/* Home do site · uma só linguagem visual a partir do hero:
   fundo escuro, foto cinematográfica com vidro fosco em degradê, tipografia branca em dois tons,
   cápsulas escuras, pílula branca para a ação principal e pílula de vidro para a secundária. */

:root{
 --site-bg:#06121D;
 --ink-strong:#fff;
 --ink-soft:rgba(255,255,255,.62);
 --ink-body:rgba(255,255,255,.8);
 --ink-mute:rgba(255,255,255,.58);
 --capsule:rgba(2,16,28,.72);
 --capsule-line:rgba(255,255,255,.08);
 --panel:rgba(255,255,255,.045);
 --panel-line:rgba(255,255,255,.09);
 --frost-tint:linear-gradient(0deg,rgba(6,28,48,.34),rgba(6,28,48,.22));
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:var(--font);color:var(--ink-strong);-webkit-font-smoothing:antialiased;
 background:radial-gradient(70% 50% at 85% 30%,rgba(3,115,188,.16),transparent 70%),radial-gradient(60% 40% at 10% 70%,rgba(14,182,229,.07),transparent 70%),var(--site-bg)}
img{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
h1,h2{text-wrap:balance}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip-link{position:absolute;left:12px;top:-60px;z-index:50;padding:10px 16px;border-radius:99px;background:#fff;color:#013455}
.skip-link:focus{top:12px}
:focus-visible{outline:2px solid var(--brand-400);outline-offset:3px;border-radius:12px}

/* ---------- Materiais ---------- */
.glass{background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.28);backdrop-filter:blur(22px) saturate(160%);-webkit-backdrop-filter:blur(22px) saturate(160%);box-shadow:inset 0 1px 0 rgba(255,255,255,.35),0 10px 30px rgba(0,20,40,.18)}
.capsule{background:var(--capsule);border:1px solid var(--capsule-line);box-shadow:0 8px 24px rgba(0,10,20,.25);backdrop-filter:blur(16px) saturate(120%);-webkit-backdrop-filter:blur(16px) saturate(120%)}
.panel-dark{background:var(--panel);border:1px solid var(--panel-line);box-shadow:inset 0 1px 0 rgba(255,255,255,.06);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px)}

