/* Identidade compartilhada; cada marca define seus papéis sem alterar o fluxo. */
:root {
  color-scheme: light;
  --page-bg: #f5f6f7; --surface: #fff; --ink: #202c33; --heading: #093b50;
  --muted: #596b74; --line: #ccd6db; --soft: #eaf3f5;
  --primary: #164e63; --accent: #164e63; --action: #b91f26; --action-hover: #971a20;
  --action-ink: #fff; --focus: #164e63; --panel-start: #164e63; --panel-end: #093b50;
  --panel-detail: #7eb2c2; --panel-text: #fff; --panel-muted: #e3f0f4;
  --panel-cta: #fff; --panel-cta-ink: #093b50;
  --glow: rgba(22,78,99,.08); --shadow: 0 22px 64px rgba(9,59,80,.12),0 3px 10px rgba(9,59,80,.05);
  --card-radius: 28px; --control-radius: 12px; --photo-radius: 100px 14px 14px 14px;
  --font: Arial,Helvetica,sans-serif;
  font-family: var(--font); color: var(--ink); background: var(--page-bg);
}
html[data-theme="bradesco"] {
  --page-bg: #f7f7f8; --ink: #3d3d43; --heading: #3d3d43; --muted: #62646b;
  --line: #d5d8dc; --soft: #fff0f3; --primary: #cc092f; --accent: #cc092f;
  --action: #cc092f; --action-hover: #a60a2a; --focus: #a60a2a;
  --panel-start: #d80a35; --panel-end: #a60a2a; --panel-detail: #ff9db2;
  --panel-muted: #ffedf2; --panel-cta-ink: #a60a2a; --glow: rgba(204,9,47,.06);
  --shadow: 0 22px 58px rgba(67,11,24,.10),0 3px 10px rgba(35,35,39,.05);
  --card-radius: 18px; --control-radius: 8px; --photo-radius: 18px 90px 18px 18px;
  --font: "Helvetica Neue",Helvetica,Arial,sans-serif;
}
html[data-theme="porto"] {
  --page-bg: #f5f7fa; --ink: #252a31; --heading: #073b70; --muted: #53677a;
  --line: #c7d3df; --soft: #eaf7ff; --primary: #00a1fc; --accent: #006fba;
  --action: #006fba; --action-hover: #005e9f; --focus: #006fba;
  --panel-start: #006fad; --panel-end: #00548e; --panel-detail: #66caff;
  --panel-muted: #e1f5ff; --panel-cta-ink: #073b70; --glow: rgba(0,161,252,.10);
  --shadow: 0 22px 58px rgba(7,59,112,.12),0 3px 10px rgba(26,40,53,.05);
  --card-radius: 20px; --control-radius: 8px; --photo-radius: 24px 100px 24px 24px;
  --font: "Helvetica Neue",Helvetica,Arial,sans-serif;
}
html[data-theme="sulamerica"] {
  --page-bg: #f4f6fa; --ink: #20334b; --heading: #00265a; --muted: #53647b;
  --line: #ccd5e1; --soft: #edf3fc; --primary: #ed6b24; --accent: #003778;
  --action: #003778; --action-hover: #00265a; --focus: #003778;
  --panel-start: #003778; --panel-end: #001c49; --panel-detail: #ed6b24;
  --panel-muted: #e1eaff; --panel-cta-ink: #00265a; --glow: rgba(0,55,120,.08);
  --shadow: 0 22px 60px rgba(0,38,90,.13),0 3px 10px rgba(0,38,90,.05);
  --card-radius: 12px; --control-radius: 8px; --photo-radius: 12px;
  --font: "Helvetica Neue",Helvetica,Arial,sans-serif;
}
html[data-theme="unimed"] {
  --page-bg: #f3f8f5; --ink: #234438; --heading: #00543a; --muted: #526b60;
  --line: #bfd4c8; --soft: #e8f6ee; --primary: #00995d; --accent: #007d4d;
  --action: #007d4d; --action-hover: #005d3b; --focus: #007d4d;
  --panel-start: #00754b; --panel-end: #004d36; --panel-detail: #79d4a5;
  --panel-muted: #e0f5e9; --panel-cta-ink: #00543a; --glow: rgba(0,153,93,.08);
  --shadow: 0 22px 60px rgba(0,84,58,.11),0 3px 10px rgba(0,84,58,.04);
  --card-radius: 32px; --control-radius: 16px; --photo-radius: 100px 24px 100px 24px;
  --font: "Trebuchet MS","Avenir Next",Arial,sans-serif;
}
* {box-sizing: border-box;}
body {margin:0; min-width:320px; background:radial-gradient(ellipse at 95% 12%,var(--glow),transparent 38rem),var(--page-bg);}
button,input,select,textarea {font:inherit;}
button,a,input,select,textarea {touch-action:manipulation;}
button {cursor:pointer;}
button,.cta {min-height:48px; border-radius:var(--control-radius); padding:16px 24px; border:0; background:var(--action); color:var(--action-ink); font-weight:700; text-decoration:none; display:inline-flex; align-items:center; justify-content:center; line-height:1.3; transition:background .16s,box-shadow .16s;}
button:hover,.cta:hover {background:var(--action-hover);}
button:disabled {cursor:wait; opacity:.7;}
:focus-visible {outline:3px solid var(--focus); outline-offset:4px;}
header {max-width:1180px; min-height:96px; margin:auto; padding:20px 0; display:flex; align-items:center; gap:24px; border-bottom:1px solid var(--line);}
header>a {display:flex; flex-shrink:0; align-items:center; min-height:48px;}
header>a img {display:block; width:190px; max-width:100%; height:auto;}
#partner {display:flex; align-items:center; min-height:42px; font-weight:700; font-size:14px; color:var(--heading); border-left:1px solid var(--line); padding-left:24px;}
#partner img {display:block; width:140px; height:52px; object-fit:contain; background:#fff; border-radius:4px;}
.secure {margin-left:auto; font-size:12px; color:var(--muted); font-weight:600;}
h1,h2,h3 {color:var(--heading);}
h1 {font-size:clamp(38px,4.2vw,60px); line-height:1.08; letter-spacing:-.045em; margin:24px 0; font-weight:750;}
h2 {font-size:clamp(28px,3vw,40px); line-height:1.12; letter-spacing:-.035em;}
h3 {font-size:21px; line-height:1.25; letter-spacing:-.02em;}
p {line-height:1.65; color:var(--muted);}
.eyebrow {text-transform:uppercase; letter-spacing:.14em; font-size:11px; line-height:1.5; font-weight:750; color:var(--accent);}
.hero {max-width:1180px; margin:36px auto 72px; display:grid; grid-template-columns:1.08fr 1fr; gap:64px; align-items:center;}
.hero>div:first-child {padding:16px 0;}
.hero h1::after {content:""; display:block; width:60px; height:4px; margin-top:26px; background:var(--primary); border-radius:4px;}
.hero p {font-size:17px; max-width:520px;}
.hero .small {font-size:13px; margin-top:16px;}
.hero-visual {position:relative; min-width:0; padding:24px 24px 12px; background:linear-gradient(145deg,var(--panel-start),var(--panel-end)); border-radius:var(--card-radius); overflow:hidden; isolation:isolate;}
.hero-visual::before,.quote-sidebar::before {position:absolute; content:""; width:300px; height:300px; border:28px solid var(--panel-detail); opacity:.30; border-radius:50%; top:-110px; right:-100px; pointer-events:none; z-index:-1;}
.hero-portrait {position:relative; height:470px; overflow:hidden; border-radius:var(--photo-radius); background:var(--soft);}
.hero-portrait img {display:block; width:100%; height:100%; object-fit:cover; object-position:50% 36%;}
.photo-note {display:block; text-align:right; font-size:10px; line-height:1.5; color:var(--panel-muted); padding-top:8px;}
.section {max-width:1180px; margin:72px auto;}
.section>.eyebrow {display:block;}
.grid {display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:22px; margin-top:32px;}
.box {position:relative; padding:30px; background:var(--surface); border:1px solid var(--line); border-top:3px solid var(--primary); border-radius:var(--control-radius);}
.box strong {color:var(--accent); font-size:12px; text-transform:uppercase; letter-spacing:.08em;}
.box p {font-size:15px; margin-bottom:0;}
.band {position:relative; overflow:hidden; isolation:isolate; background:linear-gradient(135deg,var(--panel-start),var(--panel-end)); padding:48px; border-radius:var(--card-radius); color:var(--panel-text);}
.band::after {position:absolute; content:""; width:350px; height:350px; border:35px solid var(--panel-detail); opacity:.15; border-radius:50%; right:-100px; top:-110px; z-index:-1;}
.band h2 {color:var(--panel-text); max-width:620px; margin:20px 0;}
.band>span {font-size:11px; letter-spacing:.12em; font-weight:700;}
.band p {color:var(--panel-muted); max-width:650px;}
.band button {background:var(--panel-cta); color:var(--panel-cta-ink); margin-top:12px;}
.band button:hover {background:var(--panel-muted);}
details {border-bottom:1px solid var(--line); padding:22px 0;}
summary {cursor:pointer; font-weight:700; line-height:1.5; color:var(--heading);}
details p {max-width:800px;}
footer {text-align:center; padding:26px 24px 38px; font-size:12px; line-height:1.8; color:var(--muted);}
/* O questionário recupera a composição em dois painéis usada no Auto. */
.quote-stage {display:grid; grid-template-columns:39% 61%; max-width:1180px; margin:24px auto; min-height:720px; overflow:hidden; border:1px solid var(--line); border-radius:var(--card-radius); background:var(--surface); box-shadow:var(--shadow);}
.quote-sidebar {position:relative; isolation:isolate; display:flex; flex-direction:column; padding:46px 42px 34px; overflow:hidden; background:linear-gradient(145deg,var(--panel-start),var(--panel-end)); color:var(--panel-text);}
.quote-sidebar::after {position:absolute; content:""; width:320px; height:320px; border:28px solid var(--panel-detail); opacity:.10; border-radius:50%; bottom:-150px; left:-100px; z-index:-1; pointer-events:none;}
.sidebar-eyebrow {font-size:11px; letter-spacing:.10em; font-weight:750; text-transform:uppercase; line-height:1.5;}
.quote-sidebar h2 {font-size:clamp(30px,3.1vw,43px); color:var(--panel-text); line-height:1.09; margin:26px 0 16px; letter-spacing:-.04em;}
.care-illustration {width:min(100%,235px); height:170px; margin:24px auto; flex-shrink:0; fill:none; stroke:var(--panel-text); stroke-width:4; stroke-linejoin:round; stroke-linecap:round;}
.care-illustration .care-pulse {stroke:var(--panel-detail); stroke-width:5;}
.sidebar-note {display:flex; gap:10px; align-items:center; font-size:12px; line-height:1.5; color:var(--panel-text); border:1px solid rgba(255,255,255,.32); padding:12px 14px; border-radius:var(--control-radius); margin-top:auto;}
.sidebar-note span {font-size:17px;}
.sidebar-signature {font-size:10px; line-height:1.6; color:var(--panel-muted); margin-top:18px;}
.quiz {max-width:720px; margin:24px auto; background:var(--surface); padding:42px 52px; border:1px solid var(--line); border-radius:var(--card-radius); min-height:650px; color:var(--ink);}
.quote-stage>.quiz {max-width:none; width:100%; margin:0; border:0; border-radius:0; min-height:100%; padding:36px 48px;}
.quiz h1 {font-size:clamp(30px,3vw,42px); margin:38px 0 22px; color:var(--heading);}
.quiz h1::after {content:""; display:block; width:54px; height:4px; background:var(--primary); margin-top:22px; border-radius:3px;}
.quiz>.eyebrow {margin-top:12px;}
.back {background:transparent; color:var(--muted); min-height:44px; padding:8px 0; font-size:14px; font-weight:400;}
.back:hover {background:transparent; color:var(--accent);}
.options {display:grid; gap:12px; margin:26px 0;}
.option {display:flex; flex-direction:row-reverse; gap:16px; align-items:center; border:2px solid var(--line); border-radius:var(--control-radius); padding:17px 18px; min-height:64px; cursor:pointer; background:var(--surface); transition:border-color .15s,background .15s;}
.option span {flex:1; font-size:16px; line-height:1.45; font-weight:550;}
.option:hover {border-color:var(--accent); background:var(--soft);}
.option:has(input:checked) {border-color:var(--accent); background:var(--soft);}
.option:has(input:focus-visible) {outline:3px solid var(--focus); outline-offset:3px;}
.option input {accent-color:var(--action); width:21px; height:21px; flex-shrink:0; margin:0;}
input:not([type=radio]):not([type=checkbox]),textarea,select {width:100%; padding:16px; border:1px solid var(--line); border-radius:var(--control-radius); background:var(--surface); color:var(--ink); margin:12px 0; min-height:56px;}
input:not([type=radio]):not([type=checkbox]):focus,select:focus,textarea:focus {border-color:var(--accent); outline:2px solid var(--focus); outline-offset:2px;}
label {line-height:1.6;}
.error {color:#b00020; min-height:24px; font-size:14px;}
.insight {border-left:3px solid var(--primary); border-radius:0 var(--control-radius) var(--control-radius) 0; padding:15px 18px; background:var(--soft); color:var(--heading); font-size:14px; line-height:1.6; margin:24px 0;}
.summary-item {padding:18px 0; border-bottom:1px solid var(--line); line-height:1.55;}
.edit {background:transparent; color:var(--accent); padding:10px; min-height:44px; font-size:14px;}
.edit:hover {background:var(--soft);}
.actions {display:flex; gap:14px; margin-top:26px; flex-wrap:wrap;}
.skip {position:absolute; top:-100px; z-index:10;}
.skip:focus {top:0; background:var(--surface); color:var(--heading); padding:15px;}
.consent {display:flex; gap:12px; margin:24px 0; font-size:14px;}
.consent input {min-width:22px; height:22px; accent-color:var(--action);}
.small {font-size:13px;}
.age-grid {display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px;}
.age-grid label {font-weight:700;}
.sr-only {position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0;}
/* Grafismos próprios: órbita Bradesco, arcos Porto, faixa SulAmérica, curvas Unimed. */
html[data-theme="bradesco"] .quote-sidebar::before,html[data-theme="bradesco"] .hero-visual::before {width:380px; height:310px; border-width:2px; transform:rotate(-18deg); border-color:#fff; opacity:.55;}
html[data-theme="porto"] .hero-visual::before,html[data-theme="porto"] .quote-sidebar::before {border-width:36px; opacity:.36;}
html[data-theme="sulamerica"] .hero-visual::before,html[data-theme="sulamerica"] .quote-sidebar::before {width:80px; height:650px; top:-100px; right:-35px; border:0; border-radius:0; background:var(--panel-detail); opacity:1; transform:rotate(-22deg);}
html[data-theme="sulamerica"] .quote-sidebar::after {border-radius:0; transform:rotate(-22deg);}
html[data-theme="sulamerica"] .hero-visual {border-bottom:6px solid var(--primary);}
html[data-theme="unimed"] .hero-visual::before,html[data-theme="unimed"] .quote-sidebar::before {width:350px; height:350px; border-width:2px; border-radius:36% 64% 52% 48%; transform:rotate(35deg); opacity:.6;}
html[data-theme="unimed"] .quote-sidebar::after {border-radius:35% 65% 60% 40%;}
@media(max-width:1230px) {header,.hero,.section,.quote-stage {max-width:calc(100% - 48px);} .hero {gap:42px;} .quote-sidebar {padding:40px 32px 30px;} .quote-stage>.quiz {padding:32px 36px;}}
@media(max-width:900px) {header {min-height:90px;} .hero {gap:30px; grid-template-columns:1fr 1fr;} .hero h1 {font-size:42px;} .hero-portrait {height:410px;} .hero-visual {padding:18px 18px 10px;} .quote-stage {display:block; max-width:720px; min-height:680px; margin:24px auto;} .quote-sidebar {display:none;} .quote-stage>.quiz {min-height:680px; padding:32px 40px;} .grid {gap:14px;} .box {padding:24px;}}
@media(max-width:700px) {
  header {max-width:none; margin:0; padding:18px 20px; min-height:82px; gap:16px; background:var(--surface);}
  header>a img {width:145px;} #partner {padding-left:16px; min-height:36px;} #partner img {width:104px; height:40px;} .secure {display:none;}
  h1 {letter-spacing:-.04em;} .hero {max-width:none; grid-template-columns:1fr; gap:28px; margin:0 0 48px; padding:30px 22px 0;}
  .hero>div:first-child {padding:0;} .hero h1 {font-size:clamp(35px,8.8vw,43px); margin:20px 0;} .hero h1::after {margin-top:22px;}
  .hero p {font-size:16px;} .hero-visual {padding:16px 16px 9px; border-radius:var(--card-radius);} .hero-portrait {height:300px; border-radius:var(--photo-radius);} .hero-portrait img {object-position:50% 32%;}
  .hero button {min-height:52px;} .section {max-width:none; margin:48px 22px;} .section h2 {font-size:32px;} .grid {grid-template-columns:1fr; gap:16px; margin-top:26px;}
  .box {padding:26px;}.box h3 {font-size:22px;} .band {margin:48px 16px; padding:30px 26px;} .band h2 {font-size:32px;} .band p {font-size:15px;}
  .quote-stage {max-width:none; margin:0; border:0; border-radius:var(--card-radius) var(--card-radius) 0 0; min-height:calc(100svh - 82px); box-shadow:0 -5px 24px var(--glow);}
  .quote-stage>.quiz {padding:22px 22px 32px; min-height:calc(100svh - 82px);}
  .quiz {margin:0; max-width:none; border:0; border-radius:var(--card-radius) var(--card-radius) 0 0; padding:28px 22px; min-height:calc(100svh - 82px);}
  .quiz h1 {font-size:32px; margin-top:34px; line-height:1.1;} .quiz h1::after {margin-top:20px;} .actions>button[type=submit] {width:100%;}
  .options {margin:24px 0;} .option {padding:16px; min-height:64px;} .option span {font-size:16px;} .insight {padding:14px 16px;} .photo-note {font-size:10px;}
}
@media(max-width:359px) {header {padding:16px; gap:12px;} header>a img {width:133px;} #partner {padding-left:12px;} #partner img {width:94px; height:36px;} .hero {padding:28px 18px 0;} .hero h1 {font-size:35px;} .hero-portrait {height:260px;} .quote-stage>.quiz,.quiz {padding-inline:18px;} .quiz h1 {font-size:29px;} .age-grid {grid-template-columns:1fr;}}
@media(prefers-reduced-motion:no-preference) {.quote-stage {animation:enter .18s ease;} @keyframes enter {from {opacity:.5; transform:translateY(5px);} to {opacity:1; transform:none;}}}
@media(prefers-reduced-motion:reduce) {* {scroll-behavior:auto!important; transition:none!important; animation:none!important;}}

/* A faixa laranja não cruza o texto: contraste preservado na área de leitura. */
html[data-theme="sulamerica"] .quote-sidebar::before {width:10px;height:100%;top:0;right:0;transform:none;}
html[data-theme="sulamerica"] .hero-visual::before {width:54px;height:140px;top:-30px;right:-22px;transform:rotate(-22deg);}

/* Operadoras na apresentação geral, independente da profissão da campanha. */
.operator-strip {max-width:1180px;margin:0 auto 72px;padding:30px 32px;background:var(--surface);border:1px solid var(--line);border-radius:var(--control-radius);display:grid;grid-template-columns:1fr 2fr;gap:32px;align-items:center;}
.operator-strip h2 {font-size:25px;line-height:1.2;margin:10px 0 0;letter-spacing:-.025em;}
.operator-logos {display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px;list-style:none;margin:0;padding:0;align-items:center;}
.operator-logos li {min-width:0;display:flex;align-items:center;justify-content:center;background:#fff;border-radius:8px;padding:10px;}
.operator-logos img {display:block;width:100%;max-width:160px;height:64px;object-fit:contain;}
@media(max-width:1230px) {.operator-strip {max-width:calc(100% - 48px);}}
@media(max-width:900px) {.operator-strip {grid-template-columns:1fr;gap:24px;}}
@media(max-width:699px) {.operator-strip {max-width:none;margin:0 22px 48px;padding:24px 20px;gap:22px;}.operator-strip h2 {font-size:25px;}.operator-logos {grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;}.operator-logos li {padding:8px;}.operator-logos img {height:58px;}}
