/* ==========================================================================
   Nu2ta — identity 2.0
   Emerald, one amber spark. Fraunces for display, Readex Pro for the rest.
   Motion ideas borrowed from prompt-motion.com: a gallery of looping
   previews, filter chips, a pause control and hand-written notes.
   ========================================================================== */

@font-face{font-family:'Fraunces';font-style:normal;font-weight:100 900;font-display:swap;src:url('/assets/fonts/fraunces-wght.woff2') format('woff2')}
@font-face{font-family:'Readex Pro';font-style:normal;font-weight:160 700;font-display:swap;src:url('/assets/fonts/readex-pro-wght.woff2') format('woff2')}

:root{
  --emerald:#0B2B26;
  --emerald-2:#123A33;
  --emerald-3:#1F4A43;
  --amber:#C86A00;        /* decoration only: dots, lines, drawings */
  --amber-text:#A85A00;   /* text + buttons on light (4.75:1) */
  --honey:#FFB347;        /* amber on dark (8.5:1) */
  --paper:#F4F8F5;
  --mist:#DDEBE4;
  --muted:#4F6660;
  --line:#C5D8CE;
  --on-dark-muted:#C5D8CE;
  --white:#fff;
  --success:#2F7A4F;
  --error:#B3261E;

  --display:'Fraunces',Georgia,serif;
  --text:'Readex Pro',system-ui,Tahoma,sans-serif;

  --radius:20px;
  --radius-sm:12px;
  --container:1200px;
  --gutter:clamp(16px,4vw,40px);
  --section:clamp(72px,10vw,128px);
  --ease:cubic-bezier(.22,.61,.36,1);
  --logo-accent:var(--amber);
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:88px}
body{margin:0;background:var(--paper);color:var(--emerald);font-family:var(--text);font-size:17px;line-height:1.6;font-weight:400;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
img,svg{display:block;max-width:100%}
a{color:inherit}
h1,h2,h3,p,ol,ul,figure{margin:0}
ol,ul{padding:0;list-style:none}
button,input,select,textarea{font:inherit;color:inherit}
:focus-visible{outline:3px solid var(--amber-text);outline-offset:3px;border-radius:6px}
.sprite{position:absolute;width:0;height:0;overflow:hidden}
.icon{width:20px;height:20px;flex:none}
[hidden]{display:none!important}

.skip-link{position:absolute;left:16px;top:-60px;z-index:100;background:var(--emerald);color:var(--paper);padding:10px 16px;border-radius:10px;text-decoration:none;font-weight:600}
.skip-link:focus{top:12px}

.container{width:100%;max-width:calc(var(--container) + var(--gutter)*2);margin:0 auto;padding:0 var(--gutter)}
.section{padding:var(--section) 0}

/* ---------- Type ---------- */
.eyebrow{font-size:13px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--amber-text);margin-bottom:14px}
.eyebrow--honey{color:var(--honey)}
.h2{font-family:var(--display);font-weight:600;font-size:clamp(32px,4.6vw,52px);line-height:1.08;letter-spacing:-.01em;max-width:18ch;font-variation-settings:'SOFT' 50}
.h2--light{color:var(--paper)}
.lead{font-size:clamp(17px,1.6vw,19px);color:var(--muted);max-width:56ch;margin-top:18px}
.lead--light{color:var(--on-dark-muted)}
.text-link{color:var(--amber-text);font-weight:600;text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1.5px}
.text-link:hover{color:var(--emerald)}

/* ---------- Buttons ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:48px;padding:0 22px;border-radius:var(--radius-sm);font-weight:600;font-size:16px;text-decoration:none;border:1.5px solid transparent;cursor:pointer;transition:transform .2s var(--ease),background-color .2s,color .2s,border-color .2s;white-space:nowrap}
.btn:active{transform:translateY(1px)}
.btn--sm{min-height:44px;padding:0 16px;font-size:15px}
.btn--lg{min-height:56px;padding:0 26px;font-size:17px}
.btn--block{width:100%}
.btn--primary{background:var(--amber-text);color:var(--white)}
.btn--primary:hover{background:#8F4C00}
.btn--primary .icon{transition:transform .25s var(--ease)}
.btn--primary:hover .icon{transform:translateX(3px)}
.btn--honey{background:var(--honey);color:var(--emerald)}
.btn--honey:hover{background:#FFC46E}
.btn--outline{border-color:var(--emerald);color:var(--emerald);background:transparent}
.btn--outline:hover{background:var(--emerald);color:var(--paper)}
.btn--outline-light{border-color:rgba(244,248,245,.6);color:var(--paper);background:transparent}
.btn--outline-light:hover{background:var(--paper);color:var(--emerald)}
.btn--ghost{color:var(--emerald);background:transparent}
.btn--ghost:hover{background:var(--mist)}

/* ---------- Header ---------- */
.site-header{position:sticky;top:0;z-index:50;background:rgba(244,248,245,.86);backdrop-filter:saturate(1.4) blur(12px);-webkit-backdrop-filter:saturate(1.4) blur(12px);border-bottom:1px solid transparent;transition:border-color .3s}
.site-header.is-scrolled{border-bottom-color:var(--line)}
.site-header__inner{display:flex;align-items:center;gap:24px;min-height:72px}
.logo{display:inline-flex;color:var(--emerald);padding:6px 0}
.logo__svg{width:104px;height:30px}
.logo--light{color:var(--paper);--logo-accent:var(--honey)}
.site-nav{display:flex;gap:28px;margin-left:auto;font-size:15px}
.site-nav a{text-decoration:none;color:var(--muted);font-weight:500;padding:8px 0;transition:color .2s}
.site-nav a:hover{color:var(--emerald)}
.site-header__actions{display:flex;gap:8px;align-items:center}

