/* =============================================================
   Moreira Júnior · Calculadora — estilos escopados em #mj-calc
   Paleta: azul marinho + amarelo + creme
============================================================= */

#mj-calc.mj-root{
  --mj-bg:#f7f4ec;
  --mj-surface:#fbf8f0;
  --mj-card:#ffffff;
  --mj-fg:#0e1b3d;
  --mj-muted:#5b6685;
  --mj-border:#e3dcc9;
  --mj-primary:#0e1b3d;
  --mj-primary-2:#0a1430;
  --mj-on-primary:#fbf8f0;
  --mj-accent:#f4c542;
  --mj-accent-deep:#a37310;
  --mj-success:#1f7a4a;
  --mj-danger:#b3261e;

  all: initial;
  display:block;
  font-family:"Inter", system-ui, -apple-system, Segoe UI, Roboto, sans-serif;
  color:var(--mj-fg);
  background:var(--mj-bg);
  line-height:1.5;
  font-size:16px;
  -webkit-font-smoothing:antialiased;
}
#mj-calc *{ box-sizing:border-box; }
#mj-calc h1,#mj-calc h2,#mj-calc h3,#mj-calc h4{
  font-family:"Fraunces", "Times New Roman", serif;
  font-weight:400; letter-spacing:-.02em; margin:0;
}
#mj-calc p{ margin:0; }
#mj-calc em{ font-style:italic; }
#mj-calc strong, #mj-calc b{ font-weight:600; }
#mj-calc a{ color:inherit; text-decoration:none; }
#mj-calc [hidden]{ display:none !important; }

.mj-wrap{ max-width:480px; margin:0 auto; padding:20px 22px 40px; display:flex; flex-direction:column; min-height:100vh; }

/* Header */
.mj-header{ display:flex; align-items:center; justify-content:space-between; }
.mj-brand{ display:flex; align-items:center; gap:10px; font-family:"Fraunces", serif; font-size:15px; }
.mj-brand em{ color:var(--mj-muted); }
.mj-logo{ width:32px; height:32px; border-radius:6px; background:var(--mj-primary); color:var(--mj-on-primary);
  display:flex; align-items:center; justify-content:center; font-weight:600; font-size:13px;
  box-shadow:0 0 0 1px rgba(244,197,66,.6); }
.mj-step-indicator{ font-size:11px; letter-spacing:.18em; text-transform:uppercase; color:var(--mj-muted); }

/* Progress */
.mj-progress{ height:1px; background:var(--mj-border); margin-top:14px; }
.mj-progress-bar{ height:100%; width:0%; background:var(--mj-primary); transition:width .5s ease; }

/* Eyebrow / lead */
.mj-eyebrow{ font-size:11px; text-transform:uppercase; letter-spacing:.18em; color:var(--mj-muted); }
.mj-eyebrow strong{ color:var(--mj-fg); }
.mj-lead{ margin-top:12px; max-width:32rem; font-size:15px; color:rgba(14,27,61,.82); }
.mj-center{ text-align:center; }
.mj-fineprint{ margin-top:10px; font-size:13px; color:var(--mj-muted); }

/* Titles */
.mj-h1{ margin-top:16px; font-size:clamp(44px,12vw,60px); line-height:.98; }
.mj-h1 em{ color:var(--mj-accent-deep); font-weight:300; }
.mj-h2{ margin-top:12px; font-size:clamp(34px,9vw,46px); line-height:1; }
.mj-h2 em{ color:var(--mj-accent-deep); font-weight:300; }
.mj-h3{ margin-top:6px; font-size:22px; line-height:1.2; }

/* Screens */
.mj-screen{ display:flex; flex-direction:column; flex:1; padding-top:28px; }
.mj-intro{ padding-top:32px; }

/* Buttons */
.mj-btn{ all:unset; cursor:pointer; height:52px; padding:0 22px; display:inline-flex; align-items:center; justify-content:center; gap:8px;
  border-radius:8px; font-weight:600; font-size:15px; text-align:center; transition:filter .2s, background .2s; }
