/* =========================================================
   StrongFire · strongfire.trade
   Linguagem visual no estilo Apple: fonte do sistema, tipografia
   grande com tracking negativo, superficies claras e escuras
   alternadas, molas criticamente amortecidas.
   Sem framework, sem build, sem fonte externa.
   ========================================================= */

:root{
  /* superficies, na escala da Apple */
  --w:#ffffff;
  --w-2:#f5f5f7;          /* cinza de fundo */
  --w-3:#e8e8ed;
  --k:#000000;
  --k-2:#0b0b0d;
  --k-3:#1d1d1f;          /* preto de texto */

  /* texto sobre claro */
  --tx:#1d1d1f;
  --tx-2:#6e6e73;
  --tx-3:#86868b;

  /* texto sobre escuro */
  --dtx:#f5f5f7;
  --dtx-2:#a1a1a6;
  --dtx-3:#6e6e73;

  /* marca */
  --fire:#ff5e1a;
  --fire-2:#ff8c3a;
  --gold:#f2c14e;
  --link:#2997ff;         /* azul de link da Apple no escuro */
  --link-d:#0066cc;       /* azul de link no claro */
  --up:#30d158;
  --dn:#ff453a;

  /* tipografia: o sistema primeiro, como manda a casa */
  --sans:-apple-system,BlinkMacSystemFont,"SF Pro Display","SF Pro Text",
         "Segoe UI Variable Display","Segoe UI",system-ui,Roboto,"Helvetica Neue",Arial,sans-serif;
  --mono:ui-monospace,"SF Mono",SFMono-Regular,"Cascadia Mono","Consolas","Liberation Mono",monospace;

  /* escala de tamanho: tracking e leading acompanham o tamanho */
  --t-hero:clamp(2.6rem,1.5rem + 3.4vw,4.4rem);
  --t-h2:clamp(2.1rem,1.3rem + 3.4vw,3.6rem);
  --t-h3:clamp(1.35rem,1.1rem + 1vw,1.75rem);
  --t-lead:clamp(1.15rem,1rem + .7vw,1.5rem);
  --t-body:clamp(1rem,.96rem + .2vw,1.0625rem);
  --t-sm:clamp(.86rem,.84rem + .12vw,.9375rem);
  --t-xs:.75rem;

  --gut:clamp(1.25rem,.9rem + 1.6vw,2.5rem);
  --sec:clamp(4.5rem,3rem + 7vw,9rem);
  --r:18px;
  --r-lg:28px;
  --nav-h:48px;

  /* molas: criticamente amortecidas por padrao */
  --spring:cubic-bezier(.22,.61,.36,1);     /* resposta rapida, sem overshoot */
  --spring-soft:cubic-bezier(.32,.72,0,1);  /* curva de gaveta iOS */
  --d-press:120ms;
  --d-ui:300ms;
  --d-enter:700ms;
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{
  margin:0;background:var(--w);color:var(--tx);
  font-family:var(--sans);font-size:var(--t-body);line-height:1.5;
  letter-spacing:-.01em;-webkit-font-smoothing:antialiased;
  font-synthesis-weight:none;overflow-x:hidden;
}
img,svg,canvas{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
p{margin:0}
ul,ol{margin:0;padding:0;list-style:none}
h1,h2,h3,h4{margin:0;font-weight:600}
::selection{background:rgba(255,94,26,.25)}
:focus-visible{outline:3px solid var(--link);outline-offset:3px;border-radius:8px}
section[id]{scroll-margin-top:calc(var(--nav-h) + 12px)}

.wrap{width:min(1120px,100% - (2 * var(--gut)));margin-inline:auto}
.wrap--tight{width:min(820px,100% - (2 * var(--gut)));margin-inline:auto}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:absolute;left:-999px;top:0;z-index:100;background:var(--k);color:#fff;padding:.7rem 1rem;border-radius:0 0 10px 0}
.skip:focus{left:0}

/* tipografia de display: quanto maior, mais apertado */
.hero-t{font-size:var(--t-hero);line-height:1.05;letter-spacing:-.035em;font-weight:600;text-wrap:balance}
.h2{font-size:var(--t-h2);line-height:1.08;letter-spacing:-.028em;font-weight:600;text-wrap:balance}
.h3{font-size:var(--t-h3);line-height:1.2;letter-spacing:-.02em;font-weight:600}
.lead{font-size:var(--t-lead);line-height:1.42;letter-spacing:-.012em;color:var(--tx-2);text-wrap:pretty}
.sm{font-size:var(--t-sm);line-height:1.5;color:var(--tx-2)}
.eyebrow{font-size:var(--t-sm);font-weight:600;letter-spacing:.004em;color:var(--fire)}

/* ---------- barra de navegacao: material translucido ---------- */
.nav{
  position:sticky;top:0;z-index:60;height:var(--nav-h);
  background:rgba(255,255,255,.72);
  -webkit-backdrop-filter:saturate(180%) blur(20px);
  backdrop-filter:saturate(180%) blur(20px);
  border-bottom:1px solid rgba(0,0,0,.08);
  transition:background-color 450ms var(--spring),border-color 450ms var(--spring),color 450ms var(--spring);
}
/* sobre uma secao escura a barra escurece junto, em vez de cortar a pagina ao meio */
.nav.is-dark{
  background:rgba(0,0,0,.62);border-bottom-color:rgba(255,255,255,.12);color:var(--dtx);
}
.nav.is-dark .nav__links{color:var(--dtx)}
.nav.is-dark .lang button{color:var(--dtx-3)}
.nav.is-dark .lang button.is-on{color:#fff;background:rgba(255,255,255,.14)}
.nav__in{display:flex;align-items:center;gap:1.4rem;height:var(--nav-h)}
.brand{display:flex;align-items:center;gap:.5rem;font-size:1rem;font-weight:600;letter-spacing:-.02em}
.brand__mark{width:18px;height:18px;flex:none;display:block}
.nav__links{display:flex;gap:1.6rem;margin-left:auto;font-size:var(--t-xs);color:var(--tx)}
.nav__links a{opacity:.85;transition:opacity var(--d-ui) var(--spring)}
.nav__right{display:flex;align-items:center;gap:.8rem;margin-left:auto}
.nav__links ~ .nav__right{margin-left:0}
.lang{display:flex;gap:2px;font-size:11px}
.lang button{
  appearance:none;border:0;background:none;color:var(--tx-3);cursor:pointer;
  font:600 11px/1 var(--sans);padding:.3rem .4rem;border-radius:6px;
  transition:color var(--d-ui) var(--spring),background-color var(--d-ui) var(--spring);
}
.lang button.is-on{color:var(--tx);background:rgba(0,0,0,.06)}
.nav .pill{font-size:var(--t-xs);padding:.32rem .82rem;min-height:0}

/* ---------- botoes: pilula, resposta no toque ---------- */
.pill{
  display:inline-flex;align-items:center;justify-content:center;gap:.4rem;
  background:var(--fire);color:#fff;font-size:var(--t-body);font-weight:500;
  letter-spacing:-.01em;padding:.72rem 1.35rem;border-radius:980px;border:0;cursor:pointer;
  min-height:44px;transition:transform var(--d-press) var(--spring),background-color var(--d-ui) var(--spring);
}
.pill:active{transform:scale(.97)}
.pill--ghost{background:rgba(0,0,0,.06);color:var(--tx)}
.pill--lg{font-size:var(--t-lead);padding:.9rem 1.8rem;min-height:52px}
.pill--block{width:100%}
.lnk{display:inline-flex;align-items:center;gap:.25rem;color:var(--link-d);font-size:var(--t-lead);letter-spacing:-.012em}
.lnk::after{content:"";width:6px;height:6px;border-right:1.8px solid currentColor;border-bottom:1.8px solid currentColor;transform:rotate(-45deg);transition:transform var(--d-ui) var(--spring)}
.on-dark .lnk{color:var(--link)}

@media (hover:hover) and (pointer:fine){
  .nav__links a:hover{opacity:1}
  .pill:hover{background:var(--fire-2)}
  .pill--ghost:hover{background:rgba(0,0,0,.1)}
  .lnk:hover::after{transform:rotate(-45deg) translate(2px,2px)}
  .card:hover{transform:translateY(-3px)}
}

/* ---------- blocos claros e escuros ---------- */
.b{padding:var(--sec) 0;position:relative}
.b--dark{background:var(--k);color:var(--dtx)}
.b--dark .lead,.b--dark .sm{color:var(--dtx-2)}
.b--gray{background:var(--w-2)}
.b--tight{padding-block:calc(var(--sec) * .62)}
.on-dark{color:var(--dtx)}
.mid{text-align:center;margin-inline:auto}
.mid .lead{margin-inline:auto}

/* ---------- hero: texto de um lado, produto do outro ---------- */
.hero{
  background:var(--k);color:var(--dtx);position:relative;overflow:hidden;
  padding:clamp(2.5rem,1.5rem + 4vw,4.5rem) 0 0;
}
.hero__glow{
  position:absolute;inset:-25% -15% auto;height:95vh;pointer-events:none;
  background:
    radial-gradient(40% 46% at 68% 18%,rgba(255,94,26,.26),transparent 70%),
    radial-gradient(34% 40% at 84% 8%,rgba(242,193,78,.14),transparent 72%),
    radial-gradient(50% 40% at 12% 6%,rgba(255,94,26,.10),transparent 70%);
}
.hero__grid{
  position:relative;display:grid;grid-template-columns:1fr 1.06fr;
  gap:clamp(1.5rem,.5rem + 3vw,3.5rem);align-items:center;
}
.hero__copy{max-width:36rem}
.hero-t em{
  font-style:normal;
  background:linear-gradient(94deg,var(--fire-2) 8%,var(--gold) 92%);
  -webkit-background-clip:text;background-clip:text;color:transparent;
}
.hero__sub{margin-top:1.3rem;max-width:44ch;color:var(--dtx-2);font-size:var(--t-lead);line-height:1.45;letter-spacing:-.012em;text-wrap:pretty}
.hero__cta{display:flex;flex-wrap:wrap;gap:1.2rem;align-items:center;margin-top:2.2rem}
.hero__note{margin-top:1.1rem;font-size:var(--t-sm);color:var(--dtx-3)}
.hero__art{position:relative}

/* ---------- a cena do hero: o produto em perspectiva ----------
   Tudo aqui e interface de verdade, montada em CSS. A profundidade vem de
   rotacao leve e sombra, nao de imagem. */
.cena{
  position:relative;perspective:1600px;
  padding:clamp(1rem,2vw,2.5rem) 0 clamp(3.5rem,6vw,5.5rem);
}
.cena__tela{
  transform:rotateY(-15deg) rotateX(7deg) rotate(1.2deg);
  transform-style:preserve-3d;
  filter:drop-shadow(0 45px 70px rgba(0,0,0,.75));
}
.cena .janela{border-radius:14px}
.cena__painel{
  position:absolute;left:1%;bottom:0;width:47%;z-index:2;
  transform:rotateY(-15deg) rotateX(7deg) rotate(1.2deg) translateZ(60px);
  filter:drop-shadow(0 30px 45px rgba(0,0,0,.8));
}
.cena__painel .panel{
  width:100%;max-width:none;margin:0;font-size:clamp(.56rem,.66vw,.76rem);
  padding:.85rem .9rem;border-radius:12px;background:rgba(19,20,26,.97);
}
.cena__painel .panel__v{font-size:1.45em}
.cena__painel .panel__k{margin-top:.55em;font-size:.72em}
.cena__selo{
  position:absolute;right:-2%;top:2%;z-index:3;
  display:flex;flex-direction:column;gap:.15rem;
  padding:.75rem .95rem;border-radius:12px;
  background:rgba(22,23,29,.96);border:1px solid rgba(255,255,255,.12);
  box-shadow:0 22px 40px -18px rgba(0,0,0,.9);
  transform:rotateY(-15deg) rotateX(7deg) rotate(1.2deg) translateZ(90px);
  font-family:var(--mono);font-size:.68rem;line-height:1.45;color:var(--dtx-2);
}
.cena__selo b{color:#fff;font-weight:600;font-size:.78rem}
.cena__selo-k{font-size:.56rem;letter-spacing:.14em;color:#797f8c}
.cena__selo-v{color:var(--up)}
.cena__nota{
  margin:clamp(1.2rem,2vw,2rem) auto 0;max-width:40ch;
  font-size:var(--t-xs);line-height:1.5;color:var(--dtx-3);text-align:center;
}

/* faixa de numeros fechando a dobra */
.band{
  position:relative;display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));
  gap:2rem clamp(1rem,2vw,2.5rem);
  margin-top:clamp(1.5rem,1rem + 2vw,3rem);
  padding:clamp(2rem,1.5rem + 2vw,2.8rem) 0 clamp(2.5rem,2rem + 3vw,4rem);
  border-top:1px solid rgba(255,255,255,.1);
}
.band__i b{
  display:block;font-size:clamp(2.4rem,1.8rem + 2.2vw,3.2rem);line-height:1;
  letter-spacing:-.045em;font-weight:600;
  background:linear-gradient(120deg,var(--fire-2),var(--gold));
  -webkit-background-clip:text;background-clip:text;color:transparent;
}
.band__i span{display:block;margin-top:.55rem;font-size:var(--t-sm);color:var(--dtx-2);max-width:24ch;text-wrap:pretty}

/* ---------- janela de grafico: o painel sobre precos de verdade ---------- */
.janela{
  background:#0c0d12;border:1px solid rgba(255,255,255,.1);border-radius:16px;overflow:hidden;
  box-shadow:0 40px 90px -35px rgba(0,0,0,.95),0 0 0 .5px rgba(255,255,255,.05) inset;
}
.janela__topo{
  display:flex;align-items:center;gap:.7rem;padding:.6rem .85rem;
  background:linear-gradient(180deg,#191a21,#131419);border-bottom:1px solid rgba(255,255,255,.08);
  font-family:var(--mono);font-size:.7rem;color:#8a8f98;
}
.janela__pts{display:flex;gap:5px}
.janela__pts i{width:9px;height:9px;border-radius:50%;background:rgba(255,255,255,.16);display:block}
.janela__tela{position:relative;background:#0a0b0f}
.janela__chart{width:100%;height:auto;display:block}
.janela .panel{
  position:absolute;left:3.2%;top:5.5%;width:46%;max-width:none;margin:0;
  font-size:clamp(.58rem,.72vw,.82rem);padding:.8rem .85rem;border-radius:11px;
  background:rgba(18,19,25,.94);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);
}
.janela .panel__name{font-size:.85em}
.janela .panel__v{font-size:1.5em}
.janela .panel__k{margin-top:.5em;font-size:.72em}

/* ---------- painel da EA ---------- */
.panel{
  width:min(360px,100%);margin-inline:auto;text-align:left;
  background:linear-gradient(180deg,#17181d,#111217);
  border:1px solid rgba(255,255,255,.1);border-radius:var(--r);
  padding:1.15rem 1.2rem;font-family:var(--mono);font-size:.8125rem;line-height:1.55;
  box-shadow:0 40px 80px -30px rgba(0,0,0,.9),0 0 0 .5px rgba(255,255,255,.06) inset;
  color:#d2d4dc;letter-spacing:0;
}
.panel__head{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:.85rem}
.panel__name{font-family:var(--sans);font-weight:600;font-size:.95rem;color:#fff;letter-spacing:-.01em}
.panel__live{display:inline-flex;align-items:center;gap:.35rem;color:var(--up);font-size:.68rem;font-weight:600}
.panel__live i{width:5px;height:5px;border-radius:50%;background:var(--up);display:block}
.panel__r{display:flex;justify-content:space-between;gap:1rem}
.panel__r b{font-weight:600;color:#fff}
.panel__r i{font-style:normal;color:#797f8c}
.panel__k{margin-top:.85rem;font-size:.6rem;letter-spacing:.12em;color:#797f8c}
.panel__v{font-size:1.2rem;font-weight:600;letter-spacing:-.02em;margin-top:.1rem}
.panel__v--up{color:var(--up)}
.panel__v--dn{color:var(--dn)}
.panel__r .up{color:var(--up)}
.tickup{animation:tickup 700ms var(--spring)}
@keyframes tickup{0%{color:var(--gold)}100%{color:inherit}}
.panel.is-closing{box-shadow:0 40px 80px -30px rgba(0,0,0,.9),0 0 0 2px rgba(48,209,88,.5);transition:box-shadow 700ms var(--spring)}
.panel__legend{margin:1rem auto 0;max-width:42ch;font-size:var(--t-xs);line-height:1.5;color:var(--dtx-3);text-align:center}

/* ---------- cartoes ---------- */
.grid{display:grid;gap:1.25rem;margin-top:clamp(2.5rem,2rem + 2vw,3.5rem)}
.grid--2{grid-template-columns:repeat(auto-fit,minmax(320px,1fr))}
.grid--3{grid-template-columns:repeat(auto-fit,minmax(280px,1fr))}
.grid--4{grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}
.card{
  background:var(--w);border-radius:var(--r-lg);padding:clamp(1.6rem,1.2rem + 1vw,2.2rem);
  transition:transform var(--d-ui) var(--spring);
  box-shadow:0 1px 2px rgba(0,0,0,.05),0 8px 28px -18px rgba(0,0,0,.28);
}
.b--gray .card{background:var(--w)}
.b--dark .card{background:#131317;box-shadow:none;border:1px solid rgba(255,255,255,.08)}
.card__n{display:block;font-family:var(--mono);font-size:var(--t-sm);color:var(--fire);margin-bottom:1rem}
.card .h3{margin-bottom:.5rem}
.card p{font-size:var(--t-sm);color:var(--tx-2);line-height:1.55}
.b--dark .card p{color:var(--dtx-2)}

/* ---------- capitulos com o painel fixo ---------- */
.story{display:grid;grid-template-columns:1fr 1fr;gap:clamp(2rem,1rem + 4vw,5rem);align-items:start}
.story__sticky{position:sticky;top:calc(var(--nav-h) + clamp(1.5rem,1rem + 3vw,4rem))}
.story__steps{display:flex;flex-direction:column;gap:clamp(3rem,2rem + 8vw,9rem);padding-block:clamp(1rem,1vw,3rem)}
.story__s .h3{margin-bottom:.6rem}
.story__s p{color:var(--dtx-2);font-size:var(--t-lead);line-height:1.45;letter-spacing:-.012em}
.story__s{opacity:.32;transition:opacity 500ms var(--spring)}
.story__s.is-on{opacity:1}

/* ---------- listas de check ---------- */
.checks{display:flex;flex-direction:column;gap:1rem;margin-top:2rem}
.checks li{display:grid;grid-template-columns:22px 1fr;gap:.85rem;align-items:start;font-size:var(--t-body);color:var(--tx-2)}
.b--dark .checks li{color:var(--dtx-2)}
.checks li::before{
  content:"";width:20px;height:20px;border-radius:50%;margin-top:.15em;
  background:rgba(48,209,88,.16);
  box-shadow:inset 0 0 0 1.5px rgba(48,209,88,.5);
}
.checks--no li::before{background:rgba(255,69,58,.14);box-shadow:inset 0 0 0 1.5px rgba(255,69,58,.45)}

/* ---------- preco ---------- */
.price{
  max-width:560px;margin:clamp(2.5rem,2rem + 2vw,3.5rem) auto 0;text-align:center;
  background:var(--w);border-radius:var(--r-lg);padding:clamp(2rem,1.4rem + 2vw,3rem);
  box-shadow:0 2px 6px rgba(0,0,0,.05),0 30px 60px -35px rgba(0,0,0,.35);
}
.price__v{display:flex;align-items:baseline;justify-content:center;gap:.35rem;margin:.4rem 0 .2rem}
.price__v span{font-size:var(--t-lead);color:var(--tx-2);font-weight:500}
.price__v strong{font-size:clamp(3.4rem,2.4rem + 4vw,5rem);line-height:1;letter-spacing:-.045em;font-weight:600}
.price__v em{font-style:normal;font-size:var(--t-body);color:var(--tx-3)}
.price ul{display:flex;flex-direction:column;gap:.85rem;margin:1.8rem 0;text-align:left}
.price li{display:grid;grid-template-columns:20px 1fr;gap:.8rem;font-size:var(--t-sm);color:var(--tx-2)}
.price li::before{content:"";width:18px;height:18px;margin-top:.12em;border-radius:50%;background:rgba(255,94,26,.12);box-shadow:inset 0 0 0 1.5px rgba(255,94,26,.45)}
.guar{margin-top:1.1rem;font-size:var(--t-sm);color:var(--tx-2);line-height:1.5}
.guar b{color:var(--tx)}
.price__note{margin-top:.9rem;font-size:var(--t-xs);color:var(--tx-3)}

/* ---------- faq ---------- */
.faq{margin-top:clamp(2rem,1.5rem + 2vw,3rem);border-top:1px solid rgba(0,0,0,.12)}
.faq details{border-bottom:1px solid rgba(0,0,0,.12)}
.faq summary{
  list-style:none;cursor:pointer;padding:1.3rem 2.5rem 1.3rem 0;position:relative;
  font-size:var(--t-h3);font-weight:500;letter-spacing:-.018em;
}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{
  content:"";position:absolute;right:.5rem;top:50%;width:11px;height:11px;margin-top:-8px;
  border-right:2px solid var(--tx-3);border-bottom:2px solid var(--tx-3);
  transform:rotate(45deg);transition:transform var(--d-ui) var(--spring);
}
.faq details[open] summary::after{transform:rotate(-135deg);margin-top:-4px}
.faq__a{padding:0 0 1.5rem;max-width:68ch;color:var(--tx-2);font-size:var(--t-body);line-height:1.55}
.faq details[open] .faq__a{animation:faqIn var(--d-ui) var(--spring)}
@keyframes faqIn{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}

/* ---------- formulario ---------- */
.form{display:flex;flex-direction:column;gap:.75rem;max-width:420px;margin:2rem auto 0}
.form input{
  width:100%;background:var(--w);border:1px solid rgba(0,0,0,.18);border-radius:12px;
  padding:.9rem 1rem;color:var(--tx);font:inherit;font-size:var(--t-body);min-height:48px;
  transition:border-color var(--d-ui) var(--spring),box-shadow var(--d-ui) var(--spring);
}
.form input::placeholder{color:var(--tx-3)}
.form input:focus{outline:none;border-color:var(--fire);box-shadow:0 0 0 4px rgba(255,94,26,.14)}
.form__msg{font-size:var(--t-sm);min-height:1.3em;color:var(--tx-2)}
.form__msg.ok{color:#248a3d}
.form__msg.err{color:#d70015}
.form__priv{font-size:var(--t-xs);color:var(--tx-3)}

/* ---------- rodape ---------- */
.foot{background:var(--w-2);padding:3rem 0;font-size:var(--t-xs);color:var(--tx-3);line-height:1.6}
.foot__nav{display:flex;flex-wrap:wrap;gap:1.4rem;padding-bottom:1.4rem;border-bottom:1px solid rgba(0,0,0,.1)}
.foot__nav a{color:var(--tx-2)}
.foot__risk{margin-top:1.4rem;max-width:105ch}
.foot__risk strong{color:var(--tx-2);font-weight:600}
.foot__end{margin-top:1.2rem;display:flex;flex-wrap:wrap;gap:1rem;justify-content:space-between}

/* ---------- entrada ----------
   Estado normal e visivel. A transicao so enfeita a chegada. */
.in{opacity:1;transform:none;transition:opacity var(--d-enter) var(--spring) var(--d,0ms),transform var(--d-enter) var(--spring) var(--d,0ms)}
@starting-style{ .in{opacity:0;transform:translateY(22px)} }
.js .rv{opacity:0;transform:translateY(24px);transition:opacity var(--d-enter) var(--spring),transform var(--d-enter) var(--spring)}
.js .rv.is-in{opacity:1;transform:none}

/* ---------- responsivo ---------- */
@media (max-width:980px){
  .cena__tela,.cena__painel,.cena__selo{transform:none}
  .cena__painel{position:static;width:100%;margin-top:-14%;filter:none}
  .cena__selo{display:none}
  .hero__grid{grid-template-columns:1fr;gap:2.5rem;text-align:center}
  .hero__copy{max-width:none;margin-inline:auto}
  .hero__sub{margin-inline:auto}
  .hero__cta{justify-content:center}
  .hero__art{max-width:520px;margin-inline:auto}
  .band__i span{margin-inline:auto}
  .band{text-align:center}
}
@media (max-width:760px){
  .janela .panel{
    position:static;width:auto;font-size:.78rem;border-radius:0;
    border:0;border-top:1px solid rgba(255,255,255,.1);background:#121319;
  }
}
@media (max-width:900px){
  .story{grid-template-columns:1fr;gap:2.5rem}
  .story__sticky{position:static}
  .story__steps{gap:2.5rem}
  .story__s{opacity:1}
  .nav__links{display:none}
}
@media (max-width:620px){
  .hero__cta{flex-direction:column;gap:.9rem}
  .hero__cta .pill{width:100%}
}

/* menos movimento, sem perder a resposta ao toque */
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .in,.js .rv,.story__s{opacity:1;transform:none;transition:none}
  @starting-style{ .in{opacity:1;transform:none} }
  .tickup,.faq details[open] .faq__a{animation:none}
  .card:hover{transform:none}
}
/* menos transparencia: o material vira solido */
@media (prefers-reduced-transparency:reduce){
  .nav{background:var(--w);-webkit-backdrop-filter:none;backdrop-filter:none}
}