/* Retail Calculators (mod_retail_calculators).
   Every rule is scoped under .tsc-calculators so nothing bleeds into or out of
   the site template / Bootstrap. Variables live on the container, not :root. */
.tsc-calculators{
  --text-xs:clamp(0.75rem,0.7rem + 0.25vw,0.875rem);
  --text-sm:clamp(0.875rem,0.8rem + 0.35vw,1rem);
  --text-base:clamp(1rem,0.95rem + 0.25vw,1.125rem);
  --text-lg:clamp(1.125rem,1rem + 0.75vw,1.5rem);
  --text-xl:clamp(1.5rem,1.2rem + 1.25vw,2.25rem);
  --text-2xl:clamp(1.9rem,1.2rem + 2.3vw,3.1rem);
  --space-1:.25rem;--space-2:.5rem;--space-3:.75rem;--space-4:1rem;--space-5:1.25rem;--space-6:1.5rem;--space-8:2rem;--space-10:2.5rem;--space-12:3rem;--space-16:4rem;
  --navy:#0c1630;--navy-2:#162350;--navy-3:#596075;
  --bg:#f4f6fa;--surface:#ffffff;--surface-2:#e4eaf4;--border:#d2dbed;
  --text:#0c1630;--muted:#596075;
  --accent:#b86a00;--accent-soft:#fbefdc;
  --good:#2e6b24;--good-soft:#e2efdc;--bad:#a1302f;--bad-soft:#f6e0de;
  --radius:10px;--radius-lg:16px;
  --shadow:0 1px 2px rgba(22,35,80,.06),0 6px 20px rgba(22,35,80,.07);
  font-family:inherit;font-size:var(--text-base);line-height:1.55;color:var(--text);background:var(--bg);
  -webkit-font-smoothing:antialiased;
}
.tsc-calculators *,.tsc-calculators *::before,.tsc-calculators *::after{box-sizing:border-box;margin:0;padding:0}
.tsc-calculators button,.tsc-calculators input{font:inherit;color:inherit}
.tsc-calculators :focus-visible{outline:3px solid var(--accent);outline-offset:2px}
.tsc-calculators [hidden]{display:none !important}

