/* =====================================================================
   PROPOSTA PEDRO VARGAS · by alvs
   Direção: ÓPTICO (branco editorial) + bordas molten em movimento
   ===================================================================== */
@property --ang{syntax:'<angle>';inherits:false;initial-value:120deg}

*{margin:0;padding:0;box-sizing:border-box}
:root{
  --paper:#f1efe9;
  --paper-2:#e9e6dd;
  --ink:#16151a;
  --ink-soft:#3a3832;
  --mut:#8a847a;
  --line:rgba(22,21,26,.14);
  --grad:linear-gradient(120deg,#ffd23d,#ff8a1e 56%,#ff6a00);
  --grad-soft:linear-gradient(120deg,#ffe39a,#ffb45e);
  --ease:cubic-bezier(.22,1,.36,1);
  --pad:22px;
}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;}
body{
  font-family:'General Sans',sans-serif;
  background:var(--paper);
  color:var(--ink);
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
  overflow-x:clip;
}
body.regime-b{--grad:linear-gradient(120deg,#c9c4ba,#8a847a);} /* embers cool when promo ends */

img{display:block;max-width:100%;}
button{font-family:inherit;cursor:pointer;border:none;background:none;color:inherit;}
::selection{background:#ff8a1e;color:#fff;}

/* grain overlay */
.grain{position:fixed;inset:0;z-index:1;pointer-events:none;opacity:.04;mix-blend-mode:multiply;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");}

/* ---------- moving gradient border ---------- */
.gb{position:relative;border-radius:20px;
  background:linear-gradient(var(--paper),var(--paper)) padding-box,
    conic-gradient(from var(--ang),#ff6a00,#ffd23d 25%,#ff8a1e 50%,#ffd23d 75%,#ff6a00) border-box;
  border:1.5px solid transparent;animation:spin 7s linear infinite;}
.gb-dark{background:linear-gradient(var(--ink),var(--ink)) padding-box,
    conic-gradient(from var(--ang),#ff6a00,#ffd23d 25%,#ff8a1e 50%,#ffd23d 75%,#ff6a00) border-box;}
.gb-2{background:linear-gradient(var(--paper-2),var(--paper-2)) padding-box,
    conic-gradient(from var(--ang),#ff6a00,#ffd23d 25%,#ff8a1e 50%,#ffd23d 75%,#ff6a00) border-box;}
.gb-fast{animation-duration:3.2s;border-width:2px;}
@keyframes spin{to{--ang:480deg}}
body.regime-b .gb,body.regime-b .gb-dark,body.regime-b .gb-2{
  background-image:linear-gradient(var(--paper),var(--paper)),
    conic-gradient(from var(--ang),#8a847a,#c9c4ba 50%,#8a847a);}
body.regime-b .gb-dark{background-image:linear-gradient(var(--ink),var(--ink)),
    conic-gradient(from var(--ang),#8a847a,#c9c4ba 50%,#8a847a);}

/* static hairline (unselected) */
.hb{border:1.5px solid var(--line);border-radius:20px;transition:border-color .4s var(--ease);}

/* =====================================================================
   LAYOUT SHELL
   ===================================================================== */
.shell{position:relative;z-index:2;width:100%;max-width:560px;margin:0 auto;padding:0 18px;}
section{position:relative;padding:84px 0;}
.eyebrow{font-family:'Satoshi',sans-serif;font-weight:500;font-size:11px;letter-spacing:.26em;
  text-transform:uppercase;color:var(--mut);}
.eyebrow .dot{display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--grad);
  margin-right:8px;vertical-align:middle;}
.disp{font-family:'Bricolage Grotesque',sans-serif;font-weight:800;letter-spacing:-.04em;line-height:.86;}
.disp em{font-weight:300;font-style:italic;letter-spacing:-.02em;}
.serif-it{font-family:'Bricolage Grotesque',sans-serif;font-weight:300;font-style:italic;}
.body-txt{font-size:15px;line-height:1.62;color:var(--ink-soft);}
.num{font-variant-numeric:tabular-nums;font-feature-settings:"tnum";}

/* reveal: base VISÍVEL (conteúdo nunca fica invisível); entrada é enhancement via JS/WAA */
.reveal{opacity:1;transform:none;}
.reveal.in{opacity:1;transform:none;}

/* =====================================================================
   STEP INDICATOR (sticky top)
   ===================================================================== */
.stepbar{position:fixed;top:0;left:0;right:0;z-index:30;display:flex;justify-content:center;
  padding:10px 14px;backdrop-filter:blur(14px);background:rgba(241,239,233,.72);
  border-bottom:1px solid var(--line);transition:transform .5s var(--ease);}
.stepbar.hide{transform:translateY(-100%);}
.stepbar .inner{display:flex;gap:4px;align-items:center;max-width:560px;width:100%;justify-content:space-between;}
.step{display:flex;align-items:center;gap:7px;font-family:'Satoshi',sans-serif;font-size:10.5px;
  letter-spacing:.04em;color:var(--mut);text-transform:uppercase;transition:color .4s var(--ease);}
.step b{font-family:'Bricolage Grotesque',sans-serif;font-weight:700;font-size:11px;
  width:18px;height:18px;border-radius:50%;display:grid;place-items:center;border:1px solid var(--line);
  transition:all .4s var(--ease);}
.step.active{color:var(--ink);}
.step.active b{background:var(--ink);color:var(--paper);border-color:var(--ink);}
.step .lbl{display:none;}
@media(min-width:420px){.step .lbl{display:inline;}}

/* =====================================================================
   HERO
   ===================================================================== */
#hero{min-height:100vh;display:flex;flex-direction:column;justify-content:center;padding:108px 0 120px;}
.hero-frame{padding:30px 22px 26px;display:flex;flex-direction:column;gap:26px;border-radius:26px;}
.hero-top{display:flex;justify-content:space-between;align-items:center;}
.hero-h{font-size:clamp(58px,17vw,96px);}
.hero-h .l{display:block;overflow:hidden;}
.hero-h .l > span{display:inline-block;transform:translateY(105%);transition:transform 1s var(--ease);}.hero-h.in .l > span{transform:none;}
.hero-h .l:nth-child(2) span{transition-delay:.1s}.hero-h .l:nth-child(3) span{transition-delay:.2s}
.pv-card{padding:22px 20px;border-radius:18px;display:flex;flex-direction:column;gap:14px;}
.pv-card .logo{width:72%;}
.alvs-line{display:flex;align-items:center;gap:9px;font-family:'Satoshi',sans-serif;font-weight:500;
  font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:#9a948a;}
.alvs-line img{height:18px;width:auto;}
.hero-foot{display:flex;justify-content:space-between;align-items:flex-end;padding-top:6px;}
.teaser .lbl{font-family:'Satoshi',sans-serif;font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--mut);margin-bottom:4px;}
.teaser .val{font-family:'Bricolage Grotesque',sans-serif;font-weight:800;font-size:40px;letter-spacing:-.03em;}
.teaser .val small{font-size:18px;font-weight:500;}
.scroll-hint{display:flex;flex-direction:column;align-items:center;gap:8px;margin-top:54px;
  font-family:'Satoshi',sans-serif;font-size:10px;letter-spacing:.24em;text-transform:uppercase;color:var(--mut);}
.scroll-hint .ln{width:1px;height:40px;background:linear-gradient(var(--mut),transparent);position:relative;overflow:hidden;}
.scroll-hint .ln::after{content:"";position:absolute;top:0;left:0;width:100%;height:40%;background:var(--ink);animation:drop 1.8s var(--ease) infinite;}
@keyframes drop{0%{transform:translateY(-100%)}60%,100%{transform:translateY(280%)}}

/* =====================================================================
   INTRO
   ===================================================================== */
.big{font-size:clamp(34px,8vw,52px);margin:18px 0 0;}
.big .hl{position:relative;white-space:nowrap;}
.big .hl::after{content:"";position:absolute;left:0;right:0;bottom:.08em;height:.42em;
  background:var(--grad);opacity:.85;z-index:-1;border-radius:3px;}

/* =====================================================================
   WORKS (horizontal snap carousel)
   ===================================================================== */
#works{padding-bottom:40px;}
.works-head{display:flex;justify-content:space-between;align-items:flex-end;margin-bottom:22px;}
.carousel{display:flex;gap:14px;overflow-x:auto;scroll-snap-type:x mandatory;
  scroll-padding:0 18px;margin:0 -18px;padding:6px 18px 8px;scrollbar-width:none;-webkit-overflow-scrolling:touch;}
.carousel::-webkit-scrollbar{display:none;}
.work-stage{position:relative;}
.work{display:none;border-radius:24px;padding:24px 22px 22px;
  flex-direction:column;min-height:472px;background:var(--paper);width:100%;}
.work.active{display:flex;}

/* wizard nav */
.work-nav{display:flex;gap:12px;margin-top:22px;}
.wbtn{flex:1;padding:16px;border-radius:100px;font-family:'Satoshi',sans-serif;font-weight:700;font-size:14px;
  letter-spacing:.02em;text-align:center;cursor:pointer;
  transition:transform .3s var(--ease),box-shadow .3s var(--ease),background .3s var(--ease);}
.wbtn span{display:block;}
.wbtn:active{transform:scale(.97);}
.wbtn-next{color:var(--ink);border:1.5px solid transparent;
  background:linear-gradient(120deg,#ffd23d,#ff8a1e 56%,#ff6a00);
  background-clip:padding-box;-webkit-background-clip:padding-box;
  box-shadow:0 10px 26px -12px rgba(255,138,30,.7);}
.wbtn-next:hover{transform:translateY(-2px);box-shadow:0 16px 34px -12px rgba(255,138,30,.85);}
.wbtn-back{background:transparent;border:1.5px solid var(--ink);color:var(--ink);}
.wbtn-back:hover{background:rgba(22,21,26,.05);}
body.regime-b .wbtn-next{background:linear-gradient(120deg,#c9c4ba,#8a847a);box-shadow:none;}
.work-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:auto;}
/* toggle subiu pro topo do card (mais visível) — com label "incluir" */
.work-pick{display:flex;align-items:center;gap:10px;}
.work-pick .pick-lbl{font-family:'Satoshi',sans-serif;font-weight:600;font-size:10px;letter-spacing:.16em;
  text-transform:uppercase;color:var(--mut);transition:color .3s var(--ease);}
.work-card.sel .work-pick .pick-lbl{color:#ff7a1e;}
.work-idx{font-family:'Bricolage Grotesque',sans-serif;font-weight:300;font-size:14px;color:var(--mut);letter-spacing:.02em;}
.work-tag{font-family:'Satoshi',sans-serif;font-size:9px;letter-spacing:.18em;text-transform:uppercase;
  color:var(--mut);border:1px solid var(--line);border-radius:100px;padding:4px 10px;}
.work h3{font-family:'Bricolage Grotesque',sans-serif;font-weight:700;font-size:30px;line-height:.96;
  letter-spacing:-.03em;margin:18px 0 12px;}
.work .desc{font-size:13.5px;line-height:1.5;color:var(--ink-soft);max-width:34ch;}
.work .meta{margin-top:14px;display:flex;flex-direction:column;gap:6px;}
.work .meta .mrow{display:flex;align-items:center;gap:8px;font-family:'Satoshi',sans-serif;font-size:11px;color:var(--mut);letter-spacing:.02em;}
.work .meta .mrow::before{content:"";width:4px;height:4px;border-radius:50%;background:var(--mut);}
.work-foot{margin-top:20px;padding-top:16px;border-top:1px solid var(--line);
  display:flex;justify-content:space-between;align-items:center;}
.price{font-family:'Bricolage Grotesque',sans-serif;font-weight:700;font-size:22px;letter-spacing:-.02em;}
.price .strike{font-weight:300;font-size:15px;color:var(--mut);text-decoration:line-through;margin-right:8px;}
.price .free{font-size:13px;font-weight:500;color:var(--mut);font-family:'Satoshi',sans-serif;letter-spacing:.04em;}
.price .pcombo{display:block;font-family:'Satoshi',sans-serif;font-weight:500;font-size:10px;
  letter-spacing:.02em;color:var(--mut);margin-top:3px;}

/* toggle */
.toggle{width:52px;height:30px;border-radius:100px;background:#dcd8cf;position:relative;flex-shrink:0;
  transition:background .35s var(--ease);}
.toggle::before{content:"";position:absolute;inset:0;border-radius:100px;background:var(--grad);opacity:0;transition:opacity .35s var(--ease);}
.toggle i{position:absolute;top:3px;left:3px;width:24px;height:24px;border-radius:50%;background:#fff;z-index:2;
  box-shadow:0 2px 7px rgba(0,0,0,.22);transition:transform .4s var(--ease);}
.toggle.on::before{opacity:1;}
.toggle.on i{transform:translateX(22px);}
.work.sel{}

/* radio (app) */
.radio-set{margin-top:16px;display:flex;flex-direction:column;gap:8px;}
.radio{display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:14px;border:1px solid var(--line);
  cursor:pointer;transform-origin:center;
  transition:border-color .3s var(--ease),background .3s var(--ease),transform .35s var(--ease),opacity .35s var(--ease);}
.radio:hover{border-color:rgba(22,21,26,.32);}
/* entrada com offset (stagger) via CSS — backwards fill: escondido no delay, e LIVRE depois (o render controla opacity/scale do feedback) */
.screen.active .radio{animation:radioIn .5s var(--ease) backwards;}
.screen.active .radio:nth-of-type(1){animation-delay:.04s;}
.screen.active .radio:nth-of-type(2){animation-delay:.12s;}
.screen.active .radio:nth-of-type(3){animation-delay:.20s;}
.screen.active .radio:nth-of-type(4){animation-delay:.28s;}
/* sem opacity no 'to' → anima até a opacidade REAL do elemento (o dim já entra/sai aplicado, sem flash) */
@keyframes radioIn{from{opacity:0;transform:translateX(-28px);}to{transform:translateX(0);}}
@media (prefers-reduced-motion:reduce){.screen.active .radio{animation:none;}}
.radio .rdot{width:18px;height:18px;border-radius:50%;border:1.5px solid var(--mut);flex-shrink:0;position:relative;transition:border-color .3s;}
.radio .rdot::after{content:"";position:absolute;inset:3px;border-radius:50%;background:var(--grad);transform:scale(0);transition:transform .3s var(--ease);}
.radio.on{border-color:transparent;background:var(--paper-2);}
.radio.on .rdot{border-color:#ff8a1e;}
.radio.on .rdot::after{transform:scale(1);}
.radio .rmain{flex:1;}
.radio .rlvl{font-family:'Satoshi',sans-serif;font-weight:700;font-size:13px;}
.radio .rsub{font-size:11px;color:var(--mut);margin-top:1px;}
.radio .rprice{font-family:'Bricolage Grotesque',sans-serif;font-weight:700;font-size:16px;text-align:right;}
.radio .rprice small{display:block;font-size:9.5px;font-weight:500;color:var(--mut);font-family:'Satoshi',sans-serif;letter-spacing:.04em;}

/* same-day-edit add-on — layout em coluna pra dar respiro (título / descrição / preço) */
.addon{margin-top:16px;border-radius:16px;padding:14px 16px;display:flex;flex-direction:column;gap:9px;
  background:var(--paper-2);opacity:.5;pointer-events:none;transition:background .3s var(--ease),opacity .3s var(--ease);}
.addon.live{opacity:1;pointer-events:auto;}
.addon-head{display:flex;align-items:center;gap:11px;}
.addon .ck{width:22px;height:22px;border-radius:7px;border:1.5px solid var(--mut);flex-shrink:0;position:relative;transition:all .3s var(--ease);}
.addon .ck svg{position:absolute;inset:0;width:100%;height:100%;stroke:var(--paper);stroke-width:2.4;fill:none;
  stroke-dasharray:20;stroke-dashoffset:20;transition:stroke-dashoffset .35s var(--ease);}
.addon.on .ck{background:var(--ink);border-color:var(--ink);}
.addon.on .ck svg{stroke-dashoffset:0;}
.addon .atitle{flex:1;min-width:0;font-family:'Satoshi',sans-serif;font-weight:700;font-size:13px;
  display:flex;align-items:center;gap:8px;}
.addon .atitle .badge{font-size:8px;letter-spacing:.12em;background:var(--ink);color:var(--paper);
  padding:3px 8px;border-radius:7px;white-space:nowrap;flex-shrink:0;}
.addon .asub{font-size:11px;color:var(--mut);line-height:1.45;padding-left:33px;}
.addon .aprice{align-self:flex-end;font-family:'Bricolage Grotesque',sans-serif;font-weight:700;font-size:16px;white-space:nowrap;}
.addon .aprice .strike{font-weight:300;font-size:12px;color:var(--mut);text-decoration:line-through;margin-right:6px;}

/* embed */
.embed-host{margin-left:-14px;margin-right:-14px;}        /* respira além do padding do card → IG não corta o header */
.embed-wrap{margin:12px auto 0;width:100%;border-radius:16px;overflow:hidden;zoom:.93;} /* um tiquinho menor (reflui, sem cortar) */
.embed-fallback{display:flex;flex-direction:column;gap:8px;padding:18px;background:var(--paper-2);border-radius:16px;text-align:center;}
.embed-fallback a{font-family:'Satoshi',sans-serif;font-weight:700;font-size:12px;color:#ff7a1e;letter-spacing:.04em;}
.instagram-media{margin:0 auto!important;}
body.regime-b .embed-host{display:none;}

/* dots */
.dots{display:flex;gap:8px;justify-content:center;margin-top:20px;}
.dots button{width:8px;height:8px;border-radius:50%;background:var(--line);transition:all .35s var(--ease);cursor:pointer;}
.dots button.on{width:26px;border-radius:6px;background:var(--ink);}

/* =====================================================================
   SUMMARY / CALCULATOR
   ===================================================================== */
.sum-card{padding:16px 18px;border-radius:22px;}
.sum-line{display:flex;justify-content:space-between;align-items:center;gap:14px;padding:10px 0;border-bottom:1px solid var(--line);}
.sum-line:last-of-type{border-bottom:none;}
.sum-line .sl{display:flex;flex-direction:column;gap:2px;flex:1;min-width:0;}
.sum-line .nm{font-family:'Satoshi',sans-serif;font-weight:500;font-size:14px;}
.sum-line .sub{font-size:11px;color:var(--mut);}
.sum-line.off{opacity:.34;}
.sum-line .amt{font-family:'Bricolage Grotesque',sans-serif;font-weight:700;font-size:17px;white-space:nowrap;}
.sum-line .amt .strike{font-weight:300;font-size:12px;color:var(--mut);text-decoration:line-through;margin-right:5px;}
.total-block{margin-top:14px;padding:20px;border-radius:22px;}
.total-block .tlbl{font-family:'Satoshi',sans-serif;font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:#9a948a;}
.total-block .tbig{font-family:'Bricolage Grotesque',sans-serif;font-weight:800;letter-spacing:-.04em;
  font-size:clamp(46px,13.5vw,68px);line-height:.92;color:var(--paper);margin-top:8px;}
.total-block .tbig small{font-size:.4em;font-weight:500;vertical-align:baseline;}
.total-block .tnote{font-size:12px;color:#b8b2a6;margin-top:10px;line-height:1.4;}
.total-block .tnote .em{color:#ffb45e;}

/* =====================================================================
   PAYMENT
   ===================================================================== */
.pay-grid{display:flex;flex-direction:column;gap:10px;margin-top:18px;}
.pay{width:100%;padding:16px 18px;border-radius:18px;display:flex;justify-content:space-between;align-items:center;gap:12px;cursor:pointer;
  transition:transform .3s var(--ease);}
.pay:active{transform:scale(.99);}
.pay .pl{display:flex;flex-direction:column;gap:3px;}
.pay .pname{font-family:'Satoshi',sans-serif;font-weight:700;font-size:15px;display:flex;align-items:center;gap:9px;}
.pay .ptag{font-size:9px;letter-spacing:.1em;text-transform:uppercase;padding:3px 8px;border-radius:5px;font-family:'Satoshi',sans-serif;font-weight:700;}
.pay .ptag.save{background:var(--grad);color:var(--ink);}
.pay .ptag.fee{background:#e4ded3;color:var(--ink-soft);}
.pay .psub{font-size:11.5px;color:var(--mut);}
.pay .pr{text-align:right;}
.pay .ptot{font-family:'Bricolage Grotesque',sans-serif;font-weight:800;font-size:24px;letter-spacing:-.03em;}
.pay .pper{font-size:11px;color:var(--mut);margin-top:1px;}
.pay.sel{}
.nudge{margin-top:16px;padding:14px 16px;border-radius:14px;background:var(--paper-2);
  font-size:12.5px;line-height:1.5;color:var(--ink-soft);display:flex;gap:10px;align-items:flex-start;}
.nudge::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--grad);margin-top:7px;flex-shrink:0;}
.nudge.hide{display:none;}

/* =====================================================================
   URGENCY / COUNTDOWN
   ===================================================================== */
.urg-card{padding:32px 26px;border-radius:26px;text-align:center;}
.badge-live{display:inline-flex;align-items:center;gap:8px;font-family:'Satoshi',sans-serif;
  font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:#ff7a1e;margin-bottom:18px;}
.badge-live .pulse{width:8px;height:8px;border-radius:50%;background:#ff5a00;position:relative;}
.badge-live .pulse::after{content:"";position:absolute;inset:0;border-radius:50%;background:#ff5a00;animation:pulse 1.6s ease-out infinite;}
@keyframes pulse{0%{transform:scale(1);opacity:.7}100%{transform:scale(3.2);opacity:0}}
.cd{display:flex;justify-content:center;gap:8px;margin:8px 0 18px;}
.cd .unit{display:flex;flex-direction:column;align-items:center;gap:7px;min-width:64px;}
.cd .uval{font-family:'Bricolage Grotesque',sans-serif;font-weight:800;font-size:clamp(40px,12vw,60px);
  letter-spacing:-.04em;line-height:1;font-variant-numeric:tabular-nums;}
.cd .ulbl{font-family:'Satoshi',sans-serif;font-size:9px;letter-spacing:.18em;text-transform:uppercase;color:var(--mut);}
.cd .sep{font-family:'Bricolage Grotesque',sans-serif;font-weight:300;font-size:40px;color:var(--mut);align-self:flex-start;}
.urg-copy{font-size:14px;line-height:1.6;color:var(--ink-soft);max-width:40ch;margin:0 auto;}
.urg-copy .em{font-weight:700;color:var(--ink);}
.urg-expired{display:none;}
body.regime-b .urg-live{display:none;}
body.regime-b .urg-expired{display:block;}

/* sticky urgency strip */
.urg-strip{position:fixed;bottom:0;left:0;right:0;z-index:29;display:flex;justify-content:center;
  transform:translateY(120%);transition:transform .5s var(--ease);pointer-events:none;}
.urg-strip.show{transform:none;}
.urg-strip .inner{pointer-events:auto;margin:0 14px 14px;max-width:534px;width:100%;display:flex;align-items:center;
  justify-content:space-between;gap:14px;padding:12px 16px;border-radius:18px;
  background:rgba(22,21,26,.94);backdrop-filter:blur(10px);color:var(--paper);}
.urg-strip .sl{display:flex;flex-direction:column;gap:2px;min-width:0;}
.urg-strip .stxt{font-family:'Satoshi',sans-serif;font-size:10px;letter-spacing:.04em;color:#b8b2a6;text-transform:uppercase;}
.urg-strip .stot{font-family:'Bricolage Grotesque',sans-serif;font-weight:800;font-size:22px;letter-spacing:-.02em;line-height:1;}
.urg-strip .stot small{font-size:13px;font-weight:500;}
.urg-strip .sbtn{font-family:'Satoshi',sans-serif;font-weight:700;font-size:12px;padding:11px 16px;border-radius:100px;
  background:var(--grad);color:var(--ink);white-space:nowrap;transition:transform .3s var(--ease);}
.urg-strip .sbtn:active{transform:scale(.96);}

/* =====================================================================
   CTA
   ===================================================================== */
.cta-h{font-size:clamp(40px,11vw,64px);margin:16px 0 8px;}
.wa-btn{display:inline-flex;align-items:center;justify-content:center;gap:12px;padding:19px 38px;border-radius:100px;
  background:linear-gradient(120deg,#ffd23d,#ff8a1e 56%,#ff6a00);color:var(--ink);font-family:'Satoshi',sans-serif;font-weight:700;font-size:16px;
  transition:transform .35s var(--ease),box-shadow .35s var(--ease);box-shadow:0 14px 38px -14px rgba(255,138,30,.6);}
.wa-btn:hover{transform:translateY(-3px);box-shadow:0 22px 50px -16px rgba(255,138,30,.7);}
.wa-btn svg{width:22px;height:22px;}
.wa-hint{margin-top:16px;font-size:12px;color:var(--mut);}

/* =====================================================================
   CONDITIONS (discreet accordion)
   ===================================================================== */
#condicoes{padding:48px 0;}
.acc{border-top:1px solid var(--line);}
.acc-item{border-bottom:1px solid var(--line);}
.acc-head{width:100%;display:flex;justify-content:space-between;align-items:center;gap:12px;padding:18px 2px;text-align:left;}
.acc-head .at{font-family:'Satoshi',sans-serif;font-weight:500;font-size:13px;color:var(--ink-soft);letter-spacing:.01em;}
.acc-head .ai{width:16px;height:16px;position:relative;flex-shrink:0;}
.acc-head .ai::before,.acc-head .ai::after{content:"";position:absolute;background:var(--mut);transition:transform .35s var(--ease);}
.acc-head .ai::before{top:7px;left:0;width:16px;height:1.5px;}
.acc-head .ai::after{top:0;left:7px;width:1.5px;height:16px;}
.acc-item.open .ai::after{transform:scaleY(0);}
.acc-body{max-height:0;overflow:hidden;transition:max-height .45s var(--ease);}
.acc-body .inner{padding:0 2px 18px;font-size:12.5px;line-height:1.65;color:var(--mut);}
.acc-body .inner strong{color:var(--ink-soft);font-weight:600;}

/* =====================================================================
   FOOTER
   ===================================================================== */
footer{padding:54px 0 40px;border-top:1px solid var(--line);text-align:center;}
footer .falvs-plate{display:inline-block;padding:34px 60px;margin:0 auto 18px;border-radius:22px;
  background:radial-gradient(ellipse 78% 125% at 50% 50%, #100f12 0%, #16151a 44%, rgba(22,21,26,0) 80%);}
footer .falvs{height:54px;width:auto;margin:0;display:block;}
footer .flinks{display:flex;gap:18px;justify-content:center;margin-bottom:20px;}
footer .flinks a{font-family:'Satoshi',sans-serif;font-weight:500;font-size:13px;color:var(--ink-soft);
  letter-spacing:.02em;transition:color .3s;}
footer .flinks a:hover{color:#ff7a1e;}
footer .fcopy{font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--mut);}

@media (prefers-reduced-motion:reduce){
  *{animation:none!important;}
  .gb,.gb-dark,.gb-2{animation:none!important;}
  .reveal{opacity:1;transform:none;transition:none;}
  .hero-h .l > span{transform:none;}
}

/* =====================================================================
   DECK · 10 telas navegadas por Voltar / Prosseguir
   ===================================================================== */
html,body{height:100%;overflow:hidden;}

.deck-progress{position:fixed;top:0;left:0;right:0;height:3px;background:rgba(22,21,26,.08);z-index:60;}
.deck-progress i{display:block;height:100%;width:10%;background:var(--grad);border-radius:0 3px 3px 0;transition:width .55s var(--ease);}
.deck-count{position:fixed;top:13px;right:16px;z-index:60;font-family:'Satoshi',sans-serif;font-weight:500;font-size:10px;letter-spacing:.16em;color:var(--mut);}
/* barra fosca translúcida no topo (abaixo da barra de progresso, fade até pouco abaixo do contador) */
.deck-topbar{position:fixed;top:0;left:0;right:0;height:46px;z-index:55;pointer-events:none;
  background:linear-gradient(to bottom,rgba(241,239,233,.62),rgba(241,239,233,.30) 72%,rgba(241,239,233,0));
  backdrop-filter:blur(11px);-webkit-backdrop-filter:blur(11px);
  -webkit-mask-image:linear-gradient(to bottom,#000 62%,transparent);mask-image:linear-gradient(to bottom,#000 62%,transparent);}
/* label da etapa (esquerda) — mesma fonte/tamanho do contador, com roll in/out */
.deck-step{position:fixed;top:13px;left:16px;z-index:60;width:170px;height:14px;overflow:hidden;
  font-family:'Satoshi',sans-serif;font-weight:500;font-size:10px;letter-spacing:.16em;color:var(--mut);}
.deck-step .ds-cur{position:absolute;left:0;top:0;white-space:nowrap;
  transition:transform .42s var(--ease),opacity .42s var(--ease);}

.deck{position:fixed;top:0;left:0;right:0;bottom:calc(86px + env(safe-area-inset-bottom));overflow:hidden;z-index:2;}
.screen{position:absolute;inset:0;padding:0;overflow-y:auto;overflow-x:hidden;opacity:0;visibility:hidden;
  -webkit-overflow-scrolling:touch;scrollbar-width:none;}   /* padding:0 mata o legado section{padding:84px 0} */
.screen::-webkit-scrollbar{display:none;}
.screen.active{opacity:1;visibility:visible;}
.screen-inner{min-height:100%;display:flex;flex-direction:column;justify-content:flex-start;
  max-width:560px;margin:0 auto;padding:44px 20px 104px;}
/* telas 2, 9 e 10 voltam ao espaçamento antigo (centralizado; e respiro no topo quando o conteúdo é alto, ex. tela 10) */
.screen-vc .screen-inner{justify-content:safe center;padding-top:64px;}

.screen-kick{font-family:'Satoshi',sans-serif;font-weight:500;font-size:11px;letter-spacing:.24em;
  text-transform:uppercase;color:var(--mut);margin-bottom:16px;}
.hint-next{margin-top:34px;font-family:'Satoshi',sans-serif;font-size:12px;letter-spacing:.03em;color:var(--mut);}
.hint-next b{color:var(--ink);}

/* work agora é o card principal da tela (sempre visível) */
.screen .work{display:flex;width:100%;min-height:auto;}
.screen .hero-frame{padding:30px 22px 26px;}
.screen .hero-h .l{display:block;overflow:hidden;}

/* condições na tela final */
.acc-cap{display:block;}
.cta-foot{display:flex;gap:20px;justify-content:center;margin-top:30px;}
.cta-foot a{font-family:'Satoshi',sans-serif;font-weight:500;font-size:13px;color:var(--ink-soft);
  text-decoration:none;letter-spacing:.02em;transition:color .3s var(--ease);}
.cta-foot a:hover{color:#ff7a1e;}

/* NAV */
.deck-nav{position:fixed;left:0;right:0;bottom:0;min-height:86px;z-index:50;display:flex;align-items:center;
  background:rgba(241,239,233,.9);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);
  border-top:1px solid var(--line);padding-bottom:env(safe-area-inset-bottom);}
.deck-nav .nav-inner{max-width:560px;margin:0 auto;width:100%;display:flex;align-items:center;gap:10px;padding:14px 16px;}
.nav-brand{display:flex;align-items:center;gap:7px;flex-shrink:0;padding:0 4px;text-decoration:none;}
.nav-brand .nav-by{font-family:'Satoshi',sans-serif;font-weight:500;font-size:11px;letter-spacing:.04em;color:var(--mut);}
.nav-brand img{height:21px;width:auto;}
/* NAV buttons: encolhe/revela só nas bordas 1↔2 e 9↔10, transição suave (sem teleporte) */
.deck-nav .wbtn{flex:1 1 0;min-width:0;padding:15px 12px;font-size:13.5px;margin:0;
  overflow:hidden;white-space:nowrap;
  transition:flex-grow .5s var(--ease),opacity .42s var(--ease),margin .5s var(--ease),
    padding .5s var(--ease),transform .28s var(--ease),box-shadow .28s var(--ease),background .28s var(--ease);}
.deck-nav .wbtn-next{background-clip:padding-box;-webkit-background-clip:padding-box;}
.deck-nav .wbtn.is-collapsed{flex-grow:0;opacity:0;pointer-events:none;padding-left:0;padding-right:0;}
.deck-nav .wbtn-back.is-collapsed{margin-right:-10px;}
.deck-nav .wbtn-next.is-collapsed{margin-left:-10px;}
.deck-nav .wbtn.noanim{transition:none;}
.deck-nav .wbtn-back:hover{background:var(--ink);color:var(--paper);transform:translateY(-2px);}
.deck-nav .wbtn-next:hover{transform:translateY(-2px);filter:saturate(1.15);}
.deck-nav .wbtn:active{transform:scale(.97);}

/* balão flutuante do valor + logo (by alvs) */
.value-balloon{position:fixed;bottom:calc(100px + env(safe-area-inset-bottom));left:50%;transform:translateX(-50%) scaleX(1);transform-origin:center;z-index:46;
  display:none;align-items:center;gap:11px;padding:9px 17px;border-radius:100px;overflow:hidden;white-space:nowrap;
  background:rgba(18,17,20,.93);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);
  box-shadow:0 14px 34px -14px rgba(0,0,0,.6);max-width:calc(100vw - 60px);}
.value-balloon .vb-logo{display:flex;align-items:center;gap:5px;flex-shrink:0;}
.value-balloon .vb-logo .vb-by{font-family:'Satoshi',sans-serif;font-weight:500;font-size:9px;color:#b8b2a6;letter-spacing:.04em;}
.value-balloon .vb-logo img{height:15px;width:auto;}
.value-balloon .vb-sep{width:1px;height:17px;background:rgba(255,255,255,.16);flex-shrink:0;}
.value-balloon .vb-val{display:flex;flex-direction:column;line-height:1.05;min-width:0;max-width:54vw;}
.value-balloon .vb-lbl{font-family:'Satoshi',sans-serif;font-size:8px;letter-spacing:.12em;text-transform:uppercase;color:#9a948a;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:100%;}
.value-balloon .vb-tot{font-family:'Bricolage Grotesque',sans-serif;font-weight:700;font-size:15px;color:var(--paper);letter-spacing:-.01em;}

@media (prefers-reduced-motion:reduce){
  .deck-progress i{transition:none;}
}

/* card de trabalho — borda em path-reveal (SVG) */
.work-card{position:relative;}
.wb{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:1;overflow:visible;}
.wb-rect{fill:none;stroke:#d6d0c4;stroke-width:2;vector-effect:non-scaling-stroke;
  stroke-linejoin:round;stroke-linecap:round;}
.work-card.sel .wb-rect{stroke:#ff8a1e;stroke-width:2.4;}
.work-card > *:not(.wb){position:relative;z-index:2;}

/* =====================================================================
   SPLASH de abertura (lottie "made by alvs" → degradê pro site)
   ===================================================================== */
#splash{position:fixed;inset:0;z-index:9999;background:#07070a;display:grid;place-items:center;
  overflow:hidden;transition:opacity 1.5s var(--ease),filter 1.5s var(--ease);}
#splash.fade{opacity:0;filter:brightness(2.3) saturate(.45);} /* clareia enquanto some → troca de cor mais homogênea */
#splash.gone{display:none;}
#splash-wave{position:absolute;inset:0;width:100%;height:100%;z-index:0;}       /* fundo de ondas */
#splash-logo{position:relative;z-index:1;width:min(52vw,230px);aspect-ratio:1;} /* logo um pouco menor */
#splash-logo svg,#splash-logo canvas{width:100%!important;height:100%!important;display:block;}

/* =====================================================================
   Anotação rabiscada (giz amarelo) no headline do pagamento
   ===================================================================== */
.pay-head{position:relative;}
.scribble{display:block;width:max-content;max-width:100%;max-height:48px;overflow:visible;
  margin:11px 0 2px 2px;transform-origin:left center;
  font-family:'Caveat',cursive;font-weight:700;font-size:23px;line-height:1.1;
  background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent;
  transform:rotate(-3deg);white-space:nowrap;pointer-events:none;
  transition:opacity .45s var(--ease),transform .45s var(--ease),max-height .45s var(--ease),margin .45s var(--ease);}
.scribble.hide{opacity:0;max-height:0;margin-top:0;margin-bottom:0;transform:rotate(-3deg) translateY(-6px) scale(.97);}

/* =====================================================================
   Destaque de economia no quadro preto do total
   ===================================================================== */
.total-block .tsave{display:inline-flex;align-items:center;gap:7px;margin-top:13px;
  padding:7px 14px 7px 11px;border-radius:100px;background:var(--grad);color:var(--ink);
  box-shadow:0 7px 20px -8px rgba(255,138,30,.75);}
.total-block .tsave.hide{display:none;}
.total-block .tsave .ts-spark{font-size:12px;line-height:1;}
.total-block .tsave .ts-lbl{font-family:'Satoshi',sans-serif;font-weight:700;font-size:10px;
  letter-spacing:.14em;text-transform:uppercase;}
.total-block .tsave .ts-val{font-family:'Bricolage Grotesque',sans-serif;font-weight:800;font-size:17px;letter-spacing:-.02em;}
body.regime-b .total-block .tsave{display:none;}