:root{
  --navy:#082f58;--blue:#0d477d;--blue-soft:#eaf3fb;--yellow:#ffb800;--yellow-deep:#f0a800;
  --ink:#132238;--muted:#667386;--line:#dfe6ed;--white:#fff;--danger:#c83737;--success:#248555;
  --shadow:0 30px 80px rgba(8,47,88,.16);
  --header:76px;--gutter:clamp(16px,3.2vw,48px);
  --ease:cubic-bezier(.77,0,.18,1);--dur:.95s;
  /* largura do casal recortado (proporção 750x613) */
  --pw:min(54vw,calc((100dvh - 40px) * 1.2235));
}
*{box-sizing:border-box}
html,body{height:100%;margin:0;overflow:hidden}
body{color:var(--ink);background:#fff;font-family:Inter,Arial,sans-serif;-webkit-font-smoothing:antialiased}
button,input,select{font:inherit;color:inherit}
button,a{-webkit-tap-highlight-color:transparent}
a{text-decoration:none;color:inherit}
svg{width:1.15em;height:1.15em;stroke-width:2;flex:none}
[inert]{pointer-events:none}

/* ---------- Palco ---------- */
.stage{position:fixed;inset:0;height:100dvh;overflow:hidden;background:#fff}

.bg{position:absolute;inset:0;z-index:0}
.bg-photo,.bg-shade{position:absolute;inset:0;width:100%;height:100%;transition:opacity var(--dur) ease,transform 1.6s var(--ease)}
.bg-photo{object-fit:cover;object-position:center}
.bg-shade{background:linear-gradient(90deg,rgba(3,30,58,.92) 0%,rgba(3,30,58,.72) 30%,rgba(3,30,58,.12) 60%,rgba(3,30,58,0) 100%)}
.bg-sun{position:absolute;left:calc(100vw - var(--pw) * 1.02);bottom:calc(var(--pw) * -.18);width:calc(var(--pw) * .95);aspect-ratio:1;border-radius:50%;
  background:radial-gradient(circle at 50% 50%,#fff3cf 0%,#ffe9a8 38%,rgba(255,233,168,.0) 70%);opacity:0;transform:scale(.7);transition:opacity var(--dur) ease .15s,transform 1.2s var(--ease) .1s}
.stage:not([data-scene="intro"]) .bg-photo{opacity:0;transform:scale(1.06)}
.stage:not([data-scene="intro"]) .bg-shade{opacity:0}
.stage:not([data-scene="intro"]):not([data-scene="thanks"]) .bg-sun{opacity:1;transform:scale(1)}

/* ---------- Casal ---------- */
.people{position:absolute;z-index:2;left:0;bottom:0;width:var(--pw);height:auto;aspect-ratio:750/613;pointer-events:none;user-select:none;
  transform:translateX(calc(100vw - var(--pw) - 1vw));transition:transform var(--dur) var(--ease),width var(--dur) var(--ease),opacity .6s ease;will-change:transform}
/* nas cenas brancas o casal continua à direita; o painel entra pela esquerda */
.stage[data-scene="form"] .people,.stage[data-scene="finance"] .people{transform:translateX(calc(100vw - var(--pw) * .94))}
.stage[data-scene="thanks"] .people{transform:translateX(calc(100vw + 2vw));opacity:0}
.stage[data-scene="result"] .people{width:calc(var(--pw) * .82);transform:translateX(calc(100vw - var(--pw) * .66))}

/* ---------- Marca d'água (entre o fundo e o casal) ---------- */
.watermark{position:absolute;z-index:1;left:0;bottom:calc(var(--pw) * .08);width:calc(var(--pw) * .92);aspect-ratio:1;max-height:calc(100dvh - var(--header));object-fit:contain;pointer-events:none;user-select:none;
  opacity:.32;filter:saturate(.9);-webkit-mask-image:radial-gradient(circle at 50% 48%,#000 50%,transparent 70%);mask-image:radial-gradient(circle at 50% 48%,#000 50%,transparent 70%);
  transform:translateX(calc(100vw - var(--pw) * .97 - 1vw));
  transition:transform var(--dur) var(--ease),opacity var(--dur) ease,filter var(--dur) ease,width var(--dur) var(--ease)}
.stage[data-scene="thanks"] .watermark{opacity:0;transform:translateX(calc(100vw + 2vw))}
.stage[data-scene="form"] .watermark,.stage[data-scene="finance"] .watermark{opacity:.1;transform:translateX(calc(100vw - var(--pw) * .9))}
.stage[data-scene="result"] .watermark{opacity:.1;width:calc(var(--pw) * .78);transform:translateX(calc(100vw - var(--pw) * .7))}

/* ---------- Topo ---------- */
.topbar{position:absolute;z-index:10;top:0;left:0;right:0;height:var(--header);padding:0 var(--gutter);display:flex;align-items:center;justify-content:space-between;gap:16px}
.brand{height:calc(var(--header) - 18px);aspect-ratio:1;background:#fff;border-radius:14px;padding:4px;box-shadow:0 8px 24px rgba(3,30,58,.18);display:flex}
.brand img{width:100%;height:100%;object-fit:contain}
.steps{display:flex;gap:8px}
.steps span{width:28px;height:4px;border-radius:4px;background:rgba(255,255,255,.35);transition:background .5s,width .5s}
.stage:not([data-scene="intro"]) .steps span{background:var(--line)}
.stage[data-scene="intro"] .steps [data-step="intro"],.stage[data-scene="form"] .steps [data-step="form"],.stage[data-scene="result"] .steps [data-step="result"],.stage[data-scene="finance"] .steps [data-step="finance"]{background:var(--yellow);width:44px}
.topbar-cta{display:flex;align-items:center;gap:8px;padding:11px 16px;border-radius:999px;font-size:14px;font-weight:700;color:#fff;background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.35);backdrop-filter:blur(8px);transition:background .5s,color .5s,border-color .5s}
.stage:not([data-scene="intro"]) .topbar-cta{background:var(--navy);border-color:var(--navy)}
.topbar-cta:hover{background:var(--yellow);border-color:var(--yellow);color:#17212e}

/* ---------- Cenas ---------- */
.scene{position:absolute;inset:0;z-index:5;padding:calc(var(--header) + 8px) var(--gutter) var(--gutter);display:flex;align-items:center;
  opacity:0;visibility:hidden;transition:opacity .55s ease,transform .8s var(--ease),visibility 0s linear .8s}
.stage[data-scene="intro"] .scene-intro,.stage[data-scene="form"] .scene-form,.stage[data-scene="result"] .scene-result,.stage[data-scene="finance"] .scene-finance,.stage[data-scene="thanks"] .scene-thanks{opacity:1;visibility:visible;transform:none;transition:opacity .6s ease .35s,transform .9s var(--ease) .2s,visibility 0s}
.scene-intro{transform:translateX(-60px)}
.scene-form,.scene-result,.scene-finance{justify-content:flex-start;transform:translateX(-80px)}
.scene-thanks{justify-content:center;transform:scale(.96)}
.stage[data-scene="thanks"] .steps{opacity:0}

/* Cena 1 */
.intro-content{width:min(600px,calc(100vw - var(--pw) - var(--gutter) * 1.5));color:#fff}
.eyebrow,.kicker{display:inline-flex;align-items:center;gap:8px;text-transform:uppercase;font-size:12px;font-weight:800;letter-spacing:1.4px}
.eyebrow{color:var(--yellow);margin-bottom:16px}
.intro-content h1 span{color:var(--yellow)}
.intro-content h1{font-family:"Barlow Condensed",Arial,sans-serif;font-size:clamp(44px,5.6vw,88px);line-height:.95;margin:0}
.intro-content>p{font-size:clamp(16px,1.5vw,21px);line-height:1.5;margin:18px 0 28px;color:rgba(255,255,255,.86);max-width:460px}
.intro-trust{display:flex;flex-wrap:wrap;gap:10px 22px;margin-top:26px}
.intro-trust span{display:flex;align-items:center;gap:7px;font-size:13px;font-weight:600;color:rgba(255,255,255,.8)}
.intro-trust svg{color:var(--yellow)}

.primary-button{min-height:54px;border:0;border-radius:10px;background:var(--yellow);color:#17212e;font-weight:800;font-size:16px;display:inline-flex;align-items:center;justify-content:center;gap:10px;padding:0 26px;cursor:pointer;box-shadow:0 14px 32px rgba(255,184,0,.28);transition:transform .2s,background .2s,box-shadow .2s}
.primary-button:hover{background:#ffc832;transform:translateY(-2px)}
.primary-button:disabled{opacity:.7;cursor:wait;transform:none}

/* ---------- Painéis ---------- */
.panel{container-type:inline-size;background:#fff;border:1px solid rgba(8,47,88,.08);border-radius:22px;box-shadow:var(--shadow);
  max-height:100%;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin}
.calculator,.finance{width:min(560px,calc(100vw - var(--pw) * .86 - var(--gutter) * 2));padding:clamp(18px,2.4vh,28px) clamp(18px,2.2vw,30px);display:flex;flex-direction:column;gap:clamp(10px,1.6vh,16px)}
.results{width:min(900px,calc(100vw - var(--pw) * .58 - var(--gutter) * 2));height:100%;max-height:760px;padding:clamp(16px,2.2vh,26px) clamp(18px,2vw,28px);display:flex;flex-direction:column;gap:clamp(10px,1.6vh,16px)}

.panel-head{display:flex;align-items:center;gap:12px}
.panel-head>div:not(.data-status){flex:1;min-width:0}
.kicker{color:var(--blue);margin-bottom:4px}
.panel-head h2{font-family:"Barlow Condensed",Arial,sans-serif;font-size:clamp(26px,3.4vh,36px);line-height:1;margin:0;color:var(--navy)}
.ghost-button{width:40px;height:40px;flex:none;display:grid;place-items:center;border-radius:12px;border:1px solid var(--line);background:#fff;color:var(--navy);cursor:pointer;transition:background .2s,border-color .2s}
.ghost-button:hover{background:var(--blue-soft);border-color:#c7d9ea}

.data-status{display:flex;align-items:center;gap:7px;font-size:12px;font-weight:700;color:var(--muted);white-space:nowrap}
.data-status>span{width:8px;height:8px;border-radius:50%;background:var(--yellow);animation:pulse 1.2s infinite}
.data-status.ready{color:var(--success)}.data-status.ready>span{background:var(--success);animation:none}
.data-status.error{color:var(--danger)}.data-status.error>span{background:var(--danger);animation:none}
@keyframes pulse{50%{opacity:.3}}

/* Formulário */
.fields{display:grid;grid-template-columns:1fr 1fr;gap:clamp(8px,1.4vh,14px) 12px}
.field{min-width:0}.full{grid-column:1/-1}
.field .label{display:block;font-size:13px;font-weight:700;color:var(--navy);margin-bottom:6px}
.location{display:flex;align-items:center;gap:10px;height:clamp(44px,5.6vh,52px);padding:0 14px;border-radius:12px;background:var(--blue-soft);color:var(--navy);font-size:15px}
.location svg{color:var(--yellow-deep)}
.location small{margin-left:auto;font-size:11px;font-weight:700;color:var(--blue);text-transform:uppercase;letter-spacing:.8px}
.field label{display:block;font-size:13px;font-weight:700;color:var(--navy);margin-bottom:6px}
.input-wrap,.currency-input{position:relative;display:flex;align-items:center;height:clamp(44px,5.6vh,52px);border:1.5px solid var(--line);border-radius:12px;background:#fbfcfd;transition:border-color .2s,box-shadow .2s,background .2s}
.input-wrap:focus-within,.currency-input:focus-within{border-color:var(--blue);background:#fff;box-shadow:0 0 0 4px rgba(13,71,125,.1)}
.input-wrap>svg:first-child{position:absolute;left:14px;color:#8a97a6;pointer-events:none}
.input-wrap input,.input-wrap select,.currency-input input{width:100%;height:100%;border:0;background:transparent;outline:0;padding:0 14px 0 42px;font-size:15px;min-width:0}
.select-wrap select{appearance:none;padding-right:36px;cursor:pointer;text-overflow:ellipsis}
.select-wrap select:disabled{cursor:not-allowed;color:#9aa5b1}
.select-icon{position:absolute;right:12px;color:#8a97a6;pointer-events:none}
.currency-input span{padding-left:16px;font-weight:800;color:var(--navy)}
.currency-input input{padding-left:8px;font-size:18px;font-weight:700}
.quick-values{display:flex;gap:8px;margin-top:8px}
.quick-values button{flex:1;height:34px;border-radius:9px;border:1px solid var(--line);background:#fff;font-size:13px;font-weight:700;color:var(--blue);cursor:pointer;transition:all .2s}
.quick-values button:hover{border-color:var(--blue)}
.quick-values button.active{background:var(--navy);border-color:var(--navy);color:#fff}
.field-error{display:none;color:var(--danger);font-size:12px;font-weight:600;margin-top:4px}
.field.invalid .field-error{display:block}
.field.invalid .input-wrap,.field.invalid .currency-input{border-color:var(--danger)}
.consent{display:flex;align-items:center;gap:10px;font-size:13px;color:var(--muted);cursor:pointer;line-height:1.35}
.consent input{position:absolute;opacity:0;width:0;height:0}
.checkmark{width:22px;height:22px;flex:none;border-radius:7px;border:1.5px solid #c6d1dc;display:grid;place-items:center;color:transparent;background:#fff;transition:all .2s}
.checkmark svg{width:14px;height:14px;stroke-width:3}
.consent input:checked+.checkmark{background:var(--navy);border-color:var(--navy);color:#fff}
.consent input:focus-visible+.checkmark{box-shadow:0 0 0 4px rgba(13,71,125,.15)}
.form-alert{display:none;padding:10px 14px;border-radius:10px;background:#fdf0f0;color:var(--danger);font-size:13px;font-weight:600}
.form-alert.show{display:block}
.submit-button{width:100%;flex:none}
.privacy{display:flex;align-items:center;justify-content:center;gap:6px;margin:0;font-size:12px;color:var(--muted);text-align:center}

/* ---------- Financiamento ---------- */
.finance{padding:clamp(18px,2.4vh,28px) clamp(18px,2.2vw,30px);display:flex;flex-direction:column;gap:clamp(10px,1.5vh,14px)}
.fin-count{font-size:12px;font-weight:800;color:var(--blue);background:var(--blue-soft);padding:6px 10px;border-radius:999px;white-space:nowrap}
.fin-perks{display:flex;flex-wrap:wrap;gap:6px}
.fin-perks span{display:flex;align-items:center;gap:6px;font-size:12px;color:var(--ink);background:#fff8e6;border:1px solid #ffe7a6;padding:5px 10px;border-radius:999px}
.fin-perks svg{color:var(--yellow-deep);width:15px;height:15px}
.fin-progress{height:4px;border-radius:4px;background:var(--line);overflow:hidden}
.fin-progress span{display:block;height:100%;width:50%;background:var(--yellow);border-radius:4px;transition:width .5s var(--ease)}
.finance[data-step="2"] .fin-progress span{width:100%}
.fin-step{border:0;margin:0;padding:0;min-width:0;animation:fade .35s ease}
.prefill-note{display:flex;align-items:center;gap:6px;margin-top:6px;padding:7px 10px;border-radius:10px;background:#eaf7ef;color:var(--success);font-size:12px;font-weight:600;letter-spacing:0;text-transform:none}
.prefill-note[hidden]{display:none}
.prefill-note svg{width:14px;height:14px}
.fin-step legend{width:100%;padding:0;margin-bottom:10px;font-size:12px;font-weight:800;letter-spacing:1.2px;text-transform:uppercase;color:var(--muted)}
.finance[data-step="1"] [data-fin-step="2"],.finance[data-step="2"] [data-fin-step="1"]{display:none}
.field label em{font-style:normal;font-weight:500;color:var(--muted)}
.input-wrap input[type="date"]{padding-right:10px}

/* ---------- Agradecimento ---------- */
.thanks{display:grid;justify-items:center;text-align:center;gap:14px;max-width:520px}
.thanks-logo{width:clamp(120px,22vh,180px);height:auto;animation:pop .8s var(--ease) both .3s}
.thanks h2{margin:6px 0 0;font-family:"Barlow Condensed",Arial,sans-serif;font-size:clamp(34px,5vh,48px);line-height:1;color:var(--navy)}
.thanks p{margin:0;font-size:16px;line-height:1.55;color:var(--muted)}
.thanks .secondary-button{margin-top:8px}
@keyframes pop{from{opacity:0;transform:scale(.7) rotate(-8deg)}}

.secondary-button{min-height:54px;border:1.5px solid var(--line);border-radius:10px;background:#fff;color:var(--navy);font-weight:800;font-size:15px;display:inline-flex;align-items:center;justify-content:center;gap:10px;padding:0 22px;cursor:pointer;transition:border-color .2s,background .2s}
.secondary-button:hover{border-color:var(--navy);background:var(--blue-soft)}

/* ---------- Resultados ---------- */
.savings{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:clamp(14px,2.2vh,22px) clamp(16px,2vw,26px);border-radius:18px;color:#fff;
  background:radial-gradient(circle at 92% 20%,rgba(255,184,0,.32),transparent 40%),linear-gradient(120deg,var(--navy),var(--blue));flex:none}
.savings-copy span{font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:1.2px;color:rgba(255,255,255,.72)}
.savings-copy strong{display:block;font-family:"Barlow Condensed",Arial,sans-serif;font-size:clamp(38px,6vh,62px);line-height:1;margin:4px 0;color:var(--yellow)}
.savings-copy p{margin:0;font-size:14px;color:rgba(255,255,255,.82)}
.savings-copy b{color:#fff}
.sun-meter{display:grid;justify-items:center;text-align:center;flex:none;width:clamp(96px,14vh,128px);aspect-ratio:1;border-radius:50%;place-content:center;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.18)}
.sun-meter svg{color:var(--yellow);width:22px;height:22px}
.sun-meter strong{font-family:"Barlow Condensed",Arial,sans-serif;font-size:clamp(26px,4vh,36px);line-height:1}
.sun-meter small{font-size:10px;color:rgba(255,255,255,.75);max-width:80px;line-height:1.2}

.metrics{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;flex:none}
.metric{padding:clamp(10px,1.6vh,14px) 14px;border:1px solid var(--line);border-radius:14px;background:#fbfcfd;display:grid;gap:3px;min-width:0}
.metric svg{color:var(--yellow-deep);width:20px;height:20px}
.metric span{font-size:12px;color:var(--muted);font-weight:600}
.metric strong{font-size:clamp(14px,2vh,18px);color:var(--navy);line-height:1.2}

.projection{flex:1;min-height:150px;display:grid;grid-template-columns:minmax(170px,.8fr) 2fr;gap:16px;padding:clamp(12px,1.8vh,18px);border:1px solid var(--line);border-radius:16px}
.projection-copy{display:flex;flex-direction:column;min-width:0}
.projection-copy>strong{font-family:"Barlow Condensed",Arial,sans-serif;font-size:clamp(28px,4.4vh,40px);line-height:1;color:var(--success);margin-top:4px}
.projection-copy>small{font-size:13px;color:var(--muted);margin-bottom:auto}
.chart-legend{display:flex;flex-wrap:wrap;gap:12px;font-size:12px;font-weight:600;color:var(--muted);margin:10px 0 8px}
.chart-legend span{display:flex;align-items:center;gap:6px}
.chart-legend span::before{content:"";width:14px;height:3px;border-radius:3px;background:#9aa7b5}
.chart-legend .solar::before{background:var(--yellow)}
.technical{display:flex;flex-wrap:wrap;gap:6px}
.technical span{font-size:11px;font-weight:600;color:var(--blue);background:var(--blue-soft);padding:4px 8px;border-radius:999px}
.chart-wrap{position:relative;min-height:0;min-width:0}
.chart-wrap canvas{position:absolute;inset:0;width:100%;height:100%}

.result-cta{display:flex;align-items:center;gap:10px;flex:none}
.result-cta .primary-button{flex:1.4}
.result-cta .secondary-button{flex:1}
.result-cta .whats{width:54px;height:54px;color:var(--success)}
.result-note{margin:-4px 0 0;font-size:11px;color:var(--muted);text-align:center;flex:none}

/* ---------- Como calculamos ---------- */
.info-link{display:flex;align-items:center;gap:7px;border:0;background:none;padding:0;cursor:pointer;font-size:13px;font-weight:700;color:#fff;text-decoration:underline;text-underline-offset:3px}
.info-link svg{color:var(--yellow)}
.info{position:absolute;inset:0;z-index:30;display:grid;place-items:center;padding:16px;background:rgba(3,30,58,.55);backdrop-filter:blur(4px);animation:fade .25s ease}
.info[hidden]{display:none}
.info-card{width:min(640px,100%);max-height:100%;overflow-y:auto;background:#fff;border-radius:22px;padding:clamp(18px,3vw,30px);box-shadow:var(--shadow);display:grid;gap:14px;color:var(--ink);font-size:14px;line-height:1.55}
.info-head{display:flex;align-items:center;justify-content:space-between;gap:12px}
.info-head h2{margin:0;font-family:"Barlow Condensed",Arial,sans-serif;font-size:30px;line-height:1;color:var(--navy)}
.info-card p{margin:0}
.info-faq{display:grid;gap:8px}
.info-faq details{border:1px solid var(--line);border-radius:12px;padding:10px 14px}
.info-faq summary{cursor:pointer;font-weight:700;color:var(--navy)}
.info-faq details p{margin-top:8px;color:var(--muted)}
.info address{font-style:normal;font-size:12px;color:var(--muted)}
.info address svg{vertical-align:-3px;color:var(--yellow-deep)}
.info address a{color:var(--blue);font-weight:700}
@keyframes fade{from{opacity:0}}

/* Painéis estreitos (container queries) */
@container (max-width:520px){.metrics{grid-template-columns:repeat(2,1fr)}}
@container (max-width:640px){
  .projection{grid-template-columns:1fr;grid-template-rows:auto minmax(64px,1fr);min-height:0;gap:6px}
  .metric{grid-template-columns:auto 1fr;column-gap:10px;align-items:center;padding:8px 12px}
  .metric svg{grid-row:span 2}
  .metric span{font-size:11px}
  .metric strong{font-size:15px}
  .panel-head h2{font-size:clamp(24px,3.4vh,32px)}
  .projection-copy{display:grid;grid-template-columns:auto 1fr;align-items:end;column-gap:10px}
  .projection-copy .kicker{grid-column:1/-1}
  .projection-copy>small{margin:0 0 4px}
  .projection-copy .chart-legend,.projection-copy .technical{grid-column:1/-1;margin:4px 0 0}
  .projection-copy .technical{display:none}
  .savings-copy strong{font-size:clamp(34px,5.4vh,52px)}
  .result-cta{flex-wrap:wrap;gap:8px}
  .result-cta .primary-button{flex:1 1 100%}
  .result-cta .primary-button,.result-cta .secondary-button{min-height:48px}
  .result-cta .whats{width:48px;height:48px}
}
@container (max-width:300px){.fields{grid-template-columns:1fr}}
@container (max-width:420px){
  .fin-perks{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;margin-inline:-2px}
  .fin-perks span{flex:none}
  .fin-perks::-webkit-scrollbar{display:none}
  .location small{display:none}
  .data-status{display:none}
  .select-wrap select{padding-left:36px;padding-right:28px;font-size:14px}
  .select-wrap>svg:first-child{left:11px}
  .technical{display:none}
  .sun-meter{display:none}
}

/* ---------- Tablet / celular ---------- */
@media (max-width:900px){
  :root{--header:64px;--pw:min(100vw,calc(52dvh * 1.2235))}
  .bg-photo{object-position:72% center}
  .bg-shade{background:linear-gradient(180deg,rgba(3,30,58,.9) 0%,rgba(3,30,58,.7) 38%,rgba(3,30,58,.1) 70%,rgba(3,30,58,0) 100%)}
  .scene-intro{align-items:flex-start;padding-top:calc(var(--header) + 3vh)}
  .intro-content{width:100%;max-width:560px}
  .intro-content h1 span{color:var(--yellow)}
.intro-content h1{font-size:clamp(38px,10vw,64px)}
  .intro-content>p{margin:12px 0 20px}
  .intro-trust{margin-top:18px}
  .people{transform:translateX(calc(100vw - var(--pw)))}
  .stage:not([data-scene="intro"]) .people{width:var(--pw);transform:translateX(-105%);opacity:0}
  .watermark{width:calc(var(--pw) * .95);bottom:calc(var(--pw) * .1);opacity:.22;transform:translateX(calc(100vw - var(--pw) * .975))}
  .stage:not([data-scene="intro"]) .watermark{width:calc(var(--pw) * .7);opacity:0;transform:translateX(-105%)}
  .bg-sun{display:none}
  .scene-form,.scene-result,.scene-finance{justify-content:center;align-items:stretch;padding:calc(var(--header) + 4px) 12px 12px}
  .calculator,.results,.finance{width:100%;max-width:640px;height:auto;max-height:100%;margin:auto;border-radius:20px}
  .results{height:100%;max-height:none}
  .steps{display:none}
}
@media (max-width:520px){
  .topbar-cta span{display:none}
  .topbar-cta{padding:11px}
  .panel{box-shadow:0 10px 40px rgba(8,47,88,.12)}
  .privacy{display:none}
  .quick-values button{height:32px;font-size:12px}
  .savings{padding:14px 16px}
}
@media (max-height:700px){
  .calculator .kicker,.finance .kicker{display:none}
  .fields{row-gap:8px}
  .location{height:40px}
  .field label,.field .label{margin-bottom:4px}
  .calculator,.finance{gap:10px}
  .intro-trust{display:flex!important}.intro-trust span{display:none}
  .savings-copy>span{display:none}
  .chart-legend{margin:2px 0 0}
  .results .kicker{display:none}
  .result-note{display:none}
  .privacy{display:none}
  .quick-values{margin-top:6px}
}
@media (prefers-reduced-motion:reduce){
  :root{--dur:.01s}
  *,*::before,*::after{transition-duration:.01s!important;animation:none!important}
}