/* Who It's For (v2), built from Jay's approved mockup: handoff/who-its-for-v2/reference/approved_mockup.png.
   Sizes are the mockup's (1122px wide) scaled to a 1440px screen. */
:root{
  --rhino:#1B475D;--barley:#FFF5D0;--naples:#FAD564;--neptune:#8EBD9D;--olive:#B4BD62;
  --ink:#122f44;--body:#1f4258;--green:#5F8E75;--cream:#FCF9F0;--rule:#ddddd2;
  --serif:"EB Garamond","Baskerville",Georgia,"Times New Roman",serif;
  --sans:"Helvetica Neue",Arial,sans-serif;
  --numerals:"Playfair Display","EB Garamond",Georgia,serif;
}
*{box-sizing:border-box}html{scroll-behavior:smooth}
body{margin:0;background:var(--cream);color:var(--ink);font-family:var(--serif);-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}img{max-width:100%;display:block}h1,h2,h3,p{margin-top:0}h1,h2,h3{font-weight:400}
:focus-visible{outline:3px solid var(--naples);outline-offset:4px}
.skip-link{position:absolute;z-index:100;top:-60px;left:20px;padding:8px 15px;background:var(--naples);color:var(--rhino)}.skip-link:focus{top:15px}
.w-wrap{width:min(1300px,calc(100% - 172px));margin:0 auto}
.w-eyebrow{display:flex;align-items:center;gap:22px;font:500 11px/1.5 var(--sans);letter-spacing:.2em;text-transform:uppercase;color:#4d6b79;margin:0 0 20px}
.w-eyebrow-light{color:#f3efe2}
.w-rule{display:inline-block;width:52px;height:2px;background:var(--naples)}
.w-button{display:inline-flex;align-items:center;gap:22px;background:var(--naples);color:var(--rhino);padding:22px 30px;font:700 12px/1.2 var(--sans);letter-spacing:.09em;text-transform:uppercase;white-space:nowrap;transition:background .2s}
.w-button:hover{background:#ffe386}
.w-button span{font-size:15px}
em{font-style:italic;color:var(--green)}

/* Hero */
.w-hero{position:relative;overflow:hidden;background:#102f45;color:#fff;min-height:574px}
.w-hero-art{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:right center}
.w-hero::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(11,40,58,.74) 0%,rgba(13,46,66,.6) 38%,rgba(13,46,66,.14) 62%,transparent 80%)}
.w-hero-inner{position:relative;z-index:1;padding:54px 0 48px}
.w-hero h1{font-size:clamp(52px,4.9vw,71px);line-height:.98;letter-spacing:-.02em;margin:0 0 26px;color:#fffdf6}
.w-gold{color:var(--naples)}
.w-hero-body{font-size:19px;line-height:1.35;max-width:600px;margin:0 0 30px;color:#f7f2e6}

/* A shared experience */
.w-shared{background:var(--cream);padding:44px 0 40px}
.w-shared-grid{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(0,1fr);gap:0;align-items:center}
.w-shared h2{font-size:clamp(50px,5.2vw,74px);line-height:1;letter-spacing:-.02em;margin:0}
.w-shared-body{font-size:19px;line-height:1.48;color:var(--body);margin:0;padding:6px 0 6px 64px;border-left:1px solid var(--rule)}

/* Wherever you are */
.w-stages{position:relative;background:#FDF9F1;padding:36px 0 30px;overflow:hidden}
.w-stages::before,.w-stages::after{content:"";position:absolute;top:0;bottom:0;width:92px;background-size:cover;background-position:center;pointer-events:none}
.w-stages::before{left:0;background-image:url('/assets/who-its-for/stages-edge-left.jpg');-webkit-mask-image:linear-gradient(90deg,#000 55%,transparent);mask-image:linear-gradient(90deg,#000 55%,transparent)}
.w-stages::after{right:0;background-image:url('/assets/who-its-for/stages-edge-right.jpg');-webkit-mask-image:linear-gradient(270deg,#000 55%,transparent);mask-image:linear-gradient(270deg,#000 55%,transparent)}
.w-stages .w-wrap{position:relative;z-index:1}
.w-stages h2{font-size:clamp(44px,4.4vw,60px);line-height:1.05;letter-spacing:-.02em;margin:0 0 20px}
.w-stage-grid{display:grid;grid-template-columns:repeat(3,1fr)}
.w-stage{padding:0 40px 10px 0}
.w-stage+.w-stage{border-left:1px solid var(--rule);padding-left:58px}
.w-num{display:block;font:400 clamp(70px,6.6vw,94px)/.86 var(--numerals);letter-spacing:-.04em;margin:0 0 8px}
.w-n1{color:#E4CC7A}.w-n2{color:#94BBA4}.w-n3{color:#8EB0C3}
.w-stage h3{font-size:clamp(30px,2.8vw,38px);line-height:1.05;letter-spacing:-.015em;margin:0 0 14px}
.w-micro{font:600 11px/1.4 var(--sans);letter-spacing:.2em;text-transform:uppercase;color:#4a6977;margin:0 0 14px}
.w-stage>p:last-child{font-size:18px;line-height:1.32;color:var(--body);margin:0;max-width:330px}

/* One system */
.w-system{background:var(--cream);padding:34px 0 22px}
.w-system-grid{display:grid;grid-template-columns:minmax(0,2.15fr) repeat(3,minmax(0,1fr));align-items:start}
.w-system-head{padding-right:12px}
.w-system h2{font-size:clamp(38px,3.3vw,47px);line-height:1.02;letter-spacing:-.03em;margin:0}
@media(min-width:1051px){.w-system h2 em{white-space:nowrap}}
.w-sys{border-left:1px solid var(--rule);padding:6px 22px 18px 28px;min-height:220px}
.w-sys h3{font-size:clamp(24px,2.2vw,30px);line-height:1.05;letter-spacing:-.015em;margin:0 0 12px}
.w-sys .w-micro{font-size:9px;letter-spacing:.16em;margin:0 0 14px}
.w-sys>p:last-child{font-size:15px;line-height:1.38;color:var(--body);margin:0}

/* Final band */
.w-band{position:relative;overflow:hidden;background:#123650;color:#fff}
.w-band-art{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:right 60%}
.w-band::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(14,46,66,.95) 0%,rgba(14,46,66,.9) 55%,rgba(14,46,66,.4) 78%,rgba(14,46,66,.15) 100%)}
.w-band-grid{position:relative;z-index:1;display:grid;grid-template-columns:210px minmax(0,1fr) auto;gap:0;align-items:center;padding:34px 0 30px}
.w-band-micro{font:500 11px/1.75 var(--sans);letter-spacing:.2em;text-transform:uppercase;margin:0;color:#eef0e8}
.w-band-micro .w-rule{display:block;margin-top:14px}
.w-band-copy{border-left:1px solid rgba(255,255,255,.3);padding:4px 0 4px 44px}
.w-band-title{font-size:clamp(34px,3.2vw,44px);line-height:1;letter-spacing:-.015em;margin:0 0 10px}
.w-band-sub{font-size:17px;margin:0;color:rgba(255,255,255,.85)}

/* Tablet */
@media(max-width:1050px){
  .w-wrap{width:calc(100% - 64px)}
  .w-shared-grid{grid-template-columns:1fr}
  .w-shared-body{border-left:0;border-top:1px solid var(--rule);padding:22px 0 0;margin-top:24px}
  .w-stage{padding-right:22px}.w-stage+.w-stage{padding-left:26px}
  .w-system-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .w-system-head{grid-column:1/-1;margin-bottom:22px}
  .w-sys:first-of-type{border-left:0;padding-left:0}
  .w-band-grid{grid-template-columns:1fr;gap:22px;padding:42px 0}
  .w-band-copy{border-left:0;border-top:1px solid rgba(255,255,255,.3);padding:22px 0 0}
  .w-band-grid .w-button{justify-self:start}
}
/* Phone */
@media(max-width:760px){
  .w-wrap{width:calc(100% - 40px)}
  .w-hero{min-height:0}
  .w-hero::after{background:linear-gradient(180deg,rgba(11,40,58,.9),rgba(11,40,58,.82))}
  .w-hero-inner{padding:44px 0 44px}
  .w-hero h1{font-size:clamp(40px,11vw,52px)}
  .w-hero-body{font-size:17px}
  .w-button{width:100%;justify-content:center;white-space:normal;text-align:center}
  .w-shared h2{font-size:clamp(40px,10.5vw,52px)}
  .w-shared-body{font-size:17px}
  .w-stages::before,.w-stages::after{width:28px;opacity:.7}
  .w-stages h2{font-size:clamp(36px,9.5vw,46px)}
  .w-stage-grid{grid-template-columns:1fr}
  .w-stage,.w-stage+.w-stage{border-left:0;padding:22px 0;border-top:1px solid var(--rule)}
  .w-stage>p:last-child{max-width:none;font-size:17px}
  .w-system h2{font-size:clamp(36px,9.5vw,46px)}
  .w-system-grid{grid-template-columns:1fr}
  .w-sys,.w-sys:first-of-type{border-left:0;border-top:1px solid var(--rule);padding:20px 0;min-height:0}
  .w-sys>p:last-child{font-size:16px}
  .w-band::after{background:rgba(14,46,66,.9)}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}