/* Marca Filipe: indigo #2B2F6E, roxo #8A8FEA, creme #F2EFE9, preto #0B0B0B (contraste pontual). Unbounded nos títulos, Fira Sans no texto. */
:root {
  --preto:#0B0B0B; --creme:#F2EFE9; --branco:#fff; --indigo:#2B2F6E; --indigo-fundo:#22265B; --roxo:#8A8FEA; --roxo-claro:#B9BDF7; --lilas:#E7E8FB;
  --f-display:"Unbounded","Arial Black",Arial,sans-serif; --f-corpo:"Fira Sans","Helvetica Neue",Arial,sans-serif;
  --gutter:max(16px,5vw); --largura:1160px; --secao:clamp(72px,10vw,132px);
}
.t-creme { --bg:var(--creme); --fg:var(--preto); --titulo:var(--indigo); --muted:#4A4B6B; --accent:var(--indigo); --rule:rgba(43,47,110,.16); --card:#fff; --btn-bg:var(--indigo); --btn-fg:var(--creme); --btn-hover:var(--roxo); --btn-hover-fg:var(--preto); }
.t-lilas { --bg:var(--lilas); --fg:var(--preto); --titulo:var(--indigo); --muted:#44456A; --accent:var(--indigo); --rule:rgba(43,47,110,.18); --card:#fff; --btn-bg:var(--indigo); --btn-fg:var(--creme); --btn-hover:var(--roxo); --btn-hover-fg:var(--preto); }
.t-indigo { --bg:var(--indigo); --fg:var(--creme); --titulo:var(--branco); --muted:#D6D8F6; --accent:var(--roxo-claro); --rule:rgba(242,239,233,.24); --card:rgba(255,255,255,.08); --btn-bg:var(--creme); --btn-fg:var(--indigo); --btn-hover:var(--roxo); --btn-hover-fg:var(--preto); }
.t-preto { --bg:var(--preto); --fg:var(--creme); --titulo:var(--branco); --muted:#B5B5C4; --accent:var(--roxo); --rule:rgba(242,239,233,.2); --btn-bg:var(--creme); --btn-fg:var(--indigo); --btn-hover:var(--roxo); --btn-hover-fg:var(--preto); }

*,*::before,*::after { box-sizing:border-box; }
html { -webkit-text-size-adjust:100%; scroll-behavior:smooth; }
body { margin:0; background:var(--creme); color:var(--preto); font-family:var(--f-corpo); font-size:18px; line-height:1.55; -webkit-font-smoothing:antialiased; }
@media (min-width:1024px){ body{font-size:19px;} }
img,svg { max-width:100%; display:block; }
a { color:inherit; }
h1,h2,h3,p,ol,ul,figure { margin:0; } ol,ul { padding:0; list-style:none; }
.skip { position:absolute; left:16px; top:-60px; z-index:100; background:var(--branco); color:var(--indigo); padding:12px 16px; font-weight:700; text-decoration:none; }
.skip:focus { top:16px; }
:focus-visible { outline:3px solid var(--roxo); outline-offset:3px; }
.secao { background:var(--bg); color:var(--fg); padding-block:var(--secao); position:relative; overflow:hidden; }
.wrap { width:100%; max-width:calc(var(--largura) + 2*var(--gutter)); margin-inline:auto; padding-inline:var(--gutter); position:relative; z-index:1; }

.display { font-family:var(--f-display); text-transform:uppercase; letter-spacing:-.02em; color:var(--titulo); text-wrap:balance; }
.etiqueta { display:inline-flex; align-items:center; gap:10px; font-weight:700; font-size:13px; letter-spacing:.16em; text-transform:uppercase; color:var(--accent); }
.etiqueta::before { content:""; width:28px; height:3px; border-radius:2px; background:linear-gradient(90deg,var(--roxo),var(--indigo)); }
.t-indigo .etiqueta::before, .t-preto .etiqueta::before { background:var(--roxo); }
.sec-t { font-weight:800; font-size:clamp(1.55rem,4vw,2.9rem); line-height:1.05; margin-top:14px; max-width:24ch; }
.lead { font-size:clamp(1.1rem,1.6vw,1.3rem); max-width:52ch; }

.btn { display:inline-flex; align-items:center; justify-content:center; gap:10px; min-height:56px; padding:0 30px; background:var(--btn-bg); color:var(--btn-fg); border:2px solid var(--btn-bg); border-radius:999px; font-family:var(--f-display); font-weight:700; font-size:14px; letter-spacing:.02em; text-transform:uppercase; text-decoration:none; cursor:pointer; box-shadow:0 10px 28px -12px rgba(43,47,110,.6); transition:background-color .15s ease,color .15s ease,transform .15s ease; }
.btn:hover { background:var(--btn-hover); border-color:var(--btn-hover); color:var(--btn-hover-fg); transform:translateY(-2px); }
.btn-sm { min-height:44px; padding:0 18px; font-size:11px; white-space:nowrap; }
.link { display:inline-flex; align-items:center; min-height:44px; font-weight:600; text-decoration:underline; text-decoration-thickness:2px; text-underline-offset:6px; }
.apoio { margin-top:14px; font-size:15px; color:var(--muted); max-width:60ch; }
.apoio a { color:inherit; }

/* Hero */
.hero { background:radial-gradient(900px 520px at 85% 15%,rgba(138,143,234,.45),transparent 60%),radial-gradient(700px 500px at 0% 100%,rgba(138,143,234,.25),transparent 60%),linear-gradient(160deg,#2B2F6E 0%,#232760 55%,#1D2152 100%); padding-block:0 clamp(56px,8vw,104px); }
.topo { display:flex; align-items:center; justify-content:space-between; gap:16px; padding-block:18px; }
.marca { font-family:var(--f-display); font-weight:800; font-size:13px; text-transform:uppercase; color:var(--branco); text-decoration:none; display:inline-flex; align-items:center; gap:10px; min-height:44px; }
.marca img { width:30px; height:30px; border-radius:6px; }
.hero-grid { display:grid; gap:44px; padding-top:clamp(28px,6vw,72px); align-items:center; }
@media (min-width:960px){ .hero-grid { grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr); gap:56px; } }
.hero h1 { font-weight:800; font-size:clamp(1.6rem,3.7vw,2.8rem); line-height:1.06; margin-top:18px; }
.hero h1 em { font-style:normal; color:var(--roxo-claro); }
.hero .lead { margin-top:22px; color:var(--creme); }
.hero-acoes { display:flex; flex-wrap:wrap; align-items:center; gap:12px 28px; margin-top:30px; }
.direta { margin-top:30px; max-width:62ch; padding:18px 20px; border-radius:14px; background:rgba(255,255,255,.08); border:1px solid rgba(185,189,247,.35); font-size:1rem; color:var(--creme); }

/* Conversa ilustrativa (celular) */
.celular { position:relative; max-width:360px; margin-inline:auto; width:100%; border-radius:30px; padding:14px; background:linear-gradient(180deg,rgba(255,255,255,.16),rgba(255,255,255,.05)); border:1px solid rgba(185,189,247,.5); box-shadow:0 30px 70px -30px rgba(0,0,0,.6),0 0 0 8px rgba(138,143,234,.12); }
.cel-topo { display:flex; align-items:center; gap:10px; padding:6px 6px 14px; color:var(--branco); font-weight:600; font-size:14px; }
.cel-topo i { width:34px; height:34px; border-radius:50%; background:linear-gradient(135deg,var(--roxo),var(--indigo)); display:grid; place-items:center; }
.cel-topo i svg { width:18px; height:18px; color:#fff; }
.cel-topo small { display:block; font-weight:400; font-size:12px; color:var(--roxo-claro); }
.balao { max-width:86%; padding:10px 14px; margin-top:10px; border-radius:16px; font-size:15px; line-height:1.35; }
.balao.in { background:var(--creme); color:var(--preto); border-bottom-left-radius:4px; }
.balao.out { margin-left:auto; background:var(--roxo); color:var(--preto); border-bottom-right-radius:4px; }
.balao small { display:block; margin-top:4px; font-size:12px; color:#2A2B50; }
.cel-nota { margin-top:14px; font-size:12px; color:var(--roxo-claro); text-align:center; }
.js .balao { animation:sobe .6s ease both; } .js .balao:nth-of-type(2){animation-delay:.5s} .js .balao:nth-of-type(3){animation-delay:1s} .js .balao:nth-of-type(4){animation-delay:1.5s}
@keyframes sobe { from{opacity:0;transform:translateY(10px)} to{opacity:1;transform:none} }

/* Cartões com ícone */
.grade { display:grid; gap:18px; margin-top:clamp(32px,5vw,56px); }
@media (min-width:760px){ .grade.c3 { grid-template-columns:repeat(3,minmax(0,1fr)); } .grade.c2 { grid-template-columns:repeat(2,minmax(0,1fr)); } .grade.c5 { grid-template-columns:repeat(6,minmax(0,1fr)); } .grade.c5 > li { grid-column:span 2; } .grade.c5 > li:nth-child(4){grid-column:2 / span 2} .grade.c5 > li:nth-child(5){grid-column:4 / span 2} }
.cartao { background:var(--card); border-radius:20px; padding:26px 24px 28px; border:1px solid var(--rule); border-top:5px solid var(--roxo); }
.t-indigo .cartao { backdrop-filter:blur(2px); }
.cartao h3 { font-family:var(--f-corpo); font-weight:700; font-size:clamp(1.1rem,1.8vw,1.3rem); line-height:1.2; margin:14px 0 8px; color:var(--titulo); }
.cartao p { color:inherit; } .t-creme .cartao p, .t-lilas .cartao p { color:#26273F; }
.icone { width:52px; height:52px; border-radius:16px; display:grid; place-items:center; background:linear-gradient(135deg,var(--roxo),var(--indigo)); color:#fff; box-shadow:0 10px 24px -10px rgba(43,47,110,.7); }
.icone svg { width:26px; height:26px; }
.t-indigo .icone { background:linear-gradient(135deg,var(--roxo),#5d62c9); }
.fecho-t { margin-top:clamp(28px,4vw,48px); font-family:var(--f-display); font-weight:800; text-transform:uppercase; line-height:1.2; font-size:clamp(1.05rem,2.2vw,1.55rem); color:var(--titulo); max-width:36ch; text-wrap:balance; }
.nota-regra { margin-top:26px; padding:18px 20px; border-radius:14px; max-width:72ch; font-size:16px; background:rgba(255,255,255,.1); border:1px solid rgba(185,189,247,.45); }
.nota-regra b { color:var(--branco); }

/* Passos */
.passos-l { margin-top:clamp(30px,5vw,56px); display:grid; gap:14px; counter-reset:p; }
.passos-l li { counter-increment:p; display:grid; grid-template-columns:56px 1fr; gap:6px 18px; padding:20px; align-items:center; background:var(--card); border:1px solid var(--rule); border-radius:18px; }
.passos-l li::before { content:counter(p); width:48px; height:48px; border-radius:50%; display:grid; place-items:center; font-family:var(--f-display); font-weight:800; font-size:1.2rem; background:var(--roxo); color:var(--preto); }
.passos-l strong { color:var(--titulo); }

/* Prova */
.prova-cards { display:grid; gap:18px; margin-top:clamp(28px,4vw,48px); }
@media (min-width:760px){ .prova-cards { grid-template-columns:repeat(2,minmax(0,1fr)); } }
.prova-cards .cartao h3 { font-family:var(--f-display); text-transform:uppercase; font-size:1.05rem; margin-top:0; }
.prova-t { font-family:var(--f-display); font-weight:800; text-transform:uppercase; line-height:1.2; font-size:clamp(1.05rem,2.4vw,1.6rem); max-width:38ch; margin-top:26px; color:var(--titulo); text-wrap:balance; }

/* Quem é */
.bio { display:grid; gap:36px; margin-top:26px; align-items:center; }
.bio p + p { margin-top:1.1em; } .bio p { max-width:62ch; }
.bio figure { position:relative; max-width:340px; }
.bio figure::before { content:""; position:absolute; inset:14px -14px -14px 14px; border-radius:24px; background:linear-gradient(135deg,var(--roxo),transparent); z-index:0; }
.bio img { position:relative; z-index:1; width:100%; height:auto; aspect-ratio:1/1; object-fit:cover; object-position:50% 45%; border-radius:24px; }
@media (min-width:800px){ .bio { grid-template-columns:minmax(0,1fr) 340px; gap:64px; } }

/* FAQ */
.faq { margin-top:clamp(28px,4vw,48px); display:grid; gap:12px; max-width:920px; }
.faq details { background:var(--card); border:1px solid var(--rule); border-radius:16px; }
.faq summary { display:flex; align-items:center; justify-content:space-between; gap:20px; min-height:44px; padding:20px 22px; cursor:pointer; list-style:none; font-family:var(--f-display); font-weight:700; font-size:clamp(.95rem,1.9vw,1.2rem); line-height:1.25; text-transform:uppercase; color:var(--titulo); }
.faq summary::-webkit-details-marker { display:none; }
.faq summary::after { content:"+"; flex-shrink:0; width:34px; height:34px; border-radius:50%; display:grid; place-items:center; background:var(--roxo); color:var(--preto); font-size:1.4rem; line-height:1; transition:transform .2s ease; }
.faq details[open] summary::after { transform:rotate(45deg); }
.faq details p { padding:0 22px 24px; max-width:64ch; color:#26273F; }

/* CTA final */
.final { background:radial-gradient(800px 420px at 90% 0%,rgba(138,143,234,.55),transparent 60%),linear-gradient(135deg,#2B2F6E,#3a3fa0 60%,#6a70d8); padding-block:clamp(80px,12vw,150px); }
.final h2 { font-weight:900; font-size:clamp(1.9rem,5.6vw,4.2rem); line-height:1; max-width:17ch; margin-top:16px; }
.final .lead { margin-top:24px; color:var(--creme); }
.final .btn { box-shadow:0 14px 34px -10px rgba(0,0,0,.5); }

/* Obrigado */
.obrigado .check { width:72px; height:72px; border-radius:50%; display:grid; place-items:center; background:linear-gradient(135deg,var(--roxo),#5d62c9); margin-bottom:22px; color:#fff; box-shadow:0 0 0 10px rgba(138,143,234,.2); }
.obrigado .check svg { width:36px; height:36px; }

/* Rodapé (preto como contraste pontual) */
.rodape { background:var(--preto); color:var(--creme); padding-block:48px; font-size:15px; }
.rodape-linha { display:flex; flex-wrap:wrap; justify-content:space-between; gap:12px 40px; }
.rodape nav { display:flex; flex-wrap:wrap; gap:2px 22px; }
.rodape nav a, .linkbtn { display:inline-flex; align-items:center; min-height:44px; color:var(--creme); }
.rodape nav a:hover, .linkbtn:hover { color:var(--roxo); }
.linkbtn { background:none; border:0; padding:0; font:inherit; cursor:pointer; text-decoration:underline; }
.rodape .legal { margin-top:18px; font-size:13px; max-width:80ch; color:#B5B5C4; } .rodape .legal a { color:var(--creme); }
.rodape small { display:block; margin-top:18px; font-size:13px; color:#B5B5C4; }

@media (prefers-reduced-motion:reduce){ html{scroll-behavior:auto} .js .balao{animation:none} .btn,.faq summary::after{transition:none} }

/* Seletor de ramo (/diagnostico-ia/) */
.escolha { display:grid; gap:16px; margin-top:clamp(28px,4vw,48px); }
@media (min-width:760px){ .escolha { grid-template-columns:repeat(2,minmax(0,1fr)); gap:20px; } }
@media (min-width:1100px){ .escolha { grid-template-columns:repeat(3,minmax(0,1fr)); } }
.card-n { display:flex; flex-direction:column; gap:10px; height:100%; padding:26px 24px 28px; background:#fff; border:1px solid var(--rule); border-top:5px solid var(--roxo); border-radius:20px; text-decoration:none; color:var(--preto); transition:background-color .15s ease,color .15s ease,transform .15s ease; }
a.card-n:hover { background:var(--indigo); color:var(--creme); transform:translateY(-3px); }
a.card-n:hover h3 { color:#fff; }
.card-n h3 { font-family:var(--f-display); font-weight:800; text-transform:uppercase; font-size:clamp(1rem,2vw,1.2rem); line-height:1.15; color:var(--indigo); }
.card-n p { font-size:1rem; }
.card-n .seta { margin-top:auto; font-family:var(--f-display); font-weight:700; font-size:12px; text-transform:uppercase; color:inherit; text-decoration:underline; text-underline-offset:5px; }
.card-outro { background:var(--lilas); }
.card-outro form { display:grid; gap:10px; }
.card-outro label { font-weight:600; font-size:15px; }
.card-outro input[type=text] { width:100%; height:50px; padding:0 14px; border-radius:12px; border:1.5px solid var(--indigo); background:#fff; color:var(--preto); font:500 17px var(--f-corpo); }
.card-outro input[type=text]:focus { outline:3px solid var(--roxo); }
.card-outro .btn { justify-self:start; }