/* ---------- Botões em pílula ---------- */
.pill{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:42px;padding:0 20px;border-radius:99px;font-size:14px;font-weight:500;letter-spacing:-.01em;border:1px solid transparent;cursor:pointer;font-family:inherit;transition:background-color 160ms ease,color 160ms ease,transform 140ms var(--ease-out)}
.pill-lg{min-height:50px;padding:0 26px;font-size:15px}
.pill-light{background:#fff;color:#013455;box-shadow:0 1px 2px rgba(0,20,40,.12)}
.pill-glass{color:#fff;background:rgba(255,255,255,.12);border-color:rgba(255,255,255,.3);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px)}
.pill:active{transform:scale(.97)}
.pill svg{transition:transform 160ms var(--ease-out)}
@media(hover:hover) and (pointer:fine){.pill-light:hover{background:#E8F4FC}.pill-glass:hover{background:rgba(255,255,255,.22)}.pill:hover svg{transform:translateX(2px)}}

/* ---------- Tipografia compartilhada ---------- */
.kicker{display:inline-flex;padding:7px 14px;border-radius:99px;font-size:12.5px;color:rgba(255,255,255,.9)}
.title-xl,.section-head h2,.faq h2{margin:0;font-size:clamp(34px,4.4vw,60px);line-height:1.02;font-weight:600;letter-spacing:-.05em;color:var(--ink-strong)}
.title-xl span,.section-head h2 span,.faq h2 span{color:var(--ink-soft);font-weight:500}
.lead{margin:0;font-size:16px;line-height:1.6;color:var(--ink-body)}
.section-head{display:grid;gap:16px;max-width:680px;margin-bottom:40px}
.section-head .kicker{justify-self:start}
.check-list{display:grid;gap:10px;list-style:none;margin:4px 0 8px;padding:0}
.check-list li{position:relative;padding-left:30px;font-size:15px;line-height:1.5;color:var(--ink-body)}
.check-list li:before{content:"";position:absolute;left:0;top:2px;width:20px;height:20px;border-radius:50%;background:rgba(255,255,255,.12) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 12.5l4 4 8-9'/%3E%3C/svg%3E") center/11px no-repeat}

/* ---------- Bloco com foto e vidro (hero e seções) ---------- */
.scene{position:relative;overflow:hidden;isolation:isolate;border-radius:30px;color:#fff}
.scene .scene-photo{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-3}
.scene-glass,.scene-frost,.scene-shade{position:absolute;inset:0;pointer-events:none}
.scene-glass{z-index:-2;backdrop-filter:blur(12px) saturate(115%);-webkit-backdrop-filter:blur(12px) saturate(115%);
 -webkit-mask-image:radial-gradient(ellipse 125% 135% at 0% 100%,#000 0%,rgba(0,0,0,.8) 25%,rgba(0,0,0,.45) 48%,rgba(0,0,0,.12) 64%,transparent 76%);
 mask-image:radial-gradient(ellipse 125% 135% at 0% 100%,#000 0%,rgba(0,0,0,.8) 25%,rgba(0,0,0,.45) 48%,rgba(0,0,0,.12) 64%,transparent 76%)}
.scene-frost{z-index:-2;backdrop-filter:blur(34px) saturate(115%) brightness(.92);-webkit-backdrop-filter:blur(34px) saturate(115%) brightness(.92);background:var(--frost-tint);
 -webkit-mask-image:radial-gradient(ellipse 60% 74% at 0% 100%,#000 0%,#000 72%,rgba(0,0,0,.5) 88%,transparent 100%);
 mask-image:radial-gradient(ellipse 60% 74% at 0% 100%,#000 0%,#000 72%,rgba(0,0,0,.5) 88%,transparent 100%)}
.scene-shade{z-index:-1;background:linear-gradient(35deg,rgba(1,25,45,.6) 0%,rgba(1,30,52,.32) 30%,rgba(1,30,52,0) 58%)}

/* ---------- Hero ---------- */
.hero{min-height:max(640px,100svh);margin:10px;display:flex;flex-direction:column}
.hero .scene-photo{object-position:42% 30%}
.hero .scene-glass{
 -webkit-mask-image:radial-gradient(ellipse 125% 135% at 0% 100%,#000 0%,rgba(0,0,0,.8) 25%,rgba(0,0,0,.45) 48%,rgba(0,0,0,.12) 64%,transparent 76%),linear-gradient(270deg,#000 0%,#000 7%,transparent 17%);
 mask-image:radial-gradient(ellipse 125% 135% at 0% 100%,#000 0%,rgba(0,0,0,.8) 25%,rgba(0,0,0,.45) 48%,rgba(0,0,0,.12) 64%,transparent 76%),linear-gradient(270deg,#000 0%,#000 7%,transparent 17%)}
.hero-topfrost{position:absolute;left:0;right:0;top:0;height:min(220px,30%);z-index:-1;pointer-events:none;
 backdrop-filter:blur(26px) saturate(115%) brightness(.85);-webkit-backdrop-filter:blur(26px) saturate(115%) brightness(.85);
 background:linear-gradient(180deg,rgba(4,20,36,.62) 0%,rgba(4,20,36,.38) 50%,rgba(4,20,36,0) 100%);
 -webkit-mask-image:linear-gradient(180deg,#000 0%,#000 45%,transparent 100%);mask-image:linear-gradient(180deg,#000 0%,#000 45%,transparent 100%)}
.hero .scene-shade{background:linear-gradient(35deg,rgba(1,25,45,.6) 0%,rgba(1,30,52,.32) 30%,rgba(1,30,52,0) 58%),linear-gradient(180deg,rgba(1,25,45,.35) 0%,rgba(1,25,45,0) 20%)}

.site-nav{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:16px;padding:24px 28px}
.nav-capsule{display:flex;gap:2px;list-style:none;margin:0;padding:4px;border-radius:99px;justify-self:start}
.nav-capsule a{display:block;padding:8px 15px;border-radius:99px;font-size:13.5px;color:rgba(255,255,255,.9);transition:background-color 160ms ease,color 160ms ease}
.nav-logo img{height:34px;width:auto}
.nav-actions{display:flex;align-items:center;gap:0;padding:4px;border-radius:99px;justify-self:end}
.nav-link-plain{padding:8px 14px;border-radius:99px;font-size:13.5px;color:rgba(255,255,255,.88);transition:background-color 160ms ease}
.nav-actions .pill{min-height:36px;padding:0 18px;font-size:13.5px;box-shadow:none}
.nav-round{display:grid;place-items:center;width:36px;height:36px;margin-left:2px;border-radius:50%;border:0;background:none;color:rgba(255,255,255,.88);cursor:pointer;transition:background-color 160ms ease}
.nav-round svg{width:17px;height:17px}
@media(hover:hover) and (pointer:fine){.nav-capsule a:hover,.nav-link-plain:hover,.nav-round:hover{background:rgba(255,255,255,.12);color:#fff}}
.mobile-menu{position:absolute;top:84px;right:20px;z-index:5;display:grid;min-width:220px;padding:8px;border-radius:24px;background:rgba(1,30,52,.7)}
.mobile-menu[hidden]{display:none}
.mobile-menu a{padding:12px 16px;border-radius:16px;font-size:15px}
.mobile-menu a:hover{background:rgba(255,255,255,.12)}

.hero-copy{margin-top:auto;padding:0 56px 64px;max-width:940px}
.hero-copy h1{margin:0 0 18px;font-size:clamp(42px,6vw,86px);line-height:.98;font-weight:600;letter-spacing:-.055em}
.hero-copy h1 span{color:var(--ink-soft);font-weight:500}
.hero-copy p{max-width:470px;margin:0 0 30px;font-size:16px;line-height:1.6;color:var(--ink-body)}
.hero-ctas{display:flex;flex-wrap:wrap;gap:10px}

/* Widget guardado (oculto no HTML) */
.hero-widget{position:absolute;right:40px;bottom:48px;width:300px;padding:20px;border-radius:26px;background:rgba(255,255,255,.94);color:#013455;box-shadow:inset 0 1px 0 #fff,0 24px 60px rgba(0,20,40,.35)}
.hero-widget[hidden]{display:none}
.widget-head{display:flex;align-items:center;gap:8px}
.widget-head strong{font-size:16px;font-weight:600;letter-spacing:-.02em}
.chip-up{padding:3px 9px;border-radius:99px;font-size:11px;font-weight:600;color:#02578D;background:#E2F0FA}
.widget-dots{margin-left:auto;width:14px;height:14px;border-radius:4px;border:1.5px solid #C6D6E2}
.widget-tabs{display:flex;gap:14px;margin:12px 0 14px;font-size:11.5px;color:#7389A0}
.widget-tabs .on{color:#013455;font-weight:600}
.widget-value small{display:block;font-size:11px;color:#5B7385}
.widget-value strong{font-size:28px;font-weight:600;letter-spacing:-.04em;font-variant-numeric:tabular-nums}
.widget-value strong span{font-size:16px;color:#7389A0}
.widget-bars{width:100%;height:auto;margin:12px 0 10px;stroke:none}
.widget-foot{display:flex;justify-content:space-between;font-size:11px;color:#5B7385}
.widget-foot i{display:inline-block;width:7px;height:7px;margin-right:6px;border-radius:50%;background:#5E9E49}

/* ---------- Conteúdo ---------- */
main{max-width:1260px;margin:0 auto;padding:0 24px}
main>section{margin-top:120px}
main>section:first-child{margin-top:28px}

/* Destaques: uma cápsula longa, como a navegação */
.trust{display:grid;grid-template-columns:repeat(4,1fr);border-radius:28px;overflow:hidden}
.trust>div{display:grid;gap:4px;padding:22px 26px}
.trust>div+div{border-left:1px solid var(--capsule-line)}
.trust strong{font-size:15px;font-weight:600;letter-spacing:-.02em}
.trust span{font-size:13px;color:var(--ink-mute)}

/* Capital de giro: foto com vidro + texto sobre o fosco, como o hero (espelhado) */
.feature{min-height:620px;display:grid;grid-template-columns:1fr 1fr;align-items:end}
.feature .scene-photo{object-position:25% 40%}
.feature .scene-frost{-webkit-mask-image:radial-gradient(ellipse 75% 95% at 100% 100%,#000 0%,#000 70%,rgba(0,0,0,.5) 88%,transparent 100%);mask-image:radial-gradient(ellipse 75% 95% at 100% 100%,#000 0%,#000 70%,rgba(0,0,0,.5) 88%,transparent 100%)}
.feature .scene-glass{-webkit-mask-image:radial-gradient(ellipse 125% 135% at 100% 100%,#000 0%,rgba(0,0,0,.8) 25%,rgba(0,0,0,.45) 48%,rgba(0,0,0,.12) 64%,transparent 76%);mask-image:radial-gradient(ellipse 125% 135% at 100% 100%,#000 0%,rgba(0,0,0,.8) 25%,rgba(0,0,0,.45) 48%,rgba(0,0,0,.12) 64%,transparent 76%)}
.feature .scene-shade{background:linear-gradient(-35deg,rgba(1,25,45,.65) 0%,rgba(1,30,52,.32) 32%,rgba(1,30,52,0) 60%),linear-gradient(0deg,rgba(1,25,45,.35),transparent 40%)}
.feature-copy{grid-column:2;display:grid;gap:18px;padding:56px}
.feature-copy .kicker{justify-self:start}
.feature-copy .pill{justify-self:start;margin-top:6px}
.float-card{position:absolute;left:32px;top:32px;width:250px;padding:18px 20px;border-radius:22px}
.float-card small{font-size:11.5px;color:var(--ink-mute)}
.float-card strong{display:block;margin:2px 0 12px;font-size:24px;font-weight:600;letter-spacing:-.035em;font-variant-numeric:tabular-nums}
.float-card span{font-size:11.5px;color:var(--ink-mute)}
.mini-progress{height:5px;margin-bottom:8px;border-radius:5px;background:rgba(255,255,255,.14);overflow:hidden}
.mini-progress i{display:block;height:100%;border-radius:5px;background:linear-gradient(90deg,#fff,rgba(255,255,255,.7))}

/* Cartões em vidro escuro (Para que serve, Como funciona) */
.card-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;list-style:none;margin:0;padding:0}
.card-grid>*{display:flex;flex-direction:column;gap:10px;padding:28px;border-radius:26px;transition:transform 180ms var(--ease-out),background-color 180ms ease}
@media(hover:hover) and (pointer:fine){.card-grid>*:hover{transform:translateY(-3px);background:rgba(255,255,255,.07)}}
.card-grid strong{font-size:18px;font-weight:600;letter-spacing:-.025em}
.card-grid p{margin:0;font-size:14px;line-height:1.6;color:var(--ink-mute)}
.card-icon{display:grid;place-items:center;width:46px;height:46px;margin-bottom:8px;border-radius:50%;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.14)}
.card-icon svg{width:22px;height:22px}
.step-num{font-size:13px;font-weight:600;color:var(--ink-soft);font-variant-numeric:tabular-nums;margin-bottom:6px}

/* Painel do lojista */
.app-band{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:center;padding:64px;border-radius:32px}
.app-copy{display:grid;gap:18px}
.app-copy .kicker{justify-self:start}
.app-mock{display:grid;gap:14px}
.mock-card{padding:22px;border-radius:24px;background:rgba(255,255,255,.95);color:#013455;box-shadow:0 24px 50px -20px rgba(0,10,20,.7)}
.mock-main{transform:rotate(-1.5deg)}
.mock-list{margin-left:40px;transform:rotate(1deg)}
.mock-row{display:flex;justify-content:space-between;align-items:center;font-size:12px;color:#5B7385}
.mock-row em{font-style:normal;font-size:11px;padding:3px 9px;border-radius:99px;background:#E2F0FA;color:#02578D}
.mock-value{display:block;margin:6px 0 12px;font-size:34px;font-weight:600;letter-spacing:-.04em;font-variant-numeric:tabular-nums}
.mock-value span{font-size:18px;color:#7389A0}
.mock-card .mini-progress{background:#E3EDF4}
.mock-card .mini-progress i{background:linear-gradient(90deg,var(--brand-900),var(--brand-600))}
.mock-sub{margin:8px 0 16px}
.mock-btn{display:grid;place-items:center;height:44px;border-radius:99px;background:#013455;color:#fff;font-size:14px;font-weight:500}
.mock-list .mock-row{margin-bottom:10px;color:#013455;font-size:14px}
.mock-item{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:12px;padding:10px 0;border-top:1px solid #10405F12;font-size:13.5px}
.mock-item small{display:block;font-size:11.5px;color:#5B7385}
.mock-item>b{font-variant-numeric:tabular-nums;font-weight:600}
.mock-date{display:grid;place-items:center;width:42px;height:42px;border-radius:12px;background:#EEF5FB;font-size:10px;color:#5B7385;line-height:1.1}
.mock-date b{font-size:15px;color:#013455}

/* Simulação: foto de dia com o mesmo vidro do hero */
.sim-band{min-height:680px;display:flex;align-items:center;justify-content:space-between;gap:48px;padding:56px}
.sim-band .scene-photo{object-position:60% 40%}
.sim-band .scene-glass{backdrop-filter:blur(16px) saturate(115%);-webkit-backdrop-filter:blur(16px) saturate(115%);-webkit-mask-image:none;mask-image:none}
.sim-band .scene-shade{background:linear-gradient(90deg,rgba(1,25,45,.72),rgba(1,30,52,.42) 55%,rgba(1,25,45,.6))}
.sim-intro{display:grid;gap:16px;max-width:460px}
.sim-intro .kicker{justify-self:start}
.sim{width:min(470px,100%);padding:32px;border-radius:28px;background:var(--capsule);border:1px solid rgba(255,255,255,.12);box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 24px 60px -24px rgba(0,10,20,.7);backdrop-filter:blur(22px) saturate(130%);-webkit-backdrop-filter:blur(22px) saturate(130%)}
.sim-steps{display:flex;gap:6px;list-style:none;margin:0 0 22px;padding:0}
.sim-steps li{flex:1;padding-top:10px;border-top:2px solid rgba(255,255,255,.16);font-size:11.5px;color:var(--ink-mute);transition:border-color 200ms ease,color 200ms ease}
.sim-steps li.on{border-color:#fff;color:#fff}
.sim-step{display:grid;gap:14px}
.sim-step[hidden],.sim-loading[hidden]{display:none}
.sim-step h2{margin:0 0 4px;font-size:24px;line-height:1.15;font-weight:600;letter-spacing:-.035em}
.sim-step h2:focus{outline:none}
.sim label{display:grid;gap:6px;font-size:12.5px;color:var(--ink-body)}
.sim input:not([type=checkbox]){width:100%;height:50px;padding:0 16px;border-radius:14px;border:1px solid rgba(255,255,255,.18);background:rgba(255,255,255,.08);color:#fff;font:inherit;font-size:16px;font-variant-numeric:tabular-nums}
.sim input::placeholder{color:rgba(255,255,255,.4)}
.sim input:focus{outline:2px solid rgba(255,255,255,.7);outline-offset:1px;background:rgba(255,255,255,.12)}
.sim input[aria-invalid=true]{border-color:#F3A6AE}
.field-row{display:grid;grid-template-columns:1fr 1.25fr;gap:12px}
.field-error{font-size:12px;color:#FFC3C9}
.field-error:empty{display:none}
.ticket{display:flex;justify-content:space-between;align-items:center;padding:14px 16px;border-radius:16px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.14);font-size:13px;color:var(--ink-body)}
.ticket[hidden]{display:none}
.ticket strong{font-size:20px;font-weight:600;letter-spacing:-.02em;color:#fff;font-variant-numeric:tabular-nums}
.sim .pill-lg{width:100%;margin-top:4px}
.sim-loading{display:grid;place-items:center;gap:18px;min-height:300px;text-align:center;font-size:16px}
.spinner-ring{width:44px;height:44px;border-radius:50%;border:3px solid rgba(255,255,255,.16);border-top-color:#fff;animation:spin .8s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.teaser{display:grid;gap:4px;padding:18px;border-radius:18px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.14);text-align:center}
.teaser>span{font-size:12.5px;color:var(--ink-mute)}
.teaser strong{font-size:34px;font-weight:600;letter-spacing:-.04em}
.teaser .blurred{filter:blur(9px);user-select:none}
.teaser small{font-size:13px;color:var(--ink-body)}
.consent{display:flex!important;align-items:flex-start;gap:10px!important;font-size:12.5px;line-height:1.5}
.consent input{width:18px;height:18px;margin-top:1px;flex:none;accent-color:#fff}
.link-back{justify-self:center;background:none;border:0;color:var(--ink-mute);font:inherit;font-size:13px;cursor:pointer;padding:6px 10px;border-radius:99px}
.link-back:hover{color:#fff}
.sim-result{text-align:center}
.result-badge{justify-self:center;padding:5px 12px;border-radius:99px;font-size:12px;font-weight:500;color:#fff;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.22)}
.result-value{font-size:clamp(40px,5vw,56px);font-weight:600;letter-spacing:-.05em;line-height:1;font-variant-numeric:tabular-nums}
.result-range{margin:0;font-size:14px;color:var(--ink-body)}
.result-facts{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:4px 0}
.result-facts div{padding:12px 8px;border-radius:14px;background:rgba(255,255,255,.07)}
.result-facts dt{font-size:11px;color:var(--ink-mute)}
.result-facts dd{margin:4px 0 0;font-size:14px;font-weight:600;font-variant-numeric:tabular-nums}
.result-sent{margin:0;font-size:13px;line-height:1.55;color:var(--ink-body)}
.result-note{font-size:11.5px;line-height:1.5;color:var(--ink-mute)}

/* Perguntas */
.faq{max-width:860px;margin-left:auto;margin-right:auto}
.faq h2{margin-bottom:28px}
.faq details{border-bottom:1px solid rgba(255,255,255,.12)}
.faq summary{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:22px 4px;font-size:17px;font-weight:500;letter-spacing:-.015em;cursor:pointer;list-style:none}
.faq summary::-webkit-details-marker{display:none}
.faq summary:after{content:"+";font-size:22px;font-weight:300;color:var(--ink-soft);transition:transform 200ms var(--ease-out)}
.faq details[open] summary:after{transform:rotate(45deg)}
.faq p{margin:0 4px 22px;font-size:15px;line-height:1.65;color:var(--ink-mute)}

/* Fechamento: foto do hero, toda em vidro */
.closing{min-height:420px;display:grid;place-items:center;align-content:center;gap:28px;padding:64px 24px;text-align:center}
.closing .scene-photo{object-position:50% 30%}
.closing .scene-glass{backdrop-filter:blur(26px) saturate(115%) brightness(.9);-webkit-backdrop-filter:blur(26px) saturate(115%) brightness(.9);background:var(--frost-tint);-webkit-mask-image:none;mask-image:none}
.closing .scene-shade{background:radial-gradient(70% 80% at 50% 50%,rgba(1,25,45,.2),rgba(1,25,45,.55))}


/* ---------- Responsivo ---------- */
@media(max-width:1080px){
 .nav-capsule{display:none}
 .site-nav{grid-template-columns:auto 1fr}
 .card-grid{grid-template-columns:repeat(2,1fr)}
 .trust{grid-template-columns:repeat(2,1fr)}
 .trust>div:nth-child(3){border-left:0}
 .trust>div:nth-child(n+3){border-top:1px solid var(--capsule-line)}
 .feature{grid-template-columns:1fr}
 .feature-copy{grid-column:1;padding:40px}
 .app-band{grid-template-columns:1fr;padding:44px}
 .sim-band{flex-direction:column;align-items:stretch}
 .sim{width:100%}
}
@media(max-width:640px){
 .hero{margin:6px;border-radius:24px}
 .site-nav{padding:16px}
 .nav-logo img{height:26px}
 .nav-link-plain,.nav-actions .pill{display:none}
 .nav-actions{padding:0;background:none;border:0;box-shadow:none;backdrop-filter:none;-webkit-backdrop-filter:none}
 .nav-round{width:42px;height:42px;background:var(--capsule)}
 .hero-copy{padding:0 22px 36px}
 .hero-copy p{font-size:15px}
 .hero .scene-photo{object-position:48% 30%}
 .hero .scene-frost{-webkit-mask-image:linear-gradient(0deg,#000 0%,#000 50%,transparent 72%);mask-image:linear-gradient(0deg,#000 0%,#000 50%,transparent 72%)}
 main{padding:0 12px}
 main>section{margin-top:80px}
 .trust,.card-grid{grid-template-columns:1fr}
 .trust>div+div{border-left:0;border-top:1px solid var(--capsule-line)}
 .feature{min-height:640px}
 .feature-copy{padding:24px}
 .feature .scene-frost{-webkit-mask-image:linear-gradient(0deg,#000 0%,#000 55%,transparent 80%);mask-image:linear-gradient(0deg,#000 0%,#000 55%,transparent 80%)}
 .float-card{left:16px;top:16px;width:220px}
 .app-band{padding:28px 20px;gap:32px}
 .mock-list{margin-left:0}
 .mock-main,.mock-list{transform:none}
 .sim-band{padding:20px 12px;gap:24px}
 .sim{padding:22px}
 .field-row,.result-facts{grid-template-columns:1fr}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}.spinner-ring{animation-duration:1.6s}}
@media(prefers-reduced-transparency:reduce){
 .glass,.capsule,.panel-dark,.pill-glass,.sim{background:rgba(2,16,28,.92);backdrop-filter:none;-webkit-backdrop-filter:none}
 .scene-glass,.scene-frost,.hero-topfrost{backdrop-filter:none;-webkit-backdrop-filter:none;background:rgba(1,30,52,.35)}
}
/* Selos sempre na cápsula escura do menu, legíveis sobre foto clara ou escura. */
.kicker,.kicker.glass{background:var(--capsule);border:1px solid var(--capsule-line);box-shadow:0 8px 24px rgba(0,10,20,.2);backdrop-filter:blur(16px) saturate(120%);-webkit-backdrop-filter:blur(16px) saturate(120%)}
/* Foto clara (gestora): vidro mais escuro para manter o contraste do texto branco. */
.feature .scene-frost{backdrop-filter:blur(34px) saturate(110%) brightness(.72);-webkit-backdrop-filter:blur(34px) saturate(110%) brightness(.72);background:linear-gradient(0deg,rgba(4,22,38,.62),rgba(4,22,38,.48))}
.feature .scene-shade{background:linear-gradient(-35deg,rgba(1,25,45,.75) 0%,rgba(1,30,52,.4) 35%,rgba(1,30,52,.08) 65%),linear-gradient(0deg,rgba(1,25,45,.4),transparent 45%)}

/* ===== Tema claro como base; seções escuras só onde há foto (.scene) ===== */
:root{
 --ink-strong:#013455;
 --ink-soft:rgba(1,52,85,.5);
 --ink-body:#3E5B70;
 --ink-mute:#5B7385;
}
body{color:var(--ink-strong);background:radial-gradient(1100px 720px at 6% -8%,#FFFFFFE0,#FFFFFF00 62%),radial-gradient(880px 620px at 96% 20%,#7ACFF12E,#7ACFF100 64%),radial-gradient(1000px 760px at 88% 104%,#2F86C426,#2F86C400 62%),linear-gradient(150deg,#F2F8FC 0%,#E3EEF7 55%,#D3E5F2 100%);background-attachment:fixed}
/* Dentro das cenas com foto, a tipografia volta a ser branca, como no hero. */
.scene{--ink-strong:#fff;--ink-soft:rgba(255,255,255,.62);--ink-body:rgba(255,255,255,.8);--ink-mute:rgba(255,255,255,.58);color:#fff}

/* Superfícies claras */
.capsule-light{background:rgba(255,255,255,.72);border:1px solid rgba(255,255,255,.9);box-shadow:inset 0 1px 0 #fff,0 10px 30px -12px rgba(16,64,95,.22);backdrop-filter:blur(18px) saturate(150%);-webkit-backdrop-filter:blur(18px) saturate(150%)}
.panel-light{background:rgba(255,255,255,.78);border:1px solid rgba(255,255,255,.95);box-shadow:inset 0 1px 0 #fff,0 14px 34px -18px rgba(16,64,95,.3);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px)}
.trust.capsule-light>div+div{border-left-color:rgba(16,64,95,.1)}
.kicker.light{background:rgba(255,255,255,.8);border:1px solid rgba(255,255,255,.95);color:#013455;box-shadow:0 4px 14px -6px rgba(16,64,95,.25)}
.card-grid>.panel-light .card-icon{background:linear-gradient(180deg,#E7F3FB,#D6EAF7);border:0;color:var(--brand-600)}
@media(hover:hover) and (pointer:fine){.card-grid>.panel-light:hover{background:#fff}}
.step-num{color:var(--brand-600)}
.panel-light .check-list li:before,.light-check li:before{background:#DCEEFA url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230364A3' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 12.5l4 4 8-9'/%3E%3C/svg%3E") center/11px no-repeat}
.pill-navy{color:#fff;background:#013455;box-shadow:0 1px 2px rgba(1,52,85,.2)}
@media(hover:hover) and (pointer:fine){.pill-navy:hover{background:#02426B}}

/* Painel do lojista em claro */
.app-band.panel-light{background:radial-gradient(70% 90% at 100% 0%,rgba(14,182,229,.14),transparent 60%),linear-gradient(160deg,rgba(255,255,255,.85),rgba(232,242,250,.85))}
.app-band .mock-card{box-shadow:0 24px 50px -24px rgba(16,64,95,.45)}

/* Perguntas e rodapé em claro */
.faq details{border-bottom-color:rgba(16,64,95,.14)}

/* Página Sobre */
.hero-short{min-height:max(560px,78svh)}
.nav-capsule a[aria-current=page]{background:rgba(255,255,255,.14);color:#fff}
.about-cols{display:grid;grid-template-columns:1fr 1fr;gap:32px;max-width:1040px}
.about-cols .lead{font-size:17px;line-height:1.7}
.card-grid-3{grid-template-columns:repeat(3,1fr)}
.audience .card-grid strong{font-size:20px}
@media(max-width:1080px){.card-grid-3{grid-template-columns:1fr 1fr}}
@media(max-width:640px){.about-cols,.card-grid-3{grid-template-columns:1fr}}
main>.about-intro:first-child{margin-top:88px}@media(max-width:640px){main>.about-intro:first-child{margin-top:56px}}

/* Rodapé: painel navy da marca, com contato comercial e links da plataforma. */
.site-footer{margin:100px 0 0;color:rgba(255,255,255,.66);font-size:13.5px;
 background:radial-gradient(50% 120% at 100% 0%,rgba(14,182,229,.08),transparent 60%),radial-gradient(40% 90% at 0% 100%,rgba(3,115,188,.12),transparent 65%),linear-gradient(180deg,#011C30,#000E1A)}
.footer-inner{max-width:1212px;margin:0 auto;padding:64px 24px 32px}
.footer-top{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,.8fr) minmax(0,.9fr) minmax(0,1.3fr);gap:40px}
.footer-brand img{height:34px;width:auto}
.footer-brand p{max-width:340px;margin:18px 0 22px;line-height:1.65;color:rgba(255,255,255,.72)}
.footer-col h3{margin:4px 0 16px;font-size:12px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:#7FD3F2}
.footer-col ul{list-style:none;margin:0;padding:0;display:grid;gap:11px}
.footer-col a{display:inline-flex;align-items:center;gap:9px;color:#fff;transition:color var(--duration-fast) var(--ease-out)}
.footer-col a svg{width:16px;height:16px;flex:none;color:#7FD3F2}
@media(hover:hover) and (pointer:fine){.footer-col a:hover{color:#B9E4F6}}
.footer-social{list-style:none;display:flex;gap:10px;margin:0;padding:0}
.footer-social a{display:grid;place-items:center;width:38px;height:38px;border-radius:999px;color:#fff;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.14);transition:background var(--duration-fast) var(--ease-out),transform var(--duration-press) var(--ease-out)}
.footer-social svg{width:18px;height:18px}
.footer-social a:active{transform:scale(.96)}
@media(hover:hover) and (pointer:fine){.footer-social a:hover{background:rgba(255,255,255,.16)}}
.footer-contact a{white-space:nowrap}
.footer-bottom{display:flex;flex-wrap:wrap;justify-content:space-between;gap:8px 24px;margin-top:48px;padding-top:22px;border-top:1px solid rgba(255,255,255,.08);font-size:12px;color:rgba(255,255,255,.48)}
.footer-bottom p{margin:0;line-height:1.6}
@media(max-width:1080px){
 .site-footer{margin-top:80px}
 .footer-top{grid-template-columns:repeat(2,minmax(0,1fr))}
 .footer-brand{grid-column:1/-1}
}
@media(max-width:640px){
 .site-footer{margin-top:72px}
 .footer-inner{padding:48px 20px 28px}
 .footer-top{grid-template-columns:1fr;gap:32px}
 .footer-contact a{white-space:normal;overflow-wrap:anywhere}
}

/* ===== Celular (revisão 2026-10-14): leitura compacta, sem sobreposição ===== */
@media(max-width:640px){
 /* Hero: título menor, botões do mesmo tamanho */
 .hero{min-height:max(600px,94svh)}
 .hero-copy{padding:0 20px 28px}
 .hero-copy h1{font-size:40px;margin-bottom:14px}
 .hero-copy p{margin-bottom:22px}
 .hero-ctas{flex-direction:column;align-items:stretch;gap:10px}
 .hero-ctas .pill{width:100%}
 /* Foto do topo: no celular usa a foto vertical do showroom (hero-mobile.jpg),
    com os carros nítidos; o texto fica abaixo sobre o azul */
 .hero:not(.hero-short){background:#06213A}
 .hero:not(.hero-short) .scene-photo{height:66%;bottom:auto;object-position:50% 62%}
 .hero:not(.hero-short) .scene-glass,.hero:not(.hero-short) .scene-frost{display:none}
 .hero:not(.hero-short) .scene-shade{background:linear-gradient(180deg,rgba(6,33,58,.35) 0%,rgba(6,33,58,0) 18%,rgba(6,33,58,0) 40%,rgba(6,33,58,.8) 56%,#06213A 64%)}
 .hero-short .scene-glass{display:none}
 .hero-short{min-height:max(560px,84svh)}
 .hero-short .scene-photo{object-position:64% 30%}

 /* Menu: largura toda, toques confortáveis, inscrição em destaque */
 .mobile-menu{top:70px;left:12px;right:12px;min-width:0;padding:10px;gap:2px;border-radius:24px;background:rgba(1,24,42,.9);border:1px solid rgba(255,255,255,.1);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);box-shadow:0 24px 60px -20px rgba(0,10,20,.7)}
 .mobile-menu a{padding:14px 16px;font-size:16px;color:#fff}
 .mobile-menu a:last-child{margin-top:8px;text-align:center;background:#fff;color:#013455;font-weight:600;border-radius:999px}

 /* Destaques em 2 colunas */
 .trust{grid-template-columns:1fr 1fr;border-radius:22px}
 .trust>div{padding:16px;gap:3px}
 .trust>div+div{border-left:0;border-top:0}
 .trust>div:nth-child(even){border-left:1px solid rgba(16,64,95,.1)}
 .trust>div:nth-child(n+3){border-top:1px solid rgba(16,64,95,.1)}
 .trust strong{font-size:13.5px;line-height:1.3}
 .trust span{font-size:12px;line-height:1.4}

 /* Foto com cartão de limite: o cartão fica no topo e o texto começa abaixo dele */
 .feature{min-height:0}
 .feature{background:#06213A}
 .feature-copy{padding:300px 20px 24px;gap:14px}
 .feature .scene-photo{height:380px;bottom:auto;object-position:30% 35%}
 .feature .scene-glass,.feature .scene-frost{display:none}
 .feature .scene-shade{background:linear-gradient(180deg,rgba(6,33,58,0) 0px,rgba(6,33,58,0) 170px,rgba(6,33,58,.75) 290px,#06213A 380px)}
 .float-card{left:auto;right:14px;top:14px;width:178px;padding:13px 15px;border-radius:18px}
 .float-card strong{font-size:18px;margin-bottom:8px}
 .feature .pill{width:100%}

 /* Títulos de seção */
 .title-xl,.section-head h2,.faq h2{font-size:34px}
 .section-head{gap:12px;margin-bottom:22px}
 .lead{font-size:15px}

 /* Cartões em linha: ícone ou número à esquerda, texto à direita */
 .card-grid{gap:10px}
 .card-grid>*{display:grid;grid-template-columns:42px 1fr;column-gap:16px;row-gap:4px;align-items:start;padding:18px;border-radius:22px}
 .card-grid>*>.card-icon,.card-grid>*>.step-num{grid-row:1/3;grid-column:1;margin:0}
 .card-grid>*>strong,.card-grid>*>p{grid-column:2}
 /* Cartão sem ícone nem número: texto ocupa a largura toda */
 .card-grid>*:not(:has(>.card-icon)):not(:has(>.step-num)){grid-template-columns:1fr}
 .card-grid>*:not(:has(>.card-icon)):not(:has(>.step-num))>*{grid-column:1}
 .card-grid strong{font-size:16px;line-height:1.3}
 .card-grid p{font-size:13.5px;line-height:1.55}
 .card-icon{width:42px;height:42px}
 .card-icon svg{width:20px;height:20px}
 .step-num{display:grid;place-items:center;width:42px;height:42px;border-radius:50%;background:linear-gradient(180deg,#E7F3FB,#D6EAF7);font-size:13px}

 /* Painel do lojista */
 .app-band{padding:26px 18px 20px;gap:26px;border-radius:26px}
 .mock-card{padding:18px}
 .mock-value{font-size:30px}

 /* Simulação */
 .sim-band{padding:22px 12px 12px}
 .sim-intro{gap:12px}

 /* Perguntas e fechamento */
 .faq summary{padding:18px 2px;font-size:16px}
 .closing{min-height:0;padding:56px 20px;gap:22px}
 .closing .pill{width:100%}
}