/* Hero */
/* Width matches the template header: .container = var(--container) (1100px) with 24px side padding. */
.tsc-calculators .tsc-hero{background:linear-gradient(180deg,var(--navy) 0%,var(--navy-2) 100%);color:#fff;padding:var(--space-12) 0 var(--space-16)}
.tsc-calculators .tsc-hero-inner{max-width:var(--container,1100px);margin:0 auto;padding:0 24px}
.tsc-calculators .tsc-eyebrow{font-size:var(--text-xs);letter-spacing:.12em;text-transform:uppercase;font-weight:700;color:#f3c37e}
.tsc-calculators .tsc-hero h1{font-size:var(--text-2xl);font-weight:800;line-height:1.1;margin:var(--space-3) 0 var(--space-4);max-width:18ch;letter-spacing:-.01em;color:#fff}
.tsc-calculators .tsc-hero p{max-width:60ch;color:#d2dbed}
.tsc-calculators .tsc-region{display:inline-flex;margin-top:var(--space-6);background:rgba(255,255,255,.08);border-radius:999px;padding:4px;gap:4px;align-items:center}
.tsc-calculators .tsc-region span{font-size:var(--text-xs);padding:0 var(--space-3);color:#d2dbed}
.tsc-calculators .tsc-region button{border:0;background:transparent;color:#fff;padding:var(--space-2) var(--space-4);border-radius:999px;cursor:pointer;font-size:var(--text-sm);font-weight:600}
.tsc-calculators .tsc-region button[aria-pressed="true"]{background:#fff;color:var(--navy)}

/* Layout */
.tsc-calculators .tsc-wrap{max-width:var(--container,1100px);margin:calc(-1 * var(--space-10)) auto 0;padding:0 24px var(--space-16);display:grid;grid-template-columns:260px 1fr;gap:var(--space-6);align-items:start}
.tsc-calculators .tsc-wrap--nohero{margin-top:0;padding-top:var(--space-8)}
.tsc-calculators .tsc-tools{background:var(--surface);border-radius:var(--radius-lg);box-shadow:var(--shadow);padding:var(--space-3);position:sticky;top:100px}
.tsc-calculators .tsc-tools button{display:flex;gap:var(--space-3);align-items:flex-start;width:100%;text-align:left;border:0;background:transparent;padding:var(--space-3);border-radius:var(--radius);cursor:pointer}
.tsc-calculators .tsc-tools button:hover{background:var(--bg)}
.tsc-calculators .tsc-tools button[aria-selected="true"]{background:var(--surface-2)}
.tsc-calculators .tsc-num{flex:none;width:26px;height:26px;border-radius:50%;background:var(--bg);display:grid;place-items:center;font-size:var(--text-xs);font-weight:700;color:var(--navy-3)}
.tsc-calculators .tsc-tools button[aria-selected="true"] .tsc-num{background:var(--navy);color:#fff}
.tsc-calculators .tsc-tools strong{display:block;font-size:var(--text-sm);font-weight:700;line-height:1.3}
.tsc-calculators .tsc-tools small{display:block;font-size:var(--text-xs);color:var(--muted);line-height:1.35;margin-top:2px}

.tsc-calculators .tsc-panel{background:var(--surface);border-radius:var(--radius-lg);box-shadow:var(--shadow);padding:clamp(var(--space-5),3vw,var(--space-10))}
.tsc-calculators .tsc-panel h2{font-size:var(--text-xl);font-weight:800;line-height:1.15;letter-spacing:-.01em;color:var(--text)}
.tsc-calculators .tsc-lede{color:var(--muted);margin-top:var(--space-2);max-width:62ch}
.tsc-calculators .tsc-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);gap:var(--space-8);margin-top:var(--space-8)}
.tsc-calculators .tsc-inputs{display:grid;gap:var(--space-5);align-content:start}
.tsc-calculators .tsc-field label{display:block;font-size:var(--text-sm);font-weight:700;margin-bottom:var(--space-1)}
.tsc-calculators .tsc-hint{font-size:var(--text-xs);color:var(--muted);margin-bottom:var(--space-2)}
.tsc-calculators .tsc-pair{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-2)}
.tsc-calculators .tsc-input{display:flex;align-items:center;border:1.5px solid var(--border);border-radius:var(--radius);background:#fff;transition:border-color .15s}
.tsc-calculators .tsc-input:focus-within{border-color:var(--navy-2)}
.tsc-calculators .tsc-affix{white-space:nowrap;padding:0 var(--space-3);color:var(--muted);font-size:var(--text-sm);font-weight:600}
.tsc-calculators .tsc-input input{border:0;outline:0;background:transparent;width:100%;padding:var(--space-3);font-size:var(--text-base);font-variant-numeric:tabular-nums;min-width:0;box-shadow:none;height:auto}
.tsc-calculators .tsc-input .tsc-affix:first-child{padding-right:0}
.tsc-calculators .tsc-input .tsc-affix:last-child{padding-left:0}
.tsc-calculators .tsc-seg{display:inline-flex;background:var(--bg);border-radius:var(--radius);padding:4px;gap:4px;flex-wrap:wrap}
.tsc-calculators .tsc-seg button{border:0;background:transparent;padding:var(--space-2) var(--space-4);border-radius:8px;cursor:pointer;font-size:var(--text-sm);font-weight:600;color:var(--muted)}
.tsc-calculators .tsc-seg button[aria-pressed="true"]{background:#fff;color:var(--navy);box-shadow:0 1px 3px rgba(22,35,80,.12)}

.tsc-calculators .tsc-results{background:var(--bg);border-radius:var(--radius-lg);padding:var(--space-6);display:grid;gap:var(--space-4);align-content:start}
.tsc-calculators .tsc-big{background:var(--navy);color:#fff;border-radius:var(--radius);padding:var(--space-5) var(--space-6)}
.tsc-calculators .tsc-big .tsc-k{font-size:var(--text-xs);text-transform:uppercase;letter-spacing:.1em;color:#d2dbed;font-weight:700}
.tsc-calculators .tsc-big .tsc-v{font-size:var(--text-xl);font-weight:800;font-variant-numeric:tabular-nums;line-height:1.2;margin-top:var(--space-1)}
.tsc-calculators .tsc-big .tsc-s{font-size:var(--text-sm);color:#d2dbed;margin-top:var(--space-1)}
.tsc-calculators .tsc-stats{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--space-3)}
.tsc-calculators .tsc-stat{background:#fff;border-radius:var(--radius);padding:var(--space-4)}
.tsc-calculators .tsc-stat .tsc-k{font-size:var(--text-xs);color:var(--muted);font-weight:600}
.tsc-calculators .tsc-stat .tsc-v{font-size:var(--text-lg);font-weight:800;font-variant-numeric:tabular-nums;margin-top:2px}
.tsc-calculators .tsc-stat .tsc-vs{font-size:var(--text-xs);color:var(--muted);font-weight:600}
.tsc-calculators .tsc-insight{border-left:4px solid var(--accent);background:var(--accent-soft);padding:var(--space-4);border-radius:0 var(--radius) var(--radius) 0;font-size:var(--text-sm)}
.tsc-calculators .tsc-insight.good{border-color:var(--good);background:var(--good-soft)}
.tsc-calculators .tsc-insight.bad{border-color:var(--bad);background:var(--bad-soft)}
.tsc-calculators .tsc-insight strong{font-weight:700}
.tsc-calculators table.tsc-mini{width:100%;border-collapse:collapse;background:#fff;border-radius:var(--radius);overflow:hidden;font-size:var(--text-sm);font-variant-numeric:tabular-nums;margin:0}
.tsc-calculators table.tsc-mini th,.tsc-calculators table.tsc-mini td{padding:var(--space-2) var(--space-3);text-align:right;border:0;border-bottom:1px solid var(--bg)}
.tsc-calculators table.tsc-mini th:first-child,.tsc-calculators table.tsc-mini td:first-child{text-align:left}
.tsc-calculators table.tsc-mini th{font-size:var(--text-xs);color:var(--muted);font-weight:700;text-transform:uppercase;letter-spacing:.05em;background:#fff}
.tsc-calculators table.tsc-mini tr.hl td{background:var(--accent-soft);font-weight:700}
.tsc-calculators .tsc-how{margin-top:var(--space-8);border-top:1px solid var(--border);padding-top:var(--space-6);display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--space-6);font-size:var(--text-sm);color:var(--muted)}
.tsc-calculators .tsc-how h3{font-size:var(--text-sm);color:var(--text);font-weight:700;margin-bottom:var(--space-2)}
.tsc-calculators .tsc-how p+p{margin-top:var(--space-2)}
.tsc-calculators .tsc-bar{height:10px;background:#fff;border-radius:999px;overflow:hidden;display:flex}
.tsc-calculators .tsc-bar i{display:block;height:100%}
.tsc-calculators .tsc-legend{display:flex;gap:var(--space-4);flex-wrap:wrap;font-size:var(--text-xs);color:var(--muted);margin-top:var(--space-2)}
.tsc-calculators .tsc-legend b{display:inline-block;width:10px;height:10px;border-radius:2px;margin-right:6px;vertical-align:-1px}

.tsc-calculators .tsc-foot{max-width:var(--container,1100px);margin:0 auto;padding:0 24px var(--space-12);display:grid;grid-template-columns:1.4fr 1fr;gap:var(--space-6)}
.tsc-calculators .tsc-card{background:var(--navy);color:#fff;border-radius:var(--radius-lg);padding:var(--space-8)}
.tsc-calculators .tsc-card h2{font-size:var(--text-lg);font-weight:800;color:#fff}
.tsc-calculators .tsc-card p{color:#d2dbed;margin-top:var(--space-2);font-size:var(--text-sm);max-width:56ch}
.tsc-calculators .tsc-card a{display:inline-block;margin-top:var(--space-5);background:#fff;color:var(--navy);font-weight:700;text-decoration:none;padding:var(--space-3) var(--space-5);border-radius:999px;font-size:var(--text-sm)}
.tsc-calculators .tsc-card a:hover{text-decoration:none;background:var(--surface-2)}
.tsc-calculators .tsc-note{font-size:var(--text-xs);color:var(--muted);padding:var(--space-4) 0}
.tsc-calculators .tsc-note p+p{margin-top:var(--space-2)}

@media (max-width:960px){
  .tsc-calculators .tsc-wrap{grid-template-columns:1fr}
  .tsc-calculators .tsc-tools{position:static;display:flex;overflow-x:auto;gap:var(--space-2);padding:var(--space-2);scroll-snap-type:x mandatory}
  .tsc-calculators .tsc-tools button{flex:none;width:auto;min-width:180px;scroll-snap-align:start}
  .tsc-calculators .tsc-tools small{display:none}
  .tsc-calculators .tsc-grid{grid-template-columns:1fr}
  .tsc-calculators .tsc-foot{grid-template-columns:1fr}
}
@media (max-width:560px){
  .tsc-calculators .tsc-hero{padding:var(--space-8) 0 var(--space-16)}
  .tsc-calculators .tsc-wrap{padding:0 24px var(--space-12)}
  .tsc-calculators .tsc-foot{padding:0 24px var(--space-10)}
  .tsc-calculators .tsc-how{grid-template-columns:1fr}
  .tsc-calculators .tsc-results{padding:var(--space-4)}
}