/* ════════ DESIGN TOKENS ════════ */
:root{
  /* Professional world (default) */
  --bg:#F3F0EA; --bg2:#EDE9E1; --ink:#1A1815; --soft:#5A554C; --faint:#A8A296;
  --line:rgba(26,24,21,.12); --accent:#C1502E; --accent2:#C1502E;
  --card:#FBFAF6;
  --hero-img:url('me-hero.webp');
  --ease:cubic-bezier(.16,1,.3,1);
  --easeio:cubic-bezier(.77,0,.175,1);
  --df:'Instrument Serif',Georgia,serif;     /* display (professional) */
  --sf:'Archivo',system-ui,sans-serif;        /* sans / body */
  --mf:'JetBrains Mono',ui-monospace,monospace;/* mono labels */
  --hand:'Caveat',cursive;                     /* handwritten accent */
  --anton:'Anton','Archivo',sans-serif;        /* adventure display */
  --leather:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='lth'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.5' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23lth)'/%3E%3C/svg%3E");
}
body.adv{
  /* warm obsidian · cream · clay — cinematic, premium (altitude at dusk) */
  --bg:#16130F; --bg2:#201B15; --ink:#F2EDE2; --soft:#B5AB9B; --faint:#6B6253;
  --line:rgba(242,238,230,.12); --accent:#D9663B; --accent2:#E8895F;
  --card:#1E1813; --spark:#D9663B;
}

/* ════════ RESET ════════ */
*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-font-smoothing:antialiased}
/* smooth cross-page transitions (Chromium; degrades to instant nav elsewhere) */
@view-transition{navigation:auto}
@media(prefers-reduced-motion:no-preference){
  ::view-transition-old(root){animation:vtOut .35s var(--easeio) both}
  ::view-transition-new(root){animation:vtIn .45s var(--easeio) both}
}
@keyframes vtOut{to{opacity:0;transform:translateY(-8px)}}
@keyframes vtIn{from{opacity:0;transform:translateY(10px)}}
#nav{view-transition-name:siteNav}
/* Lenis smooth-scroll helpers */
html.lenis,html.lenis body{height:auto}
.lenis.lenis-smooth{scroll-behavior:auto!important}
.lenis.lenis-smooth [data-lenis-prevent]{overscroll-behavior:contain}
.lenis.lenis-stopped{overflow:hidden}
body{
  background:var(--bg);color:var(--ink);font-family:var(--sf);
  font-weight:400;line-height:1.5;overflow-x:hidden;cursor:none;
  transition:background 1s var(--easeio),color 1s var(--easeio);
}
::selection{background:var(--accent);color:#fff}
a{color:inherit;text-decoration:none}
img{display:block;max-width:100%}
button{font-family:inherit;cursor:none}

/* ════════ LOADER ════════ */
#loader{position:fixed;inset:0;z-index:9999;background:#1A1815;display:flex;
  align-items:center;justify-content:center;flex-direction:column;gap:22px}
#loader::before{content:'';position:absolute;inset:0;pointer-events:none;
  background-image:var(--leather);background-size:200px 200px;opacity:.05}
#loader .lk{font-family:var(--df);font-size:clamp(48px,9vw,96px);color:#F3F0EA;
  letter-spacing:1px;opacity:0;transform:translateY(14px);animation:lkIn .9s .2s var(--ease) forwards}
#loader .lk sup{color:#C1502E;font-size:.46em;vertical-align:.62em;margin-left:.04em;font-style:normal;font-weight:600}
#loader .lbar{width:160px;height:2px;background:rgba(255,255,255,.14);overflow:hidden;border-radius:2px}
#loader .lbar i{display:block;height:100%;width:0;background:#C1502E;animation:lbar 1.7s .4s var(--ease) forwards}
#loader .ltx{font-family:var(--mf);font-size:10px;letter-spacing:4px;color:rgba(243,240,234,.4);text-transform:uppercase}
@keyframes lkIn{to{opacity:1;transform:none}}
@keyframes lbar{to{width:100%}}
#loader.out{opacity:0;pointer-events:none;transition:opacity .7s var(--easeio)}

/* ════════ WORLD WIPE ════════ */
#wipe{position:fixed;inset:0;z-index:9000;pointer-events:none;clip-path:circle(0% at 90% 5%);
  transition:clip-path .8s var(--easeio)}
#wipe.pro{background:#F3F0EA}
#wipe.adv{background:#16130F}

/* ════════ SCROLL PROGRESS ════════ */
#prog{position:fixed;top:0;left:0;height:3px;width:0;z-index:10002;pointer-events:none;
  background:linear-gradient(90deg,var(--accent2),var(--accent));
  box-shadow:0 0 12px color-mix(in srgb,var(--accent) 75%,transparent)}
#prog::after{content:'';position:absolute;right:0;top:0;height:100%;width:46px;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.75))}

/* ════════ CURSOR (smooth, GPU) ════════ */
#cur{position:fixed;top:0;left:0;width:8px;height:8px;margin:-4px 0 0 -4px;border-radius:50%;
  background:var(--accent);z-index:10000;pointer-events:none;will-change:transform;
  transition:width .35s var(--ease),height .35s var(--ease),margin .35s var(--ease),opacity .3s,background .5s}
#cur-r{position:fixed;top:0;left:0;width:38px;height:38px;margin:-19px 0 0 -19px;border:1.5px solid var(--accent);
  border-radius:50%;z-index:9999;pointer-events:none;opacity:.45;will-change:transform;
  transition:width .4s var(--ease),height .4s var(--ease),margin .4s var(--ease),opacity .35s,border-color .5s,background .4s}
body.hov #cur{width:6px;height:6px;margin:-3px 0 0 -3px;opacity:.6}
body.hov #cur-r{width:60px;height:60px;margin:-30px 0 0 -30px;opacity:1;background:color-mix(in srgb,var(--accent) 10%,transparent)}
body.down #cur-r{width:30px;height:30px;margin:-15px 0 0 -15px}

/* ════════ NAV ════════ */
nav{position:fixed;top:0;left:0;right:0;z-index:1000;padding:22px 40px;display:flex;
  align-items:center;justify-content:space-between;gap:20px;
  transition:padding .4s var(--ease),background .5s}
nav.scrolled{padding:14px 40px;background:color-mix(in srgb,var(--bg) 82%,transparent);
  backdrop-filter:blur(14px);border-bottom:1px solid var(--line)}
.brand{display:flex;align-items:center;gap:14px}
.brand .mark{position:relative;width:38px;height:38px;border-radius:10px;background:var(--ink);color:var(--bg);
  display:flex;align-items:center;justify-content:center;line-height:1;
  box-shadow:0 0 14px -2px color-mix(in srgb,var(--accent) 55%,transparent);
  transition:background .6s,color .6s,box-shadow .55s var(--ease),transform .45s var(--ease)}
.brand .mark .mk{font-family:var(--df);font-size:20px;letter-spacing:-1px}
.brand .mark .mk-plus{font-family:var(--df);font-size:14px;color:var(--accent);margin:-7px 0 0 1px;
  transition:color .6s,transform .45s var(--ease)}
.brand .mark::before{content:'';position:absolute;inset:0;border-radius:inherit;pointer-events:none;
  background-image:var(--leather);background-size:90px 90px;mix-blend-mode:soft-light;opacity:.5}
.brand .mark::after{content:'';position:absolute;inset:-5px;border-radius:14px;z-index:-1;pointer-events:none;
  background:radial-gradient(circle,color-mix(in srgb,var(--accent) 65%,transparent) 0%,transparent 70%);
  filter:blur(5px);opacity:.4;animation:markPulse 3.6s ease-in-out infinite;transition:opacity .5s}
