/* =========================================================
   ACG · estilo v4 (proposta)
   Referência enviada por Allison em 29/10/2026: violeta da marca no lugar
   do âmbar, cartões brancos com cantos suaves sobre o papel lavanda,
   faixas escuras com a grade da prancha e o triângulo da logo em traço.
   Mantém: comparador esboço × site, revisão linha por linha, Raio-X.
   Sem brilho atrás de título e sem degradê em texto (regra da casa).
========================================================= */
:root{
  --v:#6C4BF4; --v-2:#7D5FFF; --v-esc:#5233D6; --v-claro:#A08BFF; --v-vel:#ECE7FF;
  --ambar:#7C5CFA; --ambar-2:#8D72FF; --ambar-esc:#5233D6;
  --noite:#120A2B; --noite-2:#1B1042; --noite-3:#2B1466; --noite-4:#0B0620;
  --papel:#F5F3FB; --papel-2:#FFFFFF; --borda:#E2DCF2; --borda-2:#D6CEEA;
  --r:12px; --r-s:8px;
}

/* ---------- botões ---------- */
.btn{border-radius:var(--r-s);font-weight:650}
.btn--ambar{background:var(--v);color:#fff}
.btn--ambar:hover{background:var(--v-2)}
.btn--escuro{background:var(--v);color:#fff}
.btn--escuro:hover{background:var(--v-2)}
.btn--contorno{border-color:var(--v);color:#fff;background:var(--v)}
.btn--contorno:hover,.btn--contorno[aria-pressed=true]{background:transparent;border-color:var(--v-claro);color:var(--v-claro)}
.lnk{border-bottom-color:var(--v)}
.lnk--claro:hover{color:var(--v-claro)}
.k{color:var(--v-esc);letter-spacing:.08em;text-transform:uppercase;font-size:.72rem}
.k--claro{color:var(--v-claro)}
.k--esc{color:var(--v-esc)}
h1 em,h2 em{color:var(--v-claro)}

/* ---------- cabeçalho ---------- */
.hd__in{border-bottom:0}
.hd__cta{padding:.65rem 1.1rem}
.hd--solido{background:rgba(18,10,43,.96)}

/* ---------- hero: prancha escura com o triângulo da logo em traço ---------- */
.hero{background-color:var(--noite);padding-bottom:0;overflow-x:clip}
.hero__tri{position:absolute;right:-4%;top:6rem;width:58%;max-width:900px;height:auto;z-index:0;pointer-events:none}
.hero__tri path{fill:none;stroke:var(--v-claro);stroke-width:1.2;vector-effect:non-scaling-stroke;opacity:.35}
.hero__tri path+path{opacity:.18;stroke-dasharray:6 8}
.hero__g{position:relative;z-index:1}
.hero h1{font-size:clamp(2.3rem,3.5vw,3.3rem)}
.tag{font-size:.72rem}
.tag i{border-color:var(--v);background:var(--v);border-radius:2px}
.hero__fatos{border-top:0;padding-top:0;gap:.6rem 1.6rem}
.hero__fatos li{display:flex;align-items:center;gap:.5rem}
.hero__fatos li::before{content:"";width:1.05rem;height:1.05rem;border-radius:50%;border:1.5px solid var(--v-claro);
  background:radial-gradient(circle,var(--v-claro) 0 2.5px,transparent 3px)}
.nav-mock{border-radius:var(--r-s)}
.cel{border-radius:26px}
.anot{position:absolute;left:-2.2rem;bottom:2.4rem;display:flex;align-items:flex-end;gap:.4rem;color:var(--v-claro);font:italic 500 .78rem/1.25 var(--m);transform:rotate(-6deg);z-index:2}
.anot svg{width:2.6rem;height:2.2rem;fill:none;stroke:currentColor;stroke-width:1.4;stroke-linecap:round}
.comp__alca{background:var(--v);border-color:#fff}
.comp__alca svg{stroke:#fff}
.comp__linha{background:var(--v)}
.comp__rot,.comp__dica{background:var(--noite);color:var(--v-claro);border-radius:4px}
.cota{color:var(--v-claro)}
.cota i,.cota--top i::before,.cota--top i::after{background:var(--v-claro)!important}
.cota--cel{border-top-color:var(--v-claro)}

/* faixa de painéis: um cartão só, que atravessa a borda do hero */
.paineis{transform:translateY(5.5rem);padding-inline:0;width:calc(100% - 2 * var(--pad));max-width:calc(var(--wrap) - 2 * var(--pad));border-radius:var(--r);overflow:hidden;box-shadow:0 30px 70px -30px rgba(18,10,43,.55);grid-template-columns:5fr 4fr 4fr}
.painel{min-height:22rem}
.painel--a{background:var(--noite-2);border:0}
.painel--b{background:var(--noite-3);border:0}
.painel--c{background:#fff;border:0;box-shadow:none}
.painel__k{color:var(--v-claro);font-size:.72rem;letter-spacing:.08em;text-transform:uppercase}
.painel--c .painel__k{color:var(--v-esc)}
.spec li{grid-template-columns:2.6rem 9.5rem 1fr;align-items:start;border-top:0;padding:.55rem 0}
.ico{width:2.3rem;height:2rem;border:1.5px solid var(--v-claro);border-radius:5px;position:relative;opacity:.95}
.ico svg{position:absolute;inset:0;width:100%;height:100%;fill:none;stroke:var(--v-claro);stroke-width:1.3}
.passos li{border-bottom:1px solid rgba(255,255,255,.08)}
.passos span{color:var(--v-claro)}
.mini{grid-template-columns:7rem 1fr}
.mini img{border-radius:6px}
.mini span::after{color:var(--v-esc)}

/* ---------- seções claras ---------- */
.sec{padding-block:7rem}
.trab{padding-top:11rem;background:var(--papel)}
.trab::before{display:none}
.trab h2 em,.proc h2 em,.quem h2 em,.duv h2 em{color:var(--v-esc)}
.abas button{border-radius:var(--r-s);background:#fff}
.abas button[aria-selected=true]{background:var(--noite);border-color:var(--noite)}
.nav-mock--caso{box-shadow:0 30px 60px -35px rgba(18,10,43,.45)}
.nota{background:var(--v);color:#fff;border-radius:4px}
.explorar__k{background:var(--v);color:#fff;border-radius:var(--r-s);box-shadow:none}
.explorar svg{fill:#fff}
.entregas{gap:.6rem;font-family:var(--f);font-size:.95rem;letter-spacing:0}
.entregas li{display:flex;gap:.6rem;align-items:center}
.entregas li::before{content:"✓";flex:none;width:1.25rem;height:1.25rem;border-radius:50%;background:var(--v-vel);color:var(--v-esc);font-size:.72rem;display:grid;place-items:center}
.selo{border-radius:999px;border-color:var(--v-esc);color:var(--v-esc)}
.caso2{background:#fff;border-color:var(--borda);border-radius:var(--r);overflow:hidden}
.caso2--vazio{border-radius:var(--r);border-color:var(--v-claro);background-image:none;background:#fff;flex-direction:row;align-items:center;gap:1.2rem;flex-wrap:wrap}
.caso2--vazio .mais{flex:none;width:3.2rem;height:3.2rem;border-radius:50%;background:var(--v-vel);color:var(--v-esc);display:grid;place-items:center;font-size:1.6rem;font-weight:400}
.caso2--vazio>div{flex:1;min-width:12rem;display:grid;gap:.4rem}
.caso2--vazio h3{margin:0;font-size:1.4rem}

/* ---------- critério: revisão em duas colunas, genérico × ACG ---------- */
.diff-sec{background:var(--noite);background-image:linear-gradient(var(--linha) 1px,transparent 1px),linear-gradient(90deg,var(--linha) 1px,transparent 1px);background-size:48px 48px}
.diff-sec h2 em{color:var(--v-claro)}
.diff{border-radius:var(--r);overflow:hidden;background:var(--noite-2);font-family:var(--f);font-size:.92rem}
.diff figcaption{font-family:var(--m);font-size:.74rem}
.diff__cab{display:grid;grid-template-columns:1fr 1fr;font-weight:650;font-size:.88rem}
.diff__cab span{padding:.75rem 1rem;text-align:center;background:rgba(255,255,255,.03)}
.diff__cab span+span{background:var(--noite-3);color:#fff}
.diff__l{display:grid;grid-template-columns:1fr 1fr;border-top:1px solid var(--linha)}
.diff p,.diff--js .p{display:flex;gap:.6rem;align-items:flex-start;padding:.85rem 1rem}
.diff .m{background:transparent;color:#B7AED0;text-decoration:none}
.diff .m::before,.diff .p::before{flex:none;width:1.15rem;height:1.15rem;border-radius:50%;display:grid;place-items:center;font-size:.66rem;font-weight:700;margin-top:.15rem}
.diff .m::before{content:"✕";background:rgba(236,72,90,.18);color:#FF8A97}
.diff .p{background:rgba(124,92,250,.10);border-left:1px solid var(--linha);color:#fff}
.diff .p::before{content:"✓";background:var(--v);color:#fff}
.diff--antes .p{grid-template-rows:1fr!important;opacity:.0!important;padding-block:.85rem!important}
.diff--antes .m::before{content:"?";background:rgba(255,255,255,.08);color:var(--claro)}

/* ---------- raio-x: faixa violeta com a folha inclinada ---------- */
.rx{background:#2E157A;background-image:linear-gradient(rgba(255,255,255,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.05) 1px,transparent 1px);background-size:48px 48px}
.rx h2 em{color:#C3B4FF}
.rx__itens li::before{color:#C3B4FF}
.laudo{border:0;border-radius:var(--r);box-shadow:0 40px 70px -30px rgba(8,4,24,.7);overflow:hidden}
.laudo__ex{background:var(--noite);color:#fff;border-radius:4px}
.laudo__n{background:var(--v);color:#fff}
.laudo__m::before{color:var(--v-esc)}
.laudo__carimbo{border-top:1px solid var(--borda-2);background:var(--papel)}
@media (min-width:901px){.laudo{transform:rotate(2deg)}}

/* ---------- processo ---------- */
.proc{background:#fff}
.etapas{border-top:0;gap:1.2rem}
.etapas::before,.etapas::after{display:none}
.etapas li,.etapas li+li{padding:1.6rem;border:1px solid var(--borda);border-radius:var(--r);background:var(--papel)}
.etapas__n{font-size:2.6rem;color:var(--v);-webkit-text-stroke:0}
.etapas li.on .etapas__n{color:var(--v)}
.entrega{color:var(--v-esc)!important}
.compromissos{border-top:0}

/* ---------- para quem ---------- */
.quem{background:var(--papel)}
.nichos{display:grid;grid-template-columns:1fr 1fr;gap:.6rem}
.nichos li,.nichos li:nth-child(3n+1){display:flex;align-items:center;gap:.6rem;border:1px solid var(--borda);background:#fff;border-radius:var(--r-s);font-family:var(--f);font-size:.95rem}
.nichos li::before{content:"✓";flex:none;width:1.25rem;height:1.25rem;border-radius:50%;background:var(--v-vel);color:var(--v-esc);font-size:.7rem;display:grid;place-items:center}
.sobre{border-top-color:var(--borda)}

/* ---------- dúvidas ---------- */
.duv{background:#fff;border-top:0}
.notas{border:1px solid var(--borda);border-radius:var(--r);overflow:hidden}
.notas__k{display:none}
.notas details+details{border-top:1px solid var(--borda)}
.notas summary::after{color:var(--v-esc)}
.notas summary span{color:var(--v-claro)}

/* ---------- orçamento ---------- */
.orc{background-color:var(--noite)}
.orc h2 em{color:var(--v-claro)}
.depois .mono{color:var(--v-claro)}
.previa{border-radius:var(--r-s)}
.form{border-top:0;border-radius:var(--r);box-shadow:0 40px 80px -40px rgba(0,0,0,.6)}
.form input,.form textarea,.chips button{border-radius:var(--r-s)}
.chips button[aria-pressed=true]{background:var(--v);border-color:var(--v)}
.form input:focus,.form textarea:focus{border-color:var(--v);outline-color:rgba(108,75,244,.2)}
.ft{background:var(--noite-4)}

@media (max-width:900px){
  .hero__tri{width:120%;right:-40%;top:auto;bottom:30%}
  .anot{display:none}
  .paineis{transform:none;border-radius:var(--r);grid-template-columns:1fr}
  .spec li{grid-template-columns:2.6rem 1fr}
  .spec li span{grid-column:2}
  .trab{padding-top:5rem}
  .diff__cab,.diff__l{grid-template-columns:1fr}
  .diff__cab span:first-child{display:none}
  .diff .p{border-left:0}
  .etapas li,.etapas li+li{padding:1.3rem}
  .nichos{grid-template-columns:1fr}
}
