/* Vitra · página de venda (Fase 7) */
:root{
  --tinta:#101935;--tinta-2:#23305C;--jade:#14B8A0;--jade-claro:#E3F7F3;--jade-esc:#0B7A6B;
  --violeta:#6366F1;--violeta-claro:#EEEFFE;--cruz:#1E3A8A;
  --fundo:#FFFFFF;--fundo-2:#F5F7FB;--linha:#E2E7F0;--texto:#1B2236;--suave:#596379;
  --raio:16px;--sombra:0 18px 50px -20px rgba(16,25,53,.28);
  --titulos:"Sora","Inter",system-ui,sans-serif;--corpo:"Inter",system-ui,sans-serif;
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:84px;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--fundo);color:var(--texto);font:400 16px/1.65 var(--corpo);-webkit-font-smoothing:antialiased;overflow-x:hidden}
img,svg{display:block;max-width:100%}
a{color:var(--jade-esc)}
h1,h2,h3{font-family:var(--titulos);color:var(--tinta);margin:0;letter-spacing:-.02em;line-height:1.15}
p{margin:0}
:focus-visible{outline:3px solid var(--violeta);outline-offset:3px;border-radius:6px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.pular{position:absolute;left:12px;top:-60px;background:var(--tinta);color:#fff;padding:10px 14px;border-radius:8px;z-index:100}
.pular:focus{top:12px}
.faixa{width:min(1180px,100%);margin:0 auto;padding:0 24px}
.faixa-estreita{width:min(860px,100%)}

/* botões */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;min-height:46px;padding:10px 20px;border-radius:12px;border:1.5px solid transparent;
  font:600 .98rem/1.2 var(--corpo);text-decoration:none;cursor:pointer;transition:transform .15s,box-shadow .15s,background .15s;white-space:nowrap}
.btn:hover{transform:translateY(-1px)}
.btn-grande{min-height:54px;padding:14px 26px;font-size:1.03rem}
.btn-bloco{width:100%}
.btn-jade{background:var(--jade);color:var(--tinta);box-shadow:0 10px 24px -12px rgba(20,184,160,.9)}
.btn-jade:hover{background:#1FC9AF}
.btn-contorno{border-color:#C9D1E0;color:var(--tinta);background:#fff}
.btn-contorno:hover{border-color:var(--tinta)}
.btn-whats{background:#1FAF57;color:#fff}
.btn-whats:hover{background:#18994B}
.btn:disabled{opacity:.6;cursor:wait;transform:none}

/* topo */
.topo{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.86);backdrop-filter:saturate(1.4) blur(12px);-webkit-backdrop-filter:saturate(1.4) blur(12px);
  border-bottom:1px solid transparent;transition:border-color .2s,box-shadow .2s}
.topo.rolou{border-color:var(--linha);box-shadow:0 6px 24px -18px rgba(16,25,53,.4)}
.topo .faixa{display:flex;align-items:center;justify-content:space-between;gap:20px;min-height:72px}
.marca img{height:34px;width:auto}
.menu{display:flex;align-items:center;gap:26px}
.menu a{color:var(--tinta);text-decoration:none;font-weight:500;font-size:.96rem}
.menu a:not(.btn):hover{color:var(--jade-esc)}
.menu .menu-cta{min-height:42px;padding:8px 18px;color:var(--tinta)}
.menu-botao{display:none;width:44px;height:44px;border:1px solid var(--linha);background:#fff;border-radius:10px;cursor:pointer;flex-direction:column;justify-content:center;align-items:center;gap:5px}
.menu-botao span:not(.sr){display:block;width:18px;height:2px;background:var(--tinta);border-radius:2px}

/* hero */
.hero{position:relative;overflow:hidden;padding:72px 0 84px;background:
  radial-gradient(900px 480px at 88% 8%,rgba(99,102,241,.13),transparent 60%),
  radial-gradient(700px 420px at 70% 92%,rgba(20,184,160,.14),transparent 60%),#fff}
.hero-grade{display:grid;grid-template-columns:minmax(0,1.02fr) minmax(0,1fr);gap:56px;align-items:center}
.sobretitulo{display:inline-flex;align-items:center;gap:8px;font:600 .8rem/1.3 var(--corpo);letter-spacing:.08em;text-transform:uppercase;color:var(--jade-esc);margin-bottom:14px}
.sobretitulo::before{content:"";width:18px;height:3px;border-radius:3px;background:linear-gradient(90deg,var(--jade),var(--violeta))}
.hero h1{font-size:clamp(2.1rem,4.4vw,3.45rem);font-weight:800;letter-spacing:-.035em}
.hero .lead{margin-top:20px;font-size:1.14rem;color:var(--suave);max-width:36em}
.hero-acoes{display:flex;flex-wrap:wrap;gap:12px;margin-top:30px}
.hero-nota{margin-top:14px;font-size:.9rem;color:var(--suave)}
.hero-visual{position:relative;padding:18px 10px 34px 22px}
.janela{background:#fff;border-radius:18px;box-shadow:var(--sombra),0 0 0 1px rgba(16,25,53,.06);overflow:hidden;transform:rotate(-1.2deg)}
.janela-barra{display:flex;align-items:center;gap:6px;padding:11px 14px;background:#F2F4F9;border-bottom:1px solid var(--linha)}
.janela-barra i{width:10px;height:10px;border-radius:50%;background:#D5DBE6}
.janela-barra span{margin-left:10px;flex:1;background:#fff;border-radius:7px;padding:3px 10px;font-size:.72rem;color:var(--suave)}
.janela-site{padding:14px 16px 18px;font-size:.7rem}
.ms-topo{display:flex;align-items:center;gap:10px;padding-bottom:12px}
.ms-topo b{font:700 .85rem var(--titulos);color:#0E4D6E;margin-right:auto}
.ms-topo span{width:34px;height:6px;border-radius:4px;background:#E4E8F0}
.ms-topo em{font-style:normal;background:#1FAF57;color:#fff;border-radius:6px;padding:3px 8px;font-weight:600}
.ms-hero{display:grid;grid-template-columns:1.1fr 1fr;gap:12px;align-items:center;background:linear-gradient(135deg,#0E4D6E,#13708F);color:#fff;border-radius:12px;padding:18px}
.ms-hero strong{display:block;font:700 1.02rem/1.25 var(--titulos)}
.ms-hero p{margin:8px 0 12px;opacity:.85;line-height:1.5}
.ms-hero em{font-style:normal;background:#F4B63B;color:#2B1D00;border-radius:6px;padding:5px 10px;font-weight:700;display:inline-block}
.ms-foto{aspect-ratio:4/3;border-radius:10px;background:
  linear-gradient(160deg,rgba(255,255,255,.18),transparent 55%),
  repeating-linear-gradient(90deg,rgba(255,255,255,.22) 0 10px,transparent 10px 16px) 22% 38%/56% 26% no-repeat,
  linear-gradient(180deg,#9ED3E4,#5FA9C4)}
.ms-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:12px}
.ms-cards span{height:54px;border-radius:10px;background:#F2F5FA;border-top:3px solid #F4B63B}
.flutua{position:absolute;display:flex;align-items:center;gap:10px;background:#fff;border-radius:14px;padding:11px 14px;box-shadow:0 16px 36px -16px rgba(16,25,53,.45),0 0 0 1px rgba(16,25,53,.05);font-size:.82rem;line-height:1.3}
.flutua b{display:block;color:var(--tinta)}
.flutua small{color:var(--suave)}
.flutua-1{left:-6px;bottom:2px;animation:sobe 5s ease-in-out infinite}
.flutua-2{right:-4px;top:2px;color:var(--jade-esc);animation:sobe 5s ease-in-out 1.2s infinite}
.flutua-2 b{color:var(--tinta)}
.ponto{width:10px;height:10px;border-radius:50%;background:var(--jade);box-shadow:0 0 0 5px rgba(20,184,160,.18);flex:none}
@keyframes sobe{50%{transform:translateY(-6px)}}
@media (prefers-reduced-motion:reduce){.flutua{animation:none}html{scroll-behavior:auto}.btn:hover{transform:none}}

/* faixa de confiança */
.confianca{border-block:1px solid var(--linha);background:var(--fundo-2)}
.confianca ul{list-style:none;display:flex;flex-wrap:wrap;justify-content:space-between;gap:14px 26px;padding-block:20px;margin:0 auto}
.confianca li{display:flex;align-items:center;gap:10px;font-weight:600;color:var(--tinta-2);font-size:.95rem}
.confianca svg{width:22px;height:22px;fill:none;stroke:var(--jade-esc);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}

/* seções */
.secao{padding:96px 0}
.secao-clara{background:var(--fundo-2)}
.secao h2{font-size:clamp(1.65rem,3vw,2.35rem);font-weight:700;max-width:24em}
.intro{margin-top:16px;color:var(--suave);font-size:1.06rem;max-width:44em}
.passos{list-style:none;padding:0;margin:44px 0 0;display:grid;grid-template-columns:repeat(4,1fr);gap:20px;counter-reset:p}
.passos li{position:relative;padding:26px 22px 24px;border:1px solid var(--linha);border-radius:var(--raio);background:#fff}
.passos li:not(:last-child)::after{content:"";position:absolute;top:44px;right:-21px;width:22px;height:2px;background:linear-gradient(90deg,var(--jade),var(--violeta));opacity:.5}
.num{display:inline-grid;place-items:center;width:38px;height:38px;border-radius:11px;background:var(--tinta);color:#fff;font:700 1rem var(--titulos);margin-bottom:16px}
.passos h3{font-size:1.08rem;margin-bottom:8px}
.passos p{color:var(--suave);font-size:.95rem}

.segmentos{list-style:none;padding:0;margin:44px 0 0;display:grid;grid-template-columns:repeat(5,1fr);gap:16px}
.seg{background:#fff;border:1px solid var(--linha);border-radius:var(--raio);padding:22px 20px;transition:border-color .2s,transform .2s,box-shadow .2s}
.seg:hover{border-color:#C4CCDD;transform:translateY(-2px);box-shadow:0 14px 30px -22px rgba(16,25,53,.5)}
.seg h3{font-size:1rem;margin:14px 0 6px}
.seg p{font-size:.88rem;color:var(--suave);line-height:1.55}
.seg-ico{display:block;width:40px;height:40px;border-radius:12px;background:var(--c,var(--jade));position:relative;overflow:hidden}
.seg-ico::after{content:"";position:absolute;inset:0;background:var(--c2,var(--violeta));clip-path:polygon(55% 0,100% 0,100% 100%,20% 100%);opacity:.85}
.seg-servicos{--c:#14B8A0;--c2:#0E7490}.seg-comercio{--c:#F59E0B;--c2:#DC2626}.seg-escola{--c:#22C55E;--c2:#2563EB}
.seg-industria{--c:#64748B;--c2:#1E3A8A}.seg-contabilidade{--c:#0EA5E9;--c2:#1E3A8A}.seg-advocacia{--c:#78716C;--c2:#1C1917}
.seg-saude{--c:#2DD4BF;--c2:#0284C7}.seg-construcao{--c:#FACC15;--c2:#1F2937}.seg-solar{--c:#FBBF24;--c2:#F97316}.seg-estetica{--c:#F9A8D4;--c2:#9D174D}

.secao-escura{background:var(--tinta);color:#C9D0E2;position:relative;overflow:hidden}
.secao-escura::before{content:"";position:absolute;right:-340px;top:-230px;width:460px;height:460px;opacity:.7;background:
  linear-gradient(115deg,transparent 0 30%,rgba(20,184,160,.25) 30% 52%,transparent 52%),
  linear-gradient(65deg,transparent 0 46%,rgba(99,102,241,.28) 46% 68%,transparent 68%);pointer-events:none}
.secao-escura h2{color:#fff}
.secao-escura .intro{color:#AEB7CF}
.secao-escura .sobretitulo{color:#5EE0CB}
.recursos-grade{display:grid;grid-template-columns:1fr 1.1fr;gap:56px;align-items:center;position:relative}
.checks{list-style:none;padding:0;margin:0;display:grid;gap:12px}
.checks li{position:relative;padding-left:34px;line-height:1.5}
.checks li::before{content:"";position:absolute;left:0;top:1px;width:22px;height:22px;border-radius:7px;background:var(--jade) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='m6 12.5 4 4 8-9' fill='none' stroke='%23101935' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/15px no-repeat}
.recursos-grade .checks{grid-template-columns:1fr 1fr;gap:16px 24px;color:#E7EBF5}

/* planos */
.planos{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:48px;align-items:stretch}
.plano{position:relative;display:flex;flex-direction:column;background:#fff;border:1px solid var(--linha);border-radius:20px;padding:32px 28px 28px}
.plano h3{font-size:1.25rem}
.plano-destaque{border:2px solid var(--jade);box-shadow:0 30px 60px -34px rgba(20,184,160,.75);background:linear-gradient(180deg,#F3FCFA,#fff 38%)}
.selo{position:absolute;top:-13px;left:28px;background:var(--tinta);color:#fff;font:600 .74rem/1 var(--corpo);letter-spacing:.06em;text-transform:uppercase;border-radius:999px;padding:7px 12px}
.preco{margin-top:14px;font:800 2.7rem/1 var(--titulos);color:var(--tinta);letter-spacing:-.03em}
.preco .rs{font-size:1.05rem;font-weight:700;vertical-align:top;margin-right:3px;position:relative;top:6px}
.preco .mes{font:500 .98rem var(--corpo);color:var(--suave);letter-spacing:0;margin-left:3px}
.implantacao{margin-top:8px;font-size:.9rem;color:var(--suave)}
.checks-plano{margin:24px 0 28px;flex:1;font-size:.95rem;align-content:start}
.comparar{margin-top:32px;border:1px solid var(--linha);border-radius:var(--raio);background:#fff}
.comparar summary{cursor:pointer;padding:18px 22px;font-weight:600;color:var(--tinta);list-style:none;display:flex;justify-content:space-between;align-items:center}
.comparar summary::-webkit-details-marker{display:none}
.comparar summary::after{content:"+";font:400 1.5rem/1 var(--corpo);color:var(--jade-esc)}
.comparar[open] summary::after{content:"–"}
.tabela-rolagem{overflow-x:auto;padding:0 22px 18px}
.comparar table{width:100%;border-collapse:collapse;font-size:.93rem;min-width:520px}
.comparar th,.comparar td{padding:11px 10px;border-top:1px solid var(--linha);text-align:center}
.comparar th[scope=row],.comparar thead th:first-child{text-align:left;font-weight:500;color:var(--texto)}
.comparar thead th{font:700 .92rem var(--titulos);color:var(--tinta);border-top:0}
.sim{color:var(--jade-esc);font-weight:700}
.nao{color:#B4BBC9}
.nota-planos{margin-top:18px;font-size:.88rem;color:var(--suave)}

/* dúvidas */
.faq{margin-top:34px;display:grid;gap:12px}
.faq details{background:#fff;border:1px solid var(--linha);border-radius:14px}
.faq summary{cursor:pointer;padding:18px 22px;font-weight:600;color:var(--tinta);list-style:none;display:flex;justify-content:space-between;gap:16px}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";font:400 1.4rem/1 var(--corpo);color:var(--jade-esc);flex:none}
.faq details[open] summary::after{content:"–"}
.faq details p{padding:0 22px 20px;color:var(--suave)}

/* contato */
.contato{background:linear-gradient(180deg,#fff,var(--jade-claro))}
.contato-grade{display:grid;grid-template-columns:.9fr 1.1fr;gap:56px;align-items:start}
.contato-texto .btn{margin-top:26px}
.contato-form{background:#fff;border:1px solid var(--linha);border-radius:20px;padding:30px;box-shadow:var(--sombra)}
.campos{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-bottom:22px}
.campos label{display:grid;gap:6px;font-weight:600;font-size:.88rem;color:var(--tinta)}
.campos .c2{grid-column:1/-1}
.campos input,.campos select,.campos textarea{width:100%;font:400 1rem var(--corpo);color:var(--texto);background:#fff;border:1.5px solid #D3DAE6;border-radius:11px;padding:11px 13px;min-height:48px}
.campos textarea{resize:vertical;min-height:96px}
.campos input:focus,.campos select:focus,.campos textarea:focus{outline:none;border-color:var(--jade);box-shadow:0 0 0 4px rgba(20,184,160,.18)}
.mel{position:absolute!important;left:-9999px}
.nota-form{margin-top:12px;font-size:.84rem;color:var(--suave)}
.retorno{margin-top:12px;font-weight:600;min-height:1.4em}
.retorno.ok{color:var(--jade-esc)}
.retorno.erro{color:#B42318}

/* rodapé */
.rodape{background:var(--tinta);color:#AEB7CF;padding:38px 0;font-size:.92rem}
.rodape-grade{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:18px}
.rodape img{height:30px;width:auto;margin-bottom:10px}
.rodape a{color:#E7EBF5}

/* responsivo */
@media (max-width:1080px){
  .segmentos{grid-template-columns:repeat(3,1fr)}
  .passos{grid-template-columns:repeat(2,1fr)}
  .passos li::after{display:none}
}
@media (max-width:900px){
  .hero{padding:44px 0 60px}
  .hero-grade,.recursos-grade,.contato-grade{grid-template-columns:1fr;gap:40px}
  .hero-visual{max-width:560px}
  .planos{grid-template-columns:1fr;max-width:520px}
  .menu-botao{display:flex}
  .menu{position:absolute;left:0;right:0;top:100%;flex-direction:column;align-items:stretch;gap:0;background:#fff;border-bottom:1px solid var(--linha);
    padding:8px 24px 18px;box-shadow:0 18px 30px -20px rgba(16,25,53,.4);display:none}
  .menu.aberto{display:flex}
  .menu a{padding:12px 0;border-bottom:1px solid var(--linha)}
  .menu .menu-cta{margin-top:12px;border:0}
  .secao{padding:72px 0}
}
@media (max-width:620px){
  .faixa{padding:0 16px}
  .segmentos{grid-template-columns:1fr 1fr;gap:12px}
  .seg{padding:18px 16px}
  .passos{grid-template-columns:1fr}
  .recursos-grade .checks{grid-template-columns:1fr}
  .campos{grid-template-columns:1fr}
  .contato-form{padding:22px 18px}
  .hero-acoes .btn{width:100%}
  .confianca ul{justify-content:flex-start}
  .flutua-1{left:0}.flutua-2{right:0}
  .ms-hero{grid-template-columns:1fr}.ms-foto{display:none}
}
@media (max-width:400px){.segmentos{grid-template-columns:1fr}}

/* política */
.texto-legal h1{font-size:clamp(1.8rem,3.4vw,2.4rem);margin-bottom:18px}
.texto-legal h2{font-size:1.2rem;margin:30px 0 8px}
.texto-legal p{color:var(--suave);margin-top:10px}