.mj-btn-self{ align-self:flex-start; margin-top:28px; }
.mj-btn-primary{ background:var(--mj-primary); color:var(--mj-on-primary); }
.mj-btn-primary:hover{ filter:brightness(1.12); }
.mj-btn-ghost{ background:transparent; color:var(--mj-fg); border:1px solid var(--mj-border); }
.mj-btn-ghost:hover{ background:#efe9d7; }
.mj-btn-whats{ background:#1f9d55; color:#fff; width:100%; margin-top:20px; }
.mj-btn-whats:hover{ filter:brightness(1.08); }
.mj-btn-block{ width:100%; margin-top:12px; }
.mj-nav{ display:grid; grid-template-columns:1fr 1.4fr; gap:12px; margin-top:32px; }

/* Cover (intro) */
.mj-cover{ position:relative; margin:auto -22px 0; min-height:320px; display:flex; align-items:flex-end; justify-content:center; overflow:hidden; }
.mj-cover-glow{ position:absolute; inset:14% 0 0 0; background:radial-gradient(ellipse at bottom, rgba(244,197,66,.35), transparent 68%); pointer-events:none; }
.mj-cover-card{ position:relative; width:88%; height:300px; border-radius:40% 40% 0 0;
  background:linear-gradient(180deg, var(--mj-primary), #050b1f); color:var(--mj-on-primary);
  display:flex; align-items:flex-end; justify-content:center; padding-bottom:36px; }
.mj-avatar{ width:96px; height:96px; border-radius:50%; border:2px solid var(--mj-accent);
  display:flex; align-items:center; justify-content:center; font-family:"Fraunces", serif; font-size:28px; margin:0 auto; }
.mj-cover-name{ margin-top:14px; font-family:"Fraunces", serif; font-size:20px; text-align:center; }
.mj-cover-role{ font-size:11px; text-transform:uppercase; letter-spacing:.18em; opacity:.7; text-align:center; }
.mj-cover-cap{ position:absolute; right:20px; bottom:20px; background:rgba(255,255,255,.85); backdrop-filter:blur(6px);
  border:1px solid var(--mj-border); padding:8px 12px; font-size:12px; }
.mj-cover-cap strong{ display:block; font-size:14px; }
.mj-cover-cap span{ color:var(--mj-muted); }

/* Fields */
.mj-field{ display:block; margin-top:20px; font-size:12px; font-weight:700; text-transform:uppercase; letter-spacing:.06em; color:var(--mj-muted); }
.mj-field input{ display:block; width:100%; margin-top:8px; padding:12px 0; font-size:21px; font-weight:400; text-transform:none; letter-spacing:0; color:var(--mj-fg);
  background:transparent; border:0; border-bottom:1px solid var(--mj-border); outline:none; font-family:inherit; transition:border-color .2s; }
.mj-field input:focus{ border-bottom-color:var(--mj-primary); }
.mj-field input.mj-invalid{ border-bottom-color:var(--mj-danger); }
.mj-error{ display:block; margin-top:6px; font-size:12px; font-weight:500; text-transform:none; letter-spacing:0; color:var(--mj-danger); min-height:1em; }

.mj-money{ position:relative; display:block; margin-top:20px; font-size:12px; font-weight:700; text-transform:uppercase; letter-spacing:.06em; color:var(--mj-muted); }
.mj-money-prefix{ position:absolute; left:0; top:52px; font-family:"Fraunces", serif; font-size:24px; color:var(--mj-accent-deep); pointer-events:none; }
.mj-money input{ display:block; width:100%; margin-top:8px; padding:12px 0 12px 48px; font-family:"Fraunces", serif;
  font-size:clamp(42px,11vw,56px); letter-spacing:-.02em; color:var(--mj-fg); background:transparent; border:0; border-bottom:1px solid var(--mj-border); outline:none; transition:border-color .2s; }
.mj-money input:focus{ border-bottom-color:var(--mj-primary); }
.mj-money input.mj-invalid{ border-bottom-color:var(--mj-danger); }

.mj-consent{ display:flex; gap:12px; align-items:flex-start; margin-top:20px; font-size:14px; color:rgba(14,27,61,.82); }
.mj-consent input{ margin-top:3px; width:18px; height:18px; accent-color:var(--mj-primary); }

/* Sliders */
.mj-slider-box{ margin-top:8px; padding:24px 0; border-top:1px solid var(--mj-border); border-bottom:1px solid var(--mj-border); }
.mj-slider-out{ display:block; font-family:"Fraunces", serif; font-size:48px; line-height:1; }
.mj-slider-out em{ font-size:22px; color:var(--mj-muted); font-style:italic; }
.mj-slider-box input[type=range]{ width:100%; margin-top:24px; accent-color:var(--mj-primary); }
.mj-slider-ticks{ margin-top:8px; display:flex; justify-content:space-between; font-size:12px; color:var(--mj-muted); }
.mj-hint{ margin-top:20px; padding:14px 16px; border-left:3px solid var(--mj-accent); background:rgba(255,255,255,.7); font-size:14px; }

/* Loading */
.mj-loading{ align-items:center; justify-content:flex-start; text-align:center; padding-top:48px; }
.mj-spinner{ width:56px; height:56px; border-radius:50%; border:1px solid var(--mj-border); border-top-color:var(--mj-primary); animation:mjspin 1s linear infinite; margin:0 auto 22px; display:block; }
@keyframes mjspin{ to{ transform:rotate(360deg); } }

/* Result */
.mj-tag{ display:inline-flex; padding:6px 12px; font-size:12px; font-weight:700; color:var(--mj-success); border:1px solid var(--mj-border); border-radius:999px; }
.mj-bignum{ margin-top:18px; font-family:"Fraunces", serif; font-size:28px; color:var(--mj-success); }
.mj-bignum strong{ font-size:clamp(54px,15vw,76px); font-weight:500; }
.mj-bignum-md{ font-size:42px; }
.mj-bignum-md small{ font-family:"Inter", sans-serif; font-size:14px; color:var(--mj-muted); margin-left:4px; }

.mj-card{ margin-top:24px; padding:20px; border:1px solid var(--mj-border); background:var(--mj-card); border-radius:10px; }
.mj-card .mj-h3{ margin-top:8px; font-size:22px; }
.mj-card del{ color:var(--mj-muted); }
.mj-econ{ display:block; margin-top:10px; color:var(--mj-success); }

/* Chart */
.mj-chart-cap{ display:flex; align-items:baseline; justify-content:space-between; }
.mj-chart-years{ font-family:"Fraunces", serif; font-style:italic; font-size:13px; color:var(--mj-muted); }
.mj-chart svg{ display:block; width:100%; margin-top:14px; }
.mj-legend{ list-style:none; padding:0; margin:14px 0 0; display:grid; gap:6px; font-size:12px; }
.mj-legend li{ display:flex; align-items:center; gap:8px; }
.mj-leg{ display:inline-block; width:20px; height:2px; }
.mj-leg-line{ background:var(--mj-primary); }
.mj-leg-dash{ border-top:1px dashed var(--mj-muted); }
.mj-leg-fill{ height:10px; border-radius:2px; background:rgba(244,197,66,.6); }

.mj-summary div{ display:flex; justify-content:space-between; padding:12px 0; border-bottom:1px solid var(--mj-border); font-size:14px; }
.mj-summary div:last-child{ border-bottom:0; }
.mj-econ-row{ color:var(--mj-success); }

/* Blocks */
.mj-block{ margin-top:40px; }
.mj-rows{ margin-top:14px; border:1px solid var(--mj-border); border-radius:10px; background:var(--mj-card); overflow:hidden; }
.mj-rows article{ padding:16px; border-bottom:1px solid var(--mj-border); }
.mj-rows article:last-child{ border-bottom:0; }
.mj-rows h4{ font-family:"Fraunces", serif; font-size:18px; }
.mj-rows p{ margin-top:6px; font-size:13px; color:rgba(14,27,61,.82); }
.mj-rows p strong{ color:var(--mj-fg); }
.mj-row-hl{ background:rgba(244,197,66,.15); }

.mj-steps{ list-style:none; padding:0; margin:14px 0 0; display:grid; gap:12px; }
.mj-steps li{ padding:16px; border:1px solid var(--mj-border); border-radius:10px; background:var(--mj-card); }
.mj-steps li > div{ display:flex; align-items:baseline; gap:12px; }
.mj-step-n{ font-family:"Fraunces", serif; font-size:24px; color:var(--mj-accent-deep); }
.mj-steps h4{ font-family:"Fraunces", serif; font-size:18px; }
.mj-steps p{ margin-top:6px; font-size:13px; color:rgba(14,27,61,.82); }

.mj-stat{ margin-top:32px; padding:20px; border:1px solid rgba(244,197,66,.6); background:var(--mj-primary); color:var(--mj-on-primary); border-radius:10px; }
.mj-stat-big{ font-family:"Fraunces", serif; font-size:56px; line-height:1; color:var(--mj-accent); }
.mj-stat p{ margin-top:10px; font-size:13px; color:rgba(251,248,240,.85); }
.mj-stat strong{ color:var(--mj-accent); }

.mj-faq{ margin-top:14px; border:1px solid var(--mj-border); border-radius:10px; background:var(--mj-card); overflow:hidden; }
.mj-faq details{ padding:16px; border-bottom:1px solid var(--mj-border); }
.mj-faq details:last-child{ border-bottom:0; }
.mj-faq summary{ list-style:none; display:flex; justify-content:space-between; gap:12px; cursor:pointer; font-size:14px; font-weight:600; }
.mj-faq summary::-webkit-details-marker{ display:none; }
.mj-faq summary span{ font-family:"Fraunces", serif; font-size:22px; color:var(--mj-accent-deep); transition:transform .2s; }
.mj-faq details[open] summary span{ transform:rotate(45deg); }
.mj-faq p{ margin-top:10px; font-size:13px; color:rgba(14,27,61,.82); }

.mj-disclaimer{ margin-top:24px; font-size:12px; color:var(--mj-muted); }
.mj-footer{ margin-top:auto; padding-top:32px; font-size:12px; color:var(--mj-muted); }
.mj-footer strong{ color:var(--mj-fg); }
