/* =============================================================
   ASEC — LANDING PAGE SIMPLES NACIONAL (/simples-nacional)
   -------------------------------------------------------------
   Mesma IDV da LP do MEI (papel menta + esmeralda), um degrau
   acima nos efeitos:
   · hero com "extrato" 3D interativo (tilt + contador + scan)
   · marquee duplo em contrafluxo
   · dores em espinha central que "resolve" conforme o scroll
   · carimbo "PROBLEMA NOSSO" na frase de virada
   · bento de solução com spotlight que segue o mouse
   · 8 tributos que se fundem em 1 guia (DAS)
   · medidores nos benefícios + spotlight no quadro
   Carregar DEPOIS de mei.css (reusa lp-tag, lp-sec, marquee,
   frame, why, reqs, mei-final, mei-form, lp-bar).
   ============================================================= */

/* =========================================================
   1. HERO
   ========================================================= */
.sn-hero{position:relative;min-height:100svh;display:flex;align-items:center;overflow:hidden;
  padding:130px 0 80px;isolation:isolate;background:#fff}
/* aurora bem suave nos cantos, quase subliminar */
.sn-aurora{position:absolute;inset:0;z-index:-1;pointer-events:none;
  background:
    radial-gradient(34% 40% at 88% 12%,rgba(18,161,80,.10),transparent 68%),
    radial-gradient(30% 36% at 6% 88%,rgba(18,161,80,.07),transparent 68%)}

.sn-hero-grid{display:grid;grid-template-columns:1.04fr .96fr;gap:clamp(36px,5vw,72px);align-items:center;width:100%}
.sn-hero-copy{max-width:600px}

.sn-hero h1{font-size:clamp(1.9rem,3.5vw,3.2rem);font-weight:700;line-height:1.06;letter-spacing:-.025em;margin-bottom:20px}
.sn-hero h1 .hl{position:relative;white-space:nowrap;color:var(--brand-2)}
.sn-hero h1 .hl svg{position:absolute;left:0;bottom:-.16em;width:100%;height:.34em;overflow:visible}
.sn-hero h1 .hl path{fill:none;stroke:var(--brand);stroke-width:6;stroke-linecap:round;
  stroke-dasharray:1;stroke-dashoffset:1;pathLength:1}
.is-ready .sn-hero h1 .hl path{animation:lp-draw 1s .5s cubic-bezier(.6,0,.2,1) forwards}

.sn-hero-sub{font-size:clamp(1rem,1.2vw,1.1rem);color:var(--muted);max-width:52ch;margin-bottom:28px}
.sn-cta-row{display:flex;flex-wrap:wrap;gap:14px;margin-bottom:26px}
.sn-cta-row .btn-wa-solid,.lp-bar .btn-wa-solid{background:#25D366;color:#fff;box-shadow:0 12px 30px -10px rgba(37,211,102,.55)}
.sn-cta-row .btn-wa-solid:hover{box-shadow:0 18px 42px -12px rgba(37,211,102,.6)}
.sn-cta-row .btn-wa-solid svg{width:20px;height:20px}

/* ---------- vitrine do painel fora do hero ----------
   O hero agora é da consulta de CNPJ; o "extrato"/dashboard vive numa
   seção logo abaixo, em 2 colunas (copy + painel). Vale p/ Simples e Presumido. */
.sn-showcase{display:grid;grid-template-columns:1.02fr .98fr;gap:clamp(36px,5vw,72px);align-items:center}
.sn-showcase-copy{max-width:560px}
.sn-showcase-copy .h2{margin:16px 0 14px}
.sn-showcase .sn-visual{margin-top:26px} /* respiro p/ os chips que flutuam acima */

/* ---------- "extrato" 3D interativo ---------- */
.sn-visual{position:relative;justify-self:center;width:100%;max-width:480px;perspective:1200px}
.sn-doc{position:relative;border-radius:var(--radius-lg);overflow:hidden;
  background:linear-gradient(160deg,#ffffff,#F3FAF6);border:1px solid var(--line-2);
  box-shadow:0 44px 90px -40px rgba(12,60,40,.45),inset 0 1px 0 #fff;
  padding:clamp(24px,2.6vw,34px);
  transform:rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg));
  transition:transform .18s ease-out;will-change:transform}
.doc-top{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-bottom:22px;
  padding-bottom:16px;border-bottom:1px dashed var(--line-2)}
.doc-kicker{font-family:var(--font-mono);font-size:.66rem;font-weight:600;letter-spacing:.2em;
  text-transform:uppercase;color:var(--muted-2)}
.doc-top img{opacity:.9}

.doc-row{display:flex;align-items:baseline;justify-content:space-between;gap:18px;padding:13px 0}
.doc-row span{color:var(--muted);font-size:.95rem;font-weight:500}
.doc-row b{font-family:var(--font-mono);font-size:clamp(1.05rem,1.6vw,1.3rem);font-weight:600;letter-spacing:-.01em;white-space:nowrap}
/* valor errado: risca sozinho (linha cresce) e apaga */
.doc-row .val-bad{position:relative;color:#B4543A;transition:opacity .5s 1.15s ease}
.doc-row .val-bad .strike{position:absolute;left:-3%;right:-3%;top:52%;height:2.5px;border-radius:2px;
  background:#B4543A;transform:scaleX(0);transform-origin:left;transition:transform .55s 1s cubic-bezier(.6,0,.2,1)}
.sn-doc.live .val-bad{opacity:.42}
.sn-doc.live .val-bad .strike{transform:scaleX(1)}
.doc-row .val-good{color:var(--brand-2)}

/* barrinha que "recalcula" */
.doc-meter{height:6px;border-radius:6px;background:var(--surface-2);overflow:hidden;margin:10px 0 16px}
.doc-meter i{display:block;height:100%;width:100%;border-radius:6px;
  background:linear-gradient(90deg,var(--brand-deep),var(--brand));
  transform:scaleX(0);transform-origin:left;transition:transform 1.5s .9s cubic-bezier(.16,1,.3,1)}
.sn-doc.live .doc-meter i{transform:scaleX(.68)}

/* economia: pop com molinha */
.doc-save{display:flex;align-items:center;justify-content:space-between;gap:16px;
  padding:15px 18px;border-radius:16px;background:var(--brand-soft);border:1px solid rgba(18,161,80,.28);
  opacity:0;transform:translateY(12px) scale(.96);
  transition:opacity .6s 2.15s ease,transform .6s 2.15s cubic-bezier(.34,1.45,.5,1)}
.sn-doc.live .doc-save{opacity:1;transform:none}
.doc-save span{color:var(--brand-2);font-size:.92rem;font-weight:600}
.doc-save b{font-family:var(--font-mono);font-size:clamp(1.1rem,1.7vw,1.35rem);color:var(--brand-2)}
.doc-save b small{font-size:.68em;color:var(--muted);font-weight:500}

/* linha de "escaneamento" percorrendo o extrato */
.doc-scan{position:absolute;left:0;right:0;top:-12%;height:26%;pointer-events:none;z-index:1;
  background:linear-gradient(180deg,transparent,rgba(18,161,80,.075) 46%,rgba(18,161,80,.16) 50%,rgba(18,161,80,.075) 54%,transparent);
  animation:sn-scan 4.6s cubic-bezier(.45,0,.55,1) infinite}
@keyframes sn-scan{0%{top:-26%}58%,100%{top:112%}}

/* chips flutuando ao redor do extrato */
.sn-chip{position:absolute;z-index:3;display:inline-flex;align-items:center;gap:7px;padding:9px 14px;border-radius:100px;
  width:max-content;white-space:nowrap;
  background:#fff;border:1px solid var(--line-2);color:var(--lp-ink);font-size:.8rem;font-weight:600;
  box-shadow:0 18px 40px -18px rgba(12,60,40,.4)}
.sn-chip svg{width:15px;height:15px;color:var(--brand-2)}
/* chips flutuando PARA FORA das laterais do extrato:
   c1 esquerda-em-cima, c2 direita-no-meio, c3 esquerda-embaixo.
   o overlap (~40px) cai só na margem interna do card, sem tocar texto. */
.sn-chip.c1{top:18%;right:calc(100% - 32px);animation:lp-floatchip 5s ease-in-out infinite}
.sn-chip.c2{top:57%;left:calc(100% - 50px);animation:lp-floatchip 5.6s ease-in-out infinite .4s}
.sn-chip.c3{top:74%;right:calc(100% - 32px);animation:lp-floatchip 6.2s ease-in-out infinite .8s}
.doc-note{margin-top:18px;text-align:center;font-size:.74rem;color:var(--muted-2)}

/* =========================================================
   2. MARQUEE — uma faixa
   ========================================================= */
.sn-marquee .marquee-track{animation-duration:30s}

/* =========================================================
   3. DORES — espinha central que resolve
   ========================================================= */
.sn-spine-wrap{position:relative;max-width:1060px;margin:0 auto;
  display:grid;grid-template-columns:1fr 1fr;
  column-gap:clamp(64px,8vw,132px);row-gap:clamp(30px,4.4vw,58px);align-items:center}
/* uma dor por linha -> a da esquerda; a próxima entra embaixo, à direita */
.sn-spine-wrap>.sn-pain{--conn:clamp(32px,4vw,66px)}
.sn-spine-wrap>.sn-pain:nth-child(2){grid-row:1}
.sn-spine-wrap>.sn-pain:nth-child(3){grid-row:2}
.sn-spine-wrap>.sn-pain:nth-child(4){grid-row:3}
.sn-spine-wrap>.sn-pain:nth-child(5){grid-row:4}
.sn-spine-wrap>.sn-pain:nth-child(6){grid-row:5}
.sn-spine-wrap>.sn-pain:nth-child(7){grid-row:6}
.sn-pain.left{grid-column:1}
.sn-pain.right{grid-column:2}
/* trilho central */
.sn-spine{position:absolute;left:50%;top:8px;bottom:8px;width:3px;transform:translateX(-1.5px);border-radius:3px;
  background:var(--surface-2)}
.sn-spine-fill{position:absolute;left:0;top:0;width:100%;height:calc(var(--fill,0) * 100%);border-radius:3px;
  background:linear-gradient(180deg,var(--brand-deep),var(--brand));box-shadow:0 0 16px var(--brand-glow)}
.sn-spine-fill .tip{position:absolute;left:50%;bottom:-5px;width:12px;height:12px;transform:translateX(-50%);border-radius:50%;
  background:var(--brand);border:3px solid #fff;box-shadow:0 0 0 1px rgba(18,161,80,.3),0 0 18px var(--brand-glow)}

.sn-pain{position:relative;display:flex;align-items:center;gap:15px;padding:22px 24px;border-radius:var(--radius);
  border:1px solid var(--line);background:linear-gradient(168deg,#fff,#F6FBF8);
  filter:grayscale(.5);opacity:.6;
  transition:filter .6s ease,opacity .6s ease,border-color .6s ease,box-shadow .6s ease}
/* conector card -> linha central (largura = metade do vão -> pousa exatamente na linha) */
.sn-pain::after{content:"";position:absolute;top:50%;height:2px;width:var(--conn);
  background:var(--line-2);transition:background .5s ease}
.sn-pain.left::after{left:100%}
.sn-pain.right::after{right:100%}
/* nó sobre a linha central */
.sn-pain::before{content:"";position:absolute;top:50%;width:13px;height:13px;margin-top:-6.5px;border-radius:50%;z-index:2;
  background:var(--bg-3);border:2px solid var(--line-2);transition:background .45s ease,border-color .45s ease,box-shadow .45s ease}
.sn-pain.left::before{left:calc(100% + var(--conn));margin-left:-6.5px}
.sn-pain.right::before{right:calc(100% + var(--conn));margin-right:-6.5px}

/* estado RESOLVIDO — a linha já passou por ele */
.sn-pain.done{filter:none;opacity:1;border-color:rgba(18,161,80,.3);
  box-shadow:0 22px 46px -34px rgba(16,60,40,.6)}
.sn-pain.done::after{background:var(--brand)}
.sn-pain.done::before{background:var(--brand);border-color:#fff;box-shadow:0 0 12px var(--brand-glow)}

/* ícone alerta -> check (mesma linguagem da LP MEI) */
.sn-pain .pic{position:relative;flex:none;width:42px;height:42px;border-radius:12px;display:grid;place-items:center;
  background:rgba(224,120,60,.12);border:1px solid rgba(224,120,60,.26);
  transition:background .6s .1s ease,border-color .6s .1s ease}
.sn-pain .pic svg{grid-area:1/1;width:20px;height:20px;transition:opacity .5s .1s ease,transform .5s .1s cubic-bezier(.34,1.4,.5,1)}
.sn-pain .pic .i-alert{color:#e0783c}
.sn-pain .pic .i-check{color:var(--brand-2);opacity:0;transform:scale(.3) rotate(-25deg)}
.sn-pain.done .pic{background:var(--brand-soft);border-color:rgba(18,161,80,.28)}
.sn-pain.done .pic .i-alert{opacity:0;transform:scale(.3) rotate(25deg)}
.sn-pain.done .pic .i-check{opacity:1;transform:none}

.sn-pain p{flex:1;color:var(--text);font-size:1rem;font-weight:500;line-height:1.42}

.sn-pain .solved{flex:none;margin-left:4px;display:inline-flex;align-items:center;gap:5px;
  padding:5px 11px;border-radius:100px;font-family:var(--font-mono);font-size:.58rem;font-weight:600;
  letter-spacing:.1em;text-transform:uppercase;color:var(--brand-2);background:var(--brand-soft);border:1px solid rgba(18,161,80,.24);
  opacity:0;transform:translateX(10px) scale(.92);transition:opacity .5s .3s ease,transform .5s .3s cubic-bezier(.34,1.4,.5,1)}
.sn-pain .solved svg{width:11px;height:11px}
.sn-pain.done .solved{opacity:1;transform:none}

/* ---------- frase de virada + CARIMBO ---------- */
.sn-relief{position:relative;max-width:760px;margin:64px auto 0;text-align:center;padding:10px 0 26px}
.sn-stamp{position:absolute;right:clamp(-20px,-1vw,0px);top:-34px;display:inline-flex;align-items:center;gap:8px;
  padding:10px 18px;border:3px solid var(--brand-2);border-radius:10px;color:var(--brand-2);
  font-family:var(--font-mono);font-weight:600;font-size:clamp(.72rem,1.2vw,.92rem);
  letter-spacing:.2em;text-transform:uppercase;
  -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence baseFrequency='.75' numOctaves='2'/%3E%3CfeColorMatrix values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 .9 .12'/%3E%3C/filter%3E%3Crect width='120' height='120' fill='%23000'/%3E%3Crect width='120' height='120' filter='url(%23n)'/%3E%3C/svg%3E");
  mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence baseFrequency='.75' numOctaves='2'/%3E%3CfeColorMatrix values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 .9 .12'/%3E%3C/filter%3E%3Crect width='120' height='120' fill='%23000'/%3E%3Crect width='120' height='120' filter='url(%23n)'/%3E%3C/svg%3E");
  -webkit-mask-size:110px;mask-size:110px;
  opacity:0;transform:rotate(-24deg) scale(2.2);
  transition:opacity .3s ease,transform .38s cubic-bezier(.3,1.6,.4,1)}
.sn-stamp svg{width:16px;height:16px}
.sn-relief.in .sn-stamp{opacity:.92;transform:rotate(-9deg) scale(1)}

/* =========================================================
   4. SOLUÇÃO — bento com spotlight
   ========================================================= */
.sn-bento{display:grid;grid-template-columns:repeat(6,1fr);gap:18px;max-width:1080px;margin:0 auto}
.sn-cell{position:relative;grid-column:span 2;padding:clamp(24px,2.8vw,34px);border-radius:var(--radius-lg);
  border:1px solid var(--line);background:linear-gradient(165deg,#fff,#F4FBF7);overflow:hidden;
  transition:transform .35s,border-color .35s,box-shadow .35s}
.sn-cell.wide{grid-column:span 3}
.sn-cell.full{grid-column:1/-1}
.sn-cell:hover{transform:translateY(-5px);border-color:rgba(18,161,80,.32);
  box-shadow:0 34px 70px -44px rgba(18,161,80,.55)}
/* luz que segue o mouse */
.sn-cell::before{content:"";position:absolute;inset:0;pointer-events:none;opacity:0;transition:opacity .35s;
  background:radial-gradient(320px circle at var(--mx,50%) var(--my,50%),rgba(18,161,80,.10),transparent 65%)}
.sn-cell:hover::before{opacity:1}
.sn-cell .cn{position:absolute;top:18px;right:22px;font-family:var(--font-display);font-weight:700;
  font-size:clamp(1.7rem,2.6vw,2.3rem);line-height:1;color:transparent;-webkit-text-stroke:1.2px rgba(18,161,80,.4)}
.sn-cell .cic{width:52px;height:52px;border-radius:14px;display:grid;place-items:center;margin-bottom:18px;
  background:var(--brand-soft);border:1px solid rgba(18,161,80,.22);transition:transform .35s cubic-bezier(.34,1.4,.5,1)}
.sn-cell:hover .cic{transform:scale(1.08) rotate(-5deg)}
.sn-cell .cic svg{width:25px;height:25px;color:var(--brand-2)}
.sn-cell h3{font-size:clamp(1.15rem,1.8vw,1.42rem);margin-bottom:9px;padding-right:44px}
.sn-cell p{color:var(--muted);font-size:.98rem;max-width:60ch}

/* célula final: gradiente esmeralda, fechamento */
.sn-cell.hot{display:flex;align-items:center;gap:24px;background:var(--lp-grad);border-color:transparent;color:#fff}
.sn-cell.hot::before{background:radial-gradient(360px circle at var(--mx,50%) var(--my,50%),rgba(255,255,255,.14),transparent 65%)}
.sn-cell.hot .cn{-webkit-text-stroke-color:rgba(255,255,255,.65)}
.sn-cell.hot .cic{flex:none;margin-bottom:0;background:rgba(255,255,255,.16);border-color:rgba(255,255,255,.3)}
.sn-cell.hot .cic svg{color:#fff}
.sn-cell.hot h3{color:#fff}
.sn-cell.hot p{color:rgba(255,255,255,.9);max-width:none}

/* =========================================================
   5. QUEM PODE — grid + fusão dos tributos
   ========================================================= */
.sn-fit-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(28px,5vw,64px);align-items:start;max-width:1060px;margin:0 auto}
.sn-fit-side .reqs-lead{color:var(--muted);font-size:1.02rem;font-weight:500;margin-bottom:14px}
.sn-fit-side .reqs-soft{margin-top:24px}

/* palco da fusão: 8 chips -> 1 guia */
.das-merge{position:relative;height:250px;margin-top:30px;border-radius:var(--radius-lg);
  border:1px dashed var(--line-2);background:
    radial-gradient(60% 70% at 50% 50%,rgba(18,161,80,.05),transparent 75%),
    linear-gradient(168deg,#fff,#F6FBF8)}
.dm-chip{position:absolute;left:var(--x);top:var(--y);transform:translate(-50%,-50%);
  padding:8px 14px;border-radius:100px;background:#fff;border:1px solid var(--line-2);
  font-family:var(--font-mono);font-size:.72rem;font-weight:600;letter-spacing:.08em;color:var(--muted);
  box-shadow:0 10px 24px -14px rgba(12,60,40,.35);white-space:nowrap;
  transition:left .8s var(--d,0s) cubic-bezier(.6,0,.2,1),top .8s var(--d,0s) cubic-bezier(.6,0,.2,1),
             transform .8s var(--d,0s) cubic-bezier(.6,0,.2,1),opacity .55s calc(var(--d,0s) + .3s) ease}
.das-merge.in .dm-chip{left:50%;top:50%;transform:translate(-50%,-50%) scale(.3);opacity:0}
/* a guia única */
.dm-one{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%) scale(.55);
  display:flex;flex-direction:column;align-items:center;gap:2px;text-align:center;
  padding:18px 34px;border-radius:20px;background:var(--lp-grad);color:#fff;
  box-shadow:0 26px 60px -22px rgba(10,94,48,.6);opacity:0;
  transition:opacity .5s .85s ease,transform .55s .85s cubic-bezier(.34,1.5,.5,1)}
.dm-one b{font-family:var(--font-display);font-size:1.4rem;font-weight:700;line-height:1.05}
.dm-one{font-family:var(--font-mono);font-size:.68rem;letter-spacing:.16em;text-transform:uppercase}
.das-merge.in .dm-one{opacity:1;transform:translate(-50%,-50%) scale(1)}
.dm-caption{position:absolute;left:50%;bottom:14px;transform:translateX(-50%);
  font-family:var(--font-mono);font-size:.64rem;letter-spacing:.14em;text-transform:uppercase;color:var(--muted-2);white-space:nowrap}

/* =========================================================
   6. TRANSFORMAÇÃO — cards com medidor
   ========================================================= */
.sn-gains{display:grid;grid-template-columns:repeat(2,1fr);gap:20px;max-width:1000px;margin:0 auto}
.sn-gain{position:relative;padding:clamp(26px,3.2vw,38px);border-radius:var(--radius-lg);overflow:hidden;
  border:1px solid var(--line);background:linear-gradient(168deg,#fff,#F4FBF7);
  transition:transform .4s,box-shadow .4s,border-color .4s}
.sn-gain:hover{transform:translateY(-6px);border-color:transparent;
  box-shadow:0 40px 80px -46px rgba(18,161,80,.5),0 0 0 1px var(--brand-soft)}
.sn-gain .gk{position:absolute;top:22px;right:24px;font-family:var(--font-mono);font-size:.62rem;font-weight:600;
  letter-spacing:.2em;text-transform:uppercase;color:var(--brand-2);opacity:.75}
.sn-gain .gic{width:54px;height:54px;border-radius:15px;display:grid;place-items:center;margin-bottom:20px;
  background:var(--brand-soft);border:1px solid rgba(18,161,80,.22)}
.sn-gain .gic svg{width:26px;height:26px;color:var(--brand-2)}
.sn-gain h3{font-size:clamp(1.25rem,2vw,1.6rem);margin-bottom:9px}
.sn-gain p{color:var(--muted);font-size:1rem;max-width:46ch}
/* medidor que preenche quando o card entra na tela */
.sn-gain .gmeter{display:block;height:4px;border-radius:4px;background:var(--surface-2);overflow:hidden;margin-top:22px}
.sn-gain .gmeter i{display:block;height:100%;width:100%;border-radius:4px;
  background:linear-gradient(90deg,var(--brand-deep),var(--brand));
  transform:scaleX(0);transform-origin:left;transition:transform 1.3s .25s cubic-bezier(.16,1,.3,1)}
.sn-gain.lit .gmeter i{transform:scaleX(1)}

/* =========================================================
   7. QUADRO — spotlight que segue o mouse
   ========================================================= */
/* (sem overflow:hidden — os cantos .fc ficam 6px para fora do quadro) */
.frame-spot{position:absolute;inset:0;z-index:0;pointer-events:none;opacity:0;transition:opacity .4s;
  background:radial-gradient(460px circle at var(--fx,50%) var(--fy,50%),rgba(18,161,80,.08),transparent 68%)}
.frame:hover .frame-spot{opacity:1}

/* =========================================================
   RESPONSIVO
   ========================================================= */
@media(max-width:980px){
  .sn-hero{padding:120px 0 60px;min-height:auto}
  .sn-hero-grid{grid-template-columns:1fr;gap:60px}
  .sn-hero-copy{max-width:none}
  .sn-showcase{grid-template-columns:1fr;gap:56px}
  .sn-showcase-copy{max-width:none}
  .sn-showcase .sn-visual{margin-top:8px}
  /* no mobile os chips não saem pelas laterais (estouraria a tela):
     c1/c3 voltam para cima do card; c2 fica na altura da barra, na borda. */
  .sn-visual{max-width:440px}
  .sn-chip.c1{top:-18px;right:5%;left:auto}
  .sn-chip.c2{top:62%;left:auto;right:0}
  .sn-chip.c3{top:-18px;left:5%;right:auto}

  /* espinha à esquerda; uma coluna, cards empilhados */
  .sn-spine-wrap{grid-template-columns:1fr;column-gap:0;padding-left:40px;row-gap:20px}
  .sn-spine{left:11px;top:8px;bottom:8px;transform:none}
  .sn-spine-wrap>.sn-pain{grid-column:1!important;grid-row:auto!important;--conn:28px}
  .sn-pain.left::after,.sn-pain.right::after{left:auto;right:100%}
  .sn-pain.left::before,.sn-pain.right::before{left:auto;right:calc(100% + var(--conn));margin-left:0;margin-right:-6.5px}
  .sn-stamp{position:static;display:inline-flex;margin-top:18px;transform:rotate(-24deg) scale(2)}
  .sn-relief.in .sn-stamp{transform:rotate(-6deg) scale(1)}

  .sn-bento{grid-template-columns:1fr 1fr}
  .sn-cell,.sn-cell.wide{grid-column:span 1}
  .sn-cell.full{grid-column:1/-1}

  .sn-fit-grid{grid-template-columns:1fr}
  .sn-gains{grid-template-columns:1fr}
}
@media(max-width:600px){
  .sn-bento{grid-template-columns:1fr}
  .sn-cell,.sn-cell.wide{grid-column:1/-1}
  .sn-cell.hot{flex-direction:column;align-items:flex-start;gap:16px}
  .sn-visual{max-width:340px}
  .sn-chip.c2{top:58%;right:2px}
  .sn-pain{flex-wrap:wrap}
  .sn-pain .solved{margin-left:56px}
  .das-merge{height:210px}
}

/* =========================================================
   REDUZ MOVIMENTO — tudo direto no estado final
   ========================================================= */
@media(prefers-reduced-motion:reduce){
  .doc-scan,.sn-chip{animation:none!important}
  .sn-doc{transform:none!important;transition:none}
  .sn-doc .val-bad{opacity:.42}
  .sn-doc .val-bad .strike{transform:scaleX(1)}
  .sn-doc .doc-meter i{transform:scaleX(.68)}
  .sn-doc .doc-save{opacity:1;transform:none}
  .sn-hero h1 .hl path{stroke-dashoffset:0}
  .sn-pain{filter:none;opacity:1;transform:none}
  .sn-pain .pic .i-alert{opacity:0}
  .sn-pain .pic .i-check{opacity:1;transform:none}
  .sn-pain .solved{opacity:1;transform:none}
  .sn-spine-fill{height:100%}
  .sn-stamp{opacity:.92;transform:rotate(-9deg) scale(1)}
  .das-merge .dm-chip{opacity:0}
  .das-merge .dm-one{opacity:1;transform:translate(-50%,-50%) scale(1)}
  .sn-gain .gmeter i{transform:scaleX(1)}
}