:root {
  --ink:#173c39;
  --muted:#607975;
  --cream:#f7f4ec;
  --paper:#fffdf8;
  --sage:#8fa99b;
  --sage-light:#dfe9df;
  --terracotta:#c98267;
  --line:rgba(23,60,57,.13);
  --shadow:0 22px 60px rgba(29,60,55,.12);
  --visual:#c98267;
  --auditivo:#668ca0;
  --cinestesico:#85a183;
  --digital:#8b7d9f;
}

* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--cream); color:var(--ink); font-family:"Segoe UI",system-ui,-apple-system,sans-serif; -webkit-font-smoothing:antialiased; }
button { font:inherit; color:inherit; }
button:not(:disabled) { cursor:pointer; }
.topbar { height:76px; padding:0 clamp(20px,6vw,84px); display:flex; align-items:center; justify-content:space-between; border-bottom:1px solid var(--line); background:rgba(247,244,236,.9); backdrop-filter:blur(14px); position:sticky; top:0; z-index:20; }
.brand { color:var(--ink); text-decoration:none; font:26px Georgia,serif; display:flex; gap:9px; align-items:center; }
.brand-mark { width:30px; height:30px; display:grid; place-items:center; border:1px solid var(--ink); border-radius:50%; font-size:24px; }
.back-link { color:var(--ink); text-decoration:none; font-size:13px; font-weight:700; }
main { overflow:hidden; }
.hero { min-height:430px; padding:clamp(58px,9vw,108px) max(24px,calc((100vw - 1232px)/2)); display:grid; grid-template-columns:1.25fr .75fr; align-items:center; gap:55px; background:radial-gradient(circle at 82% 42%,rgba(255,255,255,.58) 0 14%,transparent 14.3%),linear-gradient(140deg,#edf1e8,#eadbd0); }
.eyebrow { margin:0 0 13px; color:var(--terracotta); font-size:10px; font-weight:800; letter-spacing:.17em; }
h1,h2,h3,p { margin-top:0; }
h1 { max-width:780px; margin-bottom:22px; font:400 clamp(48px,7vw,78px)/1 Georgia,serif; letter-spacing:-.035em; }
.hero-copy > p:not(.eyebrow) { max-width:680px; color:var(--muted); font-size:18px; line-height:1.65; }
.hero-notes { display:flex; flex-wrap:wrap; gap:9px; margin-top:24px; }
.hero-notes span { padding:9px 13px; border:1px solid var(--line); border-radius:99px; background:rgba(255,253,248,.6); color:var(--muted); font-size:11px; }
.systems-orbit { justify-self:center; width:240px; height:240px; border:1px solid rgba(23,60,57,.22); border-radius:50%; position:relative; display:grid; place-items:center; }
.systems-orbit::before { content:""; position:absolute; inset:38px; border:1px solid rgba(23,60,57,.15); border-radius:50%; }
.systems-orbit strong { font:400 25px Georgia,serif; z-index:1; }
.systems-orbit > span { position:absolute; width:46px; height:46px; display:grid; place-items:center; border-radius:50%; color:#fff; font:700 17px Georgia,serif; box-shadow:0 8px 25px rgba(23,60,57,.14); }
.orbit-v { top:-7px; left:97px; background:var(--visual); }
.orbit-a { right:-7px; top:97px; background:var(--auditivo); }
.orbit-c { bottom:-7px; left:97px; background:var(--cinestesico); }
.orbit-d { left:-7px; top:97px; background:var(--digital); }
.explanation { max-width:1100px; margin:68px auto 28px; padding:30px; display:grid; grid-template-columns:54px 1fr; gap:20px; border-radius:24px; background:var(--ink); color:white; }
.step-number { width:48px; height:48px; display:grid; place-items:center; border-radius:50%; background:var(--terracotta); font:700 13px Georgia,serif; }
.explanation h2 { margin-bottom:9px; font:400 clamp(28px,4vw,38px)/1.1 Georgia,serif; }
.explanation p:last-child { margin:0; color:#c8d8d3; line-height:1.65; }
.quiz-shell { max-width:1100px; margin:0 auto 70px; border:1px solid var(--line); border-radius:26px; background:var(--paper); overflow:hidden; box-shadow:0 12px 40px rgba(29,60,55,.05); }
.quiz-header { display:flex; align-items:center; justify-content:space-between; gap:28px; padding:22px 28px; border-bottom:1px solid var(--line); background:#fbfaf6; }
.quiz-header .eyebrow { margin-bottom:5px; }
.quiz-header > div > span { color:var(--muted); font-size:12px; }
.progress-track { width:min(340px,42%); height:7px; overflow:hidden; border-radius:99px; background:var(--sage-light); }
.progress-track span { display:block; height:100%; width:20%; border-radius:inherit; background:var(--terracotta); transition:width .3s ease; }
.question-card { padding:clamp(25px,5vw,55px); }
.question-kicker { margin-bottom:8px; color:var(--terracotta); font-size:10px; font-weight:800; letter-spacing:.14em; }
.question-card h2 { max-width:830px; margin-bottom:10px; font:400 clamp(27px,4vw,42px)/1.12 Georgia,serif; }
.selection-hint { color:var(--muted); line-height:1.5; }
.options-list { display:grid; grid-template-columns:1fr 1fr; gap:11px; margin-top:25px; }
.option-button { min-height:88px; display:grid; grid-template-columns:38px 1fr; align-items:center; gap:13px; padding:15px; border:1px solid var(--line); border-radius:15px; background:#fbfaf6; text-align:left; transition:.18s; }
.option-button:hover { border-color:var(--sage); transform:translateY(-2px); }
.option-letter { width:34px; height:34px; display:grid; place-items:center; border-radius:50%; background:var(--sage-light); font-weight:800; font-size:11px; }
.option-button.selected { color:white; background:var(--ink); border-color:var(--ink); }
.option-button.selected .option-letter { background:var(--terracotta); color:white; }
.option-rank { display:block; margin-bottom:4px; color:#d7e3df; font-size:9px; font-weight:800; letter-spacing:.09em; }
.option-button:not(.selected) .option-rank { display:none; }
.option-text { line-height:1.45; }
.quiz-actions { display:flex; align-items:center; justify-content:space-between; gap:16px; margin-top:30px; }
.primary-button,.secondary-button,.text-button { border:0; }
.primary-button { padding:14px 19px; border-radius:99px; background:var(--ink); color:white; font-weight:800; }
.primary-button span { margin-left:10px; }
.primary-button:disabled { opacity:.35; cursor:not-allowed; }
.text-button { padding:10px 0; background:transparent; text-decoration:underline; }
.result-section { max-width:1232px; margin:0 auto 68px; }
.result-heading { max-width:800px; margin-bottom:30px; }
.result-heading h2,.profiles-heading h2,.professional-cta h2 { margin-bottom:13px; font:400 clamp(34px,5vw,52px)/1.05 Georgia,serif; }
.result-heading > p:last-child,.profiles-heading > p:last-child { color:var(--muted); line-height:1.65; }
.result-layout { display:grid; grid-template-columns:1.25fr .75fr; gap:18px; }
.chart-card,.result-summary { min-height:440px; padding:30px; border:1px solid var(--line); border-radius:24px; background:var(--paper); }
.chart-card { display:grid; grid-template-columns:42px 1fr; gap:12px; }
.chart-scale { height:340px; display:flex; flex-direction:column; justify-content:space-between; align-items:flex-end; color:var(--muted); font-size:9px; }
.bar-chart { height:340px; display:grid; grid-template-columns:repeat(4,1fr); align-items:end; gap:20px; border-bottom:1px solid var(--line); background:repeating-linear-gradient(to bottom,var(--line) 0 1px,transparent 1px 85px); }
.bar-item { height:100%; display:flex; flex-direction:column; justify-content:flex-end; align-items:center; }
.bar-value { margin-bottom:8px; font:700 17px Georgia,serif; }
.bar { width:min(72px,68%); min-height:4px; border-radius:10px 10px 0 0; transition:height .7s ease; }
.bar-label { min-height:34px; padding-top:9px; font-size:10px; font-weight:800; text-align:center; }
.result-summary { display:flex; flex-direction:column; align-items:flex-start; }
.primary-system-mark { width:58px; height:58px; display:grid; place-items:center; border-radius:50%; color:white; font:700 24px Georgia,serif; }
.result-summary h3 { margin:14px 0 8px; font:400 34px Georgia,serif; }
.result-summary > p:not(.eyebrow) { color:var(--muted); line-height:1.65; }
.ranking { width:100%; display:grid; gap:7px; margin-top:auto; }
.rank-row { display:grid; grid-template-columns:28px 1fr auto; align-items:center; gap:10px; padding:10px; border-radius:11px; background:#f5f3ec; }
.rank-row span:first-child { width:26px; height:26px; display:grid; place-items:center; border-radius:50%; color:white; font-size:9px; font-weight:800; }
.rank-row strong { font:400 15px Georgia,serif; }
.rank-row b { font-size:12px; }
.profiles-heading { margin-top:58px; }
.profile-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:14px; }
.profile-card { padding:24px; border:1px solid var(--line); border-radius:19px; background:var(--paper); }
.profile-top { display:flex; align-items:center; gap:12px; margin-bottom:13px; }
.profile-icon { width:42px; height:42px; display:grid; place-items:center; border-radius:50%; color:white; font:700 16px Georgia,serif; }
.profile-card h3 { margin:0; font:400 24px Georgia,serif; }
.profile-card > p { color:var(--muted); line-height:1.6; }
.profile-card strong { display:block; margin-bottom:6px; font-size:11px; }
.profile-card ul { margin:0; padding-left:18px; color:var(--muted); font-size:12px; line-height:1.65; }
.result-actions { display:flex; align-items:center; flex-wrap:wrap; gap:15px; margin-top:22px; }
.secondary-button { padding:13px 18px; border-radius:99px; background:var(--ink); color:white; font-weight:800; }
.result-actions > span { margin-left:auto; color:var(--muted); font-size:10px; }
.professional-cta { max-width:1232px; margin:0 auto 28px; padding:clamp(32px,5vw,55px); display:flex; align-items:center; justify-content:space-between; gap:35px; border-radius:28px; background:var(--ink); color:white; }
.professional-cta > div { max-width:720px; }
.professional-cta p:last-child { margin:0; color:#c8d8d3; line-height:1.6; }
.professional-cta > a { flex:0 0 auto; padding:15px 20px; border-radius:99px; background:var(--paper); color:var(--ink); text-decoration:none; font-weight:800; }
.professional-cta > a span { margin-left:10px; }
.disclaimer { max-width:850px; margin:0 auto 80px; padding:0 22px; text-align:center; color:var(--muted); font-size:11px; line-height:1.65; }
.floating-therapist { position:fixed; z-index:30; right:22px; bottom:22px; display:flex; align-items:center; gap:9px; padding:12px 16px; border-radius:99px; background:var(--terracotta); color:white; text-decoration:none; box-shadow:0 12px 35px rgba(80,45,34,.24); font-size:12px; }
.floating-therapist span { font-size:20px; }
footer { padding:28px max(24px,calc((100vw - 1232px)/2)); border-top:1px solid var(--line); display:flex; justify-content:space-between; color:var(--muted); font-size:11px; }
footer p { margin:0; }
footer a { color:var(--ink); text-decoration:none; font:18px Georgia,serif; }

@media (max-width:900px) {
  .hero { grid-template-columns:1fr; }
  .systems-orbit { display:none; }
  .explanation,.quiz-shell,.result-section,.professional-cta { margin-left:18px; margin-right:18px; }
  .result-layout { grid-template-columns:1fr; }
}

@media (max-width:620px) {
  .topbar { height:68px; padding:0 18px; }
  .brand { font-size:22px; }
  .back-link { font-size:0; }
  .back-link::after { content:"← Voltar"; font-size:12px; }
  .hero { min-height:auto; padding:58px 22px; }
  h1 { font-size:48px; }
  .hero-copy > p:not(.eyebrow) { font-size:16px; }
  .explanation { grid-template-columns:1fr; padding:24px; margin-top:28px; }
  .quiz-header { align-items:flex-start; flex-direction:column; }
  .progress-track { width:100%; }
  .question-card { padding:27px 17px; }
  .options-list { grid-template-columns:1fr; }
  .option-button { min-height:76px; }
  .quiz-actions { align-items:stretch; flex-direction:column-reverse; }
  .quiz-actions button { width:100%; }
  .chart-card,.result-summary { min-height:auto; padding:22px 14px; }
  .bar-chart { gap:6px; }
  .bar { width:min(52px,70%); }
  .bar-label { font-size:8px; }
  .profile-grid { grid-template-columns:1fr; }
  .result-actions { align-items:stretch; flex-direction:column; }
  .result-actions > span { margin-left:0; text-align:center; }
  .professional-cta { align-items:stretch; flex-direction:column; }
  .professional-cta > a { text-align:center; }
  .floating-therapist { right:12px; bottom:12px; }
  footer { padding-bottom:84px; flex-direction:column; gap:10px; }
}

@media print {
  .topbar,.floating-therapist,.professional-cta,.quiz-shell,.result-actions { display:none!important; }
  body { background:white; }
  .hero { min-height:auto; padding:20px 0; background:white; }
  .systems-orbit,.explanation { display:none; }
  .result-section[hidden] { display:none!important; }
  .result-section { margin:0; }
  .result-layout { grid-template-columns:1.25fr .75fr; }
  .chart-card,.result-summary,.profile-card { break-inside:avoid; }
  .profile-grid { gap:8px; }
}