.brand:hover .mark{box-shadow:0 0 24px 1px color-mix(in srgb,var(--accent) 80%,transparent);transform:translateY(-1px)}
.brand:hover .mark::after{opacity:.9}
.brand:hover .mark .mk-plus{transform:rotate(45deg)}
@keyframes markPulse{0%,100%{opacity:.3;transform:scale(.95)}50%{opacity:.62;transform:scale(1.06)}}
body.adv .brand .mark{background:var(--accent);color:#16130F}
body.adv .brand .mark .mk-plus{color:var(--ink)}
body.adv .brand:hover .mark{box-shadow:0 0 26px 2px color-mix(in srgb,var(--accent) 85%,transparent)}
@media(prefers-reduced-motion:reduce){.brand .mark::after{animation:none}}
.brand .bn{font-family:var(--mf);font-size:12px;letter-spacing:3px;font-weight:500}
.nav-links{display:flex;gap:30px}
.nav-links a{font-family:var(--mf);font-size:12px;letter-spacing:2px;color:var(--soft);
  text-transform:uppercase;position:relative;transition:color .3s}
.nav-links a::after{content:'';position:absolute;left:0;right:0;bottom:-5px;height:1px;background:var(--accent);
  transform:scaleX(0);transform-origin:left;transition:transform .35s var(--ease)}
.nav-links a:hover,.nav-links a.active{color:var(--ink)}
.nav-links a:hover::after,.nav-links a.active::after{transform:scaleX(1)}

/* world toggle */
.toggle{display:flex;align-items:center;gap:0;border-radius:30px;padding:5px;position:relative;
  border:1px solid color-mix(in srgb,var(--ink) 12%,transparent);
  background:color-mix(in srgb,var(--bg) 50%,transparent);
  -webkit-backdrop-filter:blur(18px) saturate(180%);backdrop-filter:blur(18px) saturate(180%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.6), inset 0 -1px 1px rgba(0,0,0,.05),
    0 10px 26px -16px rgba(0,0,0,.5)}
.toggle button{border:none;background:transparent;font-family:var(--mf);font-size:11px;letter-spacing:2px;
  font-weight:700;text-transform:uppercase;padding:9px 18px;border-radius:24px;color:var(--soft);
  position:relative;z-index:1;transition:color .4s}
.toggle .knob{position:absolute;top:5px;bottom:5px;border-radius:24px;z-index:0;overflow:hidden;
  background:linear-gradient(160deg,color-mix(in srgb,var(--ink) 86%,#ffffff),var(--ink));
  box-shadow:0 6px 16px -9px color-mix(in srgb,var(--ink) 80%,transparent),
    inset 0 1px 0 rgba(255,255,255,.32), inset 0 -3px 8px rgba(0,0,0,.28);
  transition:left .55s var(--ease),width .55s var(--ease),background .6s,box-shadow .5s}
.toggle .knob::after{content:'';position:absolute;inset:0;border-radius:inherit;pointer-events:none;
  background:linear-gradient(180deg,rgba(255,255,255,.34),rgba(255,255,255,0) 48%)}
@property --shine{syntax:'<angle>';inherits:false;initial-value:0deg}
.toggle::before{content:'';position:absolute;inset:0;border-radius:inherit;pointer-events:none;z-index:3;padding:1.6px;
  background:conic-gradient(from var(--shine),transparent 0deg 190deg,
    color-mix(in srgb,var(--accent) 60%,transparent) 248deg,#ffffff 300deg,
    color-mix(in srgb,var(--accent) 60%,transparent) 348deg,transparent 360deg);
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);
          mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);
  -webkit-mask-composite:xor;mask-composite:exclude;
  animation:toggleShine 4.5s linear infinite}
@keyframes toggleShine{to{--shine:360deg}}
@media(prefers-reduced-motion:reduce){.toggle::before{animation:none;background:none}}
.toggle button.on{color:var(--bg)}
body.adv .toggle button.on{color:#16130F}

.burger{display:none;width:30px;height:18px;position:relative;background:none;border:none}
.burger span{position:absolute;left:0;width:100%;height:2px;background:var(--ink);border-radius:2px;
  transition:transform .35s var(--ease),opacity .25s,background .5s}
.burger span:nth-child(1){top:0}.burger span:nth-child(2){top:8px}.burger span:nth-child(3){top:16px}
body.menu .burger span:nth-child(1){transform:translateY(8px) rotate(45deg)}
body.menu .burger span:nth-child(2){opacity:0}
body.menu .burger span:nth-child(3){transform:translateY(-8px) rotate(-45deg)}

/* ════════ MOBILE MENU ════════ */
.mmenu{position:fixed;inset:0;z-index:1050;background:var(--bg);display:flex;flex-direction:column;
  align-items:center;justify-content:center;gap:6px;opacity:0;visibility:hidden;
  transition:opacity .4s var(--ease),visibility .4s}
body.menu .mmenu{opacity:1;visibility:visible}
.mmenu a{font-family:var(--df);font-size:38px;color:var(--ink);padding:8px;opacity:0;transform:translateY(14px);
  transition:opacity .4s var(--ease),transform .4s var(--ease)}
body.adv .mmenu a{font-family:var(--anton);text-transform:uppercase;font-size:34px}
body.menu .mmenu a{opacity:1;transform:none}
.mmenu a:nth-child(1){transition-delay:.06s}.mmenu a:nth-child(2){transition-delay:.12s}
.mmenu a:nth-child(3){transition-delay:.18s}.mmenu a:nth-child(4){transition-delay:.24s}

/* ════════ HERO ════════ */
#hero{position:relative;min-height:100vh;display:flex;align-items:flex-end;
  padding:140px 40px 60px;overflow:hidden}
.hero-gl{position:absolute;inset:0;z-index:0;width:100%;height:100%;display:block;pointer-events:none}
.gl-on .hero-aurora{display:none}
.hero-photo{position:absolute;inset:0;z-index:0;background-size:cover;background-position:center;
  filter:grayscale(.15)}
.hero-photo.pro{background-image:var(--hero-img);background-repeat:no-repeat;
  background-position:right bottom;background-size:auto 86%;filter:grayscale(.03);
  -webkit-mask-image:linear-gradient(100deg,transparent 34%,#000 60%);
  mask-image:linear-gradient(100deg,transparent 34%,#000 60%)}
@media(max-width:980px){.hero-photo.pro{background-size:auto 64%;background-position:right bottom;
  -webkit-mask-image:linear-gradient(115deg,transparent 4%,#000 40%);
  mask-image:linear-gradient(115deg,transparent 4%,#000 40%)}}
@media(max-width:600px){.hero-photo.pro{opacity:1}}
.hero-photo.adv{display:none;background-image:linear-gradient(0deg,rgba(22,17,11,.7),rgba(22,17,11,.15)),
  url('adv-hero.jpg'),url('https://images.unsplash.com/photo-1521336575822-6da63fb45455?q=80&w=1500&auto=format&fit=crop')}
body.adv .hero-photo.pro{display:none}
body.adv .hero-photo.adv{display:block}
.hero-grain{position:absolute;inset:0;z-index:1;opacity:.4;pointer-events:none;mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='3'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.5'/%3E%3C/svg%3E")}

.hero-inner{position:relative;z-index:2;width:100%;max-width:1320px;margin:0 auto;
  min-height:calc(100vh - 200px);display:flex;flex-direction:column;justify-content:space-between;gap:30px}
.hero-top{position:relative}
.hero-eyebrow{display:block;font-family:var(--mf);font-size:11px;letter-spacing:4px;
  color:var(--accent);text-transform:uppercase;margin-bottom:10px}
/* big name (professional) */
.hero-name{font-family:var(--df);font-weight:400;line-height:.8;color:var(--ink);
  font-size:clamp(64px,14vw,220px);letter-spacing:-.01em;pointer-events:none}
.hero-name .l2{display:block;font-style:italic;margin-left:.04em}
body.adv .hero-name{display:none}
/* big name (adventure) */
.hero-free{display:none;font-family:var(--anton);line-height:.82;text-transform:uppercase;
  font-size:clamp(64px,15vw,230px);color:var(--ink);letter-spacing:.005em;pointer-events:none}
.hero-free .sub{display:block;font-family:var(--hand);text-transform:none;color:var(--accent);
  font-size:.42em;line-height:.9;margin-top:.05em;font-weight:600;letter-spacing:0}
body.adv .hero-free{display:block}

.hero-foot{position:relative;display:flex;justify-content:space-between;align-items:flex-end;gap:40px;flex-wrap:wrap}
.hero-tagwrap{max-width:620px}
.hero-kicker{font-family:var(--mf);font-size:11px;letter-spacing:3px;color:var(--accent);
  text-transform:uppercase;margin-bottom:16px}
.hero-tag{font-family:var(--df);font-style:italic;font-size:clamp(20px,2.6vw,30px);line-height:1.32;color:var(--ink)}
body.adv .hero-tag{font-family:var(--sf);font-style:normal;font-weight:300;font-size:clamp(17px,2vw,22px)}
.hero-meta{text-align:right;display:flex;flex-direction:column;gap:14px;align-items:flex-end}
.hero-loc{font-family:var(--mf);font-size:11px;letter-spacing:2px;color:var(--soft);text-transform:uppercase}
.hero-open{display:inline-flex;align-items:center;gap:9px;font-family:var(--mf);font-size:11px;
  letter-spacing:2px;color:var(--accent);text-transform:uppercase}
.hero-open .dot{position:relative;width:8px;height:8px;border-radius:50%;background:var(--accent);
  box-shadow:0 0 8px color-mix(in srgb,var(--accent) 70%,transparent)}
.hero-open .dot::after{content:'';position:absolute;inset:0;border-radius:50%;background:var(--accent);
  animation:beacon 2.2s ease-out infinite}
@keyframes beacon{0%{transform:scale(1);opacity:.6}100%{transform:scale(3.6);opacity:0}}
@media(prefers-reduced-motion:reduce){.hero-open .dot::after{animation:none}}
@keyframes pulse{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.4;transform:scale(.7)}}
.hero-pill{display:inline-flex;align-items:center;gap:8px;font-family:var(--mf);font-size:11px;letter-spacing:2px;
  text-transform:uppercase;border:1px solid var(--line);border-radius:24px;padding:9px 16px;color:var(--ink);
  transition:background .3s,border-color .5s}
.hero-pill:hover{background:var(--ink);color:var(--bg)}
.travel-badge{display:none}
body.adv .hero-meta .hero-loc,body.adv .hero-meta .hero-open{display:none}
body.adv .travel-badge{display:inline-flex;align-items:baseline;gap:10px;border:1px solid var(--line);
  border-radius:30px;padding:12px 20px;font-family:var(--mf);font-size:10px;letter-spacing:2px;
  text-transform:uppercase;color:var(--soft)}
body.adv .travel-badge b{font-family:var(--anton);font-size:30px;color:var(--ink);letter-spacing:0}
body.adv .travel-badge .pl{color:var(--accent);font-size:18px}

/* the-other-half label (adventure) */
.other-half{display:none;font-family:var(--mf);font-size:11px;
  letter-spacing:5px;color:var(--accent);text-transform:uppercase;margin-bottom:10px}
body.adv .other-half{display:block}
body.adv .hero-eyebrow.pro-block{display:none}

/* ════════ MARQUEE ════════ */
.marquee{border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:15px 0;overflow:hidden;
  white-space:nowrap;background:var(--bg);
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);
  mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.marquee .track{display:inline-flex;gap:48px;animation:scrollx 55s linear infinite;will-change:transform}
.marquee span{font-family:var(--mf);font-weight:500;font-size:12px;letter-spacing:3px;text-transform:uppercase;color:var(--soft)}
body.adv .marquee span{font-family:var(--mf);font-size:12px}
.marquee .d{color:var(--accent);font-size:9px;align-self:center}
@keyframes scrollx{to{transform:translateX(-50%)}}

/* ════════ SECTION SHELL ════════ */
.sec{padding:130px 40px;max-width:1320px;margin:0 auto;position:relative}
.smark{font-family:var(--mf);font-size:11px;letter-spacing:4px;color:var(--soft);text-transform:uppercase;
  margin-bottom:22px;display:flex;align-items:center;gap:14px}
.smark::after{content:'';flex:1;max-width:120px;height:1px;background:var(--line)}
.stitle{font-family:var(--df);font-weight:400;font-size:clamp(40px,6.5vw,86px);line-height:.98;letter-spacing:-.01em}
body.adv .stitle{font-family:var(--anton);text-transform:uppercase;letter-spacing:.01em}
.stitle em{font-style:italic;color:var(--accent)}
.script-note{font-family:var(--hand);font-size:clamp(26px,3vw,38px);color:var(--accent);font-weight:600}

.rev{opacity:0;transform:translateY(30px);transition:opacity .9s var(--ease),transform .9s var(--ease)}
.rev.vis{opacity:1;transform:none}
body.intro-done .hero-name,body.intro-done .hero-free,body.intro-done .hero-tagwrap,
body.intro-done .hero-meta,body.intro-done .hero-eyebrow,body.intro-done .other-half{opacity:1!important}

/* ════════ §00 NUMBERS ════════ */
#numbers{background:var(--bg)}
.num-head{display:flex;justify-content:space-between;align-items:flex-end;gap:30px;flex-wrap:wrap;margin-bottom:64px}
.num-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:24px}
.num{border-top:1px solid var(--line);padding-top:22px}
.num .v{font-family:var(--df);font-size:clamp(46px,6vw,84px);line-height:1;letter-spacing:-.02em}
body.adv .num .v{font-family:var(--anton)}
.num.hot .v{color:var(--accent)}
.num .k{font-family:var(--mf);font-size:10px;letter-spacing:2px;color:var(--soft);text-transform:uppercase;margin-top:14px}

/* ════════ §01 SERVICES ════════ */
#services{background:var(--bg2);transition:background 1s var(--easeio)}
.serv-head{display:flex;justify-content:space-between;align-items:flex-end;gap:30px;flex-wrap:wrap;margin-bottom:20px}
.serv-sub{max-width:440px;color:var(--soft);font-size:16px;line-height:1.7}
.serv-link{font-family:var(--mf);font-size:12px;letter-spacing:2px;text-transform:uppercase;color:var(--accent);
  white-space:nowrap;transition:gap .3s;display:inline-flex;gap:8px}
.serv-link:hover{gap:14px}
.serv-grid{display:grid;grid-template-columns:1fr 1fr;gap:0;margin-top:50px}
.serv{padding:46px 40px;border-top:1px solid var(--line);position:relative;transition:background .4s}
.serv:nth-child(odd){border-right:1px solid var(--line)}
.serv:hover{background:var(--card)}
.serv .sn{font-family:var(--mf);font-size:11px;letter-spacing:2px;color:var(--soft);text-transform:uppercase;margin-bottom:20px}
.serv h3{font-family:var(--df);font-weight:400;font-size:clamp(30px,3.6vw,46px);line-height:1.02;color:var(--accent);margin-bottom:18px}
body.adv .serv h3{font-family:var(--anton);text-transform:uppercase;font-size:clamp(26px,3vw,40px)}
.serv p{color:var(--soft);font-size:15px;line-height:1.75;max-width:440px;margin-bottom:24px}
.serv .tags{display:flex;gap:8px;flex-wrap:wrap}
.serv .tags span{font-family:var(--mf);font-size:9px;letter-spacing:1.5px;text-transform:uppercase;color:var(--soft);
  border:1px solid var(--line);border-radius:20px;padding:5px 11px}

/* ════════ §02 RECEIPTS ════════ */
#receipts{background:var(--bg)}
.rec-grid{display:grid;grid-template-columns:1fr 1fr;gap:30px;margin-top:56px}
.rec{border:1px solid var(--line);border-radius:14px;padding:40px;background:var(--card);transition:transform .5s var(--ease),box-shadow .5s}
.rec:hover{transform:translateY(-5px);box-shadow:0 18px 50px rgba(0,0,0,.07)}
.rec .q{font-family:var(--df);font-size:40px;color:var(--accent);line-height:0;height:18px;display:block}
.rec p{font-size:16px;line-height:1.8;color:var(--ink);margin:14px 0 26px}
.rec .by{font-family:var(--mf);font-size:11px;letter-spacing:2px;color:var(--soft);text-transform:uppercase}
.rec-note{font-family:var(--mf);font-size:11px;letter-spacing:2px;color:var(--faint);text-transform:uppercase;margin-top:30px}

/* ════════ OFF THE CLOCK (bridge) ════════ */
#bridge{position:relative;min-height:78vh;display:flex;align-items:center;padding:80px 40px;overflow:hidden}
.bridge-photo{position:absolute;inset:0;z-index:0;background-size:cover;background-position:center;
  background-image:linear-gradient(90deg,rgba(22,17,11,.55),rgba(22,17,11,.1)),
  url('adv-bridge.jpg'),url('https://images.unsplash.com/photo-1521336575822-6da63fb45455?q=80&w=1600&auto=format&fit=crop')}
.bridge-in{position:relative;z-index:1;max-width:1320px;margin:0 auto;width:100%;color:#fff}
.bridge-k{font-family:var(--mf);font-size:11px;letter-spacing:3px;text-transform:uppercase;color:#fff;margin-bottom:20px}
.bridge-h{font-family:var(--df);font-style:italic;font-size:clamp(40px,7vw,92px);line-height:.98;color:#fff;max-width:13ch}
.bridge-cta{display:inline-flex;align-items:center;gap:10px;margin-top:30px;font-family:var(--mf);font-size:12px;
  letter-spacing:2px;text-transform:uppercase;color:#fff;border-bottom:1px solid rgba(255,255,255,.4);padding-bottom:6px;
  transition:gap .3s,border-color .3s}
.bridge-cta:hover{gap:16px;border-color:#fff}

/* ════════ ADVENTURE STORIES (adv only) ════════ */
#stories{display:none;background:var(--bg);padding:130px 40px}
body.adv #stories{display:block}
.stories-wrap{max-width:1320px;margin:0 auto}
.stories-row{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:50px}
.story{position:relative;border-radius:14px;overflow:hidden;aspect-ratio:3/4;display:flex;align-items:flex-end;
  padding:28px;color:#fff;transition:transform .6s var(--ease)}
.story:hover{transform:translateY(-6px)}
.story::before{content:'';position:absolute;inset:0;background-size:cover;background-position:center;z-index:0;
  transition:transform .8s var(--ease)}
.story:hover::before{transform:scale(1.06)}
.story::after{content:'';position:absolute;inset:0;z-index:1;
  background:linear-gradient(0deg,rgba(22,17,11,.92) 4%,rgba(22,17,11,.25) 55%,rgba(22,17,11,.45))}
.story.s1::before{background-image:url('https://images.unsplash.com/photo-1521673461164-de300ebcfb17?q=80&w=900&auto=format&fit=crop')}
.story.s2::before{background-image:url('https://images.unsplash.com/photo-1551632811-561732d1e306?q=80&w=900&auto=format&fit=crop')}
.story.s3::before{background-image:url('https://images.unsplash.com/photo-1495467033336-2effd8753d51?q=80&w=900&auto=format&fit=crop')}
.story .meta{position:absolute;top:24px;left:28px;right:28px;z-index:2;display:flex;justify-content:space-between;
  font-family:var(--mf);font-size:10px;letter-spacing:2px;text-transform:uppercase;color:rgba(255,255,255,.85)}
.story .body{position:relative;z-index:2}
.story h3{font-family:var(--anton);text-transform:uppercase;font-size:clamp(26px,2.4vw,34px);line-height:.96;margin-bottom:10px}
.story .cap{font-family:var(--hand);font-size:24px;color:var(--accent2);font-weight:600;margin-bottom:16px}
.story .open{font-family:var(--mf);font-size:10px;letter-spacing:2px;text-transform:uppercase;color:#fff;
  display:inline-flex;gap:7px;transition:gap .3s}
.story:hover .open{gap:13px}

/* ════════ CTA ════════ */
#cta{background:var(--bg2);text-align:center;padding:140px 40px}
.cta-h{font-family:var(--df);font-style:italic;font-size:clamp(34px,5.5vw,72px);line-height:1.04;max-width:16ch;margin:0 auto 40px}
body.adv .cta-h{font-family:var(--anton);font-style:normal;text-transform:uppercase}
.cta-row{display:inline-flex;gap:16px;flex-wrap:wrap;justify-content:center}
.btn{display:inline-flex;align-items:center;gap:9px;font-family:var(--mf);font-size:12px;letter-spacing:2px;
  text-transform:uppercase;padding:17px 34px;border-radius:32px;position:relative;overflow:hidden;isolation:isolate;
  transition:transform .4s var(--ease),background .3s,color .3s,box-shadow .5s}
.btn.primary{background:var(--ink);color:var(--bg);background-image:var(--leather);background-size:88px 88px;background-blend-mode:soft-light;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.18),0 8px 22px -15px color-mix(in srgb,var(--ink) 70%,transparent)}
body.adv .btn.primary{background:var(--accent);color:#16130F}
.btn.primary::after,.f-btn::after{content:'';position:absolute;top:0;left:-60%;width:46%;height:100%;z-index:2;pointer-events:none;
  background:linear-gradient(100deg,transparent,rgba(255,255,255,.4),transparent);transform:skewX(-18deg);transition:left .65s var(--ease)}
.btn.primary:hover::after,.f-btn:hover::after{left:135%}
.btn.primary:hover{transform:translateY(-3px);
  box-shadow:0 18px 42px -16px color-mix(in srgb,var(--accent) 78%,transparent),inset 0 1px 0 rgba(255,255,255,.22)}
.btn.ghost{border:1px solid var(--line);color:var(--ink);
  background:color-mix(in srgb,var(--bg) 35%,transparent);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
.btn.ghost:hover{background:var(--ink);color:var(--bg);box-shadow:0 12px 30px -16px color-mix(in srgb,var(--ink) 60%,transparent)}

/* ════════ CONTACT FORM ════════ */
#contact{background:var(--bg);padding:120px 40px}
.contact-wrap{max-width:1320px;margin:0 auto;display:grid;grid-template-columns:1fr 1fr;gap:70px}
.cf{display:flex;flex-direction:column;gap:16px}
.cf-row{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.fg{display:flex;flex-direction:column;gap:7px}
.fg label{font-family:var(--mf);font-size:10px;letter-spacing:2px;text-transform:uppercase;color:var(--soft)}
.fg input,.fg select,.fg textarea{background:var(--card);border:1px solid var(--line);border-radius:8px;
  padding:14px 15px;color:var(--ink);font-family:var(--sf);font-size:14px;outline:none;transition:border-color .3s,box-shadow .3s}
.fg input:focus,.fg select:focus,.fg textarea:focus{border-color:var(--accent);
  box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 20%,transparent),0 10px 26px -12px color-mix(in srgb,var(--accent) 45%,transparent);
  background:color-mix(in srgb,var(--card) 60%,#fff)}
.fg textarea{min-height:120px;resize:vertical}
.f-btn{align-self:flex-start;margin-top:6px;background:var(--ink);color:var(--bg);border:none;border-radius:32px;
  padding:16px 36px;font-family:var(--mf);font-size:12px;letter-spacing:2px;text-transform:uppercase;
  position:relative;overflow:hidden;isolation:isolate;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.18),0 8px 22px -15px color-mix(in srgb,var(--ink) 70%,transparent);
  transition:transform .4s var(--ease),box-shadow .5s}
body.adv .f-btn{background:var(--accent);color:#16130F}
.f-btn:hover{transform:translateY(-3px);
  box-shadow:0 18px 42px -16px color-mix(in srgb,var(--accent) 78%,transparent),inset 0 1px 0 rgba(255,255,255,.22)}
.cf-status{font-family:var(--mf);font-size:12px;letter-spacing:.3px;margin-top:4px;min-height:1em;transition:color .3s}
.cf-status.ok{color:var(--accent)}
.cf-status.err{color:#b3402a}
body.adv .cf-status.err{color:#e8895f}
.contact-info h3{font-family:var(--df);font-size:clamp(30px,4vw,52px);line-height:1.02;margin-bottom:18px}
body.adv .contact-info h3{font-family:var(--anton);text-transform:uppercase}
.contact-info p{color:var(--soft);font-size:16px;line-height:1.7;margin-bottom:30px;max-width:420px}
.ci-links{display:flex;flex-direction:column;gap:2px}
.ci{display:flex;justify-content:space-between;gap:20px;padding:16px 0;border-top:1px solid var(--line);
  font-family:var(--mf);font-size:12px;letter-spacing:1px;text-transform:uppercase}
.ci span:last-child{color:var(--soft)}

/* ════════ FOOTER ════════ */
footer{background:var(--bg2);border-top:1px solid var(--line);padding:80px 40px 40px}
.foot-wrap{max-width:1320px;margin:0 auto;display:grid;grid-template-columns:2fr 1fr 1fr;gap:40px;align-items:start}
.foot-h{font-family:var(--df);font-size:clamp(30px,3.4vw,46px);line-height:1.02}
body.adv .foot-h{font-family:var(--anton);text-transform:uppercase}
.foot-p{color:var(--soft);font-size:14px;line-height:1.7;margin-top:16px;max-width:340px}
.foot-col h4{font-family:var(--mf);font-size:10px;letter-spacing:2px;text-transform:uppercase;color:var(--faint);margin-bottom:18px}
.foot-col a,.foot-col div{display:block;font-family:var(--mf);font-size:12px;letter-spacing:1px;text-transform:uppercase;
  color:var(--soft);padding:6px 0;transition:color .3s}
.foot-col a:hover{color:var(--ink)}
.foot-bottom{max-width:1320px;margin:60px auto 0;padding-top:24px;border-top:1px solid var(--line);
  display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;
  font-family:var(--mf);font-size:10px;letter-spacing:2px;text-transform:uppercase;color:var(--faint)}

/* ════════ ACCESSIBILITY ════════ */
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;
    transition-duration:.001ms!important;scroll-behavior:auto!important}
  .rev{opacity:1!important;transform:none!important}
  .marquee .track{animation:none!important}
}
@media(hover:none),(pointer:coarse){
  body{cursor:auto}#cur,#cur-r{display:none}
  a,button,.toggle button,.serv,.rec,.story,.hero-pill{cursor:pointer}
}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{
  outline:2px solid var(--accent);outline-offset:3px;border-radius:3px}

/* ════════ RESPONSIVE ════════ */
@media(max-width:1024px){
  .num-grid{grid-template-columns:repeat(3,1fr);gap:30px 24px}
  .stories-row{grid-template-columns:1fr 1fr}
}
@media(max-width:820px){
  nav{padding:16px 22px}
  nav.scrolled{padding:12px 22px}
  .nav-links,.brand .bn{display:none}
  .burger{display:block}
  .toggle button{padding:8px 13px;font-size:10px}
  .sec{padding:90px 22px}
  #hero{padding:120px 22px 50px}
  .hero-foot{flex-direction:column;align-items:flex-start}
  .hero-meta{text-align:left;align-items:flex-start}
  .serv-grid{grid-template-columns:1fr}
  .serv{border-right:none!important;padding:38px 0}
  .rec-grid,.contact-wrap,.stories-row{grid-template-columns:1fr}
  .num-grid{grid-template-columns:1fr 1fr}
  .foot-wrap{grid-template-columns:1fr 1fr}
  .foot-col:first-child{grid-column:1/-1}
  #bridge{min-height:60vh}
  .cf-row{grid-template-columns:1fr}
}
@media(max-width:480px){
  .marquee span{font-size:20px}
  .num-grid{grid-template-columns:1fr}
}

/* ════════════════ SUB-PAGE COMPONENTS ════════════════ */
/* page hero (shorter than landing) */
.phero{padding:170px 40px 70px;max-width:1320px;margin:0 auto}
.phero .eyebrow{font-family:var(--mf);font-size:11px;letter-spacing:4px;text-transform:uppercase;color:var(--accent);margin-bottom:18px}
.phero h1{font-family:var(--df);font-weight:400;font-size:clamp(64px,12vw,180px);line-height:.86;letter-spacing:-.01em}
body.adv .phero h1{font-family:var(--anton);text-transform:uppercase;letter-spacing:.01em}
.phero h1 em{font-style:italic;color:var(--accent)}
.phero .lead{margin-top:26px;max-width:640px;font-size:clamp(16px,2vw,19px);line-height:1.7;color:var(--soft)}

/* generic two-col block */
.blk{max-width:1320px;margin:0 auto;padding:80px 40px;border-top:1px solid var(--line)}
.blk-grid{display:grid;grid-template-columns:280px 1fr;gap:60px;align-items:start}
.blk-grid .smark{margin:0}
.prose p{font-size:17px;line-height:1.85;color:var(--ink);margin-bottom:22px;max-width:680px}
.prose p.big{font-family:var(--df);font-style:italic;font-size:clamp(24px,3vw,34px);line-height:1.4;color:var(--ink)}
body.adv .prose p.big{font-family:var(--sf);font-style:normal;font-weight:300}

/* timeline / certifications */
.tl{display:flex;flex-direction:column}
.tl-row{display:grid;grid-template-columns:90px 1fr auto;gap:24px;align-items:baseline;padding:22px 0;border-top:1px solid var(--line)}
.tl-row .yr{font-family:var(--mf);font-size:13px;color:var(--accent)}
.tl-row .ti{font-family:var(--df);font-size:clamp(20px,2.4vw,28px);line-height:1.1}
body.adv .tl-row .ti{font-family:var(--anton);text-transform:uppercase;font-size:clamp(18px,2vw,24px)}
.tl-row .org{font-family:var(--mf);font-size:11px;letter-spacing:1px;color:var(--soft);text-transform:uppercase}

/* skills bars */
.skills{display:flex;flex-direction:column;gap:26px;max-width:680px}
.skill .top{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:10px}
.skill .nm{font-family:var(--df);font-size:22px}
body.adv .skill .nm{font-family:var(--anton);text-transform:uppercase;font-size:19px}
.skill .lv{font-family:var(--mf);font-size:10px;letter-spacing:2px;text-transform:uppercase;color:var(--accent)}
.skill .yr{font-family:var(--mf);font-size:10px;letter-spacing:2px;text-transform:uppercase;color:var(--soft);margin-left:12px}
.skill .bar{height:3px;background:var(--line);border-radius:3px;overflow:hidden}
.skill .bar i{display:block;height:100%;width:0;background:var(--accent);border-radius:3px;transition:width 1.1s var(--ease)}
.rev.vis .skill .bar i{width:var(--w,80%)}

/* mini grid (languages / facts) */
.minis{display:grid;grid-template-columns:1fr 1fr;gap:18px;max-width:680px}
.mini{border:1px solid var(--line);border-radius:12px;padding:24px;background:var(--card)}
.mini h4{font-family:var(--df);font-size:26px;margin-bottom:6px}
body.adv .mini h4{font-family:var(--anton);text-transform:uppercase;font-size:22px}
.mini span{font-family:var(--mf);font-size:10px;letter-spacing:2px;text-transform:uppercase;color:var(--soft)}

/* services: topics */
.topics{display:grid;grid-template-columns:1fr 1fr;gap:0;margin-top:40px}
.topic{padding:40px;border-top:1px solid var(--line);transition:background .4s}
.topic:nth-child(odd){border-right:1px solid var(--line)}
.topic:hover{background:var(--card)}
.topic .n{font-family:var(--mf);font-size:11px;letter-spacing:2px;color:var(--soft);text-transform:uppercase;margin-bottom:16px}
.topic h3{font-family:var(--df);font-size:clamp(26px,3vw,38px);color:var(--accent);margin-bottom:14px}
body.adv .topic h3{font-family:var(--anton);text-transform:uppercase}
.topic p{color:var(--soft);font-size:15px;line-height:1.7;margin-bottom:20px;max-width:420px}
.topic .tags{display:flex;gap:8px;flex-wrap:wrap}
.topic .tags span{font-family:var(--mf);font-size:9px;letter-spacing:1.5px;text-transform:uppercase;color:var(--soft);border:1px solid var(--line);border-radius:20px;padding:5px 11px}

/* done-for-you cards */
.dfy{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:40px}
.dfy-card{border:1px solid var(--line);border-radius:14px;padding:34px;background:var(--card);transition:transform .5s var(--ease),box-shadow .5s}
.dfy-card:hover{transform:translateY(-6px);box-shadow:0 18px 50px rgba(0,0,0,.08)}
.dfy-card .ic{width:48px;height:48px;display:grid;place-items:center;border-radius:13px;margin-bottom:22px;
  color:var(--accent);background:color-mix(in srgb,var(--accent) 9%,transparent);
  border:1px solid color-mix(in srgb,var(--accent) 20%,transparent)}
.dfy-card .ic svg{width:24px;height:24px;display:block}
body.adv .dfy-card .ic{background:color-mix(in srgb,var(--accent) 16%,transparent);
  border-color:color-mix(in srgb,var(--accent) 32%,transparent)}
.dfy-card h3{font-family:var(--df);font-size:26px;margin-bottom:12px}
body.adv .dfy-card h3{font-family:var(--anton);text-transform:uppercase;font-size:22px}
.dfy-card p{color:var(--soft);font-size:14px;line-height:1.7}

/* adventures grid */
.chapter{max-width:1320px;margin:0 auto;padding:70px 40px 0}
.chapter .clabel{font-family:var(--mf);font-size:11px;letter-spacing:4px;text-transform:uppercase;color:var(--accent);margin-bottom:14px}
.chapter h2{font-family:var(--df);font-size:clamp(40px,6vw,80px);line-height:.98}
body.adv .chapter h2{font-family:var(--anton);text-transform:uppercase}
.chapter h2 em{font-style:italic;color:var(--accent)}
.chapter .csub{margin-top:14px;color:var(--soft);font-size:16px;max-width:520px}
.adv-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;max-width:1320px;margin:40px auto 0;padding:0 40px}
.adv-card{position:relative;border-radius:14px;overflow:hidden;aspect-ratio:4/5;display:flex;align-items:flex-end;
  padding:28px;color:#fff;transition:transform .6s var(--ease)}
.adv-card:hover{transform:translateY(-6px)}
.adv-card::before{content:'';position:absolute;inset:0;z-index:0;background-size:cover;background-position:center;transition:transform .8s var(--ease)}
.adv-card:hover::before{transform:scale(1.06)}
.adv-card::after{content:'';position:absolute;inset:0;z-index:1;background:linear-gradient(0deg,rgba(22,17,11,.92),rgba(22,17,11,.2) 55%,rgba(22,17,11,.5))}
.adv-card .meta{position:absolute;top:24px;left:28px;right:28px;z-index:2;display:flex;justify-content:space-between;
  font-family:var(--mf);font-size:10px;letter-spacing:2px;text-transform:uppercase;color:rgba(255,255,255,.85)}
.adv-card .num{font-family:var(--anton);font-size:18px}
.adv-card .body{position:relative;z-index:2}
.adv-card h3{font-family:var(--anton);text-transform:uppercase;font-size:clamp(24px,2.2vw,32px);line-height:.98;margin-bottom:10px}
.adv-card .cap{font-family:var(--hand);font-size:22px;color:var(--accent2);font-weight:600;margin-bottom:14px}
.adv-card .open{font-family:var(--mf);font-size:10px;letter-spacing:2px;text-transform:uppercase;color:#fff;display:inline-flex;gap:7px;transition:gap .3s}
.adv-card:hover .open{gap:13px}
.adv-card.locked{pointer-events:none}
.adv-card.locked .open{display:none}
.adv-card .star{position:absolute;bottom:28px;left:28px;z-index:2;color:var(--accent2);font-size:14px}

/* contact page */
.contact-rows{max-width:760px}
.crow{display:grid;grid-template-columns:120px 1fr auto;gap:24px;align-items:center;padding:24px 0;border-top:1px solid var(--line)}
.crow .lbl{font-family:var(--mf);font-size:11px;letter-spacing:2px;text-transform:uppercase;color:var(--soft)}
.crow .val{font-family:var(--df);font-size:clamp(20px,2.4vw,30px)}
body.adv .crow .val{font-family:var(--sf);font-weight:400;font-size:clamp(18px,2vw,24px)}
.crow .act{font-family:var(--mf);font-size:10px;letter-spacing:2px;text-transform:uppercase;color:var(--accent);border:1px solid var(--line);border-radius:20px;padding:8px 14px;background:none;transition:background .3s,color .3s}
.crow .act:hover{background:var(--accent);color:#fff}
.avail{margin-top:50px;padding:34px;border:1px solid var(--line);border-radius:14px;background:var(--card);max-width:760px}
.avail .k{font-family:var(--mf);font-size:10px;letter-spacing:2px;text-transform:uppercase;color:var(--soft);margin-bottom:14px}
.avail p{font-family:var(--df);font-size:clamp(20px,2.4vw,28px);line-height:1.4}
body.adv .avail p{font-family:var(--sf);font-weight:300}
.statusbar{display:flex;gap:30px;flex-wrap:wrap;margin-top:40px;font-family:var(--mf);font-size:10px;letter-spacing:2px;text-transform:uppercase;color:var(--soft)}
.statusbar b{color:var(--accent);font-weight:500}

@media(max-width:820px){
  .phero{padding:130px 22px 50px}
  .blk{padding:60px 22px}.blk-grid{grid-template-columns:1fr;gap:30px}
  .topics{grid-template-columns:1fr}.topic{border-right:none!important;padding:34px 0}
  .dfy,.adv-grid{grid-template-columns:1fr}
  .chapter{padding:50px 22px 0}.adv-grid{padding:0 22px}
  .minis{grid-template-columns:1fr}
  .crow{grid-template-columns:1fr;gap:8px}
  .tl-row{grid-template-columns:60px 1fr;gap:14px}.tl-row .org{grid-column:2}
}

.adv-card::before{background-image:var(--img)}
.story::before{background-image:var(--img,none)}

/* ── NAV OVERFLOW FIX (medium widths) ── */
@media(max-width:1200px){
  nav{padding:20px 28px}
  .nav-links{gap:22px}
  .nav-links a{font-size:11px}
  .toggle button{padding:8px 13px;font-size:10px}
}
@media(max-width:1060px){
  .nav-links{display:none}
  .burger{display:block}
}

/* ── FIX: closed mobile menu must never intercept clicks ── */
.mmenu{pointer-events:none}
body.menu .mmenu{pointer-events:auto}
/* belt-and-suspenders: overlays never block clicks */
#wipe,.hero-grain,.hero-photo,#cur,#cur-r{pointer-events:none}

/* ── IN-MENU WORLD SWITCH (phones) ── */
.mmenu-world{display:none;gap:10px;margin-top:34px}
.mw{font-family:var(--mf);font-size:11px;letter-spacing:2px;text-transform:uppercase;border:1px solid var(--line);
  background:none;color:var(--soft);padding:11px 20px;border-radius:24px;transition:background .3s,color .3s,border-color .5s;
  opacity:0;transform:translateY(14px)}
body.menu .mmenu-world .mw{opacity:1;transform:none;transition-delay:.3s}
.mw.active{background:var(--ink);color:var(--bg);border-color:var(--ink)}
body.adv .mw.active{background:var(--accent);color:#0d0d0f;border-color:var(--accent)}

/* ── HERO TEXT LEGIBILITY OVER PHOTO (mobile) ── */
@media(max-width:640px){
  .toggle{display:none}
  .mmenu-world{display:flex}
  /* stronger light scrim so dark text reads over the portrait */
  .hero-photo.pro{opacity:1;
    background-image:linear-gradient(180deg,transparent 0%,transparent 44%,rgba(243,240,234,.82) 70%,var(--bg) 86%),var(--hero-img);
    background-position:center top,center top;background-size:cover,auto 74%;
    -webkit-mask-image:none;mask-image:none}
  body.adv .hero-photo.adv{background-image:
    linear-gradient(180deg,rgba(22,17,11,.45),rgba(22,17,11,.1) 35%,rgba(22,17,11,.85)),
    url('adv-hero.jpg'),url('https://images.unsplash.com/photo-1521336575822-6da63fb45455?q=80&w=1500&auto=format&fit=crop')}
  .hero-kicker,.hero-eyebrow{text-shadow:0 1px 14px rgba(243,240,234,.85)}
  .hero-tag{text-shadow:0 1px 16px rgba(243,240,234,.8)}
  body.adv .hero-kicker,body.adv .hero-eyebrow,body.adv .hero-tag{text-shadow:0 1px 16px rgba(22,17,11,.7)}
}

/* ════════════════════════════════════════════════════════════════
   3D LAYER — WebGL hero canvas + CSS tilt cards
   ════════════════════════════════════════════════════════════════ */

/* Professional hero — mesh-gradient aurora (calm, premium, trustworthy) */
.hero-aurora{position:absolute;inset:0;z-index:1;pointer-events:none;overflow:hidden;
  opacity:0;animation:auroraIn 1.4s var(--ease) .25s forwards}
.hero-aurora i{position:absolute;border-radius:50%;filter:blur(64px);opacity:.5;
  mix-blend-mode:multiply;will-change:transform}
.hero-aurora i:nth-child(1){width:48vw;height:48vw;left:46%;top:-10%;
  background:radial-gradient(circle at 50% 50%,rgba(193,80,46,.42),transparent 62%);
  animation:drift1 24s ease-in-out infinite}
.hero-aurora i:nth-child(2){width:42vw;height:42vw;left:28%;top:28%;
  background:radial-gradient(circle at 50% 50%,rgba(207,115,85,.40),transparent 62%);
  animation:drift2 30s ease-in-out infinite}
.hero-aurora i:nth-child(3){width:36vw;height:36vw;left:60%;top:34%;
  background:radial-gradient(circle at 50% 50%,rgba(110,126,140,.30),transparent 62%);
  animation:drift3 27s ease-in-out infinite}
@keyframes auroraIn{to{opacity:1}}
@keyframes drift1{0%,100%{transform:translate(0,0) scale(1)}50%{transform:translate(-6%,8%) scale(1.12)}}
@keyframes drift2{0%,100%{transform:translate(0,0) scale(1)}50%{transform:translate(8%,-6%) scale(1.08)}}
@keyframes drift3{0%,100%{transform:translate(0,0) scale(1)}50%{transform:translate(-7%,-7%) scale(1.14)}}

/* soft light that follows the cursor (premium, like a spotlight) */
.hero-spot{position:absolute;inset:0;z-index:1;pointer-events:none;opacity:0;
  transition:opacity .7s var(--ease);mix-blend-mode:soft-light;
  background:radial-gradient(380px circle at var(--sx,62%) var(--sy,40%),
            rgba(255,246,235,.6),rgba(255,246,235,0) 60%)}
.hero-spot.on{opacity:1}

/* the dark adventure world keeps its cinematic photo — hide the pro aurora */
body.adv .hero-aurora,body.adv .hero-spot{display:none}
@media (max-width:600px){.hero-aurora i{filter:blur(42px)}}
@media (prefers-reduced-motion:reduce){.hero-aurora{opacity:1}.hero-aurora i{animation:none}}

/* ── 3D tilt cards (services) ── */
.tilt{
  transform-style:preserve-3d;
  transition:transform .5s var(--ease), box-shadow .5s var(--ease), background .4s;
  will-change:transform;
}
.tilt.tilting{transition:box-shadow .3s var(--ease), background .4s}
.tilt.tilting{
  background:var(--card);
  box-shadow:0 30px 60px -28px rgba(26,24,21,.40), 0 8px 22px -16px rgba(193,80,46,.30);
  z-index:3; border-radius:2px;
}
body.adv .tilt.tilting{
  box-shadow:0 30px 70px -26px rgba(0,0,0,.7), 0 0 30px -6px rgba(207,115,85,.35);
}
/* lift the inner content on the Z axis for real parallax depth */
.tilt > :not(.serv-glow){ transition:transform .5s var(--ease); }
.tilt.tilting > :not(.serv-glow){ transform:translateZ(18px); }
.tilt.tilting > h3{ transform:translateZ(34px); }
.tilt.tilting > .tags{ transform:translateZ(12px); }
/* pointer-follow shine */
.serv-glow{
  position:absolute; inset:0; pointer-events:none; opacity:0; border-radius:inherit;
  transition:opacity .4s var(--ease);
  background:radial-gradient(420px circle at var(--mx,50%) var(--my,50%),
            rgba(193,80,46,.14), transparent 45%);
}
.tilt.tilting .serv-glow{opacity:1}
body.adv .serv-glow{background:radial-gradient(420px circle at var(--mx,50%) var(--my,50%),
            rgba(207,115,85,.20), transparent 45%)}

/* the two headline pillars get a subtle accent rail */
.serv.pillar{position:relative}
.serv.pillar::before{
  content:""; position:absolute; left:0; top:0; height:100%; width:3px;
  background:linear-gradient(180deg,var(--accent),transparent);
  transform:scaleY(0); transform-origin:top; transition:transform .6s var(--ease);
}
.serv.pillar.vis::before{transform:scaleY(1)}

@media (prefers-reduced-motion:reduce){
  .tilt{transition:none!important}
  .serv.tilt h3,.serv.tilt p,.serv.tilt .sn,.serv.tilt .tags{transform:none!important}
}

/* ════════════════════════════════════════════════════════════════
   LIVE / HYPER-REAL — cinematic motion that makes the page feel alive
   ════════════════════════════════════════════════════════════════ */

/* slow "Ken Burns" drift on hero photography — subtle, premium */
.hero-photo{animation:kenburns 30s ease-in-out infinite alternate;transform-origin:62% 42%}
@keyframes kenburns{
  0%{transform:scale(1.05) translate3d(0,0,0)}
  100%{transform:scale(1.14) translate3d(-1.6%,-1.2%,0)}
}
/* living film grain — gentle flicker, no edge artefacts */
.hero-grain{animation:grainFlicker 4.5s ease-in-out infinite}
@keyframes grainFlicker{0%,100%{opacity:.34}50%{opacity:.5}}

/* parallax depth hooks (offsets set by JS, eased here) */
.hero-aurora,.hero-photo,.hero-inner{will-change:transform}

@media (prefers-reduced-motion:reduce){
  .hero-photo{animation:none}
  .hero-grain{animation:none}
}

/* ════════════════════════════════════════════════════════════════
   ADVENTURE — LUXURY GLASS WORLD
   Frosted glass, gold hairlines, glossy highlights, moving sheen.
   Everything below is scoped to body.adv only.
   ════════════════════════════════════════════════════════════════ */
body.adv{ --gold:#E3A05C; --gold-soft:rgba(242,238,230,.18); }

/* glass nav */
body.adv nav.scrolled{
  background:linear-gradient(180deg,rgba(22,22,26,.62),rgba(18,18,22,.40));
  -webkit-backdrop-filter:blur(20px) saturate(150%);
  backdrop-filter:blur(20px) saturate(150%);
  border-bottom:1px solid var(--gold-soft);
  box-shadow:0 14px 44px -22px rgba(0,0,0,.85), inset 0 1px 0 rgba(255,255,255,.06);
}
body.adv .brand .mark{
  background:linear-gradient(135deg,#E8895F,#D9663B);
  box-shadow:0 0 18px -4px rgba(207,115,85,.6), inset 0 1px 0 rgba(255,255,255,.4);
}

/* glass world-toggle with glowing knob */
body.adv .toggle{
  background:rgba(255,255,255,.05);
  border-color:var(--gold-soft);
  -webkit-backdrop-filter:blur(12px) saturate(150%);
  backdrop-filter:blur(12px) saturate(150%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.14), 0 10px 26px -16px rgba(0,0,0,.8);
}
body.adv .toggle .knob{
  background:linear-gradient(135deg,#E8895F,#D9663B);
  box-shadow:0 0 18px -2px rgba(207,115,85,.65), inset 0 1px 0 rgba(255,255,255,.4);
}

/* shared glass-card treatment for adventure imagery (stories + adv-cards) */
body.adv .story,
body.adv .adv-card{
  border:1px solid var(--gold-soft);
  box-shadow:0 34px 64px -34px rgba(0,0,0,.9), inset 0 1px 0 rgba(255,255,255,.10);
}
body.adv .story:hover,
body.adv .adv-card:hover{
  border-color:rgba(242,238,230,.55);
  box-shadow:0 46px 90px -30px rgba(0,0,0,.95),
             0 0 46px -12px rgba(207,115,85,.4),
             inset 0 1px 0 rgba(255,255,255,.20);
}
/* a slow specular sheen sweeps across the glass — reads as polished glass/metal */
body.adv .story::after,
body.adv .adv-card::after{
  background:
    linear-gradient(115deg,transparent 32%,rgba(255,255,255,.14) 46%,rgba(242,238,230,.10) 50%,transparent 64%) 120% 0/260% 100% no-repeat,
    linear-gradient(0deg,rgba(22,17,11,.92) 4%,rgba(22,17,11,.22) 55%,rgba(22,17,11,.48));
  animation:sheen 7.5s linear infinite;
}
body.adv .adv-card.locked::after{animation-duration:9.5s;opacity:.96}
@keyframes sheen{
  0%{background-position:130% 0, 0 0}
  60%,100%{background-position:-50% 0, 0 0}
}
/* gold-tinted caption ink + glossy "open" chip */
body.adv .story .cap,
body.adv .adv-card .cap{color:var(--gold)}
body.adv .story .open,
body.adv .adv-card .open{
  background:rgba(255,255,255,.06);
  border:1px solid var(--gold-soft);
  padding:7px 13px;border-radius:30px;
  -webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}

/* glass travel badge + pills in the hero */
body.adv .travel-badge{
  background:rgba(255,255,255,.05);border-color:var(--gold-soft);
  -webkit-backdrop-filter:blur(12px) saturate(140%);backdrop-filter:blur(12px) saturate(140%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.14), 0 12px 30px -18px rgba(0,0,0,.8)}
body.adv .travel-badge b{background:linear-gradient(135deg,#fff,var(--gold));-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
body.adv .hero-pill{
  background:rgba(255,255,255,.05);border-color:var(--gold-soft);
  -webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
body.adv .hero-pill:hover{background:linear-gradient(135deg,#E8895F,#D9663B);color:#16130F;border-color:transparent}

/* glossy primary buttons + bridge CTA in the luxury world */
body.adv .btn.primary{
  background:linear-gradient(135deg,#E8895F,#D9663B);color:#16130F;border-color:transparent;
  box-shadow:0 14px 34px -16px rgba(207,115,85,.7), inset 0 1px 0 rgba(255,255,255,.4)}
body.adv .bridge-cta{
  background:rgba(255,255,255,.06);border:1px solid var(--gold-soft);padding:14px 22px;border-radius:40px;
  -webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
body.adv .bridge-cta:hover{border-color:var(--gold)}

@media (prefers-reduced-motion:reduce){
  body.adv .story::after,body.adv .adv-card::after{animation:none}
}

/* ════════════════════════════════════════════════════════════════
   SELECTED WORK — portfolio proof (the conversion lever)
   ════════════════════════════════════════════════════════════════ */
#work{background:var(--bg)}
.work-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:46px}
.work{display:block;border:1px solid var(--line);border-radius:16px;overflow:hidden;background:var(--card);
  text-decoration:none;color:inherit;transition:box-shadow .5s var(--ease),border-color .4s}
.work:hover{border-color:color-mix(in srgb,var(--accent) 40%,var(--line));
  box-shadow:0 30px 60px -34px rgba(26,24,21,.4)}
.work-shot{aspect-ratio:16/10;background-image:var(--shot);background-size:cover;background-position:top center;
  position:relative;transition:transform .8s var(--ease)}
.work-shot::after{content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,transparent 60%,rgba(26,24,21,.10))}
.work:hover .work-shot{transform:scale(1.04)}
.work-body{padding:24px 24px 26px}
.work-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px}
.wcat{font-family:var(--mf);font-size:10px;letter-spacing:2px;text-transform:uppercase;color:var(--accent)}
.warrow{font-family:var(--mf);color:var(--soft);transition:transform .4s var(--ease)}
.work:hover .warrow{transform:translate(3px,-3px)}
.work h3{font-family:var(--df);font-weight:400;font-size:26px;line-height:1.05;color:var(--ink);margin-bottom:8px}
.work p{color:var(--soft);font-size:14px;line-height:1.6;margin-bottom:16px}
.wresult{font-family:var(--mf);font-size:11px;letter-spacing:.4px;color:var(--soft);
  padding-top:13px;border-top:1px solid var(--line)}
.wresult b{color:var(--accent);font-weight:700;letter-spacing:1px;text-transform:uppercase;font-size:10px}
@media (max-width:860px){.work-grid{grid-template-columns:1fr}}

/* featured result testimonial */
.rec-feature{position:relative;margin:40px 0 22px;padding:40px 44px;border:1px solid var(--line);
  border-left:3px solid var(--accent);border-radius:14px;background:var(--card)}
.rec-feature .q{font-family:var(--df);font-size:40px;color:var(--accent);line-height:.6;opacity:.5}
.rec-feature p{font-family:var(--df);font-style:italic;font-size:clamp(20px,2.6vw,30px);line-height:1.35;
  color:var(--ink);max-width:30ch;margin:14px 0 26px}
.rec-foot{display:flex;justify-content:space-between;align-items:flex-end;gap:24px;flex-wrap:wrap}
.rec-feature .by{font-family:var(--mf);font-size:11px;letter-spacing:1.5px;text-transform:uppercase;color:var(--soft)}
.rec-metric{display:flex;align-items:baseline;gap:11px}
.rec-metric b{font-family:var(--df);font-size:48px;line-height:.9;color:var(--accent);font-weight:400}
.rec-metric span{font-family:var(--mf);font-size:10px;letter-spacing:1px;text-transform:uppercase;color:var(--soft);line-height:1.4}