/* ---------- Hero ---------- */
.hero{padding:clamp(40px,7vw,88px) 0 0;overflow:hidden}
.hero__grid{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:clamp(32px,5vw,72px);align-items:center}
.hero__title{font-family:var(--display);font-weight:600;font-size:clamp(38px,4.4vw,60px);line-height:1.02;letter-spacing:-.02em;font-variation-settings:'SOFT' 50}
.hero__line{display:block}
.hero__line--accent{color:var(--amber-text);margin-top:.12em}
.hero .lead{margin-top:24px}
.hero__ctas{display:flex;flex-wrap:wrap;gap:12px;margin-top:32px}
.hero__news{display:inline-flex;align-items:center;gap:12px;margin-top:28px;font-size:15px;text-decoration:none;color:var(--emerald);padding:8px 14px 8px 10px;border-radius:99px;background:var(--white);border:1px solid var(--line);transition:border-color .2s}
.hero__news:hover{border-color:var(--emerald)}
.hero__news strong{color:var(--amber-text)}
.hero__news .icon{width:16px;height:16px}
.hero__news-dots{display:inline-flex;gap:4px}
.hero__news-dots i{width:8px;height:8px;border-radius:99px;border:2px solid var(--amber)}

/* Motion stage (hero) */
.stage{position:relative;background:var(--emerald);border-radius:28px;padding:22px 22px 18px;color:var(--paper);box-shadow:0 30px 60px -30px rgba(11,43,38,.55)}
.stage__top{display:flex;justify-content:space-between;align-items:center;font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--on-dark-muted)}
.stage__tag{display:inline-flex;align-items:center;gap:8px}
.stage__tag::before{content:"";width:8px;height:8px;border-radius:99px;background:var(--honey)}
.stage__days{height:18px;overflow:hidden;color:var(--honey);font-weight:600}
.stage__days-strip{display:flex;flex-direction:column;animation:days 10s steps(1) infinite}
.stage__days-strip span{height:18px;line-height:18px;text-align:right}
@keyframes days{0%{transform:translateY(0)}10%{transform:translateY(-18px)}20%{transform:translateY(-36px)}30%{transform:translateY(-54px)}40%{transform:translateY(-72px)}50%{transform:translateY(-90px)}60%{transform:translateY(-108px)}68%,100%{transform:translateY(-126px)}}

.stage__track{position:relative;height:24px;margin:16px 4px 18px}
.trk{position:absolute;inset:0;display:flex;justify-content:space-between;align-items:center}
.trk span{position:absolute;left:6px;right:10px;top:50%;height:3px;margin-top:-1.5px;background:var(--emerald-3)}
.trk i{position:relative;width:10px;height:10px;border-radius:99px;background:var(--emerald-3)}
.trk b{position:relative;width:18px;height:18px;border-radius:99px;background:var(--emerald-3)}
.trk--lit span,.trk--lit i,.trk--lit b{background:var(--honey)}
.trk--lit b{box-shadow:0 0 0 5px rgba(255,179,71,.3)}
.stage__track .trk--lit{animation:trackfill 10s linear infinite}
@keyframes trackfill{0%{clip-path:inset(0 100% 0 0)}68%{clip-path:inset(0 0 0 0)}95%{clip-path:inset(0 0 0 0);opacity:1}100%{clip-path:inset(0 0 0 0);opacity:0}}

