/* ==========================================================================
   QRA · Calculadora de poupança IA — page styles
   Extracted verbatim from the canvas inline <style> (incl. .qra-range slider).
   Load AFTER tokens.css + qra-components.css.
   ========================================================================== */
*{box-sizing:border-box;}
html,body{margin:0;padding:0;background:var(--surface-1);}
body{font-family:var(--font-body);color:var(--text-body);-webkit-font-smoothing:antialiased;}
a{color:var(--text-link);text-decoration:none;}
a:hover{color:var(--text-link-hover);}
.qra-range{-webkit-appearance:none;appearance:none;width:100%;height:6px;border-radius:var(--radius-full);background:var(--surface-3);outline:none;cursor:pointer;margin:0;}
.qra-range:focus-visible{box-shadow:var(--shadow-focus);}
.qra-range::-webkit-slider-thumb{-webkit-appearance:none;width:22px;height:22px;border-radius:50%;background:var(--primary-500);border:3px solid #fff;box-shadow:var(--shadow-sm);cursor:pointer;}
.qra-range::-moz-range-thumb{width:22px;height:22px;border-radius:50%;background:var(--primary-500);border:3px solid #fff;box-shadow:var(--shadow-sm);cursor:pointer;}
@keyframes qraReveal{from{opacity:0;transform:translateY(10px);}to{opacity:1;transform:none;}}
@keyframes qraFadeIn{from{opacity:0;}to{opacity:1;}}
/* Nav / mega-menu now live in qra-components.css (shared). Page override below: */
.qra-navbar{margin-bottom:0;}
[data-faq-item]:first-child{border-top:none !important;}
.qra-turn{animation:qraReveal .34s ease both;}
.qra-chatava{flex-shrink:0;width:32px;height:32px;border-radius:9px;background:var(--primary-50);display:inline-flex;align-items:center;justify-content:center;margin-top:1px;}
.qra-assist{background:var(--surface-0);border:1px solid var(--border-default);border-radius:4px 14px 14px 14px;box-shadow:var(--shadow-xs);padding:14px 18px;font-size:15px;line-height:1.5;color:var(--text-strong);max-width:88%;}
.qra-userb{background:var(--primary-500);color:#fff;border-radius:14px 14px 4px 14px;padding:11px 18px;font-size:14px;font-weight:600;max-width:82%;box-shadow:var(--shadow-sm);text-wrap:pretty;}
.qra-chip{appearance:none;cursor:pointer;font-family:var(--font-body);font-size:14px;font-weight:600;padding:11px 18px;border-radius:9999px;border:1.5px solid var(--border-default);background:var(--surface-0);color:var(--text-strong);transition:border-color .12s,background .12s,color .12s;text-align:left;}
.qra-chip:hover{border-color:var(--primary-400);background:var(--primary-50);color:var(--primary-700);}
.qra-chip[data-sel="1"]{background:var(--primary-500);border-color:var(--primary-500);color:#fff;}
.qra-chip[data-sel="1"]:hover{background:var(--primary-600);border-color:var(--primary-600);color:#fff;}
.qra-progfoot{position:fixed;left:50%;transform:translateX(-50%);bottom:16px;width:calc(100% - 32px);max-width:820px;z-index:25;background:rgba(255,255,255,.92);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border:1px solid var(--border-default);border-radius:var(--radius-xl);box-shadow:0 12px 34px rgba(21,13,51,.16);padding:13px 20px;}
@keyframes qraCalcFill{from{width:0}to{width:100%}}
@keyframes qraPulse{0%,100%{transform:scale(1)}50%{transform:scale(1.08)}}
.qra-calcbar{width:0;animation:qraCalcFill 5s linear forwards;}
.qra-calcpulse{animation:qraPulse 1.4s ease-in-out infinite;}
.qra-wa{display:flex;align-items:stretch;border:1.5px solid var(--border-default);border-radius:var(--radius-sm);background:var(--surface-0);position:relative;transition:border-color .12s,box-shadow .12s;}
.qra-wa:focus-within{border-color:var(--primary-500);box-shadow:var(--shadow-focus);}
.qra-wa-cc{display:flex;align-items:center;gap:7px;padding:0 12px;border:none;border-right:1px solid var(--border-default);background:transparent;cursor:pointer;font-family:var(--font-body);white-space:nowrap;}
.qra-wa-cc:hover{background:var(--primary-50);}
.qra-wa-input{flex:1;min-width:0;border:none;outline:none;background:transparent;padding:12px 14px;font-family:var(--font-body);font-size:15px;color:var(--text-strong);}
.qra-wa-input::placeholder{color:var(--text-subtle);}
.qra-wa-menu{position:absolute;top:calc(100% + 6px);left:0;z-index:30;width:300px;max-width:90vw;max-height:280px;overflow-y:auto;background:var(--surface-0);border:1px solid var(--border-default);border-radius:var(--radius-md);box-shadow:0 20px 50px rgba(21,13,51,.18);padding:6px;}
.qra-wa-opt{display:flex;align-items:center;gap:10px;width:100%;padding:9px 12px;border:none;background:transparent;cursor:pointer;border-radius:var(--radius-sm);font-family:var(--font-body);text-align:left;}
.qra-wa-opt:hover{background:var(--primary-50);}
.qra-wa-opt[data-sel="1"]{background:var(--primary-50);}
.qra-pgbtn{appearance:none;cursor:pointer;font-family:var(--font-body);font-size:14px;font-weight:600;padding:10px 18px;border-radius:9999px;border:1.5px solid var(--border-default);background:var(--surface-0);color:var(--text-strong);transition:border-color .12s,background .12s,color .12s,opacity .12s;}
.qra-pgbtn:hover:not(:disabled){border-color:var(--primary-400);background:var(--primary-50);color:var(--primary-700);}
.qra-pgbtn:disabled{opacity:.35;cursor:not-allowed;}
.qra-dot{appearance:none;cursor:pointer;width:9px;height:9px;padding:0;border-radius:50%;border:none;background:var(--neutral-300);transition:width .18s,background .18s,border-radius .18s;}
.qra-dot[data-active="1"]{background:var(--primary-500);width:22px;border-radius:9999px;}
.qra-topfade{position:fixed;top:0;left:0;right:0;height:130px;z-index:15;pointer-events:none;background:linear-gradient(180deg,var(--primary-50) 35%,rgba(238,231,255,0));backdrop-filter:blur(7px);-webkit-backdrop-filter:blur(7px);-webkit-mask-image:linear-gradient(180deg,#000 58%,transparent);mask-image:linear-gradient(180deg,#000 58%,transparent);}

/* ==========================================================================
   App content (stages) — extracted from inline styles into semantic classes.
   ========================================================================== */
.calc-page{background:var(--primary-50);min-height:100vh;}
.calc-app{padding:var(--space-6) var(--gutter) 116px;display:flex;justify-content:center;align-items:center;min-height:calc(100vh - 92px);}
.calc-shell{width:100%;max-width:820px;}

/* Intro */
.calc-eyebrow{display:inline-flex;align-items:center;gap:9px;font-family:var(--font-mono);font-size:var(--text-2xs);font-weight:var(--weight-bold);letter-spacing:.14em;text-transform:uppercase;color:var(--primary-500);margin-bottom:var(--space-4);}
.calc-eyebrow-ico{width:26px;height:26px;border-radius:var(--radius-lg);background:var(--primary-50);display:inline-flex;align-items:center;justify-content:center;}
.calc-h1{font-family:var(--font-display);font-weight:var(--weight-bold);font-size:var(--text-4xl);line-height:var(--leading-tight);letter-spacing:var(--tracking-tight);color:var(--text-strong);margin:0 0 var(--space-2);text-wrap:balance;}
.calc-lead{font-size:var(--text-md);line-height:var(--leading-normal);color:var(--text-muted);margin:0 0 var(--space-5);}
.calc-fieldlabel{display:block;font-size:var(--text-sm);font-weight:var(--weight-semibold);color:var(--text-body);margin-bottom:6px;}
.calc-note{text-align:center;font-size:var(--text-xs);color:var(--text-subtle);margin:var(--space-4) 0 0;}

/* Welcome / calculating badge tiles */
.calc-tile{display:inline-flex;align-items:center;justify-content:center;background:var(--surface-0);border:1px solid var(--border-default);box-shadow:var(--shadow-sm);}
.calc-tile-lg{width:64px;height:64px;border-radius:var(--radius-2xl);margin-bottom:var(--space-5);}
.calc-tile-xl{width:72px;height:72px;border-radius:var(--radius-3xl);box-shadow:var(--shadow-md);margin-bottom:26px;}
.calc-welcome-h1{font-family:var(--font-display);font-weight:var(--weight-bold);font-size:var(--text-4xl);line-height:var(--leading-tight);letter-spacing:var(--tracking-tight);color:var(--text-strong);margin:0 0 var(--space-4);text-wrap:balance;}
.calc-welcome-p{font-size:var(--text-lg);line-height:var(--leading-relaxed);color:var(--text-body);margin:0 auto var(--space-4);max-width:52ch;}
.calc-calc-h1{font-family:var(--font-display);font-weight:var(--weight-bold);font-size:var(--text-3xl);letter-spacing:var(--tracking-tight);color:var(--text-strong);margin:0 0 var(--space-2);}
.calc-calc-msg{font-size:var(--text-lg);color:var(--primary-600);font-weight:var(--weight-semibold);margin:0 0 28px;min-height:24px;}
.calc-progline{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--space-2);}
.calc-progtrack{height:6px;border-radius:var(--radius-full);background:var(--surface-3);overflow:hidden;}
.calc-progtrack--lg{height:8px;max-width:420px;margin:0 auto;}
.calc-progfill{height:100%;border-radius:var(--radius-full);background:var(--primary-500);transition:width .3s ease;}

/* Report */
.calc-report-h1{font-family:var(--font-display);font-weight:var(--weight-bold);font-size:var(--display-md);line-height:1.18;letter-spacing:var(--tracking-tight);margin:0;text-wrap:balance;}
.calc-report-h2{font-family:var(--font-display);font-weight:var(--weight-semibold);font-size:var(--text-2xl);color:var(--text-strong);margin:0 0 var(--space-1);}
.calc-statcard{background:var(--surface-0);border-radius:var(--radius-xl);padding:var(--space-5) 26px;}
.calc-statnum{font-family:var(--font-display);font-weight:var(--weight-bold);font-size:var(--display-lg);line-height:var(--leading-none);letter-spacing:var(--tracking-tight);}
.calc-statlabel{font-size:var(--text-base);color:var(--text-muted);margin-top:10px;}
.calc-pill{display:inline-flex;align-items:center;gap:6px;font-size:var(--text-xs);font-weight:var(--weight-semibold);padding:3px 10px;border-radius:var(--radius-3xl);background:var(--primary-100);color:var(--primary-700);}
.calc-ringpct{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-family:var(--font-display);font-weight:var(--weight-bold);font-size:var(--text-3xl);letter-spacing:var(--tracking-tight);color:var(--primary-600);}
.calc-step-eyebrow{display:flex;align-items:center;gap:7px;font-size:var(--text-xs);font-weight:var(--weight-bold);letter-spacing:.08em;text-transform:uppercase;color:var(--primary-600);margin-bottom:var(--space-3);}
.calc-adjust{font-size:var(--text-sm);font-weight:var(--weight-semibold);color:var(--text-subtle);cursor:pointer;}