/* Wolf Executives — enhancement layer on top of the approved design (site.css).
   Adds: sticky header + hover mega nav, scroll motion, and a few homepage blocks.
   Uses the existing tokens: --navy --ice --blue --paper --line --sans --serif --gutter */
:root{--wx-h:80px;--wx-ease:cubic-bezier(.22,.8,.2,1);--wx-io:cubic-bezier(.65,0,.35,1);--wx-black:#000;--wx-ld:rgba(255,255,255,.15)}
@media(max-width:1000px){:root{--wx-h:69px}}
@media(max-width:740px){:root{--wx-h:64px}}
@view-transition{navigation:auto}
html{scroll-behavior:auto!important;scroll-padding-top:calc(var(--wx-h) + 16px)}
html.lenis,html.lenis body{height:auto}.lenis.lenis-stopped{overflow:hidden}
body{padding-top:var(--wx-h)}

/* ---------- Header (same look as before, now fixed) ---------- */
body>header.wx-head{position:fixed;inset:0 0 auto 0;z-index:100;background:none;border:0;transition:transform .55s var(--wx-ease)}
.wx-head:before{content:"";position:absolute;inset:0 0 auto 0;height:var(--wx-h);background:#000;border-bottom:1px solid #ffffff26;z-index:0}
.wx-head.is-hidden:not(.is-open):not(.is-sheet){transform:translateY(-101%)}
.wx-head .mast{position:relative;z-index:2}
.wx-progress{position:absolute;left:0;top:calc(var(--wx-h) - 1px);height:1px;width:100%;background:var(--ice);transform-origin:left;transform:scaleX(0);z-index:3;pointer-events:none}
.wx-tabs{display:flex;align-items:center;gap:clamp(6px,1.4vw,26px)}
.wx-tab{appearance:none;background:none;border:0;cursor:pointer;color:#fff;font:500 13px/1 var(--sans);padding:14px 10px;display:inline-flex;align-items:center;gap:6px;position:relative;transition:opacity .25s}
.wx-tab .ic{width:11px;height:11px;opacity:.7;transition:transform .4s var(--wx-ease)}
.wx-tab:after{content:"";position:absolute;left:10px;right:10px;bottom:7px;height:1px;background:var(--ice);transform:scaleX(0);transform-origin:left;transition:transform .4s var(--wx-ease)}
.wx-tab:hover:after,.wx-tab[aria-expanded="true"]:after{transform:scaleX(1)}
.wx-tab[aria-expanded="true"] .ic{transform:rotate(180deg)}
.wx-head.is-open .wx-tab:not([aria-expanded="true"]){opacity:.5}
a.wx-tab{padding:14px 10px}
.wx-head .nav a.wx-tab:after{left:10px;right:10px;bottom:7px;width:auto}

/* Mega panel */
.wx-mega{position:absolute;left:0;right:0;top:var(--wx-h);z-index:1;height:0;overflow:hidden;background:#000;visibility:hidden;transition:height .6s var(--wx-ease),visibility 0s .6s}
.wx-head.is-open .wx-mega{visibility:visible;transition:height .6s var(--wx-ease),visibility 0s;border-bottom:1px solid #ffffff26}
.wx-panel{position:absolute;inset:0 0 auto 0;padding:clamp(34px,3.4vw,58px) 0 clamp(40px,4vw,66px);opacity:0;visibility:hidden;pointer-events:none;transition:opacity .2s,visibility 0s .2s}
.wx-panel.is-active{opacity:1;visibility:visible;pointer-events:auto;transition:opacity .3s .08s,visibility 0s}
.wx-panel__grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr) minmax(0,1.45fr);gap:clamp(28px,4.4vw,84px);align-items:start}
.wx-col .meta{display:block;color:#ffffff8c;margin-bottom:20px}
.wx-col ul{list-style:none;margin:0;padding:0}
.wx-col a{display:inline-flex;align-items:center;gap:12px;padding:7px 0;color:#fff;font-size:clamp(23px,2vw,34px);line-height:1.16;font-weight:500;letter-spacing:-.046em;transition:color .3s,opacity .3s}
.wx-col a .ic{width:.5em;height:.5em;color:var(--ice);opacity:0;transform:translate(-8px,6px);transition:opacity .3s,transform .5s var(--wx-ease)}
.wx-col ul:hover a{opacity:.4}
.wx-col ul:hover a:hover,.wx-col a:focus-visible{opacity:1;color:var(--ice)}
.wx-col a:hover .ic,.wx-col a:focus-visible .ic{opacity:1;transform:none}
.wx-col--sm a{font-size:clamp(17px,1.35vw,22px);letter-spacing:-.03em;padding:6px 0}
.wx-col li,.wx-col .meta,.wx-feat{opacity:0;transform:translateY(16px);transition:opacity .5s var(--wx-ease),transform .75s var(--wx-ease)}
.wx-panel.is-active .wx-col li,.wx-panel.is-active .wx-col .meta,.wx-panel.is-active .wx-feat{opacity:1;transform:none;transition-delay:calc(.1s + var(--i,0)*40ms)}
.wx-feat{position:relative;display:block;overflow:hidden;aspect-ratio:16/8.4;min-height:230px;background:var(--navy);color:#fff;isolation:isolate}
.wx-feat img{position:absolute;inset:0;width:100%;height:100%;max-width:none;object-fit:cover;filter:saturate(.72);opacity:0;transition:opacity .7s var(--wx-ease),transform 1.6s var(--wx-ease)}
.wx-feat img.is-on{opacity:1}
.wx-feat:hover img{transform:scale(1.05)}
.wx-feat:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 35%,#000000d9);z-index:1}
.wx-feat__cap{position:absolute;z-index:2;left:24px;right:84px;bottom:22px}
.wx-feat__cap small{display:flex;align-items:center;gap:9px;font-size:11px;font-weight:550;letter-spacing:.03em;margin-bottom:10px}
.wx-feat__cap small:before{content:"";width:17px;height:1px;background:var(--ice)}
.wx-feat__cap span{display:block;font-size:clamp(20px,1.7vw,28px);line-height:1.18;font-weight:500;letter-spacing:-.04em;text-wrap:balance}
.wx-feat__cap em{font-family:var(--serif);font-style:italic;font-weight:400;color:var(--ice);letter-spacing:-.03em;font-size:1.08em}
.wx-feat__go{position:absolute;z-index:2;right:20px;bottom:20px;width:38px;height:38px;border-radius:50%;border:1px solid #ffffff61;display:grid;place-items:center;transition:background .25s,color .25s}
.wx-feat__go .ic{width:16px;height:16px}
.wx-feat:hover .wx-feat__go{background:#fff;color:#000}
.wx-veil{position:fixed;inset:0;z-index:90;background:#0000008c;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);opacity:0;visibility:hidden;transition:opacity .45s,visibility 0s .45s}
.wx-veil.is-on{opacity:1;visibility:visible;transition:opacity .45s,visibility 0s}
@media(max-width:1000px){.wx-panel__grid{grid-template-columns:1fr 1fr}.wx-feat{display:none}}

/* Mobile sheet */
.wx-sheet{display:none}
@media(max-width:740px){
  .wx-mega,.wx-veil,.wx-tabs{display:none}
  .wx-sheet{display:block;position:fixed;inset:0;z-index:1;background:#000;padding:calc(var(--wx-h) + 14px) var(--gutter) 44px;overflow-y:auto;overscroll-behavior:contain;opacity:0;visibility:hidden;transition:opacity .3s,visibility 0s .3s}
  .wx-head.is-sheet .wx-sheet{opacity:1;visibility:visible;transition:opacity .3s,visibility 0s}
  .wx-sheet .meta{display:block;color:#ffffff8c;margin:24px 0 8px;padding-top:22px;border-top:1px solid var(--wx-ld)}
  .wx-sheet .meta:first-child{border:0;margin-top:0;padding-top:6px}
  .wx-sheet a:not(.btn){display:block;color:#fff;font-size:27px;line-height:1.2;font-weight:500;letter-spacing:-.046em;padding:7px 0}
  .wx-sheet a.sm:not(.btn){font-size:18px;letter-spacing:-.03em;color:#ffffffd9}
  .wx-sheet .btn{margin-top:30px;width:100%;justify-content:space-between}
  .wx-sheet>*{opacity:0;transform:translateY(12px);transition:opacity .45s var(--wx-ease),transform .6s var(--wx-ease)}
  .wx-head.is-sheet .wx-sheet>*{opacity:1;transform:none;transition-delay:calc(.06s + var(--i,0)*22ms)}
}

/* ---------- Motion ---------- */
.js [data-rv]{opacity:0;transform:translateY(26px);transition:opacity .9s var(--wx-ease) calc(var(--d,0)*80ms),transform 1.1s var(--wx-ease) calc(var(--d,0)*80ms)!important}
.js [data-rv="clip"]{transform:none;transition:opacity .5s linear calc(var(--d,0)*80ms)!important}
.js [data-rv="clip"] img{clip-path:inset(0 0 100% 0);transform:scale(1.14);transition:clip-path 1.25s var(--wx-io) calc(var(--d,0)*80ms),transform 1.8s var(--wx-ease) calc(var(--d,0)*80ms)!important}
.js [data-rv].in{opacity:1;transform:none}
.js [data-rv="clip"].in img{clip-path:inset(0 0 0 0);transform:none}
.js [data-split] .w{display:inline-block;overflow:hidden;vertical-align:top;padding:.02em .06em .16em;margin:-.02em -.06em -.16em}
.js [data-split] .w>span{display:inline-block;transform:translateY(118%);transition:transform 1.15s var(--wx-ease);transition-delay:calc(var(--w,0)*60ms)}
.js [data-split].in .w>span{transform:none}
.hero-scene.active .hero-photo{animation:wx-kb 9s ease-out both}
@keyframes wx-kb{from{transform:scale(1.07)}to{transform:scale(1)}}
.meter i{position:relative;overflow:hidden}
.meter i.active{background:#ffffff50}
.meter i.active:after{content:"";position:absolute;inset:0;background:var(--ice);transform-origin:left;animation:wx-fill var(--wx-dur,7s) linear both}
@keyframes wx-fill{from{transform:scaleX(0)}to{transform:scaleX(1)}}
.hero.is-paused .meter i.active:after{animation-play-state:paused}
@media(prefers-reduced-motion:reduce){
  .js [data-rv],.js [data-rv] img,.js [data-split] .w>span{opacity:1!important;transform:none!important;clip-path:none!important;transition:none!important}
  .hero-scene.active .hero-photo,.meter i.active:after,.wx-marquee__track{animation:none!important}
}

/* ---------- Homepage additions (same design language) ---------- */
/* logo marquee */
.trust .marks{overflow:hidden;background:var(--paper);justify-content:flex-start;gap:0;-webkit-mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent);mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent)}
.wx-marquee__track{display:flex;align-items:center;flex:none;background:inherit;gap:clamp(44px,5vw,84px);padding-right:clamp(44px,5vw,84px);animation:wx-mq var(--mq,46s) linear infinite}
.wx-marquee:hover .wx-marquee__track{animation-play-state:paused}
@keyframes wx-mq{to{transform:translateX(-100%)}}
.trust .marks img{max-width:none;height:34px;mix-blend-mode:multiply;opacity:.72;flex:none}
.trust .marks img.t{height:44px}.trust .marks img.s{height:24px}

/* statement that fills in as you scroll */
.wx-statement{background:#000;color:#fff}
.wx-statement .eyebrow{color:var(--ice)}.wx-statement .eyebrow:before{background:var(--ice)}
.wx-statement__text{margin:26px 0 0;font-size:clamp(38px,5vw,88px);line-height:1.04;font-weight:450;letter-spacing:-.053em;max-width:17em;text-wrap:balance}
.wx-statement__text .italic{font-size:1.08em;color:var(--ice)}
.js .wx-statement__text .fw{opacity:.16;transition:opacity .35s linear}
.js .wx-statement__text .fw.on{opacity:1}
.wx-statement__foot{display:grid;grid-template-columns:minmax(170px,.5fr) 1.5fr;gap:40px;margin-top:clamp(40px,5vw,84px);padding-top:26px;border-top:1px solid #ffffff4d}
.wx-statement__foot p{color:#e3e3e3;font-size:clamp(16px,1.23vw,21px);line-height:1.6;max-width:640px;text-wrap:pretty}
.wx-statement__foot p strong{color:#fff;font-weight:600}
@media(max-width:740px){.wx-statement__foot{grid-template-columns:1fr;gap:14px}}

/* terrain numbers */
.option h3 button .num{font-size:10.5px;letter-spacing:.15em;font-weight:650;color:var(--blue);width:38px;flex:none;align-self:center}
.option h3 button{justify-content:flex-start}
.option h3 button .sign{margin-left:auto}
.detail{padding-left:52px}
.work-visual img{transition:opacity .5s var(--wx-ease),transform 1.4s var(--wx-ease)}
.work-visual img.swap{opacity:0;transform:scale(1.05)}
@media(max-width:740px){.detail{padding-left:0}.option h3 button .num{width:30px}}

/* rotating testimonials */
.wx-quotes .quote-body{position:relative;min-height:1px}
.wx-quote{transition:opacity .6s var(--wx-ease),transform .9s var(--wx-ease)}
.wx-quote[hidden]{display:block;position:absolute;inset:0 0 auto 0;opacity:0;transform:translateY(22px);pointer-events:none;visibility:hidden}
.wx-quotes__nav{display:flex;align-items:center;gap:18px;margin-top:34px}
.wx-quotes__nav .round{border-color:var(--navy);color:var(--navy)}
.wx-quotes__nav .round:hover{background:var(--navy);color:#fff}
.wx-quotes__nav .meter i{background:#16233330}
.wx-quotes__nav .meter i.active{background:#16233330}.wx-quotes__nav .meter i.active:after{background:var(--navy)}
.wx-quotes__nav .meta{font-variant-numeric:tabular-nums;color:var(--muted)}

/* Google reviews */
.wx-reviews{background:var(--paper);border-block:1px solid var(--line);overflow:hidden}
.wx-reviews__head{display:flex;align-items:flex-end;justify-content:space-between;gap:30px;flex-wrap:wrap;margin-bottom:clamp(30px,3.4vw,54px)}
.wx-reviews__head .heading{margin-top:17px}
.wx-score{display:flex;align-items:center;gap:18px}
.wx-score strong{font-size:clamp(46px,4.4vw,78px);font-weight:450;letter-spacing:-.07em;line-height:1}
.wx-score span{display:block;font-size:13px;line-height:1.5;color:var(--muted)}
.wx-stars{display:flex;gap:3px;color:var(--blue);margin-bottom:5px}
.wx-stars svg{width:15px;height:15px;fill:currentColor}
.wx-reviews .wx-marquee{background:var(--paper);-webkit-mask-image:linear-gradient(90deg,transparent,#000 5%,#000 95%,transparent);mask-image:linear-gradient(90deg,transparent,#000 5%,#000 95%,transparent);display:flex}
.wx-reviews .wx-marquee__track{align-items:stretch;gap:20px;padding-right:20px}
.wx-review{flex:none;width:clamp(290px,27vw,420px);background:#fff;border-top:1px solid var(--navy);padding:24px 26px 22px;display:flex;flex-direction:column;justify-content:space-between;gap:26px}
.wx-review p{font-size:16px;line-height:1.6;color:var(--ink);text-wrap:pretty}
.wx-review footer{display:flex;align-items:center;justify-content:space-between;gap:12px;font-size:13px;font-weight:600}
.wx-review footer span{font-weight:400;color:var(--muted);font-size:11.5px}

/* focus areas */
.wx-focus{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(22px,2.6vw,46px);margin-top:clamp(34px,4vw,62px)}
.wx-focus article{border-top:1px solid var(--navy);padding-top:18px}
.wx-focus .meta{color:var(--blue)}
.wx-focus h3{font-weight:550;font-size:clamp(21px,1.6vw,26px);line-height:1.2;letter-spacing:-.04em;margin:14px 0 10px;text-wrap:balance}
.wx-focus p{font-size:15px;line-height:1.65;color:var(--muted);text-wrap:pretty}
@media(max-width:1000px){.wx-focus{grid-template-columns:1fr 1fr}}
@media(max-width:520px){.wx-focus{grid-template-columns:1fr}}

/* FAQ polish (all pages) */
.faq details p{animation:wx-in .5s var(--wx-ease)}
@keyframes wx-in{from{opacity:0;transform:translateY(-6px)}}
.wx-faq{border-top:1px solid var(--line)}

/* footer additions */
.wx-social{display:flex;gap:16px;margin-top:14px;font-size:12px}
.wx-social a{color:#d6d6d6}.wx-social a:hover{color:#fff;text-decoration:underline}

/* ---------- Service pages ---------- */
.wx-focus--3{grid-template-columns:repeat(3,minmax(0,1fr))}
.wx-focus--signs{margin-top:0}
.wx-focus--signs h3{margin-bottom:0;font-size:clamp(20px,1.7vw,28px)}
@media(max-width:1000px){.wx-focus--3{grid-template-columns:1fr 1fr}}
@media(max-width:520px){.wx-focus--3{grid-template-columns:1fr}}
.svc-chapter p+p{margin-top:12px}
.svc-option>p.wx-best{font-size:14px;line-height:1.6;margin:4px 0 20px;padding-top:14px;border-top:1px solid var(--navy);color:var(--navy);width:100%}
.svc-option>p.wx-best+p.wx-best{margin-top:-8px;border-top-color:var(--svc-line)}
.wx-best b{display:block;font-size:11px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--svc-body);margin-bottom:5px}
.svc-option h3{text-wrap:balance}
.svc-spread .svc-points{margin-bottom:24px}
.wx-voices{columns:3;column-gap:20px}
.wx-voices .wx-review{width:auto;break-inside:avoid;margin:0 0 20px;gap:22px}
.wx-voices .wx-review footer{align-items:baseline}
.wx-voices .wx-review footer span{text-align:right}
@media(max-width:1000px){.wx-voices{columns:2}}
@media(max-width:680px){.wx-voices{columns:1}}
.svc-page .wx-statement{color:#fff}

/* Inner-page hero in the homepage style: photo blended into black, no boxed image */
.hero--inner .hero-inner{min-height:clamp(480px,36vw,620px);justify-content:center;padding-bottom:clamp(57px,5.3vw,96px)}
.hero--inner h1{font-size:clamp(44px,4.9vw,88px);line-height:1.02;text-wrap:balance}
.hero--inner h1 .italic{font-size:1.1em}
.hero--inner .dek{max-width:520px}
.hero--inner .hero-scene{opacity:1;visibility:visible}
.hero--inner+.svc-facts{background:#000}
@media(max-width:740px){.hero--inner .hero-inner{min-height:620px;justify-content:flex-end;padding-bottom:36px}.hero--inner h1{font-size:clamp(40px,10.6vw,60px)}}
@media(max-width:740px){.hero--inner .hero-scene .hero-photo{object-position:var(--mpos,50% 13%)}}
/* The homepage's ".firm-copy" (light text on navy) shares a class name with body copy on light pages; keep that copy dark there */
.firm-copy>p{color:var(--muted)}
.firm .firm-copy>p{color:#e3e3e3}
/* drawn icons in place of text arrows */
.firm-link .ic,.ins-back .ic,.ins-library-link .ic,.firm-load .ic,.firm-end .btn .ic{width:1.05em;height:1.05em;vertical-align:-.14em}
.firm-link,.ins-back,.ins-library-link{display:inline-flex;align-items:center;gap:9px}
.firm-expand .ic{width:13px;height:13px}
/* keep the small uppercase labels readable on phones */
@media(max-width:740px){.eyebrow,.meta,.hero .eyebrow{font-size:10.5px}.svc-facts dt,.svc-label{font-size:11px}}