/* ============================================================
   EXO landing, simple
   one paper · one orange · real app screens · pixel EXO as the accent
   ============================================================ */
:root{
  --paper:#FDFBF9;
  --paper-2:#F7EFE9;
  --card:#FFFFFF;
  --ink:#2B1A07;
  --ink-2:#4A3A28;
  --muted:#7A6A57;
  --line:rgba(43,26,7,.10);
  --orange:#FF6F1E;
  --orange-soft:#FFEDE1;
  --navy:#1E2A5A;
  --t-orange:#FFF1E7;
  --t-cyan:#E9F8F6;
  --t-lilac:#F0EEFF;
  --t-pink:#FFF0F4;
  --display:'Fredoka',ui-rounded,system-ui,sans-serif;
  --sans:'Hanken Grotesk',system-ui,sans-serif;
  --mono:'DM Mono',ui-monospace,SFMono-Regular,Menlo,monospace;
  --ease:cubic-bezier(.22,.61,.36,1);
  --spring:cubic-bezier(.34,1.56,.64,1);
  --maxw:1180px;
  --gutter:clamp(16px,4vw,32px);
  --radius:28px;
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0;}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;scroll-padding-top:84px;}
body{font-family:var(--sans);background:var(--paper);color:var(--ink);font-size:17px;line-height:1.6;
  -webkit-font-smoothing:antialiased;overflow-x:hidden;}
img{max-width:100%;height:auto;display:block;}
a{color:inherit;text-decoration:none;}
ul{list-style:none;}
::selection{background:var(--orange);color:#fff;}
.wrap{width:100%;max-width:var(--maxw);margin:0 auto;padding:0 var(--gutter);}
.mono{font-family:var(--mono);}
img.px{image-rendering:pixelated;image-rendering:crisp-edges;object-fit:contain;}

/* ---------- type ---------- */
.h1,.h2{font-family:var(--display);font-weight:600;letter-spacing:-.025em;color:var(--ink);text-wrap:balance;}
.h1{font-size:clamp(42px,5.6vw,74px);line-height:1;}
.h2{font-size:clamp(34px,4.4vw,56px);line-height:1.02;text-transform:lowercase;}
.lead{font-size:clamp(17px,1.5vw,20px);line-height:1.5;color:var(--muted);max-width:38ch;margin-top:22px;}
.body{font-size:clamp(16px,1.3vw,18px);color:var(--muted);max-width:46ch;margin-top:16px;}
.kicker{font-family:var(--mono);font-size:13px;letter-spacing:.04em;color:var(--orange);margin-bottom:14px;text-transform:lowercase;}
.hl{color:var(--orange);}
.fine{font-size:12px;color:var(--muted);margin-top:14px;}

/* ---------- buttons ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;font-weight:600;border-radius:999px;
  background:var(--ink);color:var(--paper);transition:transform .3s var(--spring),background .2s;}
.btn:hover{transform:translateY(-2px);background:#3A260F;}
.btn-sm{padding:9px 18px;font-size:14.5px;}
.appstore{display:inline-flex;align-items:center;gap:12px;background:var(--ink);color:var(--paper);
  padding:13px 26px 13px 20px;border-radius:999px;box-shadow:0 14px 30px -14px rgba(43,26,7,.55);
  transition:transform .3s var(--spring),box-shadow .3s var(--ease),background .2s;}
.appstore:hover{transform:translateY(-3px);box-shadow:0 22px 40px -16px rgba(43,26,7,.55);background:#3A260F;}
.appstore svg{width:24px;height:24px;fill:currentColor;flex-shrink:0;}
.appstore .t{line-height:1.12;}
.appstore .t small{display:block;font-size:10.5px;opacity:.7;letter-spacing:.02em;}
.appstore .t b{font-family:var(--display);font-weight:600;font-size:19px;}
.appstore-light{background:#fff;color:var(--ink);box-shadow:0 20px 40px -18px rgba(0,0,0,.6);}
.appstore-light:hover{background:var(--orange-soft);}

/* ---------- nav ---------- */
.nav{position:sticky;top:0;z-index:50;background:color-mix(in srgb,var(--paper) 86%,transparent);
  backdrop-filter:blur(14px) saturate(1.4);-webkit-backdrop-filter:blur(14px) saturate(1.4);
  border-bottom:1px solid transparent;transition:border-color .3s;}
.nav.scrolled{border-bottom-color:var(--line);}
.nav-in{display:flex;align-items:center;justify-content:space-between;gap:24px;height:84px;}
.brand{display:flex;align-items:center;gap:8px;font-family:var(--display);font-weight:600;font-size:22px;letter-spacing:-.01em;}
.brand img{width:38px;height:38px;}
.nav .brand{font-size:28px;}
.btn-nav{padding:13px 26px;font-size:17px;}
.nav-links{display:flex;gap:clamp(20px,3.4vw,44px);font-size:17px;font-weight:500;color:var(--ink-2);}
.nav-links a:hover{color:var(--orange);}

/* ---------- hero ---------- */
.hero{padding:clamp(8px,2svh,28px) 0 clamp(40px,6vw,80px);}
.hero-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:clamp(28px,5vw,72px);align-items:center;}
.cta-row{margin-top:32px;display:flex;flex-wrap:wrap;gap:14px;align-items:center;}
.trust{display:flex;flex-wrap:wrap;gap:10px 22px;margin-top:26px;font-size:14.5px;font-weight:500;color:var(--ink-2);}
.trust li{display:flex;align-items:center;gap:8px;}
.trust img{width:22px;height:22px;}