.stage__phone{position:relative;display:flex;justify-content:center;padding:4px 0 8px}
.ph{width:min(270px,100%);background:var(--paper);color:var(--emerald);border-radius:30px;border:8px solid #061A17;overflow:hidden;box-shadow:0 18px 40px -18px rgba(0,0,0,.6)}
.ph__bar{display:flex;justify-content:space-between;align-items:center;padding:12px 14px;border-bottom:1px solid var(--mist);font-size:12px}
.ph__brand{font-family:var(--display);font-weight:600;font-size:14px}
.ph__call{background:var(--amber-text);color:#fff;border-radius:8px;padding:4px 10px;font-weight:600}
.ph__body{padding:12px 14px 16px;display:flex;flex-direction:column;gap:10px}
.ph__photo{height:104px;border-radius:12px;overflow:hidden}
.ph__photo svg{width:100%;height:100%}
.ph__h{font-family:var(--display);font-weight:600;font-size:19px;line-height:1.15}
.ph__stars{display:flex;align-items:center;gap:6px;font-size:11px}
.ph__rating{font-weight:700}
.ph__count{color:var(--muted)}
.stars{display:inline-flex;gap:1px;color:var(--amber)}
.stars svg{width:13px;height:13px}
.ph__btn{background:var(--amber-text);color:#fff;text-align:center;border-radius:10px;padding:10px;font-weight:600;font-size:13px}
.ph__grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.ph__grid span{height:46px;border-radius:10px;background:var(--mist);display:flex;align-items:flex-end;padding:6px 8px;font-size:10px;font-weight:600;color:var(--muted)}
.ph__grid span:last-child{background:#BFD3CB;color:var(--emerald)}

.toast{position:absolute;right:-6px;bottom:28px;display:flex;gap:10px;align-items:flex-start;background:var(--white);color:var(--emerald);border-radius:14px;padding:10px 14px;font-size:12px;line-height:1.35;box-shadow:0 14px 30px -10px rgba(0,0,0,.45);max-width:210px}
.toast__dot{flex:none;width:10px;height:10px;margin-top:3px;border-radius:99px;background:var(--amber);box-shadow:0 0 0 4px rgba(200,106,0,.25)}
.stage__cap{margin-top:8px;font-size:12px;color:var(--on-dark-muted);text-align:center}

/* build sequence: each piece appears in turn, all clear at the end */
.s1{animation:b1 10s var(--ease) infinite}.s2{animation:b2 10s var(--ease) infinite}.s3{animation:b3 10s var(--ease) infinite}.s4{animation:b4 10s var(--ease) infinite}.s5{animation:b5 10s var(--ease) infinite}.s6{animation:b6 10s var(--ease) infinite}.s7{animation:b7 10s var(--ease) infinite}
@keyframes b1{0%,2%{opacity:0;transform:translateY(10px)}8%,94%{opacity:1;transform:none}100%{opacity:0}}
@keyframes b2{0%,10%{opacity:0;transform:translateY(10px)}18%,94%{opacity:1;transform:none}100%{opacity:0}}
@keyframes b3{0%,20%{opacity:0;transform:translateY(10px)}28%,94%{opacity:1;transform:none}100%{opacity:0}}
@keyframes b4{0%,30%{opacity:0;transform:translateY(10px)}38%,94%{opacity:1;transform:none}100%{opacity:0}}
@keyframes b5{0%,40%{opacity:0;transform:translateY(10px)}48%,94%{opacity:1;transform:none}100%{opacity:0}}
@keyframes b6{0%,50%{opacity:0;transform:translateY(10px)}58%,94%{opacity:1;transform:none}100%{opacity:0}}
@keyframes b7{0%,70%{opacity:0;transform:translate(12px,8px) scale(.96)}76%,94%{opacity:1;transform:none}100%{opacity:0}}

/* Ticker */
.ticker{display:flex;gap:0;margin-top:clamp(48px,7vw,80px);border-top:1px solid var(--line);border-bottom:1px solid var(--line);overflow:hidden;white-space:nowrap;font-size:15px;color:var(--muted);mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.ticker li{display:inline-flex;align-items:center;gap:18px;padding:16px 18px;flex:none}
.ticker li::after{content:"";width:6px;height:6px;border-radius:99px;background:var(--amber)}
.ticker.is-running{animation:ticker 40s linear infinite}
@keyframes ticker{to{transform:translateX(-50%)}}

/* ---------- Problem ---------- */
.problem__list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;margin-top:44px}
.problem__item{background:var(--white);border:1px solid var(--line);border-radius:var(--radius);padding:28px;display:flex;flex-direction:column;gap:18px}
.problem__n{font-family:var(--display);font-size:34px;font-weight:600;color:var(--amber);line-height:1}
.problem__item p{font-size:17px}

/* ---------- Motion gallery ---------- */
.gallery{background:var(--white);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.gallery__head{display:flex;justify-content:space-between;align-items:flex-end;gap:32px;flex-wrap:wrap}
.gallery__tools{display:flex;flex-direction:column;align-items:flex-end;gap:14px}
.chips{display:flex;flex-wrap:wrap;gap:8px;justify-content:flex-end}
.chip{min-height:44px;padding:0 16px;border-radius:99px;border:1px solid var(--line);background:var(--white);font-size:15px;cursor:pointer;color:var(--emerald);transition:background-color .2s,border-color .2s,color .2s}
.chip span{color:var(--muted);margin-left:4px}
.chip:hover{border-color:var(--emerald)}
.chip[aria-pressed="true"]{background:var(--emerald);border-color:var(--emerald);color:var(--paper)}
.chip[aria-pressed="true"] span{color:var(--honey)}
.pause{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:0 6px;background:none;border:0;cursor:pointer;font-size:15px;color:var(--emerald);font-weight:500}
.pause .icon{width:18px;height:18px}
.pause__on{display:none}
.pause[aria-pressed="true"] .pause__on{display:block}
.pause[aria-pressed="true"] .pause__off{display:none}

.tiles{margin-top:44px;column-count:4;column-gap:20px}
.tile{break-inside:avoid;display:inline-block;width:100%;margin:0 0 28px}
.tile__stage{position:relative;height:240px;border-radius:16px;background:var(--paper);border:1px solid var(--line);overflow:hidden;display:flex;align-items:center;justify-content:center;isolation:isolate}
.tile__stage--tall{height:340px}
.tile__stage--dark{background:var(--emerald);border-color:var(--emerald);color:var(--paper)}
.tile__stage--mist{background:var(--mist);border-color:var(--mist)}
.tile__meta{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-top:12px}
.tile__meta h3{font-size:16px;font-weight:600;line-height:1.3}
.tag{flex:none;font-size:12px;color:var(--muted);border:1px solid var(--line);border-radius:8px;padding:2px 8px}
.tile__text{font-size:14px;color:var(--muted);margin-top:4px}
.gallery__note{font-size:13px;color:var(--muted);margin-top:4px}

/* Hand-written notes, like an animator's margin notes */
.note{position:absolute;left:14px;bottom:12px;font-family:var(--display);font-weight:500;font-size:15px;color:var(--amber-text);transform:rotate(-3deg);padding-bottom:4px;z-index:3;pointer-events:none;background:linear-gradient(currentColor,currentColor) left bottom/100% 1.5px no-repeat}
.note--light{color:var(--honey)}
.note--e{background:rgba(255,255,255,.94);padding:2px 10px 4px;border-radius:8px;background-image:none;color:var(--amber-text)}
.tile__stage--mist.tile__stage--tall{height:380px}

/* a. phone scroll */
.t-scroll{position:relative}
.t-scroll__frame{width:150px;height:270px;border-radius:24px;border:6px solid #061A17;background:var(--paper);overflow:hidden}
.t-scroll__page{display:flex;flex-direction:column;gap:8px;padding:10px;animation:pscroll 7s var(--ease) infinite}
.tsp{border-radius:6px;background:var(--mist)}
.tsp--bar{height:14px;background:#CFE0D7}
.tsp--img{height:76px;background:#BFD3CB}
.tsp--h{height:12px;width:90%;background:var(--emerald)}
.tsp--h2{height:8px;width:70%;background:var(--line)}
.tsp--btn{height:20px;background:var(--amber-text)}
.tsp--row{display:grid;grid-template-columns:1fr 1fr;gap:6px;background:none}
.tsp--row span{height:44px;border-radius:6px;background:var(--mist)}
.tsp--card{height:56px;background:var(--white);border:1px solid var(--line)}
@keyframes pscroll{0%,14%{transform:translateY(0)}42%,58%{transform:translateY(-120px)}86%,100%{transform:translateY(0)}}
.thumb{position:absolute;left:50%;top:60%;width:26px;height:26px;margin-left:-13px;border-radius:99px;background:rgba(255,179,71,.85);box-shadow:0 0 0 6px rgba(255,179,71,.25);animation:thumb 7s var(--ease) infinite}
@keyframes thumb{0%,12%{opacity:0;transform:translateY(30px)}16%{opacity:1;transform:translateY(30px)}40%{opacity:1;transform:translateY(-50px)}46%,62%{opacity:0;transform:translateY(-50px)}66%{opacity:1;transform:translateY(-50px)}84%{opacity:1;transform:translateY(30px)}90%,100%{opacity:0;transform:translateY(30px)}}

/* b. quote form */
.t-form{width:78%;display:flex;flex-direction:column;gap:8px;position:relative;margin-top:-28px}
.t-form__f{display:flex;flex-direction:column;gap:2px;background:var(--white);border:1px solid var(--line);border-radius:10px;padding:6px 10px}
.t-form__l{font-size:10px;color:var(--muted);font-weight:600;text-transform:uppercase;letter-spacing:.05em}
.t-form__v{font-size:14px;font-weight:500;white-space:nowrap;min-height:20px}
.v1{animation:type1 8s steps(8) infinite}.v2{animation:type2 8s steps(8) infinite}.v3{animation:type3 8s steps(12) infinite}
@keyframes type1{0%,4%{clip-path:inset(0 100% 0 0)}16%,96%{clip-path:inset(0 0 0 0)}100%{clip-path:inset(0 100% 0 0)}}
@keyframes type2{0%,20%{clip-path:inset(0 100% 0 0)}32%,96%{clip-path:inset(0 0 0 0)}100%{clip-path:inset(0 100% 0 0)}}
@keyframes type3{0%,36%{clip-path:inset(0 100% 0 0)}50%,96%{clip-path:inset(0 0 0 0)}100%{clip-path:inset(0 100% 0 0)}}
.t-form__btn{background:var(--amber-text);color:#fff;text-align:center;font-weight:600;font-size:13px;border-radius:10px;padding:9px;animation:press 8s infinite}
@keyframes press{0%,54%{transform:none;background:var(--amber-text)}57%{transform:scale(.95);background:#8F4C00}60%,100%{transform:none;background:var(--amber-text)}}
.t-form__done{position:absolute;inset:-12px -8px;background:var(--paper);border-radius:14px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;font-weight:600;opacity:0;animation:done 8s var(--ease) infinite}
.t-form__done .ring{width:26px;height:26px;border-radius:99px;background:var(--amber);box-shadow:0 0 0 0 rgba(200,106,0,.45);animation:ringo 8s ease-out infinite}
@keyframes done{0%,60%{opacity:0;transform:scale(.97)}64%,93%{opacity:1;transform:none}97%,100%{opacity:0}}
@keyframes ringo{0%,62%{box-shadow:0 0 0 0 rgba(200,106,0,.45)}78%,100%{box-shadow:0 0 0 18px rgba(200,106,0,0)}}

/* c. click to call */
.t-call{position:relative;width:100%;height:100%;display:flex;align-items:center;justify-content:center;flex-direction:column}
.t-call__btn{position:relative;z-index:2;width:72px;height:72px;border-radius:99px;background:var(--honey);color:var(--emerald);display:flex;align-items:center;justify-content:center;animation:callbob 2.4s var(--ease) infinite}
.t-call__btn .icon{width:30px;height:30px}
.t-call__ring{position:absolute;top:50%;left:50%;width:72px;height:72px;margin:-36px 0 0 -36px;border-radius:99px;border:2px solid var(--honey);opacity:0;animation:callring 2.4s ease-out infinite}
.t-call__ring.r2{animation-delay:.8s}.t-call__ring.r3{animation-delay:1.6s}
.t-call__label{position:absolute;top:calc(50% + 56px);font-size:13px;color:var(--on-dark-muted)}
@keyframes callring{0%{transform:scale(1);opacity:.7}100%{transform:scale(2.6);opacity:0}}
@keyframes callbob{0%,100%{transform:rotate(0)}8%{transform:rotate(-12deg)}16%{transform:rotate(10deg)}24%{transform:rotate(-6deg)}32%{transform:rotate(0)}}

/* d. reviews */
.t-rev{width:82%;display:flex;flex-direction:column;align-items:center;text-align:center;margin-top:-40px}
.t-rev__score{font-family:var(--display);font-size:54px;font-weight:600;line-height:1}
.t-rev__stars{position:relative;margin-top:8px}
.sr{display:flex;gap:3px;color:var(--line)}
.sr svg{width:24px;height:24px}
.sr--lit{position:absolute;inset:0;color:var(--amber);animation:starfill 8s var(--ease) infinite}
@keyframes starfill{0%,6%{clip-path:inset(0 100% 0 0)}34%,95%{clip-path:inset(0 0 0 0)}100%{clip-path:inset(0 100% 0 0)}}
.t-rev__count{font-size:13px;color:var(--muted);margin-top:6px}
.t-rev__card{margin-top:12px;width:100%;background:var(--white);border-radius:12px;padding:12px 14px;font-size:13px;line-height:1.45;text-align:left;box-shadow:0 8px 20px -12px rgba(11,43,38,.35)}
.t-rev__card span{display:block;font-size:11px;color:var(--muted);margin-top:4px}
.c1{animation:card1 8s var(--ease) infinite}.c2{animation:card2 8s var(--ease) infinite}
@keyframes card1{0%,36%{opacity:0;transform:translateY(14px)}44%,94%{opacity:1;transform:none}100%{opacity:0}}
@keyframes card2{0%,54%{opacity:0;transform:translateY(14px)}62%,94%{opacity:1;transform:none}100%{opacity:0}}

/* e. before / after */
.t-ba{position:absolute;inset:0}
.t-ba__img{position:absolute;inset:0;width:100%;height:100%}
.t-ba__after{position:absolute;inset:0;clip-path:inset(0 0 0 50%);animation:wipe 7s var(--ease) infinite alternate}
.t-ba__handle{position:absolute;top:0;bottom:0;left:50%;width:3px;margin-left:-1.5px;background:var(--white);box-shadow:0 0 0 1px rgba(11,43,38,.15);animation:wipeh 7s var(--ease) infinite alternate}
.t-ba__handle::after{content:"";position:absolute;top:50%;left:50%;width:28px;height:28px;margin:-14px 0 0 -14px;border-radius:99px;background:var(--white);border:3px solid var(--amber)}
@keyframes wipe{0%,10%{clip-path:inset(0 0 0 86%)}90%,100%{clip-path:inset(0 0 0 14%)}}
@keyframes wipeh{0%,10%{left:86%}90%,100%{left:14%}}
.t-ba__lab{position:absolute;top:12px;font-size:11px;font-weight:600;background:rgba(255,255,255,.92);border-radius:6px;padding:2px 8px}
.t-ba__lab--l{left:12px}.t-ba__lab--r{right:12px}

/* f. kinetic type */
.t-type{display:flex;flex-direction:column;align-items:flex-start;width:84%;margin-top:-18px}
.t-type .w{display:block;font-family:var(--display);font-weight:600;font-size:30px;line-height:1.08;animation:rise 7s var(--ease) infinite both}
.t-type .w--accent{color:var(--honey)}
.w2{animation-delay:.35s!important}.w3{animation-delay:.7s!important}.w4{animation-delay:1.05s!important}
@keyframes rise{0%{opacity:0;transform:translateY(.55em)}10%,80%{opacity:1;transform:none}90%,100%{opacity:0;transform:translateY(-.4em)}}

/* g. local SEO */
.t-seo{position:absolute;inset:0;display:flex;flex-direction:column}
.t-seo__map{position:relative;flex:1;background:
  linear-gradient(90deg,rgba(197,216,206,.6) 1px,transparent 1px) 0 0/34px 34px,
  linear-gradient(rgba(197,216,206,.6) 1px,transparent 1px) 0 0/34px 34px,
  var(--paper)}
.t-seo__map::before{content:"";position:absolute;left:-10%;right:-10%;top:58%;height:14px;background:var(--mist);transform:rotate(-12deg)}
.pin{position:absolute;display:flex;flex-direction:column;align-items:center;color:var(--muted);animation:pinpop 8s var(--ease) infinite both}
.pin svg{width:22px;height:22px}
.pin em{font-style:normal;font-size:11px;font-weight:600;background:var(--white);border-radius:6px;padding:1px 6px;margin-top:2px;color:var(--emerald)}
.p1{left:22%;top:22%;color:var(--amber)}.p2{left:62%;top:14%;animation-delay:.3s}.p3{left:14%;top:56%;animation-delay:.6s}.p4{left:64%;top:52%;animation-delay:.9s}
@keyframes pinpop{0%{opacity:0;transform:translateY(-10px) scale(.6)}8%,90%{opacity:1;transform:none}100%{opacity:0}}
.p1 svg{animation:pinbeat 8s ease-in-out infinite}
@keyframes pinbeat{0%,52%{transform:none}58%{transform:scale(1.35)}64%,100%{transform:none}}
.t-seo__search{position:absolute;left:12px;right:12px;top:12px;display:flex;align-items:center;gap:8px;background:var(--white);border:1px solid var(--line);border-radius:99px;padding:8px 14px;font-size:13px;box-shadow:0 6px 16px -10px rgba(11,43,38,.3)}
.t-seo__search .icon{width:16px;height:16px;color:var(--muted)}
.t-seo__q{white-space:nowrap;animation:typeq 8s steps(20) infinite}
@keyframes typeq{0%,4%{clip-path:inset(0 100% 0 0)}30%,95%{clip-path:inset(0 0 0 0)}100%{clip-path:inset(0 100% 0 0)}}
.t-seo__result{position:absolute;left:12px;right:12px;bottom:48px;background:var(--white);border:1px solid var(--line);border-radius:12px;padding:10px 14px;display:flex;flex-direction:column;font-size:12px;box-shadow:0 10px 24px -12px rgba(11,43,38,.4);animation:result 8s var(--ease) infinite}
.t-seo__result strong{font-size:14px;color:#1A4D9C}
.t-seo__result span{color:var(--muted)}
@keyframes result{0%,40%{opacity:0;transform:translateY(16px)}48%,94%{opacity:1;transform:none}100%{opacity:0}}

/* h. launch */
.t-launch{width:80%;display:flex;flex-direction:column;align-items:center;gap:22px;margin-top:-20px}
.t-launch__track{position:relative;width:100%;height:26px}
.t-launch .trk b{width:24px;height:24px}
.t-launch .trk--lit{animation:trackfill2 7s var(--ease) infinite}
@keyframes trackfill2{0%,6%{clip-path:inset(0 100% 0 0)}60%,94%{clip-path:inset(0 0 0 0);opacity:1}100%{clip-path:inset(0 0 0 0);opacity:0}}
.t-launch__live{font-family:var(--display);font-weight:600;font-size:40px;color:var(--honey);animation:live 7s var(--ease) infinite}
@keyframes live{0%,60%{opacity:0;transform:scale(.8)}68%,94%{opacity:1;transform:none}100%{opacity:0}}

/* Motion control: pause, off-screen, reduced motion */
.motion-paused .m,.motion-paused .m *,.motion-paused .ticker,.m.is-off,.m.is-off *{animation-play-state:paused!important}
.no-motion .m,.no-motion .m *,.no-motion .stage__days-strip{animation:none!important}
.no-motion .stage__days-strip{transform:translateY(-126px)}
.no-motion .t-form__done{display:none}
.no-motion .ticker{animation:none!important;flex-wrap:wrap;justify-content:center;white-space:normal;mask-image:none}
.no-motion .t-call__ring{opacity:.35}

/* ---------- How it works ---------- */
.how{background:var(--mist)}
.steps{position:relative;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:24px;margin-top:56px}
.steps::before{content:"";position:absolute;left:8px;right:8px;top:9px;height:3px;background:var(--line)}
.steps::after{content:"";position:absolute;left:8px;top:9px;height:3px;width:calc((100% - 16px) * var(--how,0));background:var(--amber);transition:width .2s linear}
.step{position:relative;display:flex;flex-direction:column;gap:8px}
.step__dot{position:relative;z-index:1;width:20px;height:20px;border-radius:99px;background:var(--mist);border:4px solid var(--amber)}
.step--last .step__dot{width:28px;height:28px;margin-top:-4px;background:var(--amber);box-shadow:0 0 0 6px rgba(200,106,0,.2)}
.step__n{font-size:13px;color:var(--amber-text);font-weight:600;margin-top:14px}
.step h3{font-family:var(--display);font-size:22px;font-weight:600;line-height:1.15}
.step p{font-size:15px;color:var(--muted)}

/* ---------- Price ---------- */
.price{background:var(--emerald);color:var(--paper);--logo-accent:var(--honey)}
.price__grid{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(32px,6vw,88px);align-items:start}
.price__card{background:var(--emerald-2);border:1px solid var(--emerald-3);border-radius:28px;padding:clamp(28px,4vw,44px)}
.price__amount{font-family:var(--display);font-weight:600;font-size:clamp(64px,9vw,104px);line-height:1;color:var(--honey);letter-spacing:-.02em}
.price__split{color:var(--on-dark-muted);margin-top:12px}
.price__list{display:flex;flex-direction:column;gap:12px;margin:28px 0 32px;padding-top:24px;border-top:1px solid var(--emerald-3)}
.price__list li{display:flex;gap:12px;align-items:flex-start}
.price__list .icon{color:var(--honey);margin-top:3px}
.guarantees{display:flex;flex-direction:column;gap:20px;padding-top:8px}
.guarantee{display:flex;gap:18px;padding:24px 0;border-top:1px solid var(--emerald-3)}
.guarantee h3{font-family:var(--display);font-size:24px;font-weight:600;color:var(--paper)}
.guarantee p{color:var(--on-dark-muted);margin-top:6px}
.guarantee__mark{flex:none;width:28px;height:28px;border-radius:99px;border:3px solid var(--honey);display:flex;align-items:center;justify-content:center;margin-top:4px}
.guarantee__mark span{width:10px;height:10px;border-radius:99px;background:var(--honey)}
.guarantees__honest{font-size:14px;color:var(--on-dark-muted);border-top:1px solid var(--emerald-3);padding-top:20px}

/* ---------- Founding ---------- */
.founding__head{display:flex;justify-content:space-between;align-items:flex-end;gap:32px;flex-wrap:wrap}
.spots{display:flex;align-items:center;gap:14px;background:var(--white);border:1px solid var(--line);border-radius:99px;padding:12px 20px 12px 16px}
.spots__dots{display:flex;gap:6px}
.spots__dots i{width:18px;height:18px;border-radius:99px;border:4px solid var(--amber)}
.spots__text{font-size:15px}
.bonuses{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px;margin-top:44px}
.bonus{background:var(--white);border:1px solid var(--line);border-radius:var(--radius);padding:24px;display:flex;flex-direction:column;gap:8px}
.bonus__n{align-self:flex-start;font-size:12px;font-weight:600;background:#FFF0DB;color:#8A4A00;border-radius:99px;padding:3px 10px}
.bonus h3{font-size:18px;font-weight:600;line-height:1.3;margin-top:6px}
.bonus p{font-size:15px;color:var(--muted)}

/* ---------- Team ---------- */
.team{padding-top:0}
.people{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;margin-top:40px}
.person{display:flex;gap:18px;align-items:center;background:var(--white);border:1px solid var(--line);border-radius:var(--radius);padding:22px}
.person__mono{flex:none;width:56px;height:56px;border-radius:16px;background:var(--emerald);color:var(--honey);display:flex;align-items:center;justify-content:center;font-family:var(--display);font-weight:600;font-size:26px}
.person h3{font-size:18px;font-weight:600}
.person p{font-size:15px;color:var(--muted)}
.team__mail{margin-top:24px;color:var(--muted)}

/* ---------- FAQ ---------- */
.faq{background:var(--white);border-top:1px solid var(--line)}
.faq__grid{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:clamp(32px,6vw,88px)}
.faq__list{border-top:1px solid var(--line)}
.qa{border-bottom:1px solid var(--line)}
.qa summary{display:flex;justify-content:space-between;align-items:center;gap:16px;min-height:64px;padding:16px 0;cursor:pointer;font-size:18px;font-weight:500;list-style:none}
.qa summary::-webkit-details-marker{display:none}
.qa summary .icon{color:var(--amber-text);transition:transform .25s var(--ease)}
.qa[open] summary .icon{transform:rotate(45deg)}
.qa p{color:var(--muted);padding:0 0 22px;max-width:60ch}

/* ---------- Book ---------- */
.book{background:var(--emerald);color:var(--paper)}
.book__grid{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(32px,6vw,88px);align-items:start}
.book__alt{display:flex;flex-wrap:wrap;gap:10px;margin-top:28px}
.book__card{background:var(--paper);color:var(--emerald);border-radius:28px;padding:clamp(24px,4vw,40px)}
.form__grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
.field{display:flex;flex-direction:column;gap:6px}
.field--full{grid-column:1/-1}
.field label{font-size:14px;font-weight:600}
.field__optional{font-weight:400;color:var(--muted)}
.field input{min-height:50px;border:1.5px solid var(--line);background:var(--white);border-radius:12px;padding:10px 14px;font-size:16px;transition:border-color .2s}
.field input:hover{border-color:#9FB8AC}
.field input:focus{outline:none;border-color:var(--emerald);box-shadow:0 0 0 3px rgba(11,43,38,.12)}
.field input[aria-invalid="true"]{border-color:var(--error)}
.field__error{font-size:13px;color:var(--error);min-height:0}
.field__error:empty{display:none}
.form__status{font-size:14px;color:var(--error);margin:16px 0 0}
.form__status:empty{display:none}
.form .btn--block{margin-top:22px}
.btn[aria-disabled="true"]{opacity:.7;pointer-events:none}
.form__alt,.form__privacy{font-size:14px;color:var(--muted);margin-top:14px;text-align:center}
.form__privacy{margin-top:6px}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.form-success{display:flex;flex-direction:column;align-items:center;text-align:center;gap:12px;padding:40px 0}
.form-success:focus{outline:none}
.form-success__ring{width:34px;height:34px;border-radius:99px;background:var(--amber);animation:ringo2 1.4s ease-out 1}
@keyframes ringo2{from{box-shadow:0 0 0 0 rgba(200,106,0,.5)}to{box-shadow:0 0 0 22px rgba(200,106,0,0)}}
.form-success__title{font-family:var(--display);font-size:28px;font-weight:600}
.form-success__text{color:var(--muted)}

/* ---------- Footer ---------- */
.site-footer{background:#071F1B;color:var(--on-dark-muted);padding:56px 0 calc(40px + env(safe-area-inset-bottom))}
.site-footer__inner{display:grid;grid-template-columns:auto 1fr auto;gap:20px 32px;align-items:center}
.site-footer__line{font-size:15px}
.site-footer__links{display:flex;gap:20px;font-size:15px}
.site-footer__links a{text-decoration:none;color:var(--paper)}
.site-footer__links a:hover{color:var(--honey)}
.site-footer__copy{font-size:13px;grid-column:1/-1}
.site-footer__track{position:relative;grid-column:1/-1;height:20px;opacity:.9}
.site-footer__track .trk b{width:16px;height:16px}

/* ---------- Mobile bar ---------- */
.mobile-bar{display:none}

/* ---------- Reveal ---------- */
.js .reveal{opacity:0;transform:translateY(16px);transition:opacity .7s var(--ease),transform .7s var(--ease)}
.js .reveal.is-in{opacity:1;transform:none}
.no-motion .reveal{opacity:1!important;transform:none!important;transition:none!important}

/* ---------- Responsive ---------- */
@media (max-width:1100px){
  .tiles{column-count:3}
  .site-nav{display:none}
  .site-header__actions{margin-left:auto}
}
@media (max-width:900px){
  .hero__grid,.price__grid,.book__grid,.faq__grid{grid-template-columns:1fr}
  .stage{max-width:440px;margin:0 auto;width:100%}
  .problem__list,.people{grid-template-columns:1fr}
  .bonuses{grid-template-columns:repeat(2,minmax(0,1fr))}
  .tiles{column-count:2}
  .gallery__tools{align-items:flex-start}
  .chips{justify-content:flex-start}
  .steps{grid-template-columns:1fr;gap:28px;padding-left:40px}
  .steps::before{left:9px;right:auto;top:8px;bottom:8px;width:3px;height:auto}
  .steps::after{left:9px;top:8px;width:3px;height:calc((100% - 16px) * var(--how,0))}
  .step__dot{position:absolute;left:-40px;top:2px}
  .step--last .step__dot{left:-44px;top:-2px;margin-top:0}
  .step__n{margin-top:0}
}
@media (max-width:640px){
  body{font-size:16px;padding-bottom:calc(76px + env(safe-area-inset-bottom))}
  .site-header__actions .btn--primary{display:none}
  .site-header__actions .btn--ghost span{display:none}
  .tiles{column-count:1}
  .tile__stage{height:230px}
  .tile__stage--tall{height:300px}
  .tile__stage--mist.tile__stage--tall{height:350px}
  .bonuses{grid-template-columns:1fr}
  .form__grid{grid-template-columns:1fr}
  .hero__ctas .btn{width:100%}
  .hero__news{font-size:14px;border-radius:16px}
  .site-footer__inner{grid-template-columns:1fr}
  .toast{right:0}
  .mobile-bar{display:flex;gap:10px;position:fixed;left:0;right:0;bottom:0;z-index:60;padding:10px 16px calc(10px + env(safe-area-inset-bottom));background:rgba(244,248,245,.94);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-top:1px solid var(--line);transition:transform .25s var(--ease)}
  .mobile-bar.is-hidden{transform:translateY(110%)}
  .mobile-bar .btn{min-height:50px}
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
}

/* ---------- Simple pages (privacy, thanks) ---------- */
.page-simple .simple{padding:clamp(48px,8vw,96px) 0}
.page-simple .simple .container{max-width:calc(760px + var(--gutter)*2)}
.simple h1{font-family:var(--display);font-weight:600;font-size:clamp(34px,5vw,52px);line-height:1.08;margin:12px 0 20px}
.simple h2{font-size:20px;font-weight:600;margin:36px 0 8px}
.simple p{color:var(--muted);margin-bottom:12px}
.simple .meta{font-size:14px}
.thanks{min-height:100vh;min-height:100dvh;display:flex;align-items:center;background:var(--emerald);color:var(--paper)}
.thanks .lead{color:var(--on-dark-muted)}
.thanks__ring{width:40px;height:40px;border-radius:99px;background:var(--honey);margin:40px 0 28px;box-shadow:0 0 0 10px rgba(255,179,71,.2)}
.thanks .btn{margin-top:32px}

/* ---------- v2.2 fixes ---------- */
.how .eyebrow,.how .step__n{color:#8A4A00}
.site-footer__links a{display:inline-flex;align-items:center;min-height:44px}
.menu{display:none;position:relative;margin-left:auto}
.menu__btn{display:inline-flex;align-items:center;gap:10px;min-height:44px;padding:0 14px;border-radius:var(--radius-sm);border:1.5px solid var(--line);background:var(--white);cursor:pointer;font-weight:600;font-size:15px;list-style:none}
.menu__btn::-webkit-details-marker{display:none}
.menu__bars{display:flex;flex-direction:column;gap:4px}
.menu__bars i{width:16px;height:2px;border-radius:2px;background:var(--emerald);transition:transform .2s var(--ease)}
.menu[open] .menu__bars i:first-child{transform:translateY(3px) rotate(45deg)}
.menu[open] .menu__bars i:last-child{transform:translateY(-3px) rotate(-45deg)}
.menu__panel{position:absolute;right:0;top:calc(100% + 8px);min-width:220px;background:var(--white);border:1px solid var(--line);border-radius:16px;padding:8px;display:flex;flex-direction:column;box-shadow:0 18px 40px -18px rgba(11,43,38,.35)}
.menu__panel a{display:flex;align-items:center;min-height:48px;padding:0 14px;border-radius:10px;text-decoration:none;font-weight:500}
.menu__panel a:hover{background:var(--mist)}
@media (max-width:1100px){.menu{display:block}.site-header__actions{margin-left:0}}
.notfound{min-height:70vh;display:flex;align-items:center}
.notfound .trk{position:relative;width:200px;height:24px;margin-bottom:28px}
