/* ==========================================================================
   EVO Admissions — site styles
   Layers on top of the EVO Admissions design system (_ds/…/styles.css).
   Page-level display/body font is Archivo + Montserrat (from Google Fonts),
   overriding the design system's --font-display (TT Travels Next is a trial
   font and not loaded here) — same choice the source design made.
   ========================================================================== */

:root{
  --font-display: 'Archivo', 'Helvetica Neue', Arial, sans-serif;
  --font-body: 'Montserrat', 'Helvetica Neue', Arial, sans-serif;
  --ink-bg: #0A0C11;
}

html{scroll-behavior:smooth}
body{font-family:var(--font-body)}
@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto}
}

/* The nav is a fixed pill (top:24px, 70px tall) floating over the page, so
   any anchor jump (#services, skip-link, etc.) needs this much clearance or
   the target's heading lands hidden underneath it. */
section, header, main{scroll-margin-top:112px}

.skip-link{position:absolute;left:-9999px;top:0;z-index:100;background:var(--brand);color:#fff;padding:12px 20px;border-radius:0 0 8px 0;font:var(--type-label)}
.skip-link:focus{left:0}

/* ── Placeholder tiles (stand in for imagery not yet supplied) ─────────── */
.ph{position:relative;display:flex;align-items:center;justify-content:center;overflow:hidden;text-align:center;isolation:isolate}
.ph::before{content:"";position:absolute;inset:0;background-image:repeating-linear-gradient(135deg, rgba(255,255,255,.05) 0 2px, transparent 2px 16px)}
.ph__label{position:relative;z-index:1;display:block;max-width:26ch;padding:0 20px;font-family:var(--font-display);font-weight:600;font-size:11px;line-height:1.5;letter-spacing:.05em;text-transform:uppercase;color:rgba(255,255,255,.4)}
.ph__label small{display:block;margin-top:4px;font-weight:400;font-size:10px;letter-spacing:.02em;text-transform:none;color:rgba(255,255,255,.24)}
.ph--dark{background:radial-gradient(120% 140% at 30% 20%, #171a22 0%, #0A0C11 70%)}
.ph--card{position:absolute;inset:0;background:linear-gradient(155deg, var(--ink-100), var(--ink-50))}
.ph--card .ph__label{color:var(--ink-500)}
.ph--card .ph__label small{color:var(--ink-400)}
.ph--card::before{background-image:repeating-linear-gradient(135deg, rgba(29,29,27,.035) 0 2px, transparent 2px 16px)}
.ph--avatar{width:52px;height:52px;flex:none;border-radius:999px;background:linear-gradient(155deg, var(--ink-200), var(--ink-100))}
.ph--avatar-sm{width:44px;height:44px}
.ph--avatar::before{background-image:none}

/* ── Real assets (progressive enhancement) ──────────────────────────────
   [data-asset-slot] elements start out as .ph placeholders. js/main.js
   probes each data-asset-src; the moment the file actually exists on disk
   (drop it into assets/… and reload — no code changes needed) a real <img>
   is appended on top and the placeholder chrome is switched off. Until
   then this block of CSS never fires, so nothing here is visible yet. */
.ph.has-asset .ph__label{display:none}
.ph.has-asset::before{display:none}
.hero__pattern.has-asset{background-image:none}
.asset-img{display:block}
.asset-img--hero-bg,.asset-img--about-bg,.asset-img--cta-bg{position:absolute;inset:0;z-index:2;width:100%;height:100%;object-fit:cover}
.asset-img--hero-bg{object-position:60% 68%;filter:saturate(1.05) brightness(.92)}
.asset-img--about-bg{object-position:64% 38%}
.asset-img--cta-bg{object-position:30% 70%;opacity:.5;filter:saturate(1.05) brightness(.7)}
.asset-img--pattern{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;object-position:top right}
.asset-img--figure{position:absolute;z-index:2;right:-3%;bottom:-7%;height:min(88vh,1050px);width:auto;max-width:none;object-fit:contain;object-position:bottom right;filter:drop-shadow(0 30px 60px rgba(0,0,0,.55)) contrast(1.03) brightness(1.04)}
.asset-img--logo{display:block;height:34px;width:auto}
.asset-img--logo-footer{display:block;height:30px;width:auto}
.nav__brand-slot{display:inline-flex;align-items:center;gap:10px}

/* ── Nav ─────────────────────────────────────────────────────────────── */
.nav{position:fixed;top:24px;left:50%;transform:translateX(-50%);z-index:80;width:min(82vw,1240px);box-sizing:border-box;height:70px;display:flex;align-items:center;gap:clamp(14px,1.8vw,34px);padding:0 12px 0 26px;border-radius:999px;background:rgba(10,12,17,.62);backdrop-filter:blur(22px) saturate(1.4);-webkit-backdrop-filter:blur(22px) saturate(1.4);border:1px solid rgba(255,255,255,.14);box-shadow:0 18px 44px -18px rgba(0,0,0,.7);opacity:0;animation:evoNavIn 620ms var(--ease-out, cubic-bezier(.2,.7,.3,1)) 60ms both}
.nav__brand{display:flex;align-items:center;gap:10px;flex:0 0 auto;border:none;text-decoration:none}
.nav__mark{display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;border-radius:9px;background:var(--brand);color:#fff;font-family:var(--font-display);font-weight:800;font-size:13px;letter-spacing:-.02em}
.nav__wordmark{font-family:var(--font-display);font-weight:700;font-size:13px;letter-spacing:.16em;color:#fff;white-space:nowrap}
.nav__links{display:flex;align-items:center;gap:clamp(14px,1.8vw,30px);flex:1 1 0;min-width:0;overflow:hidden;justify-content:center;-webkit-mask-image:linear-gradient(to right,transparent 0,#000 20px,#000 calc(100% - 20px),transparent 100%);mask-image:linear-gradient(to right,transparent 0,#000 20px,#000 calc(100% - 20px),transparent 100%)}
.nav__links a{flex:0 0 auto;white-space:nowrap;border:none;font-family:var(--font-display);font-weight:600;font-size:clamp(15px,1.05vw,17px);letter-spacing:-.005em;color:rgba(255,255,255,.86);transition:color 150ms cubic-bezier(.2,.7,.3,1)}
.nav__links a:hover{color:#fff}
.nav__cta{flex:0 0 auto}
.nav__burger{display:none;flex:0 0 auto;width:40px;height:40px;border:0;border-radius:999px;background:rgba(255,255,255,.1);cursor:pointer;align-items:center;justify-content:center;flex-direction:column;gap:5px}
.nav__burger span{display:block;width:16px;height:2px;background:#fff;border-radius:2px}

.mobile-menu{position:fixed;inset:0;z-index:90;background:var(--ink-bg);display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:28px;padding:0 clamp(24px,8vw,64px)}
.mobile-menu a{border:none;font-family:var(--font-display);font-weight:700;font-size:clamp(28px,7vw,40px);color:#fff;letter-spacing:-.01em}
.mobile-menu .evo-btn{margin-top:12px}

@keyframes evoNavIn{from{opacity:0;transform:translate(-50%,-14px)}to{opacity:1;transform:translate(-50%,0)}}

/* ── Hero ────────────────────────────────────────────────────────────── */
.hero{position:relative;isolation:isolate;overflow:hidden;min-height:100vh;min-height:100svh;background:var(--ink-bg);font-family:var(--font-body);color:rgba(255,255,255,.72)}
.hero__bg{position:absolute;inset:0;z-index:0}
.hero__scrim{position:absolute;inset:0;z-index:1;pointer-events:none}
/* Front-loaded into a narrower left band so it clears the subjects (who sit
   ~55-70% across the frame) well before that point — the old stops kept
   .78→.34 opacity all the way out to 68%, which sat right on top of them. */
.hero__scrim--x{background:linear-gradient(96deg,rgba(10,12,17,.97) 0%,rgba(10,12,17,.88) 16%,rgba(10,12,17,.5) 30%,rgba(10,12,17,.16) 42%,rgba(10,12,17,.03) 55%,rgba(10,12,17,0) 100%)}
.hero__scrim--y-top{background:linear-gradient(180deg,rgba(10,12,17,.55) 0%,rgba(10,12,17,.08) 22%,rgba(10,12,17,0) 36%)}
.hero__scrim--y-bottom{background:linear-gradient(0deg,rgba(10,12,17,.88) 0%,rgba(10,12,17,.28) 22%,rgba(10,12,17,0) 46%)}
.hero__glow{position:absolute;z-index:1;pointer-events:none;border-radius:50%;filter:blur(20px);background:radial-gradient(circle at center, rgba(255,255,255,.15) 0%, rgba(255,255,255,.05) 40%, rgba(255,255,255,0) 68%)}
.hero__glow--1{left:-6vw;top:-18vh;width:44vw;height:44vw}
.hero__glow--2{right:6vw;bottom:-22vh;width:40vw;height:40vw}
.hero__glow--3{left:30vw;top:-24vh;width:34vw;height:34vw}
.hero__glow--4{right:-6vw;top:14vh;width:38vw;height:38vw}
.hero__glow--5{left:14vw;bottom:-18vh;width:32vw;height:32vw}
.hero__glow--brand{background:radial-gradient(circle at center, rgba(215,2,23,.3) 0%, rgba(215,2,23,.1) 40%, rgba(215,2,23,0) 68%)}
.hero__glow--6{left:-16vw;bottom:-28vh;width:56vw;height:56vw}
.hero__pattern{position:absolute;top:-4vw;right:-3vw;width:min(22vw,340px);aspect-ratio:1;z-index:2;pointer-events:none;opacity:.14;background-image:repeating-linear-gradient(60deg, var(--red-500) 0 3px, transparent 3px 22px),repeating-linear-gradient(-60deg, var(--red-500) 0 3px, transparent 3px 22px);-webkit-mask-image:radial-gradient(circle at top right, #000 0%, transparent 72%);mask-image:radial-gradient(circle at top right, #000 0%, transparent 72%)}

.hero__inner{position:relative;z-index:10;box-sizing:border-box;max-width:1760px;margin:0 auto;padding:clamp(108px,12vh,148px) clamp(24px,4.5vw,80px) clamp(36px,5vh,64px);min-height:100vh;min-height:100svh;display:grid;grid-template-columns:repeat(auto-fit,minmax(min(420px,100%),1fr));align-items:center;gap:clamp(24px,2.4vw,48px)}
.hero__copy{position:relative;z-index:5;display:flex;flex-direction:column;align-items:flex-start;max-width:880px}
.hero__title{margin:0;font-family:var(--font-display);font-weight:800;font-size:clamp(44px,min(6.1vw,10.6vh),116px);line-height:.98;letter-spacing:-.032em;color:#fff}
.hero__line-wrap{display:block;overflow:hidden;padding-bottom:.04em}
.hero__line{display:block;opacity:0;animation:evoLineUp 760ms cubic-bezier(.2,.7,.3,1) 180ms both}
.hero__lede{margin:clamp(26px,3vh,38px) 0 0;max-width:620px;font-weight:400;font-size:clamp(17px,1.32vw,22px);line-height:1.55;color:rgba(255,255,255,.7);opacity:0;animation:evoUp 640ms cubic-bezier(.2,.7,.3,1) 620ms both}
.hero__ctas{display:flex;flex-wrap:wrap;align-items:center;gap:16px;margin-top:clamp(32px,3.8vh,46px);opacity:0;animation:evoUp 640ms cubic-bezier(.2,.7,.3,1) 760ms both}
.hero__stats{display:flex;flex-wrap:nowrap;align-items:center;gap:clamp(18px,2.2vw,38px);margin:clamp(44px,5vh,64px) 0 0;padding-top:clamp(22px,2.4vh,30px);border-top:1px solid rgba(255,255,255,.16);width:100%;max-width:min(760px,100%);opacity:0;animation:evoUp 640ms cubic-bezier(.2,.7,.3,1) 900ms both}
.hero__stats > div{display:flex;flex-direction:column;gap:4px;flex:0 0 auto;position:relative}
.hero__stats > div:not(:first-child){padding-left:clamp(18px,2.2vw,38px)}
.hero__stats > div:not(:first-child)::before{content:"";position:absolute;left:0;top:0;width:1px;height:44px;background:rgba(255,255,255,.18)}
.hero__stats dt{margin:0;font-family:var(--font-display);font-weight:800;font-size:clamp(24px,2.1vw,34px);line-height:1;letter-spacing:-.02em;white-space:nowrap;color:#fff}
.hero__stats dd{margin:0;font-weight:400;font-size:clamp(13px,1.05vw,16px);line-height:1.3;white-space:nowrap;color:rgba(255,255,255,.6)}
@media (max-width:640px){
  /* The single-line layout above (flex-wrap:nowrap + white-space:nowrap on
     every label) runs wider than a phone screen once all three stats are
     present — wrap into a 2-column grid instead so nothing gets clipped. */
  .hero__stats{display:grid;grid-template-columns:1fr 1fr;row-gap:22px;column-gap:clamp(18px,6vw,38px)}
  .hero__stats > div:not(:first-child){padding-left:clamp(18px,6vw,38px)}
  .hero__stats > div:nth-child(2n+1):not(:first-child)::before{display:none}
  .hero__stats dt,.hero__stats dd{white-space:normal}
}

.hero__figure{position:relative;z-index:1;min-height:min(70vh,660px);align-self:stretch}
.hero__figure-glow{position:absolute;right:0;bottom:-3%;width:82%;padding-bottom:82%;z-index:0;pointer-events:none;filter:blur(10px);background:radial-gradient(circle at center, rgba(255,255,255,.16) 0%, rgba(215,2,23,.14) 38%, rgba(10,12,17,0) 70%)}
.hero__figure-ph{position:absolute;z-index:2;right:2%;bottom:2%;left:14%;top:8%;border-radius:28px;opacity:0;animation:evoRise 900ms cubic-bezier(.2,.7,.3,1) 260ms both}
.hero__figure-ph .ph__label{color:rgba(255,255,255,.42)}
.hero__figure-ph .ph__label small{color:rgba(255,255,255,.26)}

@keyframes evoLineUp{from{opacity:0;transform:translateY(112%)}to{opacity:1;transform:translateY(0)}}
@keyframes evoUp{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:translateY(0)}}
@keyframes evoRise{from{opacity:0;transform:translateY(26px) scale(1.02)}to{opacity:1;transform:translateY(0) scale(1)}}
@media (prefers-reduced-motion: reduce){
  .hero__line,.hero__lede,.hero__ctas,.hero__stats,.hero__figure-ph,.nav{animation:none !important;opacity:1 !important;transform:none !important}
}

/* ── Section shell ───────────────────────────────────────────────────── */
.section{position:relative;overflow:hidden;background:#fff;padding:clamp(88px,10vh,128px) clamp(24px,4vw,64px)}
.section--alt{background:var(--ink-50)}
.section--brand{background:linear-gradient(135deg,var(--red-700),var(--red-600))}
.section--dark{background:var(--ink-bg)}
.section--dark-photo{background:var(--ink-bg)}
.section--tight{padding:clamp(64px,8vh,96px) clamp(24px,4vw,64px)}
/* position:sticky breaks under ANY ancestor with overflow other than
   visible — including this section's own overflow:hidden (used elsewhere
   to clip the glow blobs below). A section hosting a sticky pin-scroll
   effect needs overflow:visible instead; its own glows move into
   .section__glow-clip, a small absolutely-positioned wrapper that does
   the clipping locally so the rest of the section stays unclipped. */
.section--sticky-host{overflow:visible}
.section__glow-clip{position:absolute;inset:0;overflow:hidden;pointer-events:none;z-index:0}
.section__inner{position:relative;z-index:1;max-width:1440px;margin:0 auto;transition:opacity 700ms cubic-bezier(.2,.7,.3,1),transform 700ms cubic-bezier(.2,.7,.3,1)}
.section__inner--narrow{max-width:820px}
.section--globe{padding:0}
.section__inner--globe{max-width:none;width:100%}
.globe-embed{display:block;width:100%;height:92vh;min-height:620px;max-height:900px;border:0;background:var(--ink-bg)}
[data-reveal] .section__inner{opacity:0;transform:translateY(28px)}
[data-reveal].is-revealed .section__inner{opacity:1;transform:translateY(0)}
@media (prefers-reduced-motion: reduce){
  [data-reveal] .section__inner{opacity:1;transform:none}
}
.section__glow{position:absolute;z-index:0;pointer-events:none;border-radius:50%;filter:blur(20px);background:radial-gradient(circle at center, rgba(215,2,23,.1) 0%, rgba(215,2,23,.03) 42%, rgba(215,2,23,0) 70%)}
.section__glow--light{background:radial-gradient(circle at center, rgba(255,255,255,.15) 0%, rgba(255,255,255,.05) 42%, rgba(255,255,255,0) 70%)}
.section__glow--bold{mix-blend-mode:screen;background:radial-gradient(circle at center, rgba(255,32,52,.28) 0%, rgba(215,2,23,.12) 40%, rgba(215,2,23,0) 72%)}
.section__glow--a{left:-9vw;top:-15vh;width:36vw;height:36vw}
.section__glow--b{right:-9vw;bottom:-15vh;width:34vw;height:34vw}
.section__glow--c{left:50%;top:50%;width:30vw;height:30vw;transform:translate(-50%,-50%)}
.section__photo{position:absolute;inset:0;z-index:0}
.section__photo-scrim{position:absolute;inset:0;z-index:0;pointer-events:none;background:linear-gradient(90deg,#0A0C11 0%,#0A0C11 34%,rgba(10,12,17,.5) 46%,rgba(10,12,17,0) 58%)}
.section__photo-scrim--cta{background:linear-gradient(180deg,rgba(10,12,17,.75) 0%,rgba(10,12,17,.92) 60%,rgba(10,12,17,.98) 100%)}

.eyebrow{display:block;margin:0 0 14px;font-family:var(--font-display);font-weight:700;font-size:13px;letter-spacing:.08em;text-transform:uppercase;color:var(--red-500)}
.eyebrow--inverse{color:rgba(255,255,255,.85)}
.section__head{max-width:640px;margin:0 0 56px}
.section h2{margin:0;font-family:var(--font-display);font-weight:800;font-size:clamp(32px,3.6vw,56px);line-height:1.05;letter-spacing:-.02em;color:var(--ink-900)}
.h--inverse{color:#fff}
.section h2.h--inverse{color:#fff}
.section__sub{margin:18px 0 0;font-weight:400;font-size:clamp(16px,1.1vw,19px);line-height:1.6;color:var(--ink-600)}
.section__sub--inverse{color:rgba(255,255,255,.82)}

/* ── Destinations bento grid ─────────────────────────────────────────── */
.dest-grid{display:grid;grid-template-columns:repeat(4,1fr);grid-template-rows:repeat(4,minmax(150px,auto));gap:20px}
.dest-card{position:relative;display:block;border-radius:24px;overflow:hidden;background:var(--ink-100);text-decoration:none;border:none;transition:transform 320ms cubic-bezier(.2,.7,.3,1),box-shadow 320ms cubic-bezier(.2,.7,.3,1)}
.dest-card:hover{transform:translateY(-6px);box-shadow:0 28px 54px -22px rgba(29,29,27,.32)}
.dest-card:hover .dest-card__img{transform:scale(1.06)}
.dest-card__img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;transition:transform 700ms cubic-bezier(.2,.7,.3,1)}
.dest-card--germany{grid-area:1/1/3/3}
.dest-card--uk{grid-area:1/3/2/5;border-radius:20px}
.dest-card--italy{grid-area:2/3/3/4;border-radius:20px}
.dest-card--netherlands{grid-area:2/4/3/5;border-radius:20px}
.dest-card--france{grid-area:3/1/5/2}
.dest-card--usa{grid-area:3/2/5/4}
.dest-card--canada{grid-area:3/4/4/5;border-radius:20px}
.dest-card--poland{grid-area:4/4/5/5;border-radius:20px}
.dest-card__scrim{position:absolute;inset:0;z-index:1;background:linear-gradient(180deg,rgba(29,29,27,0) 38%,rgba(29,29,27,.8) 100%);pointer-events:none}
.dest-card__scrim--tight{background:linear-gradient(180deg,rgba(29,29,27,0) 40%,rgba(29,29,27,.72) 100%)}
.dest-card__copy{position:absolute;z-index:2;left:0;right:0;bottom:0;padding:28px;display:flex;flex-direction:column;gap:8px}
.dest-card__copy--tight{padding:16px}
.dest-card__title{font-family:var(--font-display);font-weight:800;font-size:clamp(22px,2vw,32px);letter-spacing:-.01em;color:#fff}
.dest-card__title--sm{font-size:clamp(19px,1.6vw,24px)}
.dest-card__title--xs{font-size:18px}
.dest-card__desc{font-size:14px;line-height:1.4;color:rgba(255,255,255,.8);max-width:340px}
.dest-card__link{margin-top:6px;font-family:var(--font-display);font-weight:600;font-size:13px;letter-spacing:.03em;color:#fff}
@media (max-width:900px){
  .dest-grid{grid-template-columns:repeat(2,1fr)}
  .dest-card--germany,.dest-card--uk,.dest-card--france,.dest-card--usa{grid-column:span 2}
  .dest-card--italy,.dest-card--netherlands,.dest-card--canada,.dest-card--poland{grid-column:span 1}
  .dest-card{grid-row:auto !important;grid-column-start:auto !important;aspect-ratio:16/11}
  .dest-card--germany,.dest-card--uk,.dest-card--france,.dest-card--usa{aspect-ratio:16/9}
}

/* ── Scroll-story: "your journey from 0 to acceptance" ──────────────────
   A tall (5×100vh) container with a position:sticky stage pinned inside it.
   Scroll progress through the tall container drives the pinned video's
   currentTime and which scene's text is active — see the "Scroll-story"
   block in main.js. Height is set in JS-independent vh so it degrades
   gracefully (still just a tall section) if JS never runs. */
.storyscroll{position:relative;height:500vh;background:var(--ink-bg)}
.storyscroll__stage{position:sticky;top:0;height:100vh;height:100svh;overflow:hidden;display:flex;align-items:flex-end}
.storyscroll__video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;background:var(--ink-bg)}
.storyscroll__scrim{position:absolute;inset:0;pointer-events:none;background:linear-gradient(0deg,rgba(6,7,10,.92) 0%,rgba(6,7,10,.6) 26%,rgba(6,7,10,0) 52%),linear-gradient(180deg,rgba(6,7,10,.55) 0%,rgba(6,7,10,0) 22%)}

.storyscroll__progress{position:absolute;z-index:2;top:clamp(96px,12vh,140px);right:clamp(24px,4.5vw,80px);display:flex;flex-direction:column;align-items:flex-end;gap:8px}
.storyscroll__progress-count{font-family:var(--font-display);font-weight:700;font-size:13px;letter-spacing:.06em;color:rgba(255,255,255,.72)}
.storyscroll__progress-current{color:#fff}
.storyscroll__progress-track{width:64px;height:2px;border-radius:2px;background:rgba(255,255,255,.22);overflow:hidden}
.storyscroll__progress-fill{display:block;width:100%;height:100%;background:var(--red-500);transform:scaleX(0);transform-origin:left;transition:transform 120ms linear}

.storyscroll__scenes{position:relative;z-index:1;width:100%;box-sizing:border-box;padding:0 clamp(24px,4.5vw,80px) clamp(56px,9vh,96px)}
.storyscroll__scene{position:absolute;left:clamp(24px,4.5vw,80px);right:clamp(24px,4.5vw,80px);bottom:clamp(56px,9vh,96px);max-width:640px;display:flex;flex-direction:column;gap:10px;opacity:0;transform:translateY(18px) scale(.985);filter:blur(6px);transition:opacity 480ms cubic-bezier(.2,.7,.3,1),transform 480ms cubic-bezier(.2,.7,.3,1),filter 480ms cubic-bezier(.2,.7,.3,1);pointer-events:none}
.storyscroll__scene.is-active{opacity:1;transform:translateY(0) scale(1);filter:blur(0)}
.storyscroll__eyebrow{font-family:var(--font-display);font-weight:700;font-size:13px;letter-spacing:.08em;text-transform:uppercase;color:rgba(255,255,255,.78)}
.storyscroll__title{margin:0;font-family:var(--font-display);font-weight:800;font-size:clamp(28px,3.6vw,52px);line-height:1.08;letter-spacing:-.02em;color:#fff}
.storyscroll__desc{margin:0;font-size:clamp(15px,1.15vw,18px);line-height:1.55;color:rgba(255,255,255,.74)}

@media (max-width:640px){
  .storyscroll{height:420vh}
  .storyscroll__scene{max-width:none}
  .storyscroll__progress{top:clamp(84px,11vh,110px)}
}
@media (prefers-reduced-motion: reduce){
  .storyscroll__scene{transition:opacity 200ms linear;transform:none;filter:none}
}

/* ── Universities rail ───────────────────────────────────────────────── */
.uni-rail-wrap{position:relative}
.uni-rail-arrow{position:absolute;top:50%;transform:translateY(-50%);z-index:3;width:48px;height:48px;border-radius:999px;border:1px solid var(--ink-100);background:var(--surface-card);box-shadow:0 10px 30px -12px rgba(29,29,27,.28);cursor:pointer;font-size:17px;line-height:1;color:var(--ink-700);display:flex;align-items:center;justify-content:center;transition:background 200ms,transform 150ms,opacity 200ms}
.uni-rail-arrow:hover{background:rgba(29,29,27,.05)}
.uni-rail-arrow:active{transform:translateY(-50%) scale(.92)}
.uni-rail-arrow--prev{left:-8px}
.uni-rail-arrow--next{right:-8px}
@media (max-width:900px){
  .uni-rail-arrow{width:40px;height:40px;font-size:15px}
  .uni-rail-arrow--prev{left:4px}
  .uni-rail-arrow--next{right:4px}
}
.uni-rail{display:flex;gap:24px;overflow-x:auto;overflow-y:hidden;padding:4px 4px 16px;margin:0 -4px 32px;-webkit-overflow-scrolling:touch;scrollbar-width:none}
.uni-rail::-webkit-scrollbar{display:none}
.uni-card{flex:0 0 auto;width:340px;display:flex;flex-direction:column;text-decoration:none;border:none;background:#fff;border-radius:24px;overflow:hidden;box-shadow:0 1px 2px rgba(29,29,27,.05);transition:transform 300ms cubic-bezier(.2,.7,.3,1),box-shadow 300ms cubic-bezier(.2,.7,.3,1)}
.uni-card:hover{transform:translateY(-6px);box-shadow:0 26px 52px -20px rgba(29,29,27,.24)}
.uni-card__img{position:relative;width:100%;height:210px;flex:0 0 auto;object-fit:cover;display:block}
.uni-card__body{display:flex;flex-direction:column;gap:10px;padding:26px}
.uni-card__meta{font-family:var(--font-display);font-weight:700;font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--red-500)}
.uni-card__name{font-family:var(--font-display);font-weight:700;font-size:23px;line-height:1.2;letter-spacing:-.01em;color:var(--ink-900)}
.uni-card__field{font-size:14px;line-height:1.4;color:var(--ink-600)}

/* ── Services — vertical scroll drives horizontal motion ─────────────────
   Same mechanism as the #journey scroll-story: a tall wrapper with a
   position:sticky stage inside it. JS measures how far the track has to
   travel (its width minus the viewport) and stretches the wrapper to
   exactly that much scroll distance, then maps scroll position inside it
   to a [0,1] progress that translateX's the track. Scroll down, the row
   moves sideways; once the last card clears, the stage un-sticks and the
   page continues normally — so it costs only as much page height as the
   card row actually needs to travel, not a fixed guess.
   prefers-reduced-motion gets a plain horizontally-scrollable row instead
   (no pin, no hijacked scroll) — see js/main.js for the JS half. */
.service-scroll{position:relative}
.service-scroll__stage{position:sticky;top:112px;overflow:hidden;padding:8px 0 40px}
.service-scroll__track{display:flex;gap:28px;width:max-content;padding:4px clamp(24px,4.5vw,80px) 4px clamp(24px,4.5vw,80px)}
.service-card{flex:0 0 auto;width:440px;display:flex;flex-direction:column;background:#fff;border:1px solid var(--ink-200);border-radius:24px;overflow:hidden;box-shadow:0 1px 2px rgba(29,29,27,.05);transition:transform 260ms cubic-bezier(.2,.7,.3,1),box-shadow 260ms cubic-bezier(.2,.7,.3,1),border-color 260ms cubic-bezier(.2,.7,.3,1)}
.service-card:hover{transform:translateY(-6px);box-shadow:0 26px 52px -20px rgba(29,29,27,.24);border-color:var(--red-200)}
/* Suppress hover while the track is actively translating — otherwise
   whatever card is sliding under a stationary cursor flickers its lift
   on and off as it passes underneath, mid-scroll. */
.service-scroll.is-scrolling .service-card:hover{transform:none;box-shadow:0 1px 2px rgba(29,29,27,.05);border-color:var(--ink-200)}
.service-scroll.is-scrolling .service-card:hover .service-card__icon{background:var(--red-50);color:var(--red-500)}
.service-card__photo{position:relative;width:100%;height:270px;flex:0 0 auto}
.service-card__photo .asset-img--service-photo{position:absolute;inset:0;z-index:0;width:100%;height:100%;object-fit:cover}
.asset-img--advisor{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 30%;border-radius:999px}
.service-card__body{position:relative;display:flex;flex-direction:column;gap:14px;padding:28px 28px 32px}
.service-card__n{position:absolute;top:28px;right:28px;font-family:var(--font-display);font-weight:800;font-size:14px;color:var(--ink-300)}
.service-card__icon{width:60px;height:60px;flex:none;border-radius:16px;background:var(--red-50);color:var(--red-500);display:flex;align-items:center;justify-content:center;transition:background 220ms cubic-bezier(.2,.7,.3,1),color 220ms cubic-bezier(.2,.7,.3,1)}
.service-card__icon svg{width:30px;height:30px}
.service-card:hover .service-card__icon{background:var(--red-500);color:#fff}
.service-card__title{margin:0;font-family:var(--font-display);font-weight:800;font-size:25px;letter-spacing:-.01em;color:var(--ink-900)}
.service-card__desc{margin:0;font-size:16px;line-height:1.6;color:var(--ink-600)}
@media (max-width:640px){
  .service-card{width:340px}
  .service-card__photo{height:210px}
  .service-card__body{padding:24px 24px 28px}
}
@media (prefers-reduced-motion: reduce){
  .service-scroll{height:auto !important}
  .service-scroll__stage{position:static;overflow-x:auto;-webkit-overflow-scrolling:touch}
  .service-scroll__track{transform:none !important}
  .service-card{transition:none}
  .service-card:hover{transform:none}
}

/* ── About / reasons ─────────────────────────────────────────────────── */
.reason-list{max-width:580px;position:relative;z-index:1}
.reason{display:flex;align-items:center;gap:18px;padding:22px 6px;border-top:1px solid rgba(255,255,255,.18);border-radius:14px;transition:background 220ms cubic-bezier(.2,.7,.3,1)}
.reason:hover{background:rgba(255,255,255,.05)}
.reason__icon{width:48px;height:48px;flex:none;border-radius:14px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.18);color:#fff;display:flex;align-items:center;justify-content:center;transition:background 220ms cubic-bezier(.2,.7,.3,1),border-color 220ms cubic-bezier(.2,.7,.3,1)}
.reason__icon svg{width:24px;height:24px}
.reason:hover .reason__icon{background:var(--red-500);border-color:var(--red-500)}
.reason__body{display:flex;flex-direction:column;gap:4px;flex:1 1 auto;min-width:0}
.reason__word{font-family:var(--font-display);font-weight:800;font-size:clamp(17px,1.4vw,21px);letter-spacing:-.01em;text-transform:uppercase;color:#fff}
.reason__desc{font-size:14.5px;line-height:1.55;color:rgba(255,255,255,.72)}
.reason__n{font-family:var(--font-display);font-weight:800;font-size:14px;color:rgba(255,255,255,.28);flex:none}
.reason-list__rule{border-top:1px solid rgba(255,255,255,.18)}
@media (prefers-reduced-motion: reduce){
  .reason{transition:none}
}

/* ── Stats ───────────────────────────────────────────────────────────── */
.stats__eyebrow{margin-bottom:36px}
.stats-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(200px,100%),1fr));gap:32px}
.stats-grid > div{display:flex;flex-direction:column;gap:8px}
.stats-grid__value{font-family:var(--font-display);font-weight:800;font-size:clamp(40px,4.2vw,64px);letter-spacing:-.02em;color:#fff}
.stats-grid__label{font-size:14px;letter-spacing:.02em;text-transform:uppercase;color:rgba(255,255,255,.78)}

/* ── Video testimonials ──────────────────────────────────────────────── */
/* Auto-scrolling carousel — same duplicate-and-wrap technique as the
   university rail up top (see js/main.js), direction reversed so the row
   drifts left-to-right instead of right-to-left. Pauses on hover/touch/
   focus like the uni rail; each video plays muted+looping the moment the
   cursor is over its card and resets to its poster on mouseleave, so
   pausing the carousel and previewing a clip happen together for free. */
.video-rail-wrap{position:relative}
.video-grid{display:flex;flex-wrap:nowrap;gap:24px;overflow-x:auto;overflow-y:hidden;padding:4px 4px 16px;margin:0 -4px;-webkit-overflow-scrolling:touch;scrollbar-width:none}
.video-grid::-webkit-scrollbar{display:none}
.video-testimony{margin:0;flex:0 0 auto}
.video-testimony__frame{display:block;width:360px;aspect-ratio:3/4;border-radius:22px;overflow:hidden;background:#000;object-fit:cover;box-shadow:0 20px 40px -26px rgba(29,29,27,.3);cursor:pointer;transition:transform 260ms cubic-bezier(.2,.7,.3,1),box-shadow 260ms cubic-bezier(.2,.7,.3,1)}
.video-testimony__frame:hover{transform:translateY(-6px);box-shadow:0 30px 56px -22px rgba(29,29,27,.4)}
@media (max-width:640px){
  .video-testimony__frame{width:240px}
}
@media (prefers-reduced-motion: reduce){
  .video-testimony__frame{transition:none}
  .video-testimony__frame:hover{transform:none}
}

/* ── Advisor cards ────────────────────────────────────────────────────── */
.advisor-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(260px,100%),1fr));gap:28px}
.advisor-card{display:flex;flex-direction:column;align-items:center;text-align:center;gap:8px;padding:36px 26px;background:#fff;border:1px solid var(--ink-200);border-radius:20px}
.advisor-card__photo{margin-bottom:14px}
.ph--avatar-lg{position:relative;width:104px;height:104px;flex:none;border-radius:999px;background:linear-gradient(155deg, var(--ink-200), var(--ink-100))}
.ph--avatar-lg::before{background-image:none}
.ph--avatar-lg .ph__label{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;max-width:none;padding:6px;font-size:8px;line-height:1.3}
.ph--avatar-lg .ph__label small{display:none}
.advisor-card__focus{margin:0;font-family:var(--font-display);font-weight:800;font-size:18px;letter-spacing:-.01em;color:var(--ink-900)}
.advisor-card__desc{margin:0 0 6px;font-size:13.5px;line-height:1.55;color:var(--ink-600)}
.advisor-grid__note{margin:22px 0 0;text-align:center;font-size:12.5px;color:var(--ink-500)}
.advisor-grid__note code{font-size:12px;background:var(--ink-100);padding:2px 6px;border-radius:6px}

/* ── Deadline strip ───────────────────────────────────────────────────── */
.deadline-strip{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(180px,100%),1fr));gap:16px}
.deadline-card{background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.16);border-radius:18px;padding:22px 20px;display:flex;flex-direction:column;gap:6px}
.deadline-card__country{font-family:var(--font-display);font-weight:700;font-size:14px;color:#fff}
.deadline-card__days{font-family:var(--font-display);font-weight:800;font-size:32px;letter-spacing:-.02em;color:#fff}
.deadline-card__days span{font-size:13px;font-weight:600;letter-spacing:.02em;text-transform:uppercase;color:rgba(255,255,255,.6);margin-left:4px}
.deadline-card__note{font-size:12px;line-height:1.5;color:rgba(255,255,255,.6)}

/* ── Find your match quiz ────────────────────────────────────────────── */
/* Red brand section, white floating card for the quiz itself — outlined
   light pills matching the reference style, red brand accents on select. */
.match-quiz{position:relative;z-index:1;max-width:640px;margin:0 auto;background:#fff;border-radius:28px;padding:44px 40px;box-shadow:0 30px 70px -30px rgba(10,4,4,.45)}
.match-quiz__counter{margin:0 0 22px;text-align:center;font-family:var(--font-display);font-weight:700;font-size:13px;letter-spacing:.08em;text-transform:uppercase;color:var(--red-500)}
.match-quiz__counter.is-hidden{display:none}

.match-quiz__panel{display:none;flex-direction:column;align-items:center;text-align:center;gap:28px}
.match-quiz__panel.is-active{display:flex;animation:matchPanelIn 420ms cubic-bezier(.2,.7,.3,1) both}
@keyframes matchPanelIn{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:translateY(0)}}

.match-quiz__question{margin:0;font-family:var(--font-display);font-weight:800;font-size:clamp(21px,2.2vw,28px);letter-spacing:-.015em;color:var(--ink-900)}
.match-quiz__options{display:flex;flex-wrap:wrap;justify-content:center;gap:12px;width:100%}
.match-quiz__option{padding:14px 26px;border-radius:999px;border:1.5px solid var(--ink-300);background:#fff;color:var(--ink-800);font-family:var(--font-display);font-weight:600;font-size:15px;cursor:pointer;transition:background 200ms cubic-bezier(.2,.7,.3,1),border-color 200ms cubic-bezier(.2,.7,.3,1),color 200ms cubic-bezier(.2,.7,.3,1),transform 150ms cubic-bezier(.2,.7,.3,1)}
.match-quiz__option:hover{border-color:var(--red-400);background:var(--red-50)}
.match-quiz__option:active{transform:scale(.96)}
.match-quiz__option.is-selected{background:var(--red-500);border-color:var(--red-500);color:#fff}

.match-quiz__back{margin-top:4px;background:transparent;border:none;color:var(--ink-500);font-size:14px;cursor:pointer;transition:color 150ms}
.match-quiz__back:hover{color:var(--ink-900)}

.match-quiz__panel--result{align-items:stretch;text-align:left}
.match-quiz__result{display:flex;gap:28px;align-items:center;background:var(--ink-50);border:1px solid var(--ink-200);border-radius:20px;padding:24px;flex-wrap:wrap}
.match-quiz__result-img{width:180px;height:180px;flex:0 0 auto;border-radius:16px;object-fit:cover;background:var(--ink-100)}
.match-quiz__result-body{display:flex;flex-direction:column;gap:6px;min-width:240px;flex:1 1 auto}
.match-quiz__result-eyebrow{font-family:var(--font-display);font-weight:700;font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--red-500)}
.match-quiz__result-name{margin:0;font-family:var(--font-display);font-weight:800;font-size:clamp(22px,2.2vw,28px);letter-spacing:-.01em;color:var(--ink-900)}
.match-quiz__result-meta{font-size:14px;color:var(--ink-600)}
.match-quiz__result-score{display:flex;align-items:baseline;gap:8px;margin:10px 0 4px}
.match-quiz__result-percent{font-family:var(--font-display);font-weight:800;font-size:40px;letter-spacing:-.02em;color:var(--ink-900)}
.match-quiz__result-label{font-size:13px;text-transform:uppercase;letter-spacing:.05em;color:var(--ink-500)}
.match-quiz__result-note{margin:0;font-size:13px;line-height:1.5;color:var(--ink-500);max-width:420px}
.match-quiz__result-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:8px}

@media (max-width:640px){
  .match-quiz{padding:32px 22px;border-radius:22px}
  .match-quiz__result{flex-direction:column;text-align:center;align-items:center}
  .match-quiz__result-body{align-items:center}
  .match-quiz__option{padding:13px 20px;font-size:14px}
}
@media (prefers-reduced-motion: reduce){
  .match-quiz__panel.is-active{animation:none}
}

/* ── Get started ─────────────────────────────────────────────────────── */
.section__inner--split{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(420px,100%),1fr));gap:56px;align-items:center}
.get-started__title{margin:0 0 32px;font-family:var(--font-display);font-weight:800;font-size:clamp(28px,3vw,42px);line-height:1.15;letter-spacing:-.02em;color:var(--ink-900)}
.get-started__cards{display:flex;flex-direction:column;gap:14px;margin-bottom:24px}
.get-started__card{padding:20px 22px;border-radius:16px;background:#fff;border:1px solid var(--ink-200)}
.get-started__card--red{background:var(--red-50);border-color:var(--red-200)}
.get-started__card-title{display:block;margin:0 0 6px;font-family:var(--font-display);font-weight:700;font-size:16px;color:var(--ink-900)}
.get-started__card-desc{font-size:14px;line-height:1.5;color:var(--ink-600)}
.get-started__proof{display:flex;align-items:center;gap:10px;font-size:14px;color:var(--ink-700)}
.get-started__check{width:22px;height:22px;border-radius:999px;background:var(--red-500);color:#fff;display:flex;align-items:center;justify-content:center;font-size:12px;flex:0 0 auto}
.get-started__form{background:#fff;border:1px solid var(--ink-200);border-radius:24px;padding:36px;box-shadow:0 30px 60px -30px rgba(29,29,27,.18);display:flex;flex-direction:column;gap:16px}
.get-started__form-lede{margin:0 0 6px;font-size:15px;line-height:1.5;color:var(--ink-600)}
.get-started__form-row{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.get-started__form-note{margin:0;min-height:1.5em;font-size:14px;line-height:1.5;color:var(--ink-700)}
.get-started__form-note[data-state="error"]{color:var(--red-700)}
.get-started__form-note[data-state="accepted"]{color:var(--ink-900);font-weight:600}
.get-started__form-note:focus-visible{outline:2px solid var(--brand);outline-offset:4px;border-radius:4px}
.get-started__field-help{display:block;margin-top:6px;font-size:12px;line-height:1.5;color:var(--ink-600)}
.get-started__consent{display:flex;align-items:flex-start;gap:10px;min-height:44px;cursor:pointer;font-size:13px;line-height:1.6;color:var(--ink-700)}
.get-started__consent input{width:20px;height:20px;margin:2px 0 0;flex:0 0 auto;accent-color:var(--brand)}
.get-started__honeypot{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.get-started__form button:disabled{cursor:not-allowed;opacity:.6}
.get-started__badges{display:flex;flex-wrap:wrap;gap:14px;margin-top:2px}
.get-started__badges span{font-size:12px;color:var(--ink-500)}

/* ── FAQ ─────────────────────────────────────────────────────────────── */
.faq-item{border-top:1px solid rgba(255,255,255,.3)}
.faq-item__q{display:flex;align-items:center;justify-content:space-between;gap:24px;width:100%;box-sizing:border-box;padding:22px 0;background:transparent;border:none;cursor:pointer;text-align:left;font:inherit;transition:opacity 150ms cubic-bezier(.2,.7,.3,1)}
.faq-item__q:hover{opacity:.72}
.faq-item__q span:first-child{font-family:var(--font-display);font-weight:700;font-size:clamp(16px,1.3vw,19px);letter-spacing:-.005em;color:#fff}
.faq-item__icon{flex:0 0 auto;font-family:var(--font-display);font-weight:600;font-size:20px;color:rgba(255,255,255,.85)}
.faq-item__panel{display:grid;grid-template-rows:0fr;transition:grid-template-rows 320ms cubic-bezier(.2,.7,.3,1)}
.faq-item.is-open .faq-item__panel{grid-template-rows:1fr}
.faq-item__panel-inner{overflow:hidden}
.faq-item__panel-inner p{margin:0 0 24px;max-width:640px;font-size:15px;line-height:1.6;color:rgba(255,255,255,.82)}
.faq-list__rule{border-top:1px solid rgba(255,255,255,.3)}

/* ── Final CTA ───────────────────────────────────────────────────────── */
.section--cta{text-align:center;padding:clamp(100px,14vh,160px) clamp(24px,4vw,64px)}
.section__inner--cta{max-width:760px;display:flex;flex-direction:column;align-items:center;gap:22px}
.cta__sub{margin:0;font-size:clamp(16px,1.2vw,19px);line-height:1.6;color:rgba(255,255,255,.72);max-width:480px}
.cta__actions{display:flex;flex-wrap:wrap;justify-content:center;gap:16px;margin-top:12px}

/* ── Footer ──────────────────────────────────────────────────────────── */
.footer{background:var(--ink-900);color:rgba(255,255,255,.6);padding:clamp(56px,7vh,80px) clamp(24px,4vw,64px) 32px}
.footer__top{max-width:1240px;margin:0 auto;display:grid;grid-template-columns:repeat(auto-fit,minmax(min(220px,100%),1fr));gap:48px;padding-bottom:40px;border-bottom:1px solid rgba(255,255,255,.12)}
.footer__brand{display:flex;flex-direction:column;align-items:flex-start;gap:16px;grid-column:span 2}
.nav__brand--footer{gap:10px}
.footer__tag{margin:0;max-width:280px;font-family:var(--font-display);font-weight:700;font-size:16px;letter-spacing:-.01em;color:#fff}
.footer__col{display:flex;flex-direction:column;gap:12px}
.footer__heading{font-family:var(--font-display);font-weight:700;font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:rgba(255,255,255,.4)}
.footer__col a{font-size:14px;color:rgba(255,255,255,.68);border:none;transition:color 150ms cubic-bezier(.2,.7,.3,1)}
.footer__note{font-size:14px;line-height:1.5;color:rgba(255,255,255,.68)}
.footer__col a:hover{color:#fff}
.footer__bottom{max-width:1240px;margin:0 auto;display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px;padding-top:24px}
.footer__bottom span{font-size:13px;color:rgba(255,255,255,.4)}
.footer__legal{display:flex;gap:20px}
.footer__legal a{font-size:13px;color:rgba(255,255,255,.4);border:none;transition:color 150ms cubic-bezier(.2,.7,.3,1)}
.footer__legal a:hover{color:rgba(255,255,255,.8)}

/* ── Responsive ──────────────────────────────────────────────────────── */
@media (max-width:860px){
  .nav__links{display:none}
  .nav__cta{display:none}
  .nav__burger{display:inline-flex}
  .nav{justify-content:space-between}
  .footer__brand{grid-column:span 1}
}
.mobile-menu[hidden]{display:none}