.hero-visual{position:relative;display:grid;place-items:center;padding:10px 0 30px;}
.hero-visual::before{content:"";position:absolute;width:78%;aspect-ratio:1;border-radius:50%;
  background:radial-gradient(circle,var(--orange-soft) 0 55%,transparent 70%);z-index:-1;}
.phone{border-radius:34px;overflow:hidden;background:#fff;border:6px solid #fff;
  box-shadow:0 1px 0 1px var(--line),0 30px 60px -30px rgba(43,26,7,.45);}
.phone img{width:100%;}
.phone-hero{width:min(300px,72vw);border-radius:42px;border-width:8px;justify-self:end;margin-right:4%;}
.float{position:absolute;filter:drop-shadow(0 16px 18px rgba(43,26,7,.18));animation:bob 6s ease-in-out infinite;}
.fl1{width:clamp(76px,8vw,112px);top:6%;right:2%;}
.fl2{width:clamp(56px,6vw,84px);top:10%;left:14%;animation-delay:-3s;}
@keyframes bob{0%,100%{transform:translateY(0);}50%{transform:translateY(-10px);}}
.bubble{position:absolute;left:0;bottom:calc(6% + clamp(110px,11vw,150px));z-index:3;max-width:210px;font-size:13px;line-height:1.35;color:var(--ink);
  background:#fff;border:1.5px solid var(--ink);border-radius:16px;padding:9px 13px;box-shadow:4px 4px 0 var(--ink);}
.bubble::after{content:"";position:absolute;bottom:-7px;left:34px;width:11px;height:11px;background:#fff;
  border-right:1.5px solid var(--ink);border-bottom:1.5px solid var(--ink);transform:rotate(45deg);}
.buddy{position:absolute;left:2%;bottom:6%;z-index:3;width:clamp(100px,11vw,150px);background:none;border:0;cursor:pointer;}
.buddy img{width:100%;transform-origin:50% 90%;animation:bob 4.2s ease-in-out infinite;filter:drop-shadow(6px 8px 0 rgba(93,111,180,.16));}
.buddy img.swap{animation:squish .6s var(--ease);}
.buddy:focus-visible{outline:2px dashed var(--orange);outline-offset:6px;border-radius:20px;}
@keyframes squish{0%{scale:1 1;}18%{scale:1.22 .78;}38%{scale:.86 1.18;translate:0 -22px;}58%{scale:1.08 .92;translate:0 0;}78%{scale:.97 1.03;}100%{scale:1 1;}}
.poof{position:absolute;inset:0;pointer-events:none;}
.poof i{position:absolute;left:50%;top:45%;width:9px;height:9px;border-radius:2px;background:var(--c);animation:poof .7s var(--ease) forwards;}
@keyframes poof{0%{transform:translate(-50%,-50%) scale(.4);opacity:1;}100%{transform:translate(calc(-50% + var(--x)),calc(-50% + var(--y))) scale(1) rotate(90deg);opacity:0;}}
.rating{display:inline-flex;align-items:center;gap:10px;margin-bottom:22px;padding:7px 14px 7px 10px;border-radius:999px;
  background:var(--card);border:1px solid var(--line);font-size:14.5px;color:var(--ink-2);transition:border-color .2s;}
.rating:hover{border-color:var(--orange);}
.rating b{color:var(--ink);font-weight:700;}
.stars{display:flex;gap:1px;}
.stars svg{width:17px;height:17px;fill:#FF9A52;}

/* hero, Fitia style: the visual first, one short line, proof chips, one button */
.hero-stack{display:flex;flex-direction:column;align-items:center;text-align:center;}
.hero-stack .hero-visual{width:min(100%,620px);padding:0;height:clamp(200px,38svh,400px);}
.hero-stack .phone-hero{justify-self:center;margin:0 auto;width:min(270px,62vw);height:100%;
  -webkit-mask-image:linear-gradient(#000 78%,transparent);mask-image:linear-gradient(#000 78%,transparent);box-shadow:none;}
.hero-stack .buddy{left:6%;bottom:2%;width:clamp(80px,9vw,120px);}
.hero-stack .bubble{left:0;bottom:calc(2% + clamp(84px,9.5vw,126px));}
.hero-stack .fl1{top:4%;right:4%;}
.hero-stack .fl2{top:4%;left:12%;bottom:auto;}
.hero-stack .h1{font-size:clamp(34px,min(6.2vw,8svh),86px);line-height:.98;margin-top:clamp(12px,2svh,22px);}
.hero-proof{display:flex;justify-content:center;margin-top:clamp(12px,2svh,22px);}
.hero-proof .rating{margin:0;}
.hero-proof .rating img{width:20px;height:20px;}
.hero-stack .cta-row{justify-content:center;margin-top:clamp(14px,2.4svh,28px);}
.appstore-xl{padding:20px 40px 20px 30px;gap:16px;}
.appstore-xl svg{width:34px;height:34px;}
.appstore-xl .t small{font-size:13px;}
.appstore-xl .t b{font-size:28px;}

/* ---------- sections ---------- */
.sec{padding:clamp(56px,8vw,112px) 0;}
.head{text-align:center;display:flex;flex-direction:column;align-items:center;margin-bottom:clamp(32px,4vw,52px);}
.head .body{margin-left:auto;margin-right:auto;}

/* feature cards: title, one line, a real screen peeking up from the bottom */
.cards{display:grid;gap:clamp(14px,1.6vw,22px);}
.c3{grid-template-columns:repeat(3,1fr);}
.c4{grid-template-columns:repeat(4,1fr);}
.c4 .card{min-height:470px;padding:26px 18px 0;}
.c4 .card h3{font-size:21px;}
.c4 .phone-card{width:min(230px,86%);max-height:340px;}
.c4 .hat{position:static;width:56px;height:56px;margin:-6px auto 10px;transform:rotate(-4deg);}
.c4 .card:hover .hat{transform:rotate(6deg) scale(1.08);}
.card{position:relative;overflow:hidden;border-radius:var(--radius);padding:28px 24px 0;text-align:center;
  display:flex;flex-direction:column;align-items:center;min-height:440px;}
.card h3{font-family:var(--display);font-weight:600;font-size:23px;line-height:1.15;letter-spacing:-.01em;}
.card p{font-size:15px;color:var(--muted);margin-top:6px;max-width:24ch;}
.phone-card{margin-top:24px;width:min(220px,82%);border-radius:28px 28px 0 0;border-bottom:0;
  box-shadow:0 1px 0 1px var(--line),0 24px 40px -24px rgba(43,26,7,.35);
  max-height:330px;transition:transform .45s var(--ease);margin-bottom:-2px;}
.card:hover .phone-card{transform:translateY(-8px);}
.c3 .card{min-height:500px;}
.c3 .phone-card{width:min(250px,78%);max-height:380px;}
.t-orange{background:var(--t-orange);}
.t-cyan{background:var(--t-cyan);}
.t-lilac{background:var(--t-lilac);}
.t-pink{background:var(--t-pink);}
.t-paper{background:var(--paper-2);}
.hat{position:absolute;top:14px;right:14px;width:52px;height:52px;transform:rotate(8deg);transition:transform .4s var(--spring);}
.card:hover .hat{transform:rotate(-6deg) scale(1.08);}


/* snap (from the original page) */
#snap{padding:clamp(40px,5vw,64px) 0;}
#snap .h2{font-size:clamp(34px,4vw,52px);}
#snap .body{margin-top:10px;}
#snap .feats{margin-top:18px;gap:8px;}
.snap-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(40px,7vw,100px);align-items:center;}
.scan{position:relative;aspect-ratio:1;max-width:min(470px,72svh);margin:0 auto;}
.scan-disc{position:absolute;inset:4%;border-radius:50%;background:radial-gradient(circle at 50% 40%,#FFF4EC,#FBE6D8 70%);}
.scan-disc::after{content:"";position:absolute;inset:-7%;border-radius:50%;border:1.5px dashed rgba(255,111,30,.28);animation:spin 50s linear infinite;}
@keyframes spin{to{transform:rotate(360deg);}}
.scan-plate{position:absolute;left:14%;top:12%;width:72%;height:auto;filter:drop-shadow(0 34px 34px rgba(43,26,7,.28));animation:plate 8s ease-in-out infinite;}
@keyframes plate{0%,100%{transform:rotate(0) translateY(0);}50%{transform:rotate(6deg) translateY(-6px);}}
.scan-frame{position:absolute;left:9%;top:7%;width:82%;height:82%;pointer-events:none;}
.scan-frame i{position:absolute;width:18%;height:18%;border:4px solid var(--ink);}
.scan-frame i:nth-child(1){top:0;left:0;border-right:0;border-bottom:0;border-top-left-radius:26px;}
.scan-frame i:nth-child(2){top:0;right:0;border-left:0;border-bottom:0;border-top-right-radius:26px;}
.scan-frame i:nth-child(3){bottom:0;left:0;border-right:0;border-top:0;border-bottom-left-radius:26px;}
.scan-frame i:nth-child(4){bottom:0;right:0;border-left:0;border-top:0;border-bottom-right-radius:26px;}
.scan-line{position:absolute;left:6%;right:6%;height:3px;top:0;border-radius:3px;background:var(--orange);
  box-shadow:0 0 22px 5px rgba(255,111,30,.45);animation:scan 3s ease-in-out infinite;}
@keyframes scan{0%,100%{top:6%;opacity:.3;}50%{top:92%;opacity:1;}}
.tag{position:absolute;z-index:3;display:flex;align-items:center;gap:8px;background:var(--card);color:var(--ink);
  border:1.5px solid var(--ink);border-radius:999px;padding:5px 14px 5px 5px;font-size:14.5px;font-weight:700;
  box-shadow:4px 4px 0 var(--ink);transition:opacity .4s var(--ease),scale .6s var(--spring);}
.tag img{width:34px;height:34px;object-fit:contain;border-radius:50%;background:var(--paper-2);padding:3px;}
.tag small{font-family:var(--mono);font-weight:400;font-size:12px;color:var(--muted);}
.t1{top:14%;right:-2%;transition-delay:.5s;rotate:4deg;}
.t2{top:40%;left:-4%;transition-delay:.75s;rotate:-4deg;}
.t3{top:62%;right:-4%;transition-delay:1s;rotate:3deg;}
.result{position:absolute;z-index:4;left:8%;right:8%;bottom:-4%;background:var(--card);border-radius:24px;padding:16px 18px;
  border:1.5px solid var(--line);box-shadow:0 30px 50px -26px rgba(43,26,7,.5);
  transition:opacity .6s var(--ease) 1.25s,transform .7s var(--spring) 1.25s;}
.result-top{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:12px;}
.result-top b{font-family:var(--display);font-weight:600;font-size:19px;}
.result-top span{font-size:15px;color:var(--orange);font-weight:500;}
.result-macros{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;}
.result-macros small{display:block;font-size:12px;color:var(--muted);font-weight:600;}
.result-macros b{display:block;font-family:var(--display);font-weight:600;font-size:18px;line-height:1.2;margin-bottom:6px;}
.result-macros i{display:block;position:relative;height:6px;border-radius:9px;background:#F1EAE2;overflow:hidden;}
.result-macros i::after{content:"";position:absolute;inset:0;width:var(--w);background:var(--c);border-radius:inherit;
  transform-origin:left;transition:transform 1.2s var(--ease) 1.6s;}
/* with JS, the tags and result card pop in once the bowl is on screen */
.js [data-reveal]:not(.in) .tag{opacity:0;scale:.6;}
.js [data-reveal]:not(.in) .result{opacity:0;transform:translateY(20px);}
.js [data-reveal]:not(.in) .result-macros i::after{transform:scaleX(0);}
.feats{margin-top:26px;display:grid;gap:10px;}
.feats li{display:flex;align-items:center;gap:16px;padding:10px 18px 10px 10px;border-radius:22px;background:var(--card);border:1px solid var(--line);transition:transform .35s var(--spring);}
.feats li:hover{transform:translateX(6px);}
.fi{width:58px;height:58px;flex-shrink:0;border-radius:50%;display:grid;place-items:center;background:var(--paper-2);}
.fi img{width:70%;height:70%;object-fit:contain;filter:drop-shadow(0 6px 6px rgba(43,26,7,.16));}
.feats b{display:block;font-size:16.5px;line-height:1.25;}
.feats small{display:block;font-size:14px;color:var(--muted);}

/* meal stamps: round ink seals like the app's */
.stamp{display:block;width:100%;aspect-ratio:1;}
.stamp svg{display:block;width:100%;height:100%;overflow:visible;mix-blend-mode:multiply;}

/* snap list: a row of stamps pressing in, and the real nutrition face */
.feats li.feat-row{flex-direction:column;align-items:flex-start;gap:8px;padding:12px 18px 12px 20px;}
.feats li.feat-col{flex-direction:column;align-items:stretch;gap:2px;padding:12px 20px 10px;}
.feats li.feat-row:hover,.feats li.feat-col:hover{transform:none;}
.stamp-row{display:flex;gap:2px;min-height:clamp(44px,3.8vw,54px);}
.stamp-row .stamp{width:clamp(44px,3.8vw,54px);opacity:0;}
.stamp-row .stamp.down{animation:press .55s cubic-bezier(.3,1.4,.5,1) forwards;}
.stamp-row.lift .stamp.down{animation:lift .45s var(--ease) forwards;}
@keyframes press{0%{opacity:0;transform:translateY(-22px) scale(1.7) rotate(calc(var(--r) - 14deg));filter:blur(2px);}
  55%{opacity:1;transform:scale(.9) rotate(var(--r));filter:none;}75%{transform:scale(1.05) rotate(var(--r));}100%{opacity:.95;transform:scale(1) rotate(var(--r));}}
@keyframes lift{from{opacity:.95;transform:scale(1) rotate(var(--r));}to{opacity:0;transform:scale(.85) rotate(var(--r));}}
.face-svg{display:block;width:100%;max-width:270px;height:auto;margin:4px auto 0;overflow:visible;}
.f-lbl{font-family:var(--sans);font-size:13px;font-weight:500;fill:#8E8A85;text-anchor:middle;}
.f-dot circle{transition:fill .35s var(--ease);}
.f-dot-t{font-family:var(--sans);font-size:8.5px;font-weight:700;fill:#C4C1BD;text-anchor:middle;pointer-events:none;}
.f-dot.lit .f-dot-t{fill:#fff;}
.f-dot.pop circle{animation:dotpop .5s var(--spring);transform-box:fill-box;transform-origin:center;}
@keyframes dotpop{0%{transform:scale(.6);}60%{transform:scale(1.25);}100%{transform:scale(1);}}
.f-num{font-family:var(--sans);font-weight:700;font-size:25px;fill:#111;text-anchor:middle;}
.f-of{font-family:var(--sans);font-size:10.5px;fill:#B0ACA7;text-anchor:middle;}
.wedge-bg{opacity:.1;}
.wedge{opacity:.75;}
.nose-ring{fill:none;stroke:rgba(0,0,0,.05);stroke-width:.6;}
.nose-pin{fill:#fff;stroke:rgba(0,0,0,.06);stroke-width:.6;}
.seg{transition:fill .35s var(--ease);}
.face-plate{display:flex;justify-content:center;gap:5px;min-height:24px;margin-top:2px;}
.face-plate img{width:22px;height:22px;object-fit:contain;filter:drop-shadow(0 4px 4px rgba(43,26,7,.18));animation:plop .5s var(--spring);}
@keyframes plop{0%{transform:translateY(-14px) scale(.5);opacity:0;}100%{transform:none;opacity:1;}}

/* context hub (from the original page) */
.hub-wrap{display:grid;grid-template-columns:1.1fr .9fr;gap:clamp(30px,5vw,70px);align-items:center;max-width:1100px;margin:0 auto;}
.hub{position:relative;aspect-ratio:1;width:100%;max-width:520px;margin:0 auto;}
.hub::before{content:"";position:absolute;inset:14%;border-radius:50%;background:radial-gradient(circle,#FFF1E7,transparent 70%);}
.hub-lines{position:absolute;inset:0;width:100%;height:100%;overflow:visible;}
.spokes line{stroke:rgba(43,26,7,.18);stroke-width:1.5;stroke-dasharray:3 7;vector-effect:non-scaling-stroke;animation:flow 1.4s linear infinite;}
@keyframes flow{to{stroke-dashoffset:-20;}}
.link{fill:none;stroke:var(--orange);stroke-width:.75;stroke-linecap:round;stroke-dasharray:100;stroke-dashoffset:100;}
.link.draw{animation:draw .9s var(--ease) forwards;}
@keyframes draw{to{stroke-dashoffset:0;}}
.node{position:absolute;left:calc(var(--x) * 1%);top:calc(var(--y) * 1%);transform:translate(-50%,-50%);display:flex;flex-direction:column;align-items:center;gap:6px;z-index:2;}
.node span{width:clamp(62px,8vw,88px);aspect-ratio:1;border-radius:50%;background:var(--card);border:1.5px solid var(--line);display:grid;place-items:center;
  box-shadow:0 18px 30px -20px rgba(43,26,7,.55);transition:transform .45s var(--spring),border-color .25s,box-shadow .3s;}
.node img{width:66%;height:66%;object-fit:contain;}
.node b{font-size:13px;font-weight:700;color:var(--muted);background:var(--paper);padding:1px 8px;border-radius:99px;}
.node.lit span{transform:scale(1.14);border-color:var(--orange);box-shadow:0 0 0 7px var(--orange-soft),0 20px 30px -18px rgba(255,111,30,.6);}
.node.lit b{color:var(--ink);}
.hub-exo{position:absolute;left:50%;top:50%;width:30%;aspect-ratio:1;transform:translate(-50%,-50%);z-index:2;}
.hub-exo img{width:100%;height:100%;transform-origin:50% 90%;animation:bob 4.2s ease-in-out infinite;}
.hub-exo img.swap{animation:squish .55s var(--ease);}
.hub-say{position:absolute;left:50%;top:67%;transform:translateX(-50%);z-index:3;width:max-content;max-width:52%;
  font-size:12.5px;line-height:1.4;text-align:center;color:var(--ink);background:var(--card);border:1.5px solid var(--ink);
  border-radius:14px;padding:8px 12px;box-shadow:3px 3px 0 var(--ink);}
.hub-say::before{content:"";position:absolute;top:-7px;left:50%;width:11px;height:11px;background:var(--card);
  border-left:1.5px solid var(--ink);border-top:1.5px solid var(--ink);transform:translateX(-50%) rotate(45deg);}
.hub-say:empty{display:none;}
.insights{display:grid;gap:12px;}
.insight{display:flex;align-items:center;gap:16px;text-align:left;width:100%;padding:14px 18px 14px 14px;border-radius:24px;cursor:pointer;
  font:inherit;color:inherit;background:var(--card);border:1.5px solid var(--line);transition:transform .35s var(--spring),border-color .2s,box-shadow .3s;}
.insight:hover{transform:translateX(4px);}
.insight.on{border-color:var(--ink);box-shadow:5px 5px 0 var(--ink);transform:translate(-2px,-2px);}
.insight:focus-visible{outline:2px solid var(--orange);outline-offset:3px;}
.pair{display:flex;flex-shrink:0;}
.pair img{width:46px;height:46px;object-fit:contain;padding:6px;border-radius:50%;background:var(--paper-2);border:2px solid var(--card);}
.pair img+img{margin-left:-14px;}
.it b{display:block;font-family:var(--display);font-weight:600;font-size:18px;line-height:1.2;}
.it small{display:block;font-size:14px;color:var(--muted);line-height:1.35;margin-top:2px;}
.insights .fine{text-align:center;margin-top:4px;}

/* his day: the live stage + four stops */
.day-card{max-width:960px;margin:0 auto;}
.stage-day{border-color:var(--ink);box-shadow:8px 8px 0 var(--ink);}
.day-chips{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin-top:26px;}
.day-chips button{display:flex;align-items:center;gap:8px;font:inherit;font-size:15px;font-weight:600;color:var(--ink-2);cursor:pointer;
  padding:8px 16px 8px 9px;border-radius:999px;background:var(--card);border:1.5px solid var(--line);transition:all .2s;}
.day-chips button img{width:26px;height:26px;}
.day-chips button:hover{border-color:var(--ink);}
.day-chips button.on{border-color:var(--ink);color:var(--ink);box-shadow:3px 3px 0 var(--ink);transform:translate(-1px,-1px);}

/* goals: one card per goal, EXO in the fitting hat */
.goals{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(14px,1.6vw,20px);}
.goal{border-radius:var(--radius);padding:26px 22px 28px;text-align:center;display:flex;flex-direction:column;align-items:center;
  transition:transform .35s var(--spring);}
.goal:hover{transform:translateY(-6px) rotate(-.6deg);}
.goal-art{position:relative;width:130px;height:120px;margin-bottom:14px;}
.goal-exo{position:absolute;left:0;bottom:0;width:104px;height:104px;transform-origin:50% 90%;transition:transform .45s var(--spring);}
.goal:hover .goal-exo{transform:rotate(-8deg) scale(1.06);}
.goal-prop{position:absolute;right:0;bottom:4px;width:62px;height:62px;filter:drop-shadow(0 10px 10px rgba(43,26,7,.2));}
.goal h3{font-family:var(--display);font-weight:600;font-size:23px;line-height:1.15;}
.goal p{font-size:15px;color:var(--muted);margin-top:6px;max-width:22ch;}

/* reviews */
.rating-line{display:flex;align-items:center;gap:8px;margin-top:16px;font-size:15px;color:var(--ink-2);}
.rating-line b{color:var(--ink);}
/* carousel: the row drifts left on its own, nonstop */
.reviews{overflow:hidden;margin:0 calc(var(--gutter) * -1);padding:6px 0 10px;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);}
.reviews-track{display:flex;gap:16px;width:max-content;animation:drift var(--dur,40s) linear infinite;}
@keyframes drift{to{transform:translateX(calc(-50% - 8px));}}
.review{margin:0;width:min(340px,78vw);flex-shrink:0;background:var(--card);border:1px solid var(--line);border-radius:24px;padding:22px 22px 18px;}
.review .stars svg{width:15px;height:15px;}
.review b{display:block;font-family:var(--display);font-weight:600;font-size:18px;line-height:1.2;margin-top:10px;}
.review blockquote{font-size:15.5px;color:var(--ink-2);margin-top:6px;line-height:1.55;}
.review figcaption{font-size:12px;color:var(--muted);margin-top:12px;}

/* faq */
.faq-wrap{max-width:820px;}
.faq{display:flex;flex-direction:column;gap:10px;}
.faq details{background:var(--card);border:1px solid var(--line);border-radius:20px;padding:0 22px;transition:border-color .2s;}
.faq details[open]{border-color:color-mix(in srgb,var(--orange) 45%,transparent);}
.faq summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:16px;
  padding:19px 0;font-weight:600;font-size:17px;}
.faq summary::-webkit-details-marker{display:none;}
.faq summary::after{content:"+";font-family:var(--display);font-size:26px;line-height:1;color:var(--orange);transition:transform .25s var(--ease);}
.faq details[open] summary::after{transform:rotate(45deg);}
.faq details p{padding:0 0 20px;color:var(--muted);font-size:16px;max-width:62ch;}
.faq-more{text-align:center;margin-top:22px;color:var(--muted);}
.faq-more a{color:var(--orange);font-weight:600;}

/* final card with the live engine */
.final{padding-top:0;}
.final-card{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(24px,4vw,56px);align-items:center;
  padding:clamp(24px,4vw,48px);border-radius:40px;background:var(--navy);color:#fff;}
.final-card .h2{color:#fff;margin-bottom:28px;}
.final-copy{display:flex;flex-direction:column;align-items:flex-start;}
.stage{position:relative;aspect-ratio:16/9;border-radius:22px;overflow:hidden;background:#20294A;
  border:1.5px solid #0B1230;box-shadow:8px 8px 0 #0B1230;}
.stage .world{display:block;width:100%;height:100%;image-rendering:pixelated;image-rendering:crisp-edges;touch-action:pan-y;
  -webkit-tap-highlight-color:transparent;user-select:none;-webkit-user-select:none;}

/* footer */
.foot{border-top:1px solid var(--line);padding:48px 0 32px;margin-top:clamp(40px,6vw,72px);}
.foot-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:28px;}
.foot-brand p{font-size:14.5px;color:var(--muted);margin-top:10px;max-width:26ch;}
.foot nav{display:flex;flex-direction:column;gap:8px;font-size:14.5px;color:var(--ink-2);}
.foot nav a:hover{color:var(--orange);}
.foot h4{font-family:var(--mono);font-weight:500;font-size:12.5px;color:var(--muted);text-transform:lowercase;margin-bottom:4px;}
.foot-c{margin-top:36px;font-size:13px;color:var(--muted);}

/* ---------- responsive ---------- */
@media (max-width:1020px){
  .c4{grid-template-columns:repeat(2,1fr);}
  .goals{grid-template-columns:repeat(2,1fr);}
}
@media (max-width:880px){
  .nav-links{display:none;}
  .hero-grid{grid-template-columns:1fr;text-align:center;}
  .hero-copy{display:flex;flex-direction:column;align-items:center;}
  .phone-hero{justify-self:center;margin-right:0;}
  .lead{margin-left:auto;margin-right:auto;}
  .cta-row,.trust{justify-content:center;}
  .c3{grid-template-columns:1fr;max-width:460px;margin:0 auto;}
  .snap-grid,.hub-wrap{grid-template-columns:1fr;}
  .snap-copy{order:-1;}
  .hub-wrap{max-width:600px;}
  .final-card{grid-template-columns:1fr;text-align:center;}
  .final-copy{align-items:center;}
  .foot-grid{grid-template-columns:1fr 1fr;}
  .foot-brand{grid-column:1/-1;}
}
@media (max-width:560px){
  .c4{grid-template-columns:1fr;max-width:400px;margin:0 auto;}
  .nav-in{height:70px;}
  .btn-nav{padding:11px 20px;font-size:15.5px;}
  .appstore-xl{padding:17px 32px 17px 24px;}
  .appstore-xl .t b{font-size:24px;}
  .hero-stack .bubble{left:0;top:4%;bottom:auto;max-width:140px;font-size:11px;padding:7px 10px;}
  .hero-stack .buddy{left:-2%;bottom:0;width:72px;}
  .hero-stack .fl1{width:56px;right:0;top:auto;bottom:10%;}
  .goals{gap:10px;}
  .goal{padding:18px 12px 20px;}
  .goal-art{width:104px;height:96px;}
  .goal-exo{width:84px;height:84px;}
  .goal-prop{width:48px;height:48px;}
  .goal h3{font-size:19px;}
  .goal p{font-size:13.5px;}
  .bubble{bottom:auto;top:4%;left:0;max-width:170px;font-size:12px;}
  .buddy{left:0;bottom:2%;width:92px;}
  .fl2{display:none;}
  .tag{font-size:13px;padding:4px 11px 4px 4px;}
  .tag img{width:28px;height:28px;}
  .result{left:3%;right:3%;padding:14px;}
  .result-top b{font-size:17px;}
  .hub{margin-bottom:64px;}
  .hub-say{top:calc(100% + 14px);max-width:92%;font-size:12px;}
  .hub-say::before{display:none;}
  .node b{font-size:11.5px;}
  .insight{padding:12px 14px 12px 12px;gap:12px;}
  .stage-day{box-shadow:5px 5px 0 var(--ink);}
  .final-card{border-radius:28px;padding:18px 18px 34px;}
  .stage{border-radius:16px;box-shadow:5px 5px 0 #0B1230;}
}
@media (prefers-reduced-motion:reduce){
  .stamp-row .stamp{opacity:.95!important;transform:rotate(var(--r,0deg))!important;}
  .reviews{overflow-x:auto;scroll-snap-type:x mandatory;}
  .review{scroll-snap-align:start;}
  *{animation:none!important;transition:none!important;scroll-behavior:auto!important;}
}