/* ============================================================
   ONCE — style.css
   Palette + type per "ONCE Design Rules" Rev A (+ Rev B motion)
   One color. One page that matters. One stick.
   ============================================================ */

:root{
  /* Core palette */
  --blue:#0E93F2;          /* ONCE Blue — PMS 2925 C */
  --ink:#111111;
  --paper:#FFFFFF;
  --paper-warm:#FAFAF9;

  /* Blue ramp (working stops) */
  --blue-100:#EAF4FE;
  --blue-200:#CFE7FC;
  --blue-300:#A7D8FA;
  --blue-400:#6FBCF7;
  --blue-600:#0B76C4;
  --blue-700:#095E9D;
  --blue-800:#064274;
  --blue-900:#04304F;

  /* Neutrals */
  --fog-100:#F1F4F7;
  --fog-300:#DCE3EA;
  --steel-500:#66748D;
  --slate-700:#3A404B;

  /* Semantic */
  --ok:#1AA05B;
  --warn:#E0A400;
  --error:#B83025;

  --font:'Archivo',-apple-system,sans-serif;
  --font-narrow:'Archivo Narrow',var(--font);

  --gutter:clamp(20px,5vw,80px);
  --maxw:1440px;
}

*{margin:0;padding:0;box-sizing:border-box;border-radius:0 !important;}
html{scroll-behavior:smooth;}
body{
  font-family:var(--font);
  font-size:18px;line-height:1.45;
  color:var(--ink);
  background:var(--paper);
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
img,video{max-width:100%;display:block;}
a{color:inherit;text-decoration:none;}
button{font-family:inherit;cursor:pointer;}

/* ---------- type scale ---------- */
.display{
  font-weight:800;
  font-size:clamp(38px,7.6vw,96px);
  line-height:.94;
  letter-spacing:-.03em;
  text-transform:uppercase;
}
.headline{
  font-weight:700;
  font-size:clamp(28px,3.4vw,44px);
  line-height:1.05;
  letter-spacing:-.02em;
}
.label{
  font-weight:600;
  font-size:12px;
  letter-spacing:.12em;
  text-transform:uppercase;
}
.body-lg{font-size:clamp(18px,1.6vw,22px);font-weight:500;}
.blue-copy{color:var(--blue-700);}
.u{text-decoration:underline;text-decoration-thickness:.07em;text-underline-offset:.1em;}
.hero .u{color:var(--blue);}

/* ---------- layout ---------- */
.wrap{max-width:var(--maxw);margin:0 auto;padding-left:var(--gutter);padding-right:var(--gutter);position:relative;z-index:6;}
section{position:relative;}
.rule-top{border-top:2px solid var(--ink);}

/* ---------- reveal motion (opacity + 6px only, 200ms) ---------- */
.rv{opacity:0;transform:translateY(6px);transition:opacity .2s ease,transform .2s ease;}
.rv.in{opacity:1;transform:none;}

/* ============================================================
   NAV
   ============================================================ */
.nav{
  position:fixed;top:0;left:0;right:0;z-index:100;
  display:flex;align-items:center;justify-content:space-between;
  padding:0 var(--gutter);height:64px;
  background:transparent;
  transition:background .2s ease;
}
.nav.solid{background:var(--paper);border-bottom:1px solid var(--fog-300);}
.nav.solid .nav-logo,.nav.solid .nav-links a{color:var(--ink);}
.nav.solid .nav-cta{background:var(--blue);color:#fff;}
.nav-logo{font-weight:800;font-size:24px;letter-spacing:-.02em;color:#fff;}
.nav-links{display:flex;gap:32px;}
.nav-links a{color:#fff;font-weight:600;font-size:14px;letter-spacing:.04em;text-transform:uppercase;}
.nav-links a:hover{opacity:.7;}
.nav-cta{
  background:#fff;color:var(--blue-700);
  border:none;padding:12px 24px;
  font-weight:700;font-size:14px;letter-spacing:.06em;text-transform:uppercase;
}
.nav-cta:hover{opacity:.9;}

/* ============================================================
   HERO — full-bleed ONCE Blue, video slot, one white button
   ============================================================ */
.hero{
  min-height:100svh;
  background:var(--blue);
  color:#fff;
  display:flex;flex-direction:column;justify-content:center;
  position:relative;overflow:hidden;
}
.hero-video{
  position:absolute;inset:0;width:100%;height:100%;object-fit:cover;
  opacity:.9;
  filter:brightness(.72) saturate(.8);
}
.hero-tint{
  position:absolute;inset:0;
  background:
    linear-gradient(90deg, rgba(4,32,54,.78) 0%, rgba(4,32,54,.45) 45%, rgba(4,32,54,.12) 100%),
    linear-gradient(0deg, rgba(4,32,54,.55) 0%, rgba(4,32,54,0) 40%);
}
.hero-stick{
  position:absolute;right:var(--gutter);bottom:-5vh;
  height:92vh;max-height:860px;width:auto;
  transform:rotate(5deg);
  z-index:2;
}
.hero-content{
  position:relative;z-index:6;
  padding:104px var(--gutter) 5vh;
  max-width:1100px;
}
.hero-tag{
  margin-bottom:18px;color:#fff;opacity:.98;
  font-size:clamp(18px,2.2vw,30px);font-weight:800;letter-spacing:.09em;
  text-transform:uppercase;
}
.hero-flags{
  display:flex;flex-wrap:wrap;gap:10px;
  margin-top:30px;max-width:760px;
}
.hero-flags span{
  border:2px solid rgba(255,255,255,.85);color:#fff;
  padding:9px 16px;
  font-size:13px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;
  white-space:nowrap;
}
.hero h1{margin-bottom:22px;}
.hero-sub{font-size:clamp(17px,1.5vw,21px);font-weight:500;margin-bottom:30px;max-width:520px;}
.btn-white{
  display:inline-block;background:#fff;color:var(--blue-700);
  border:none;padding:20px 44px;
  font-weight:800;font-size:16px;letter-spacing:.08em;text-transform:uppercase;
  transition:transform .2s ease,background .2s ease,color .2s ease;
}
.btn-white:hover{transform:translateY(-3px);background:var(--blue-100);}
.btn-white:active{transform:translateY(0) scale(.98);}

.btn-blue{
  display:inline-block;background:var(--blue);color:#fff;
  border:none;padding:20px 44px;
  font-weight:800;font-size:16px;letter-spacing:.08em;text-transform:uppercase;
  transition:transform .2s ease,background .2s ease;
}
.btn-blue:hover{transform:translateY(-3px);background:var(--blue-600);}
.btn-blue:active{transform:translateY(0) scale(.98);}
.hero-scroll{
  position:absolute;bottom:24px;right:var(--gutter);z-index:2;
  color:#fff;font-size:12px;letter-spacing:.14em;text-transform:uppercase;font-weight:600;
  writing-mode:vertical-rl;opacity:.8;
}

/* ============================================================
   TICKER — budbros-style marquee, Label caps
   ============================================================ */
.ticker{
  position:relative;z-index:6;
  background:var(--ink);color:#fff;
  overflow:hidden;white-space:nowrap;
  padding:14px 0;
  border-top:2px solid var(--ink);border-bottom:2px solid var(--ink);
}
.ticker.blue{background:var(--blue);border-color:var(--blue);}
.ticker.paper{background:var(--paper);color:var(--ink);}
.ticker-track{display:inline-flex;animation:tick 38s linear infinite;}
.ticker span{
  font-weight:700;font-size:15px;letter-spacing:.14em;text-transform:uppercase;
  padding:0 28px;flex-shrink:0;
}
.ticker span b{color:currentColor;font-weight:800;}
@keyframes tick{from{transform:translateX(0);}to{transform:translateX(-50%);}}

/* ============================================================
   NUMBER BAND — white, 2px rules, flush left
   ============================================================ */
.numbers{padding:96px 0;}
.numbers-grid{
  display:grid;grid-template-columns:repeat(4,1fr);
}
.num{
  border-top:2px solid var(--ink);
  padding:28px 24px 8px 0;margin-right:32px;
}
.num-val{font-weight:800;font-size:clamp(48px,6vw,88px);letter-spacing:-.03em;line-height:1;}
.num-key{margin-top:10px;color:var(--slate-700);}

/* ============================================================
   STICK SCROLL — the one allowed scroll moment
   ============================================================ */
.stickshow{background:var(--paper-warm);}
.stickshow-inner{display:block;}
.stickshow .stick-steps{max-width:560px;}
.stick-pin{
  position:sticky;top:0;height:100svh;
  display:flex;align-items:center;justify-content:center;
}
.stick-pin img,.stick-pin svg{height:72vh;max-height:680px;width:auto;transition:transform .2s linear;}
.stick-pin{width:100%;}
.stick-pin three-d-stage{height:82vh !important;max-height:760px;width:100%;max-width:100%;overflow:hidden;--stage-bg:var(--paper-warm);}
.stick-steps{padding:30vh 0 20vh;}
.stick-step{
  min-height:60vh;display:flex;flex-direction:column;justify-content:center;
  padding-right:var(--gutter);max-width:520px;
}
.stick-step .label{color:var(--blue-700);margin-bottom:14px;}
.stick-step h3{font-weight:800;font-size:clamp(30px,3.4vw,48px);letter-spacing:-.02em;line-height:1.02;text-transform:uppercase;margin-bottom:16px;}
.stick-step p{color:var(--slate-700);font-size:18px;max-width:420px;}
.stick-step .dose{font-weight:800;color:var(--ink);}

/* ============================================================
   PILLARS — ink section (max one per page)
   ============================================================ */
.pillars{background:var(--ink);color:#fff;padding:110px 0;}
.pillars-head{margin-bottom:64px;max-width:700px;}
.pillars-head .label{color:var(--blue-400);margin-bottom:16px;}
.pillar-row{
  display:grid;grid-template-columns:minmax(200px,1fr) 2fr;
  border-top:1px solid var(--slate-700);
  padding:34px 0;gap:24px;align-items:baseline;
}
.pillar-row:last-child{border-bottom:1px solid var(--slate-700);}
.pillar-name{font-weight:800;font-size:clamp(30px,4vw,56px);letter-spacing:-.02em;text-transform:uppercase;}
.pillar-actives{color:var(--fog-300);font-size:16px;line-height:1.7;}
.pillar-actives b{color:#fff;font-weight:700;}

/* ============================================================
   SHELF COMPARISON — seven bottles, one stick
   ============================================================ */
.shelf{padding:110px 0;}
.shelf-head{max-width:760px;margin-bottom:56px;}
.shelf-head .label{color:var(--blue-700);margin-bottom:16px;}
.shelf-table{width:100%;border-collapse:collapse;font-size:16px;}
.shelf-table th{
  text-align:left;font-weight:600;font-size:12px;letter-spacing:.12em;text-transform:uppercase;
  color:var(--steel-500);padding:0 16px 14px 0;border-bottom:2px solid var(--ink);
}
.shelf-table td{padding:16px 16px 16px 0;border-bottom:1px solid var(--fog-300);}
.shelf-table .money{font-weight:700;}
.shelf-total td{border-bottom:2px solid var(--ink);font-weight:800;font-size:18px;padding-top:22px;padding-bottom:22px;}
.shelf-once{background:var(--blue-100);}
.shelf-once td{font-weight:800;color:var(--blue-800);border-bottom:2px solid var(--blue);padding:24px 16px 24px 16px;font-size:18px;}
.shelf-note{margin-top:18px;color:var(--steel-500);font-size:14px;max-width:560px;}

/* ============================================================
   SHOP — AG1-grade buy box
   ============================================================ */
.shop{padding:110px 0;background:var(--paper-warm);}
.shop-grid{display:grid;grid-template-columns:1fr 1.1fr;gap:72px;align-items:center;}
.shop-visual{
  background:var(--blue-100);
  display:flex;align-items:center;justify-content:center;
  padding:56px 0;min-height:560px;
}
.shop-visual img{height:480px;width:auto;}
.shop-box .headline{margin:12px 0 32px;}
.shop-opts{display:flex;flex-direction:column;gap:10px;margin-bottom:24px;}
.shop-opt{
  display:flex;align-items:center;gap:16px;
  border:2px solid var(--fog-300);
  padding:18px 20px;cursor:pointer;background:#fff;
}
.shop-opt.selected{border-color:var(--blue);background:var(--blue-100);}
.shop-opt input{accent-color:var(--blue);width:18px;height:18px;flex-shrink:0;}
.shop-opt div{flex:1;}
.shop-opt b{display:block;font-size:16px;}
.shop-opt small{display:block;color:var(--steel-500);font-size:13.5px;margin-top:2px;}
.shop-price{font-weight:800;font-size:13px;letter-spacing:.06em;text-transform:uppercase;color:var(--blue-700);white-space:nowrap;}
.shop-cta{width:100%;text-align:center;}
.shop-perks{list-style:none;margin-top:22px;}
.shop-perks li{
  font-size:14.5px;color:var(--slate-700);
  padding:8px 0 8px 26px;position:relative;
  border-bottom:1px solid var(--fog-300);
}
.shop-perks li::before{content:"+";position:absolute;left:0;color:var(--blue);font-weight:800;}

/* ============================================================
   STICK FLOAT — fixed 3D overlay, scroll-choreographed
   ============================================================ */
.stick-float{
  position:fixed;top:0;left:0;
  width:min(48vw,720px);height:100vh;
  z-index:4;pointer-events:none;will-change:transform,opacity;
}
.stick-float three-d-stage{width:100%;height:100% !important;--stage-bg:transparent;background:transparent;}

/* ============================================================
   LIVE LABEL — the back panel as real HTML
   ============================================================ */
.livelabel{background:var(--blue);color:#fff;padding:110px 0;}
.livelabel-grid{display:grid;grid-template-columns:1fr 1.2fr;gap:64px;align-items:start;}
.livelabel-copy .label{color:var(--blue-200);margin-bottom:16px;}
.livelabel-copy h2{color:#fff;margin-bottom:20px;}
.livelabel-copy p{color:var(--blue-100);max-width:420px;margin-bottom:28px;}
.facts{
  background:#fff;color:var(--ink);
  font-family:var(--font-narrow);
  padding:24px 22px;border:2px solid var(--ink);
}
.facts h4{font-family:var(--font);font-weight:800;font-size:26px;letter-spacing:-.01em;margin-bottom:4px;}
.facts .facts-serving{font-size:14px;border-bottom:8px solid var(--ink);padding-bottom:8px;margin-bottom:6px;}
.facts table{width:100%;border-collapse:collapse;font-size:14px;}
.facts td{padding:5px 0;border-bottom:1px solid var(--fog-300);}
.facts td:last-child{text-align:right;white-space:nowrap;}
.facts tr.thick td{border-bottom:4px solid var(--ink);}
.facts .fnote{font-size:11.5px;color:var(--slate-700);margin-top:10px;line-height:1.5;}
.facts a{color:var(--blue-700);font-weight:700;text-decoration:underline;}

/* ============================================================
   GALLERY — budbros-style contained masonry
   ============================================================ */
.gallery-section{padding:110px 0;}
.gallery-grid{
  display:grid;grid-template-columns:repeat(4,1fr);
  grid-auto-rows:230px;gap:12px;margin-top:48px;grid-auto-flow:dense;
}
.gallery-item{overflow:hidden;position:relative;}
.gallery-item.tall{grid-row:span 2;}
.gallery-item.wide{grid-column:span 2;}
.gallery-item img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .7s;}
.gallery-item:hover img{transform:scale(1.04);}
.gallery-item .cap{
  position:absolute;left:14px;bottom:12px;z-index:2;
  font-size:11px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;
  color:#fff;text-shadow:0 2px 10px rgba(0,0,0,.55);
}

/* ============================================================
   POSTER CLOSE
   ============================================================ */
.poster{
  background:var(--blue);color:#fff;
  padding:140px 0;text-align:left;
  position:relative;overflow:hidden;
}
.poster-video{
  position:absolute;inset:0;width:100%;height:100%;object-fit:cover;
  filter:brightness(.7) saturate(.85);
}
.poster-tint{
  position:absolute;inset:0;
  background:
    linear-gradient(90deg, rgba(4,32,54,.78) 0%, rgba(4,32,54,.4) 55%, rgba(4,32,54,.15) 100%),
    linear-gradient(0deg, rgba(4,32,54,.5) 0%, rgba(4,32,54,0) 45%);
}
.poster .display{margin-bottom:40px;}
.poster-tag{margin-top:28px;color:var(--blue-100);}

/* ============================================================
   FOOTER
   ============================================================ */
footer{background:var(--ink);color:var(--fog-300);padding:56px 0;font-size:13px;}
.foot-grid{display:flex;justify-content:space-between;gap:32px;flex-wrap:wrap;}
.foot-logo{font-weight:800;font-size:20px;color:#fff;}
.foot-links{display:flex;gap:24px;}
.foot-links a{color:var(--fog-300);}
.foot-links a:hover{color:#fff;}
.disclaimer{margin-top:32px;font-size:11.5px;color:var(--steel-500);max-width:720px;line-height:1.6;}

/* ============================================================
   MOBILE BUY BAR
   ============================================================ */
.buybar{
  position:fixed;left:0;right:0;bottom:0;z-index:90;
  background:var(--blue);color:#fff;
  display:none;align-items:center;justify-content:space-between;
  padding:12px var(--gutter);
  transform:translateY(100%);transition:transform .2s ease;
}
.buybar.show{transform:none;}
.buybar b{font-weight:800;text-transform:uppercase;font-size:14px;letter-spacing:.04em;}
.buybar .btn-white{padding:12px 22px;font-size:13px;}

/* ============================================================
   WAITLIST (inline — no modal, ever)
   ============================================================ */
.waitlist{display:flex;gap:0;max-width:460px;margin-top:8px;}
.hp{position:absolute;left:-9999px;width:1px;height:1px;opacity:0;}
.join-note{font-size:13.5px;color:rgba(255,255,255,.78);margin-top:12px;max-width:420px;}
.waitlist input{
  flex:1;border:2px solid #fff;background:transparent;color:#fff;
  padding:16px 18px;font-family:inherit;font-size:15px;min-height:44px;
}
.waitlist input::placeholder{color:var(--blue-200);}
.waitlist button{
  background:#fff;color:var(--blue-700);border:2px solid #fff;
  font-weight:800;text-transform:uppercase;letter-spacing:.06em;font-size:14px;
  padding:0 26px;min-height:44px;
}
.waitlist-ok{margin-top:14px;font-weight:700;color:#fff;display:none;}

/* ============================================================
   WHAT'S INSIDE page
   ============================================================ */
.inside-hero{background:var(--blue);color:#fff;padding:170px 0 90px;}
.inside-hero .label{color:var(--blue-200);margin-bottom:18px;}
.inside-hero p{max-width:560px;color:var(--blue-100);margin-top:22px;font-size:19px;}
.actives{padding:90px 0;}
.pillar-block{margin-bottom:80px;}
.pillar-block>.label{color:var(--blue-700);border-top:2px solid var(--ink);padding-top:16px;display:block;margin-bottom:8px;}
.pillar-block>h3{font-weight:800;font-size:clamp(30px,4vw,52px);text-transform:uppercase;letter-spacing:-.02em;margin-bottom:36px;}
.active-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:2px;background:var(--fog-300);border:1px solid var(--fog-300);}
.active-card{background:#fff;padding:26px 24px 30px;}
.active-card:hover{background:var(--blue-100);}
.active-dose{font-weight:800;font-size:30px;letter-spacing:-.02em;color:var(--blue-700);}
.active-name{font-weight:700;font-size:18px;margin:4px 0 12px;}
.active-why{font-size:15px;color:var(--slate-700);line-height:1.55;margin-bottom:14px;}
.active-bench{font-size:12.5px;letter-spacing:.06em;text-transform:uppercase;font-weight:600;color:var(--ok);}
.active-bench.note{color:var(--steel-500);}

/* ============================================================
   RESPONSIVE
   ============================================================ */
@media (max-width:960px){
  .numbers-grid{grid-template-columns:repeat(2,1fr);}
  .stick-float{width:min(38vw,300px);}
  .stick-step{padding-right:min(42vw,320px);}
  .numbers-grid{padding-right:min(38vw,300px);}
  .gallery-grid{grid-template-columns:repeat(2,1fr);grid-auto-rows:200px;}
  .stick-steps{padding:0 0 40px;}
  .stick-step{min-height:auto;padding:48px var(--gutter);}
  .livelabel-grid{grid-template-columns:1fr;}
  .ritual-grid{grid-template-columns:1fr;}
  .shop-grid{grid-template-columns:1fr;gap:32px;}
  .shop-visual{min-height:auto;padding:36px 0;}
  .shop-visual img{height:320px;}
  .world-grid{grid-template-columns:1fr;}
  .ritual-cell{aspect-ratio:16/10;}
  .pillar-row{grid-template-columns:1fr;gap:8px;}
  .hero-stick{display:none;}
  .nav-links{display:none;}
  .buybar{display:flex;}
}
@media (max-width:560px){
  .stick-float{width:min(34vw,180px);height:36vh;}
  .stick-step{padding-right:min(36vw,190px);}
  .stick-step h3{overflow-wrap:break-word;hyphens:auto;font-size:clamp(24px,6.4vw,34px);}
  .numbers-grid{padding-right:min(30vw,160px);}
}
@media (max-width:520px){
  .numbers-grid{grid-template-columns:1fr 1fr;}
  .num{margin-right:16px;}
  .shelf-table{font-size:14px;}
  .facts table{font-size:12px;}
}


/* ============================================================
   FEEL — hover + press states on every interactive surface
   ============================================================ */
.nav-cta{transition:transform .2s ease,opacity .2s ease;}
.nav-cta:hover{transform:translateY(-2px);opacity:1;}
.nav-cta:active{transform:translateY(0) scale(.97);}
.nav-links a{position:relative;padding-bottom:4px;}
.nav-links a::after{
  content:"";position:absolute;left:0;bottom:0;height:2px;width:100%;
  background:currentColor;transform:scaleX(0);transform-origin:left;
  transition:transform .2s ease;
}
.nav-links a:hover{opacity:1;}
.nav-links a:hover::after{transform:scaleX(1);}

.hero-flags span{transition:background .2s ease,color .2s ease,transform .2s ease;cursor:default;}
.hero-flags span:hover{background:#fff;color:var(--blue-700);transform:translateY(-2px);}

.num{transition:transform .2s ease,border-color .2s ease;}
.num:hover{transform:translateY(-4px);border-top-color:var(--blue);}
.num:hover .num-val{color:var(--blue-700);}
.num-val{transition:color .2s ease;}

.pillar-row{transition:background .2s ease,padding-left .2s ease;}
.pillar-row:hover{background:rgba(255,255,255,.05);padding-left:14px;}
.pillar-row:hover .pillar-name{color:var(--blue-400);}
.pillar-name{transition:color .2s ease;}

.shelf-table tbody tr{transition:background .2s ease;}
.shelf-table tbody tr:hover{background:var(--fog-100);}
.shelf-once:hover{background:var(--blue-200) !important;}

.shop-opt{transition:border-color .2s ease,transform .2s ease,background .2s ease;}
.shop-opt:hover{border-color:var(--blue-400);transform:translateY(-2px);}
.shop-opt.selected:hover{border-color:var(--blue);}
.shop-perks li{transition:color .2s ease,padding-left .2s ease;}
.shop-perks li:hover{color:var(--ink);padding-left:32px;}

.facts table tr{transition:background .15s ease;}
.facts table tr:hover{background:var(--blue-100);}

.gallery-item{cursor:pointer;}
.gallery-item img{transition:transform .7s ease,filter .4s ease;}
.gallery-item:hover img{transform:scale(1.05);filter:brightness(1.08);}
.gallery-item .cap{transition:letter-spacing .25s ease,transform .25s ease;}
.gallery-item:hover .cap{letter-spacing:.26em;transform:translateY(-3px);}

.ticker:hover .ticker-track{animation-play-state:paused;}

.active-card{transition:background .2s ease,transform .2s ease;}
.active-card:hover{transform:translateY(-4px);}
.active-card:hover .active-dose{color:var(--blue);}
.active-dose{transition:color .2s ease;}

.waitlist input{transition:border-color .2s ease,background .2s ease;}
.waitlist input:focus{outline:none;background:rgba(255,255,255,.12);}
.waitlist button{transition:transform .2s ease,background .2s ease,color .2s ease;cursor:pointer;}
.waitlist button:hover{transform:translateY(-2px);background:var(--blue-100);}
.waitlist button:active{transform:translateY(0) scale(.97);}

.foot-links a{position:relative;transition:color .2s ease;}
.foot-links a::after{
  content:"";position:absolute;left:0;bottom:-3px;height:1px;width:100%;
  background:#fff;transform:scaleX(0);transform-origin:left;transition:transform .2s ease;
}
.foot-links a:hover::after{transform:scaleX(1);}


/* ============================================================
   LIFE MAXING — category card carousel (ink section)
   ============================================================ */
.maxing{background:var(--ink);color:#fff;padding:110px 0 90px;}
.maxing .headline{margin-top:12px;}
.maxing-sub{color:var(--fog-300);margin-top:14px;max-width:520px;}
.maxing-track{
  display:flex;gap:14px;
  overflow-x:auto;scroll-snap-type:x mandatory;
  padding:48px var(--gutter) 10px;
  -webkit-overflow-scrolling:touch;
}
.maxing-track::-webkit-scrollbar{height:6px;}
.maxing-track::-webkit-scrollbar-thumb{background:var(--slate-700);}
.mx-card{
  position:relative;flex:0 0 340px;height:480px;
  overflow:hidden;scroll-snap-align:start;
  display:flex;flex-direction:column;
  transition:transform .2s ease;
}
.mx-card:hover{transform:translateY(-6px);}
.mc1{background:var(--blue);}
.mc2{background:var(--blue-800);}
.mc3{background:var(--slate-700);}
.mc4{background:var(--blue-600);}
.mc5{background:var(--blue-900);}
.mc6{background:#1F2933;}
.mx-card img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;}
.mx-tag{
  position:relative;z-index:2;
  font-family:var(--font-mono,'Courier New',monospace);
  font-size:11.5px;letter-spacing:.14em;text-transform:uppercase;font-weight:600;
  padding:18px 20px 0;color:#fff;
}
.mx-body{
  position:relative;z-index:2;margin-top:auto;
  background:rgba(17,17,17,.78);
  padding:20px 20px 24px;
}
.mx-body h3{font-weight:800;font-size:30px;letter-spacing:-.01em;margin-bottom:8px;}
.mx-body p{font-size:14.5px;color:var(--fog-300);line-height:1.55;}
.mx-hint{color:var(--steel-500);font-size:12px;letter-spacing:.14em;text-transform:uppercase;font-weight:600;margin-top:6px;}
@media (max-width:560px){
  .mx-card{flex:0 0 280px;height:430px;}
}


/* Life Maxing: vertical scroll drives horizontal ride (desktop) */
@media (min-width:961px){
  .maxing{padding:0;}
  .maxing-pin{
    position:sticky;top:0;min-height:100vh;
    display:flex;flex-direction:column;justify-content:center;
    padding:70px 0 40px;overflow:hidden;
  }
  .maxing-track{overflow:visible;will-change:transform;}
}