/* MyCross · página de vendas · v6C1 (SITE-SUP, ADR-0136, 28/10/2026): estilo v6 + variante C + ajuste fino C1 + ponte para o site.js real. */
/* MyCross · v6 "Corte" (SITE-SUP, ADR-0136) · CSS escrito do zero
   Conceito: a ilha de edição clara. Papel branco, tinta preta, verde-lima de marca-texto só no que corta e no que age.
   O produto (painel com transcrição, cortes e vertical 9:16) é a imagem do herói. */
@font-face{font-family:"Clash Grotesk";src:url(fontes/clash-grotesk-500.woff2) format("woff2");font-weight:500;font-display:swap}
@font-face{font-family:"Switzer";src:url(fontes/switzer-400.woff2) format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"Switzer";src:url(fontes/switzer-500.woff2) format("woff2");font-weight:500;font-display:swap}
@font-face{font-family:"Switzer";src:url(fontes/switzer-600.woff2) format("woff2");font-weight:600 700;font-display:swap}
@font-face{font-family:"JB Mono";src:url(fontes/jbmono.woff2) format("woff2");font-weight:400 700;font-display:swap}
@font-face{font-family:"Clash reserva";src:local("Arial");size-adjust:96%;ascent-override:95%;descent-override:24%}

:root{
  --papel:#fafaf8; --folha:#fff; --cinza:#f0f0ec;
  --tinta:#111110; --tinta-2:#45453f; --tinta-3:#5f5f58;
  --linha:#e4e4de; --linha-2:#cdcdc4;
  --lima:#c5f03c; --lima-escuro:#4a6b00; --lima-lavado:#f2fbd6;
  --r:16px; --r-g:26px; --larg:1240px; --pad:clamp(20px,4vw,48px);
  --disp:"Clash Grotesk","Clash reserva",system-ui,sans-serif;
  --mono:"JB Mono",ui-monospace,monospace;
}
@supports (color:oklch(0 0 0)){:root{--lima:oklch(0.9 0.2 125);--lima-escuro:oklch(0.47 0.12 128)}}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:84px;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--papel);color:var(--tinta);font:400 clamp(16px,.3vw + 15px,18px)/1.6 "Switzer",system-ui,sans-serif}
a{color:inherit}
h1,h2,h3{font-family:var(--disp);font-weight:500;line-height:1.02;letter-spacing:-.02em;margin:0;text-wrap:balance}
p{margin:0;text-wrap:pretty}
ul,ol{margin:0;padding:0;list-style:none}
:focus-visible{outline:3px solid var(--tinta);outline-offset:3px;border-radius:6px}
.pular{position:absolute;left:-999px;top:8px;background:var(--tinta);color:#fff;padding:10px 14px;border-radius:8px;z-index:99}.pular:focus{left:12px}

.bt{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:50px;padding:0 24px;border-radius:999px;font-weight:600;font-size:16px;text-decoration:none;border:1.5px solid transparent;transition:transform .2s,background .2s,border-color .2s;white-space:nowrap}
.bt-p{min-height:42px;padding:0 18px;font-size:15px}
.bt-lima{background:var(--lima);color:var(--tinta)}
.bt-lima:hover{background:#b3e01f}
.bt-tinta{background:var(--tinta);color:#fff}
.bt-tinta:hover{background:#2b2b28}
.bt-linha{background:var(--folha);border-color:var(--linha-2)}
.bt-linha:hover{border-color:var(--tinta)}
.bt-claro{border-color:rgb(255 255 255/.35);color:#fff}.bt-claro:hover{border-color:#fff}
.bt-bloco{width:100%}
.bt:active{transform:translateY(1px)}
.tri{width:0;height:0;border:6px solid transparent;border-left:10px solid currentColor;border-right:0}

/* topo */
.topo{position:sticky;top:0;z-index:20;background:rgb(250 250 248/.86);backdrop-filter:blur(14px) saturate(1.3)}
@supports (animation-timeline:scroll()){.topo{animation:filete linear both;animation-timeline:scroll();animation-range:0 100px}@keyframes filete{to{box-shadow:0 1px 0 var(--linha)}}}
.topo-in{max-width:var(--larg);margin:auto;padding:14px var(--pad);display:flex;align-items:center;gap:32px}
.marca{display:inline-flex;align-items:center;gap:10px;font:500 22px/1 var(--disp);letter-spacing:-.02em;text-decoration:none;color:var(--tinta)}
.marca strong{font-weight:500;background:linear-gradient(transparent 58%,var(--lima) 58% 92%,transparent 92%);padding:0 2px}
.marca-x{width:28px;height:28px;border-radius:8px;background:var(--tinta);position:relative}
.marca-x::before,.marca-x::after{content:"";position:absolute;left:7px;right:7px;top:13px;height:2.5px;background:var(--lima);border-radius:2px;transform:rotate(45deg)}
.marca-x::after{transform:rotate(-45deg);background:#fff}
.menu{display:flex;gap:26px;margin-right:auto}
.menu a{text-decoration:none;font-size:15px;color:var(--tinta-2)}.menu a:hover{color:var(--tinta)}
.topo-acoes{display:flex;align-items:center;gap:20px}
.link-entrar{text-decoration:none;font-weight:500;font-size:15px;padding:10px 0}

/* herói SaaS assimétrico: texto 5/12, app 7/12, faixa de benefícios embaixo */
.heroi{max-width:var(--larg);margin:auto;padding:clamp(32px,6vw,88px) var(--pad) 0;display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(32px,4vw,64px);align-items:center}
.olho{display:inline-flex;align-items:center;gap:10px;font:500 13px var(--mono);letter-spacing:.03em;text-transform:uppercase;color:var(--tinta-2)}
.gravando{width:10px;height:10px;border-radius:50%;background:#e5372b;box-shadow:0 0 0 4px #fde3e0}
.heroi h1{font-size:clamp(40px,4.2vw + 8px,74px);margin:20px 0 22px}
mark{background:linear-gradient(transparent 8%,var(--lima) 8% 94%,transparent 94%);color:inherit;padding:0 .08em;-webkit-box-decoration-break:clone;box-decoration-break:clone}
.lead{font-size:clamp(17px,.5vw + 15px,20px);color:var(--tinta-2);max-width:40ch}
.acoes{display:flex;flex-wrap:wrap;gap:12px;margin-top:32px}

.app{position:relative;background:var(--folha);border:1px solid var(--linha);border-radius:var(--r-g);box-shadow:0 2px 4px rgb(17 17 16/.04),0 50px 100px -50px rgb(17 17 16/.45);font-size:13px;line-height:1.45;margin-bottom:28px}
.app-barra{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:14px 18px;border-bottom:1px solid var(--linha);font-size:13px}
.pilula-viva{display:inline-flex;align-items:center;gap:8px;font:500 12px var(--mono);background:var(--lima-lavado);color:var(--lima-escuro);padding:5px 10px;border-radius:999px}
.pilula-viva i{width:7px;height:7px;border-radius:50%;background:var(--lima-escuro)}
@media (prefers-reduced-motion:no-preference){.pilula-viva i{animation:pisca 1.4s ease-in-out infinite}@keyframes pisca{50%{opacity:.25}}}
.app-corpo{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:18px;padding:18px}
.kpis{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:16px}
.kpis p{background:var(--cinza);border-radius:12px;padding:10px 12px;color:var(--tinta-3);font-size:12px}
.kpis b{display:block;font:500 24px/1.1 var(--disp);color:var(--tinta)}
.app-tit{font:500 11px var(--mono);text-transform:uppercase;letter-spacing:.06em;color:var(--tinta-3);margin:4px 0 8px}
.transc{display:grid;gap:4px;margin-bottom:14px}
.transc li{display:grid;grid-template-columns:44px 1fr;gap:8px;padding:6px 8px;border-radius:8px;color:var(--tinta-2)}
.transc time,.cortes time{font:500 11.5px var(--mono);color:var(--tinta-3)}
.transc li.sel{background:var(--lima-lavado);color:var(--tinta);box-shadow:inset 3px 0 0 var(--lima-escuro)}
.cortes{display:grid;gap:6px}
.cortes li{display:grid;grid-template-columns:1fr auto auto;grid-template-rows:auto 6px;column-gap:10px;row-gap:6px;align-items:center;padding:9px 10px;border:1px solid var(--linha);border-radius:10px}
.cortes span{font-weight:600}
.cortes i{grid-column:1/-1;height:6px;border-radius:6px;background:linear-gradient(90deg,var(--tinta) var(--p),var(--cinza) var(--p))}
.cortes b{font:600 12px var(--mono)}
.vertical{position:relative;aspect-ratio:9/16;max-height:320px;margin:0 auto 14px;border-radius:18px;background:#1b1b19;color:#fff;display:flex;align-items:flex-end;padding:16px 14px 26px;overflow:hidden}
.vertical::before{content:"";position:absolute;inset:0;background:radial-gradient(120% 70% at 30% 20%,#3a3a35 0,#1b1b19 60%)}
.vertical p{position:relative;font:500 19px/1.12 var(--disp);letter-spacing:-.01em}
.vertical u{text-decoration:none;background:var(--lima);color:var(--tinta);padding:0 3px;-webkit-box-decoration-break:clone;box-decoration-break:clone}
.vertical-fmt{position:absolute;top:10px;left:10px;font:500 11px var(--mono);background:rgb(255 255 255/.14);padding:3px 7px;border-radius:6px}
.vertical-barra{position:absolute;left:14px;right:14px;bottom:12px;height:3px;border-radius:3px;background:rgb(255 255 255/.25)}
.vertical-barra i{display:block;width:38%;height:100%;border-radius:3px;background:#fff}
.redes{display:flex;flex-wrap:wrap;gap:6px}
.redes span{border:1px solid var(--linha-2);border-radius:999px;padding:3px 10px;font-size:12px;font-weight:500}
.aprova{position:absolute;left:-28px;bottom:-26px;display:flex;align-items:center;gap:12px;background:var(--tinta);color:#fff;border-radius:16px;padding:12px 18px 12px 12px;box-shadow:0 20px 40px -18px rgb(17 17 16/.6)}
.aprova p{font-size:12.5px;color:#cfcfc8}.aprova b{display:block;color:#fff;font-size:14px}
.cadeado{width:34px;height:34px;border-radius:10px;background:var(--lima);position:relative}
.cadeado::before{content:"";position:absolute;left:10px;top:15px;width:14px;height:11px;border-radius:3px;background:var(--tinta)}
.cadeado::after{content:"";position:absolute;left:12px;top:7px;width:10px;height:11px;border:2.5px solid var(--tinta);border-bottom:0;border-radius:6px 6px 0 0;box-sizing:border-box}

.faixa{grid-column:1/-1;display:grid;grid-template-columns:repeat(3,1fr);margin-top:clamp(36px,4vw,56px);border-block:1px solid var(--linha)}
.faixa li{display:flex;align-items:center;gap:14px;padding:24px 22px;font-weight:600;font-size:16.5px}
.faixa li+li{border-left:1px solid var(--linha)}
.faixa li:first-child{padding-left:0}
.faixa svg{flex:none;width:40px;height:40px;padding:8px;border-radius:12px;background:var(--lima-lavado);fill:none;stroke:var(--lima-escuro);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}

/* seções */
.secao{max-width:var(--larg);margin:auto;padding:clamp(80px,10vw,136px) var(--pad) 0}
.rotulo{font:500 12.5px var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--lima-escuro);margin-bottom:14px}
.cab h2{font-size:clamp(34px,3.2vw + 12px,60px);max-width:18ch}
.cab p:not(.rotulo){margin-top:16px;color:var(--tinta-2);max-width:60ch;font-size:18px}
.cab-centro{text-align:center}.cab-centro h2,.cab-centro p{margin-inline:auto}

.problema{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(32px,6vw,96px);align-items:start}
.problema .cab{position:sticky;top:110px}
.dores li{display:grid;grid-template-columns:72px 1fr;column-gap:20px;padding:28px 0;border-top:1px solid var(--linha-2)}
.dores li:last-child{border-bottom:1px solid var(--linha-2)}
.dores span{grid-row:span 2;font:500 40px/1 var(--disp);color:var(--tinta-3)}
.dores h3{font-size:clamp(22px,1vw + 16px,28px);margin-bottom:8px}
.dores p{color:var(--tinta-2)}

.perfis{margin-top:48px;display:grid;grid-template-columns:repeat(6,1fr);gap:16px}
.perfis li{grid-column:span 2;background:var(--folha);border:1px solid var(--linha);border-radius:var(--r);padding:26px;display:flex;flex-direction:column;gap:10px}
.perfis li:nth-child(4),.perfis li:nth-child(5){grid-column:span 3}
.perfis h3{font-size:24px}
.perfis p{color:var(--tinta-2);font-size:16px}
.ganha{margin-top:auto;padding-top:14px;font:500 13px var(--mono)!important;color:var(--tinta)!important}
.ganha::before{content:"";display:inline-block;width:10px;height:10px;border-radius:3px;background:var(--lima);margin-right:8px;vertical-align:0}

.passos{margin-top:48px;display:grid;grid-template-columns:repeat(4,1fr);gap:0;counter-reset:p}
.passos li{position:relative;padding:0 24px 0 0}
.passos li+li{padding-left:24px;border-left:1px solid var(--linha)}
.tc{display:inline-grid;place-items:center;width:44px;height:44px;border-radius:12px;background:var(--tinta);color:var(--lima);font:500 18px var(--disp);margin-bottom:18px}
.passos h3{font-size:22px;margin-bottom:10px}
.passos p{color:var(--tinta-2);font-size:16px}
.chamada-linha{margin-top:48px;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px 28px;padding:24px 28px;border-radius:var(--r-g);background:var(--lima-lavado)}
.chamada-linha p{font:500 clamp(20px,1vw + 14px,26px)/1.2 var(--disp)}

.rec-grade{margin-top:48px;display:grid;grid-template-columns:repeat(12,1fr);gap:16px}
.rec{grid-column:span 5;background:var(--folha);border:1px solid var(--linha);border-radius:var(--r-g);padding:clamp(24px,3vw,40px)}
.rec-a{grid-column:span 7}
.rec-grade .rec:nth-child(3){grid-column:span 5}.rec-grade .rec:nth-child(4){grid-column:span 7}
.dor{font-size:15px;color:var(--tinta-3);text-decoration:line-through;text-decoration-color:#e5372b;text-decoration-thickness:2px;margin-bottom:18px}
.rec h3{font-size:clamp(24px,1.4vw + 14px,34px);margin-bottom:12px}
.rec p:not(.dor){color:var(--tinta-2)}
.breve{display:inline-block;vertical-align:middle;font:500 12px var(--mono);background:var(--cinza);color:var(--tinta-2);padding:4px 9px;border-radius:999px;letter-spacing:0}

.demo-in{background:var(--tinta);color:#fff;border-radius:var(--r-g);padding:clamp(32px,5vw,72px);display:grid;gap:36px}
.demo .rotulo{color:var(--lima)}.demo .cab p:not(.rotulo){color:#cfcfc8}
.esteira{display:grid;grid-template-columns:repeat(3,1fr);gap:0;border:1px solid rgb(255 255 255/.16);border-radius:var(--r)}
.esteira li{padding:24px 28px;position:relative}
.esteira li+li{border-left:1px solid rgb(255 255 255/.16)}
.esteira small{font:500 12px var(--mono);text-transform:uppercase;letter-spacing:.06em;color:var(--lima)}
.esteira p{font:500 clamp(20px,1vw + 14px,28px)/1.15 var(--disp);margin-top:8px}
.demo-nota{color:#cfcfc8;font-size:15px;max-width:70ch}

.int-grade{margin-top:44px;display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.int-grade section{background:var(--folha);border:1px solid var(--linha);border-radius:var(--r);padding:22px}
.int-grade h3{font-size:20px;margin-bottom:14px}
.int-grade li{display:flex;justify-content:space-between;gap:10px;padding:9px 0;border-top:1px solid var(--linha);font-size:15px;font-weight:500}
.int-grade em{font:500 11.5px var(--mono);font-style:normal;color:var(--tinta-2);background:var(--cinza);padding:3px 8px;border-radius:999px;white-space:nowrap;align-self:center}
.int-grade em.exp{background:var(--lima-lavado);color:var(--lima-escuro)}
.int-nota{margin-top:14px;font-size:13.5px;color:var(--tinta-3)}

.planos-in{margin-top:48px;display:grid;grid-template-columns:minmax(0,8fr) minmax(0,4fr);gap:20px;align-items:stretch}
.planos-grade{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.plano{position:relative;background:var(--folha);border:1px solid var(--linha);border-radius:var(--r-g);padding:32px;display:flex;flex-direction:column}
.plano-nome{font-weight:600;font-size:17px}
.preco{margin:16px 0 8px;display:flex;align-items:baseline;gap:6px;flex-wrap:wrap}
.preco strong{font:500 clamp(40px,2.4vw + 18px,56px)/1 var(--disp);letter-spacing:-.03em;font-variant-numeric:tabular-nums}
.preco span{color:var(--tinta-3)}
.economia{display:inline-block;align-self:flex-start;font:600 13px var(--mono);background:var(--lima);color:var(--tinta);padding:4px 10px;border-radius:999px;margin-bottom:8px}
.equiv{color:var(--tinta-2);font-size:15px}
.plano ul{margin:22px 0 28px;padding-top:20px;border-top:1px solid var(--linha);display:grid;gap:10px;font-size:15px}
.plano li{position:relative;padding-left:26px}
.plano li::before{content:"";position:absolute;left:2px;top:.45em;width:12px;height:7px;border-left:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(-45deg)}
.plano .bt{margin-top:auto}
.plano-dest{background:var(--tinta);color:#fff;border-color:var(--tinta)}
.plano-dest .equiv,.plano-dest .preco span{color:#cfcfc8}.plano-dest ul{border-color:rgb(255 255 255/.16)}.plano-dest li::before{color:var(--lima)}
.flag{position:absolute;top:-13px;right:28px;background:var(--lima);color:var(--tinta);font:600 12px var(--mono);padding:6px 12px;border-radius:999px}
.garantias{background:var(--lima-lavado);border-radius:var(--r-g);padding:30px}
.garantias h3{font-size:24px;margin-bottom:16px}
.garantias ul{display:grid;gap:12px;font-size:15px;color:var(--tinta-2)}
.garantias b{color:var(--tinta)}
.garantias>p{margin-top:18px;font-size:13.5px;color:var(--tinta-3)}

.duvidas{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,8fr);gap:clamp(28px,5vw,80px);align-items:start}
.duvidas .cab{position:sticky;top:110px}
.duv-lista{border-top:1px solid var(--linha-2)}
details{border-bottom:1px solid var(--linha-2)}
summary{list-style:none;cursor:pointer;padding:22px 48px 22px 0;font-weight:600;font-size:18px;position:relative}
summary::-webkit-details-marker{display:none}
summary::before,summary::after{content:"";position:absolute;right:8px;top:50%;width:16px;height:2px;background:var(--tinta);transition:transform .25s}
summary::after{transform:rotate(90deg)}
details[open] summary::after{transform:rotate(0)}
details p{padding:0 0 24px;color:var(--tinta-2);max-width:62ch}

.final{margin-top:clamp(88px,10vw,140px);background:var(--tinta);color:#fff}
.final-in{max-width:var(--larg);margin:auto;padding:clamp(64px,8vw,120px) var(--pad);display:grid;gap:18px;justify-items:start}
.final .rotulo{color:var(--lima)}
.final h2{font-size:clamp(38px,4.4vw + 8px,80px);max-width:15ch}
.final p:not(.rotulo){color:#cfcfc8;font-size:19px}
.rodape{max-width:var(--larg);margin:auto;padding:48px var(--pad) 56px;display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:28px;font-size:15px}
.rod-marca p{color:var(--tinta-3);margin-top:10px}
.rodape nav{display:grid;gap:6px;align-content:start}
.rodape nav p{font:500 12px var(--mono);text-transform:uppercase;letter-spacing:.06em;color:var(--tinta-3);margin-bottom:6px}
.rodape nav a{text-decoration:none;color:var(--tinta-2);padding:3px 0}.rodape nav a:hover{color:var(--tinta);text-decoration:underline}

@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}

@media (max-width:1080px){
  .menu{display:none}
  .heroi{grid-template-columns:1fr}
  .aprova{left:12px}
  .perfis li,.perfis li:nth-child(4),.perfis li:nth-child(5){grid-column:span 3}
  .passos{grid-template-columns:1fr 1fr;row-gap:36px}.passos li:nth-child(3){border-left:0;padding-left:0}
  .int-grade{grid-template-columns:1fr 1fr}
  .planos-in{grid-template-columns:1fr}
}
@media (max-width:720px){
  .topo-acoes{gap:12px}
  .topo-in{gap:12px}
  .bt{white-space:normal;text-align:center}
  .chamada-linha{padding:22px}
  .marca{font-size:19px}
  .topo .bt-p{padding:0 14px;font-size:14px;min-height:40px}
  .app-corpo{grid-template-columns:1fr}
  .app-dir{display:grid;grid-template-columns:120px 1fr;gap:14px;align-items:start}
  .vertical{margin:0;max-height:none}
  .aprova{position:relative;left:auto;bottom:auto;margin:0 18px 18px;display:flex}
  .app{margin-bottom:0}
  .faixa{grid-template-columns:1fr}.faixa li{padding:16px 0}.faixa li+li{border-left:0;border-top:1px solid var(--linha)}
  .problema,.duvidas{grid-template-columns:1fr}.problema .cab,.duvidas .cab{position:static}
  .dores li{grid-template-columns:52px 1fr}.dores span{font-size:30px}
  .perfis{grid-template-columns:1fr}.perfis li,.perfis li:nth-child(4),.perfis li:nth-child(5){grid-column:auto}
  .passos{grid-template-columns:1fr}.passos li,.passos li+li{padding:0;border-left:0}
  .rec-grade{grid-template-columns:1fr}.rec,.rec-a,.rec-grade .rec:nth-child(3),.rec-grade .rec:nth-child(4){grid-column:auto}
  .esteira{grid-template-columns:1fr}.esteira li+li{border-left:0;border-top:1px solid rgb(255 255 255/.16)}
  .int-grade{grid-template-columns:1fr}
  .planos-grade{grid-template-columns:1fr;gap:28px}
  .rodape{grid-template-columns:1fr 1fr}.rod-marca{grid-column:1/-1}
}
/* MyCross · v6C "Lima total" (SITE-SUP, ADR-0136, 28/10/2026). Camada sobre o estilo.css da v6 (A).
   Conceito: cartaz de corte. O herói é um bloco lima cheio de borda a borda, o painel vem à esquerda,
   letra larga e geométrica (Unbounded), cartões com contorno grosso e sombra dura; faixa escura no meio da página. */
@font-face{font-family:"Unbounded";src:url(fontes/unbounded-latin-wght-normal.woff2) format("woff2");font-weight:200 900;font-display:swap}
@font-face{font-family:"Unbounded reserva";src:local("Arial Black"),local("Arial");size-adjust:104%}
:root{
  --papel:#ffffff; --folha:#ffffff; --cinza:#f1f3ec;
  --disp:"Unbounded","Unbounded reserva",system-ui,sans-serif;
  --r:4px; --r-g:6px;
  --duro:6px 6px 0 var(--tinta);
}
h1,h2,h3{font-weight:600;letter-spacing:-.035em;line-height:1.04}
.marca{font-size:20px}
.topo{background:rgb(255 255 255/.92)}
.bt{border-radius:6px;border-width:2px;font-weight:700}
.bt-linha{border-color:var(--tinta)}
.bt-lima{border-color:var(--tinta)}

/* herói: bloco lima de borda a borda, painel à esquerda (7) e texto à direita (5) */
.heroi{background:var(--lima);box-shadow:0 0 0 100vmax var(--lima);clip-path:inset(0 -100vmax);grid-template-columns:minmax(0,7fr) minmax(0,5fr);padding-block:clamp(40px,5vw,80px) 0}
.heroi-txt{grid-column:2;grid-row:1}
.app{grid-column:1;grid-row:1;border:2px solid var(--tinta);border-radius:var(--r-g);box-shadow:12px 12px 0 var(--tinta);transform:rotate(-1.2deg)}
.olho{color:var(--tinta)}
.gravando{box-shadow:0 0 0 4px #fff}
.heroi h1{font-size:clamp(34px,2.6vw + 12px,58px)}
.heroi mark{background:var(--tinta);color:var(--lima);padding:0 .15em}
.lead{color:var(--tinta)}
.heroi .bt-lima{background:var(--tinta);color:var(--lima)}
.heroi .bt-lima:hover{background:#2b2b28}
.faixa{grid-row:2;background:var(--tinta);color:#fff;border:0;box-shadow:0 0 0 100vmax var(--tinta);clip-path:inset(0 -100vmax);margin-top:clamp(48px,5vw,72px)}
.faixa li+li{border-left-color:rgb(255 255 255/.2)}
.faixa svg{background:var(--lima);stroke:var(--tinta)}
.aprova{border:2px solid var(--lima)}

/* seções: contorno grosso e sombra dura */
.secao{padding-block:clamp(72px,9vw,120px) 0}
.rotulo{display:inline-block;background:var(--tinta);color:var(--lima);padding:5px 10px;border-radius:4px}
.cab h2{font-size:clamp(28px,2.4vw + 12px,50px);max-width:20ch}
.dores li{border-top:2px solid var(--tinta)}
.dores li:last-child{border-bottom:2px solid var(--tinta)}
.dores span{font-weight:800;color:var(--tinta);-webkit-text-stroke:0}
.perfis li,.rec,.int-grade section,.plano,.garantias{border:2px solid var(--tinta);border-radius:var(--r-g);box-shadow:var(--duro)}
.perfis h3{font-size:20px}
.rec h3{font-size:clamp(20px,1vw + 14px,28px)}
.rec-a{background:var(--lima-lavado)}
.tc{border-radius:4px;background:var(--lima);color:var(--tinta);border:2px solid var(--tinta)}
.passos li+li{border-left:2px solid var(--tinta)}
.chamada-linha{border:2px solid var(--tinta);border-radius:var(--r-g);background:var(--lima);box-shadow:var(--duro)}
.chamada-linha p{font-size:clamp(17px,.8vw + 12px,22px)}
.demo{max-width:none;padding-inline:0}
.demo-in{border-radius:0;max-width:var(--larg);margin:auto;box-shadow:0 0 0 100vmax var(--tinta);clip-path:inset(0 -100vmax)}
.esteira{border:2px solid var(--lima);border-radius:var(--r)}
.esteira li+li{border-left:2px solid var(--lima)}
.esteira p{font-size:clamp(18px,.9vw + 12px,24px)}
.int-grade em{border:1px solid var(--tinta);border-radius:4px}
.preco strong{font-size:clamp(32px,2vw + 14px,46px);font-weight:700}
.plano-dest{box-shadow:10px 10px 0 var(--lima)}
.flag{border-radius:4px;border:2px solid var(--tinta)}
.economia{border-radius:4px}
.garantias{background:var(--lima-lavado)}
.duv-lista{border-top:2px solid var(--tinta)}
details{border-bottom:2px solid var(--tinta)}
summary{font-family:var(--disp);font-weight:500;font-size:16px}
.final{background:var(--lima);color:var(--tinta)}
.final .rotulo{color:var(--lima)}
.final h2{font-size:clamp(32px,3.6vw + 8px,68px);color:var(--tinta)}
.final p:not(.rotulo){color:var(--tinta)}
.final .bt-lima{background:var(--tinta);color:var(--lima)}
.final .bt-claro{color:var(--tinta);border-color:var(--tinta)}
@media (max-width:1080px){
  .heroi{grid-template-columns:minmax(0,1fr)}
  .heroi-txt,.app{grid-column:auto;grid-row:auto}
  .faixa{grid-row:auto}
  .app{transform:none}
}
@media (max-width:720px){
  .heroi h1{font-size:clamp(28px,8.2vw,36px)}
  .cab h2{font-size:clamp(26px,7.4vw,32px)}
  .app{box-shadow:6px 6px 0 var(--tinta)}
  .faixa li{padding-inline:0}
  .esteira li+li{border-left:0;border-top:2px solid var(--lima)}
  .passos li+li{border-left:0}
  .perfis li,.rec,.int-grade section,.plano,.garantias,.chamada-linha{box-shadow:4px 4px 0 var(--tinta)}
}
/* MyCross v6C1 · ajuste fino aprovado pelo dono em 28/10/2026 ("de 1 a 5 eu aprovo"). Camada sobre a variante C.
   Foco visível também sobre a tinta (contorno lima) e o selo "Aprovação de gasto" sem cobrir o painel no PC. */
.plano-dest :focus-visible, .faixa :focus-visible, .demo-in :focus-visible, .aprova :focus-visible, .pular:focus-visible { outline-color: var(--lima); }
.bt-lima:focus-visible, .heroi .bt-lima:focus-visible, .final .bt-lima:focus-visible { outline-color: var(--tinta); box-shadow: 0 0 0 9px #fff; outline-offset: 2px; }
@media (min-width: 1081px) { .aprova { left: auto; right: -20px; bottom: -30px; } }
.pular:focus-visible { outline: 3px solid var(--tinta); outline-offset: 2px; box-shadow: 0 0 0 9px var(--lima); }
.plano-dest .bt:focus-visible, .plan.is-featured .btn:focus-visible { outline: 3px solid var(--lima); outline-offset: 2px; box-shadow: 0 0 0 9px var(--tinta); }

/* ===== ponte para o site.js REAL (v6C1 de produção, SITE-SUP 28/10): cartões de plano, selos das integrações,
   player e prova social são montados pelo site.js com as classes dele; aqui recebem a pele C. ===== */
.plans .plan{position:relative;background:var(--folha);border:2px solid var(--tinta);border-radius:var(--r-g);box-shadow:var(--duro);padding:32px;display:flex;flex-direction:column}
.plans .plan.is-skeleton{min-height:560px;background:var(--cinza);box-shadow:none;border-style:dashed}
.plans>.muted{grid-column:1/-1;color:var(--tinta-2)}
.plan-name{font-weight:600;font-size:17px}
.plan-price{margin:16px 0 8px;display:flex;align-items:baseline;gap:6px;flex-wrap:wrap}
.plan-price strong{font:700 clamp(32px,2vw + 14px,46px)/1 var(--disp);letter-spacing:-.03em;font-variant-numeric:tabular-nums}
.plan-cycle{color:var(--tinta-3)}
.plan-saving{display:inline-block;align-self:flex-start;font:600 13px var(--mono);background:var(--lima);color:var(--tinta);padding:4px 10px;border-radius:4px;margin-bottom:8px}
.plan-equiv{color:var(--tinta-2);font-size:15px}
.plan-features{margin:22px 0 28px;padding:20px 0 0;border-top:1px solid var(--linha);display:grid;gap:10px;font-size:15px;list-style:none}
.plan-features li{position:relative;padding-left:26px}
.plan-features .tick{position:absolute;left:2px;top:.45em;width:12px;height:7px;border-left:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(-45deg)}
.plan .btn{margin-top:auto;display:flex;align-items:center;justify-content:center;min-height:52px;padding:0 22px;border-radius:6px;border:2px solid var(--tinta);font-weight:700;text-decoration:none;width:100%}
.plan .btn-outline{background:transparent;color:var(--tinta)}
.plan .btn-outline:hover{background:var(--tinta);color:#fff}
.plan.is-featured{background:var(--tinta);color:#fff;border-color:var(--tinta);box-shadow:10px 10px 0 var(--lima)}
.plan.is-featured .plan-equiv,.plan.is-featured .plan-cycle{color:#cfcfc8}
.plan.is-featured .plan-features{border-color:rgb(255 255 255/.16)}
.plan.is-featured .tick{color:var(--lima)}
.plan.is-featured .btn-primary{background:var(--lima);color:var(--tinta);border-color:var(--lima)}
.plan.is-featured :focus-visible{outline-color:var(--lima)}
.plan-flag{position:absolute;top:-13px;right:28px;background:var(--lima);color:var(--tinta);font:600 12px var(--mono);padding:6px 12px;border-radius:4px;border:2px solid var(--tinta)}
.int-grade em.chip{border:1px solid var(--tinta);border-radius:4px}
.int-grade em.chip-ready{background:var(--lima);color:var(--tinta)}
.int-grade em.chip-export,.int-grade em.chip-next{background:var(--lima-lavado);color:var(--lima-escuro)}
.demo-frame:empty{display:none}
.demo-player{margin-top:32px;border:2px solid var(--lima);border-radius:var(--r);overflow:hidden;aspect-ratio:16/9;background:#000}
.demo-player video,.demo-cover{display:block;width:100%;height:100%;border:0}
.demo-cover{display:grid;place-items:center;gap:12px;color:#fff;cursor:pointer;background:#000;font:inherit}
.demo-cover-play{width:72px;height:72px;border-radius:50%;background:var(--lima)}
.proof{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:16px;margin-top:32px}
.proof[hidden]{display:none}
.proof-value{font:700 32px var(--disp);color:var(--lima)}
.proof-label{color:#cfcfc8}
.rod-pai{color:var(--tinta-3);font-size:14px}
.copyright{max-width:var(--larg);margin:24px auto 0;padding:0 var(--pad) 24px;color:var(--tinta-3);font-size:14px}
@media (max-width:720px){.plans .plan{box-shadow:4px 4px 0 var(--tinta)}.plan.is-featured{box-shadow:6px 6px 0 var(--lima)}}