
/* ============================================================
   ROOT & RESET
   ============================================================ */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html, body {
  overflow-x: hidden; /* Mobile Lock */
  width: 100%;
  scroll-behavior: smooth;
  font-family: 'Inter', sans-serif;
  color: var(--gray-text);
  background: var(--bg-light);
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
}

:root {
  --navy:       #002868;
  --navy-dark:  #00183F;
  --navy-mid:   #003580;
  --red:        #BF0A30;
  --red-hover:  #9B0826;
  --green:      #00875A;
  --green-h:    #006644;
  --white:      #FFFFFF;
  --charcoal:   #1D1D1F;
  --gray-text:  #5F6368;
  --border:     #E0E4E8;
  --bg-light:   #F7F9FC;
  --yellow:     #F59E0B;
  --shadow-sm:  0 1px 4px rgba(0,40,104,0.08);
  --shadow-md:  0 4px 20px rgba(0,40,104,0.12);
  --shadow-lg:  0 8px 40px rgba(0,40,104,0.16);
}

/* ============================================================
   HERO BANNER
   ============================================================ */
.calc-hero {
  background: linear-gradient(135deg, var(--navy-dark) 0%, var(--navy) 60%, var(--navy-mid) 100%);
  padding: 60px 20px 90px;
  position: relative;
  overflow: hidden;
}
.calc-hero::before {
  content: '';
  position: absolute; inset: 0;
  background: url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%23ffffff' fill-opacity='0.03'%3E%3Cpath d='M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
}
.hero-accent {
  position: absolute; top: 0; left: 0; right: 0; height: 4px;
  background: linear-gradient(90deg, var(--red) 0%, var(--navy-mid) 50%, var(--green) 100%);
}
.calc-hero-inner {
  max-width: 860px;
  margin: 0 auto;
  position: relative; z-index: 1;
  text-align: center;
}
.hero-badge {
  display: inline-flex; align-items: center; gap: 8px;
  background: rgba(255,255,255,0.08); border: 1px solid rgba(255,255,255,0.15);
  color: rgba(255,255,255,0.75); font-size: 12px; font-weight: 600;
  padding: 6px 14px; border-radius: 20px; margin-bottom: 18px;
  font-family: 'Inter', sans-serif; letter-spacing: 0.3px;
}
.hero-badge .badge-dot { width: 6px; height: 6px; background: #4ade80; border-radius: 50%; animation: blink 1.4s infinite; }
@keyframes blink { 0%,100%{opacity:1} 50%{opacity:0.3} }
.calc-hero h1 {
  font-family: 'Montserrat', sans-serif;
  font-size: clamp(26px, 4vw, 42px);
  font-weight: 900;
  color: var(--white);
  line-height: 1.15;
  margin-bottom: 14px;
  letter-spacing: -0.5px;
}
.calc-hero h1 span { color: var(--red); }
.calc-hero p {
  font-size: 16px; color: rgba(255,255,255,0.70);
  max-width: 620px; margin: 0 auto 28px; line-height: 1.7;
}
.hero-chips { display: flex; gap: 10px; justify-content: center; flex-wrap: wrap; }
.hero-chip {
  display: inline-flex; align-items: center; gap: 6px;
  background: rgba(255,255,255,0.08); border: 1px solid rgba(255,255,255,0.12);
  color: rgba(255,255,255,0.65); font-size: 12px; font-weight: 500;
  padding: 5px 12px; border-radius: 6px;
}

/* ============================================================
   MAIN WRAPPER & CARD
   ============================================================ */
.calc-wrapper {
  max-width: 1100px;
  margin: -35px auto 60px; 
  padding: 0 24px;
  position: relative;
  z-index: 10;
}
.card {
  background: var(--white); border-radius: 16px;
  border: 1px solid var(--border); box-shadow: var(--shadow-md);
  overflow: hidden; margin-bottom: 24px;
}
.card-header {
  display: flex; align-items: center; gap: 12px;
  padding: 20px 28px 0;
}
.card-header-icon {
  width: 40px; height: 40px; border-radius: 10px;
  display: flex; align-items: center; justify-content: center;
  font-size: 18px; flex-shrink: 0;
}
.card-header-icon.navy { background: rgba(0,40,104,0.08); }
.card-header-icon.red { background: rgba(191,10,48,0.08); }
.card-header-icon.green { background: rgba(0,135,90,0.08); }
.card-title { font-family: 'Montserrat', sans-serif; font-size: 17px; font-weight: 800; color: var(--charcoal); }
.card-subtitle { font-size: 13px; color: var(--gray-text); margin-top: 1px; }

/* ============================================================
   MODE TABS
   ============================================================ */
.mode-tabs-wrap { padding: 20px 28px 0; }
.mode-tabs {
  display: flex; gap: 4px; background: var(--bg-light); border-radius: 10px;
  padding: 4px; border: 1px solid var(--border);
}
.mode-tab {
  flex: 1; padding: 9px 8px; font-family: 'Montserrat', sans-serif; font-size: 12.5px; font-weight: 700;
  color: var(--gray-text); background: transparent; border: none;
  border-radius: 7px; cursor: pointer; transition: all 0.2s; text-align: center;
  white-space: nowrap;
}
.mode-tab:hover { color: var(--navy); }
.mode-tab.active { background: var(--white); color: var(--navy); box-shadow: var(--shadow-sm); }

/* ============================================================
   INPUT SECTIONS
   ============================================================ */
.input-section { padding: 24px 28px 28px; display: none; }
.input-section.active { display: block; }
.input-group-title {
  font-family: 'Montserrat', sans-serif; font-size: 12px; font-weight: 700; color: var(--navy);
  text-transform: uppercase; letter-spacing: 0.8px; margin-bottom: 14px; padding-bottom: 8px;
  border-bottom: 2px solid var(--border); display: flex; align-items: center; gap: 6px;
}
.input-group-title .dot { width: 8px; height: 8px; border-radius: 50%; display: inline-block; }
.dot-assets { background: var(--navy); } .dot-liab { background: var(--red); }

.fields-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 14px; margin-bottom: 20px; }
.fields-grid-2 { grid-template-columns: 1fr 1fr; }
.field-wrap { display: flex; flex-direction: column; gap: 5px; }
.field-label { font-size: 12.5px; font-weight: 600; color: var(--charcoal); }
.field-hint { font-size: 11px; color: var(--gray-text); }
.field-input-wrap { position: relative; display: flex; align-items: center; width: 100%;}
.field-prefix { position: absolute; left: 14px; top: 50%; transform: translateY(-50%); font-weight: 600; color: var(--gray-text); font-size: 14px; pointer-events: none; z-index: 5;}

/* Kadence Overrides */
input, select, textarea {
  width: 100% !important; padding: 10px 14px !important; border: 1.5px solid var(--border) !important;
  border-radius: 8px !important; font-family: 'Inter', sans-serif !important; font-size: 14px !important;
  color: var(--charcoal) !important; background: var(--white) !important; outline: none !important;
  transition: all 0.2s !important; height: 42px !important; -webkit-appearance: none !important;
  margin: 0 !important; box-shadow: none !important;
}
input:focus, select:focus, textarea:focus { border-color: var(--navy) !important; box-shadow: 0 0 0 3px rgba(0,40,104,0.10) !important; }
.field-select { padding-left: 14px; cursor: pointer; }
select { cursor: pointer !important; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='%235F6368'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M19 9l-7 7-7-7'%3E%3C/path%3E%3C/svg%3E") no-repeat right 12px center/12px var(--white) !important; }

/* FIX: Forces the input text out from under the $ symbol */
.field-prefix + input { padding-left: 32px !important; }
.no-prefix { padding-left: 14px !important; }

/* Auto-sum display */
.auto-sum-row {
  display: flex; align-items: center; justify-content: space-between;
  background: rgba(0,40,104,0.04); border: 1px solid rgba(0,40,104,0.12);
  border-radius: 8px; padding: 10px 16px; margin-bottom: 20px;
}
.auto-sum-label { font-size: 13px; font-weight: 600; color: var(--navy); }
.auto-sum-value { font-family: 'Montserrat', sans-serif; font-size: 16px; font-weight: 800; color: var(--navy); }
.auto-sum-row.red-sum { background: rgba(191,10,48,0.04); border-color: rgba(191,10,48,0.12); }
.auto-sum-row.red-sum .auto-sum-label, .auto-sum-row.red-sum .auto-sum-value { color: var(--red); }
.input-divider { height: 1px; background: var(--border); margin: 20px 0; }
.bottom-fields { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }

/* ============================================================
   BUTTONS
   ============================================================ */
.action-row { display: flex; align-items: center; }
.btn-calculate {
  display: flex; align-items: center; justify-content: center; gap: 10px;
  width: 100%; padding: 16px 24px;
  background: linear-gradient(135deg, var(--navy) 0%, var(--navy-mid) 100%);
  color: var(--white); border: none; border-radius: 10px;
  font-family: 'Montserrat', sans-serif; font-size: 15px; font-weight: 800;
  cursor: pointer; transition: all 0.2s; letter-spacing: 0.3px; margin-top: 4px;
}
.btn-calculate:hover { background: linear-gradient(135deg, var(--navy-mid) 0%, var(--navy) 100%); transform: translateY(-2px); box-shadow: 0 8px 24px rgba(0,40,104,0.25); }
.btn-reset {
  display: inline-flex; align-items: center; gap: 6px; padding: 10px 18px; background: transparent;
  color: var(--gray-text); border: 1.5px solid var(--border); border-radius: 8px;
  font-family: 'Montserrat', sans-serif; font-size: 13px; font-weight: 700;
  cursor: pointer; transition: all 0.2s; margin-left: 12px;
}
.btn-reset:hover { color: var(--charcoal); border-color: var(--charcoal); }

/* ============================================================
   RESULTS DASHBOARD
   ============================================================ */
#results-section { display: none; }
.ratio-cards-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; padding: 24px 28px 0; }
.ratio-card { border-radius: 12px; padding: 20px; position: relative; border: 2px solid transparent; transition: all 0.3s; }
.ratio-card.primary { background: linear-gradient(135deg, var(--navy) 0%, var(--navy-mid) 100%); border-color: var(--navy-mid); }
.ratio-card.secondary { background: var(--bg-light); border-color: var(--border); }
.ratio-card-label { font-size: 11.5px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.6px; margin-bottom: 6px; }
.ratio-card.primary .ratio-card-label { color: rgba(255,255,255,0.65); }
.ratio-card.secondary .ratio-card-label { color: var(--gray-text); }
.ratio-card-value { font-family: 'Montserrat', sans-serif; font-size: 36px; font-weight: 900; line-height: 1; margin-bottom: 6px; }
.ratio-card.primary .ratio-card-value { color: var(--white); }
.ratio-card.secondary .ratio-card-value { color: var(--charcoal); }
.ratio-card-status { display: inline-flex; align-items: center; gap: 5px; font-size: 11.5px; font-weight: 700; padding: 3px 9px; border-radius: 20px; }
.status-good { background: rgba(0,135,90,0.12); color: var(--green); }
.status-warn { background: rgba(245,158,11,0.12); color: #D97706; }
.status-bad  { background: rgba(191,10,48,0.12); color: var(--red); }
.ratio-card.primary .status-good { background: rgba(74,222,128,0.15); color: #4ade80; }
.ratio-card.primary .status-warn { background: rgba(251,191,36,0.15); color: #fbbf24; }
.ratio-card.primary .status-bad  { background: rgba(252,165,165,0.15); color: #fca5a5; }
.ratio-card-formula { font-size: 11px; margin-top: 8px; opacity: 0.6; font-family: 'Inter', sans-serif; font-style: italic; }
.ratio-card.primary .ratio-card-formula { color: rgba(255,255,255,0.6); }

/* Working Capital & Benchmark */
.wc-row { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; padding: 16px 28px 0; }
.wc-box { background: var(--bg-light); border: 1px solid var(--border); border-radius: 10px; padding: 16px 20px; display: flex; align-items: center; gap: 14px; }
.wc-box-icon { width: 42px; height: 42px; border-radius: 10px; display: flex; align-items: center; justify-content: center; font-size: 20px; flex-shrink: 0; }
.wc-box-icon.green-bg { background: rgba(0,135,90,0.08); } .wc-box-icon.navy-bg  { background: rgba(0,40,104,0.08); }
.wc-box-label { font-size: 12px; font-weight: 600; color: var(--gray-text); margin-bottom: 2px; }
.wc-box-value { font-family: 'Montserrat', sans-serif; font-size: 22px; font-weight: 800; color: var(--charcoal); line-height: 1; }
.wc-box-sub { font-size: 11px; color: var(--gray-text); margin-top: 3px; }

/* FIX: Vivid Solid Colors for the Benchmark Graph */
.benchmark-section, .lender-section { padding: 24px 28px 0; }
.benchmark-header { display: flex; align-items: center; justify-content: space-between; margin-bottom: 14px; }
.section-label { font-family: 'Montserrat', sans-serif; font-size: 13px; font-weight: 800; color: var(--charcoal); display: flex; align-items: center; gap: 7px; }
.benchmark-industry { font-size: 12.5px; color: var(--gray-text); }
.benchmark-bar-wrap { position: relative; margin-bottom: 8px; }
.benchmark-track { height: 14px; border-radius: 7px; background: var(--border); position: relative; overflow: hidden; }
.benchmark-fill-bad   { background: #ef4444; position: absolute; height: 100%; left: 0; border-radius: 7px 0 0 7px; }
.benchmark-fill-warn  { background: #f59e0b; position: absolute; height: 100%; border-radius: 0; }
.benchmark-fill-good  { background: #10b981; position: absolute; height: 100%; border-radius: 0 7px 7px 0; }
.benchmark-needle { position: absolute; top: -4px; width: 4px; height: 22px; background: var(--navy); border-radius: 2px; transform: translateX(-50%); box-shadow: 0 2px 8px rgba(0,40,104,0.4); transition: left 0.5s ease; }
.benchmark-needle::before { content: '▼'; color: var(--navy); font-size: 10px; position: absolute; top: -16px; left: 50%; transform: translateX(-50%); }
.benchmark-labels { display: flex; justify-content: space-between; font-size: 11px; color: var(--gray-text); margin-top: 5px; }
.benchmark-result-line { display: flex; align-items: center; gap: 10px; margin-top: 12px; padding: 10px 14px; border-radius: 8px; font-size: 13px; font-weight: 600; }
.brl-good { background: rgba(0,135,90,0.07); color: var(--green); border: 1px solid rgba(0,135,90,0.15); }
.brl-warn { background: rgba(245,158,11,0.07); color: #D97706; border: 1px solid rgba(245,158,11,0.15); }
.brl-bad  { background: rgba(191,10,48,0.07); color: var(--red); border: 1px solid rgba(191,10,48,0.15); }

/* Lender Scorecard */
.lender-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px; margin-top: 14px; }
.lender-card { border-radius: 10px; padding: 14px 16px; border: 1.5px solid var(--border); display: flex; align-items: center; justify-content: space-between; background: var(--bg-light); }
.lender-info { display: flex; flex-direction: column; gap: 2px; }
.lender-name { font-size: 13px; font-weight: 700; color: var(--charcoal); }
.lender-req { font-size: 11.5px; color: var(--gray-text); }
.lender-badge { display: inline-flex; align-items: center; gap: 5px; font-size: 12px; font-weight: 700; padding: 4px 10px; border-radius: 6px; }
.lb-pass     { background: rgba(0,135,90,0.10); color: var(--green); }
.lb-border   { background: rgba(245,158,11,0.10); color: #D97706; }
.lb-fail     { background: rgba(191,10,48,0.10); color: var(--red); }

/* Charts */
.charts-row { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; padding: 24px 28px; }
.chart-card { background: var(--bg-light); border: 1px solid var(--border); border-radius: 12px; padding: 20px; }
.chart-card-title { font-family: 'Montserrat', sans-serif; font-size: 13px; font-weight: 800; color: var(--charcoal); margin-bottom: 4px; display: flex; align-items: center; gap: 7px; }
.chart-card-sub { font-size: 11.5px; color: var(--gray-text); margin-bottom: 14px; }
.chart-canvas-wrap { position: relative; height: 200px; }
.asset-flags { margin-top: 12px; display: flex; flex-direction: column; gap: 6px; }
.asset-flag { display: flex; align-items: flex-start; gap: 6px; font-size: 12px; color: #D97706; background: rgba(245,158,11,0.07); border: 1px solid rgba(245,158,11,0.15); border-radius: 6px; padding: 6px 10px; display: none; }

/* ============================================================
   SCENARIO PLANNER
   ============================================================ */
.scenario-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; padding: 20px 28px; }
.scenario-card { background: var(--bg-light); border: 1.5px solid var(--border); border-radius: 12px; padding: 18px; transition: border-color 0.2s, box-shadow 0.2s; }
.scenario-card:hover { border-color: var(--navy); box-shadow: var(--shadow-sm); }
.scenario-icon { font-size: 24px; margin-bottom: 10px; }
.scenario-name { font-family: 'Montserrat', sans-serif; font-size: 13px; font-weight: 700; color: var(--charcoal); margin-bottom: 5px; }
.scenario-desc { font-size: 12px; color: var(--gray-text); margin-bottom: 12px; line-height: 1.5; }
.scenario-result-box { background: var(--white); border: 1px solid var(--border); border-radius: 8px; padding: 10px 12px; margin-top: 10px; display: flex; align-items: center; justify-content: space-between; }
.scenario-result-label { font-size: 11px; color: var(--gray-text); font-weight: 600; }
.scenario-result-value { font-family: 'Montserrat', sans-serif; font-size: 18px; font-weight: 900; color: var(--charcoal); }
.scenario-arrow { font-size: 12px; color: var(--gray-text); margin: 0 4px; }
.scenario-result-new { font-family: 'Montserrat', sans-serif; font-size: 18px; font-weight: 900; }
.snr-good { color: var(--green); } .snr-warn { color: #D97706; } .snr-bad  { color: var(--red); }

/* ============================================================
   TREND TRACKER & SEASONAL
   ============================================================ */
.trend-inputs { padding: 20px 28px 0; }
.trend-periods-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; margin-bottom: 20px; }
.trend-period-card { background: var(--bg-light); border: 1.5px solid var(--border); border-radius: 10px; padding: 14px; }
.trend-period-label { font-family: 'Montserrat', sans-serif; font-size: 12px; font-weight: 700; color: var(--navy); margin-bottom: 10px; }
.trend-chart-wrap { padding: 0 28px 24px; }
.seasonal-note { background: rgba(245,158,11,0.06); border: 1px solid rgba(245,158,11,0.20); border-radius: 8px; padding: 12px 16px; margin-bottom: 20px; font-size: 13px; color: #92400E; display: flex; align-items: flex-start; gap: 8px; }

/* ============================================================
   PDF EXPORT BUTTON
   ============================================================ */
.pdf-section { padding: 20px 28px 28px; border-top: 1px solid var(--border); }
.btn-pdf {
  display: inline-flex; align-items: center; gap: 9px; padding: 13px 24px;
  background: linear-gradient(135deg, var(--red) 0%, var(--red-hover) 100%);
  color: var(--white); border: none; border-radius: 9px;
  font-family: 'Montserrat', sans-serif; font-size: 13.5px; font-weight: 800;
  cursor: pointer; transition: all 0.2s;
}
.btn-pdf:hover { transform: translateY(-2px); box-shadow: 0 8px 24px rgba(191,10,48,0.30); }
.pdf-note { font-size: 12px; color: var(--gray-text); margin-top: 10px; }

/* ============================================================
   INFO PANEL
   ============================================================ */
.info-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; padding: 20px 28px 28px; }
.info-box { border: 1px solid var(--border); border-radius: 10px; padding: 16px; }
.info-box-icon { font-size: 22px; margin-bottom: 8px; }
.info-box-title { font-family: 'Montserrat', sans-serif; font-size: 13px; font-weight: 800; color: var(--charcoal); margin-bottom: 6px; }
.info-box-text { font-size: 12.5px; color: var(--gray-text); line-height: 1.6; }

/* ============================================================
   RESPONSIVE (Mobile Fixes)
   ============================================================ */
@media (max-width: 768px) {
  .calc-hero { padding: 40px 20px 60px; }
  .calc-wrapper { padding: 0 14px; margin-top: -20px;}
  .ratio-cards-grid { grid-template-columns: 1fr; gap: 10px; padding: 16px 18px 0; }
  .wc-row { grid-template-columns: 1fr; padding: 12px 18px 0; }
  .charts-row { grid-template-columns: 1fr; padding: 16px 18px; }
  .lender-grid { grid-template-columns: 1fr; }
  .scenario-grid { grid-template-columns: 1fr; padding: 16px 18px; }
  .trend-periods-grid { grid-template-columns: 1fr 1fr; }
  .bottom-fields { grid-template-columns: 1fr; }
  .fields-grid-2 { grid-template-columns: 1fr; }
  .input-section { padding: 18px 18px 22px; }
  .card-header { padding: 16px 18px 0; }
  .benchmark-section, .lender-section { padding: 18px 18px 0; }
  .info-grid { grid-template-columns: 1fr; padding: 16px 18px 22px; }
  .mode-tabs-wrap { padding: 14px 18px 0; }
  .mode-tab { font-size: 11px; padding: 8px 6px; }
  .trend-inputs { padding: 16px 18px 0; }
  .trend-chart-wrap { padding: 0 18px 20px; }
  .pdf-section { padding: 16px 18px 22px; }
  
  /* Mobile Action Row Stacking */
  .action-row { flex-direction: column; gap: 12px;}
  .btn-calculate, .btn-reset { width: 100%; margin: 0; justify-content: center;}
}

/* ── Scoped to #how-it-works only ─────────────────────────── */
#how-it-works{
  --n:#163a70;
  --r:#d64045;
  --g:#1f9d55;
  --c:#2f3a45;
  --b:#d9e2ec;
  --bl:#f7fafc;
  --wh:#ffffff;
  --sh:0 2px 8px rgba(16,24,40,.07);
  --shm:0 8px 28px rgba(16,24,40,.10);
  color:var(--c);
  font-family:'Inter',sans-serif;
}
#how-it-works *{box-sizing:border-box;}

/* Headings */
#how-it-works h2{
  font-family:'Montserrat',sans-serif;
  font-size:clamp(1.75rem,1.4rem + 1vw,2.25rem);
  font-weight:800;color:var(--n);
  margin:0 0 12px;line-height:1.2;
}
#how-it-works h3{
  font-family:'Montserrat',sans-serif;
  font-size:clamp(1.15rem,1rem + .45vw,1.45rem);
  font-weight:800;color:var(--n);
  margin:32px 0 10px;line-height:1.25;
}
#how-it-works h4{
  font-size:1rem;font-weight:700;
  color:var(--n);margin:0 0 7px;line-height:1.35;
}
#how-it-works p{
  margin:0 0 13px;line-height:1.78;
  font-size:1rem;color:var(--c);
}
#how-it-works p:last-child{margin-bottom:0;}
#how-it-works .lead{
  font-size:1.06rem;color:#3d4f5e;
  max-width:940px;margin-bottom:22px;
}

/* Divider */
#how-it-works hr{
  border:none;
  height:1px;
  background:linear-gradient(90deg,rgba(22,58,112,0),rgba(22,58,112,.18),rgba(22,58,112,0));
  margin:28px 0;
}

/* Formula hero block */
#how-it-works .formula-hero{
  display:grid;
  grid-template-columns:1.1fr .9fr;
  gap:18px;margin:22px 0 30px;
}
#how-it-works .formula-box{
  background:linear-gradient(145deg,#163a70,#0e2a56);
  color:#fff;border-radius:18px;
  padding:28px 26px;
  box-shadow:var(--shm);
}
#how-it-works .formula-box .ftag{
  display:inline-block;padding:5px 12px;
  border-radius:999px;background:rgba(255,255,255,.14);
  font-size:.78rem;font-weight:700;
  letter-spacing:.05em;text-transform:uppercase;
  margin-bottom:12px;
}
#how-it-works .formula-box .eq{
  font-size:clamp(1.3rem,1rem + .9vw,2rem);
  font-weight:800;line-height:1.3;margin-bottom:12px;
}
#how-it-works .formula-box p{
  color:rgba(255,255,255,.9);margin:0;font-size:.97rem;
}

/* Side mini-cards */
#how-it-works .side-cards{
  display:grid;grid-template-rows:1fr 1fr;gap:14px;
}
#how-it-works .mini-card{
  background:var(--wh);border:1px solid var(--b);
  border-radius:14px;padding:18px;
  box-shadow:var(--sh);
}

/* Grids */
#how-it-works .grid-3{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:16px;margin:18px 0 26px;
}
#how-it-works .grid-2{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:16px;margin:18px 0 26px;
}

/* Step cards */
#how-it-works .step-card,
#how-it-works .info-card,
#how-it-works .tip-card,
#how-it-works .mistake-card,
#how-it-works .example-card{
  background:var(--wh);border:1px solid var(--b);
  border-radius:14px;padding:20px;
  box-shadow:var(--sh);height:100%;
}
#how-it-works .step-num{
  width:40px;height:40px;
  border-radius:50%;
  background:rgba(22,58,112,.09);
  color:var(--n);font-weight:800;
  display:inline-flex;align-items:center;
  justify-content:center;margin-bottom:11px;
  font-size:1rem;
}

/* Callout boxes */
#how-it-works .note,
#how-it-works .tip,
#how-it-works .warn{
  border-radius:12px;padding:15px 18px;
  margin:16px 0;border-left:4px solid transparent;
  font-size:.97rem;line-height:1.7;
}
#how-it-works .note{
  background:rgba(22,58,112,.07);
  border-left-color:var(--n);
}
#how-it-works .tip{
  background:rgba(31,157,85,.09);
  border-left-color:var(--g);
}
#how-it-works .warn{
  background:rgba(214,64,69,.08);
  border-left-color:var(--r);
}

/* Table */
#how-it-works .tbl-wrap{
  overflow-x:auto;
  border:1px solid var(--b);
  border-radius:16px;
  background:var(--wh);
  box-shadow:var(--sh);
  margin:18px 0 28px;
}
#how-it-works table{
  width:100%;border-collapse:collapse;min-width:620px;
}
#how-it-works th,#how-it-works td{
  padding:13px 16px;text-align:left;
  border-bottom:1px solid var(--b);
  font-size:.97rem;line-height:1.65;
  vertical-align:top;
}
#how-it-works th{
  background:#edf2fb;color:var(--n);
  font-weight:800;font-size:.94rem;
}
#how-it-works tr:last-child td{border-bottom:none;}

/* Badges */
#how-it-works .badge{
  display:inline-flex;align-items:center;
  padding:5px 11px;border-radius:999px;
  font-size:.82rem;font-weight:800;
  white-space:nowrap;
}
#how-it-works .badge.good{background:rgba(31,157,85,.13);color:#0d7a38;}
#how-it-works .badge.warn{background:rgba(214,64,69,.12);color:#a4282d;}
#how-it-works .badge.info{background:rgba(22,58,112,.10);color:var(--n);}
#how-it-works .badge.caution{background:rgba(214,134,0,.12);color:#8a5200;}

/* KPI big number */
#how-it-works .kpi-val{
  font-family:'Montserrat',sans-serif;
  font-size:2rem;font-weight:800;
  color:var(--n);line-height:1;
  margin-bottom:8px;
}

/* Inline math */
#how-it-works .math{
  font-weight:800;color:var(--n);
}

/* Example inner box */
#how-it-works .ex-box{
  background:#f0f5ff;
  border:1px dashed rgba(22,58,112,.28);
  border-radius:10px;
  padding:11px 14px;margin-top:10px;
  font-size:.96rem;
}

/* UL list */
#how-it-works ul.cr-list{
  padding-left:18px;margin:0;
}
#how-it-works ul.cr-list li{
  margin:0 0 9px;line-height:1.75;font-size:.98rem;
}

/* FAQ accordion */
#how-it-works .faq details{
  border:1px solid var(--b);background:var(--wh);
  border-radius:12px;padding:15px 18px;
  margin-bottom:12px;box-shadow:var(--sh);
}
#how-it-works .faq summary{
  cursor:pointer;font-weight:700;
  color:var(--n);font-size:1rem;line-height:1.5;
  list-style:none;
}
#how-it-works .faq summary::-webkit-details-marker{display:none;}
#how-it-works .faq details p{margin-top:11px;}

/* Responsive */
@media(max-width:980px){
  #how-it-works .formula-hero,
  #how-it-works .grid-3{grid-template-columns:1fr;}
  #how-it-works .grid-2{grid-template-columns:1fr;}
  #how-it-works .side-cards{grid-template-rows:auto;}
}
@media(max-width:560px){
  #how-it-works h2{font-size:1.55rem;}
  #how-it-works .step-card,
  #how-it-works .info-card,
  #how-it-works .tip-card,
  #how-it-works .mistake-card,
  #how-it-works .example-card,
  #how-it-works .formula-box,
  #how-it-works .mini-card{padding:16px;}
}

/* ── Scoped entirely to #real-us-examples ─────────────────── */
#real-us-examples{
  --n:#163a70;
  --r:#d64045;
  --g:#1f9d55;
  --c:#2f3a45;
  --b:#d9e2ec;
  --bl:#f7fafc;
  --wh:#ffffff;
  --sh:0 2px 8px rgba(16,24,40,.07);
  --shm:0 10px 32px rgba(16,24,40,.11);
  color:var(--c);
  font-family:'Inter',sans-serif;
}
#real-us-examples *{box-sizing:border-box;}

#real-us-examples h2{
  font-family:'Montserrat',sans-serif;
  font-size:clamp(1.75rem,1.4rem + 1vw,2.25rem);
  font-weight:800;color:var(--n);
  margin:0 0 12px;line-height:1.2;
}
#real-us-examples h3{
  font-family:'Montserrat',sans-serif;
  font-size:clamp(1.12rem,.98rem + .45vw,1.42rem);
  font-weight:800;color:var(--n);
  margin:0 0 10px;line-height:1.25;
}
#real-us-examples h4{
  font-size:.99rem;font-weight:700;
  color:var(--n);margin:0 0 7px;line-height:1.35;
}
#real-us-examples p{
  margin:0 0 13px;line-height:1.78;
  font-size:1rem;color:var(--c);
}
#real-us-examples p:last-child{margin-bottom:0;}
#real-us-examples .lead{
  font-size:1.06rem;color:#3d4f5e;
  max-width:940px;margin-bottom:28px;
  line-height:1.78;
}

/* ── Example card shell ────────────────────────────────────── */
#real-us-examples .ex-card{
  background:var(--wh);
  border:1px solid var(--b);
  border-radius:20px;
  box-shadow:var(--sh);
  overflow:hidden;
  margin-bottom:32px;
  transition:box-shadow .2s ease;
}
#real-us-examples .ex-card:hover{
  box-shadow:var(--shm);
}

/* ── Card header band ─────────────────────────────────────── */
#real-us-examples .ex-header{
  display:flex;
  align-items:center;
  gap:20px;
  padding:22px 26px 20px;
  border-bottom:1px solid var(--b);
  background:linear-gradient(180deg,#f4f8ff,#edf3fc);
}
#real-us-examples .ex-logo{
  width:56px;height:56px;
  border-radius:14px;
  background:var(--wh);
  border:1px solid var(--b);
  display:flex;align-items:center;
  justify-content:center;
  flex-shrink:0;
  box-shadow:0 2px 6px rgba(16,24,40,.08);
  font-family:'Montserrat',sans-serif;
  font-weight:900;
  font-size:1.3rem;
  color:var(--n);
  letter-spacing:-.02em;
}
#real-us-examples .ex-meta{flex:1;min-width:0;}
#real-us-examples .ex-company{
  font-family:'Montserrat',sans-serif;
  font-size:1.18rem;font-weight:800;
  color:var(--n);line-height:1.2;
  margin-bottom:5px;
}
#real-us-examples .ex-tags{
  display:flex;flex-wrap:wrap;gap:7px;
}
#real-us-examples .tag{
  display:inline-block;padding:4px 10px;
  border-radius:999px;font-size:.78rem;
  font-weight:700;letter-spacing:.02em;
}
#real-us-examples .tag-sector{
  background:rgba(22,58,112,.10);color:var(--n);
}
#real-us-examples .tag-ticker{
  background:rgba(22,58,112,.06);color:var(--n);
  font-family:'Courier New',monospace;font-weight:700;
}
#real-us-examples .tag-year{
  background:rgba(47,58,69,.08);color:var(--c);
}

/* ratio badge in header */
#real-us-examples .ex-ratio-badge{
  text-align:right;flex-shrink:0;
}
#real-us-examples .ratio-val{
  font-family:'Montserrat',sans-serif;
  font-size:2.6rem;font-weight:900;
  line-height:1;color:var(--n);
}
#real-us-examples .ratio-label{
  font-size:.78rem;color:#6b7a8d;
  font-weight:600;letter-spacing:.04em;
  text-transform:uppercase;
}
#real-us-examples .ratio-verdict{
  display:inline-block;margin-top:6px;
  padding:4px 11px;border-radius:999px;
  font-size:.78rem;font-weight:700;
}
#real-us-examples .verdict-healthy{
  background:rgba(31,157,85,.13);color:#0d7a38;
}
#real-us-examples .verdict-caution{
  background:rgba(214,134,0,.12);color:#7a4800;
}
#real-us-examples .verdict-stress{
  background:rgba(214,64,69,.12);color:#a4282d;
}
#real-us-examples .verdict-strong{
  background:rgba(22,58,112,.10);color:var(--n);
}

/* ── Card body ─────────────────────────────────────────────── */
#real-us-examples .ex-body{
  padding:24px 26px 26px;
}

/* Balance sheet row */
#real-us-examples .bs-grid{
  display:grid;
  grid-template-columns:1fr 1fr 1fr;
  gap:14px;
  margin-bottom:22px;
}
#real-us-examples .bs-tile{
  background:var(--bl);
  border:1px solid var(--b);
  border-radius:12px;
  padding:14px 16px;
}
#real-us-examples .bs-tile .tile-label{
  font-size:.76rem;font-weight:700;
  color:#6b7a8d;text-transform:uppercase;
  letter-spacing:.04em;margin-bottom:6px;
}
#real-us-examples .bs-tile .tile-val{
  font-family:'Montserrat',sans-serif;
  font-size:1.28rem;font-weight:800;
  color:var(--n);line-height:1;
}
#real-us-examples .bs-tile .tile-sub{
  font-size:.78rem;color:#8594a5;margin-top:3px;
}
#real-us-examples .tile-assets .tile-label{color:#0d5c22;}
#real-us-examples .tile-assets{border-color:rgba(31,157,85,.25);background:rgba(31,157,85,.05);}
#real-us-examples .tile-assets .tile-val{color:#0d5c22;}
#real-us-examples .tile-liab .tile-label{color:#8a2020;}
#real-us-examples .tile-liab{border-color:rgba(214,64,69,.20);background:rgba(214,64,69,.04);}
#real-us-examples .tile-liab .tile-val{color:#a4282d;}
#real-us-examples .tile-ratio .tile-label{color:var(--n);}
#real-us-examples .tile-ratio{border-color:rgba(22,58,112,.20);background:rgba(22,58,112,.05);}
#real-us-examples .tile-ratio .tile-val{color:var(--n);}

/* formula display */
#real-us-examples .formula-display{
  background:linear-gradient(145deg,#163a70,#0e2a56);
  color:#fff;border-radius:14px;
  padding:16px 20px;
  margin-bottom:20px;
  display:flex;align-items:center;
  flex-wrap:wrap;gap:12px;
}
#real-us-examples .formula-display .fd-label{
  font-size:.78rem;font-weight:700;
  letter-spacing:.05em;text-transform:uppercase;
  color:rgba(255,255,255,.7);
  margin-right:4px;
}
#real-us-examples .formula-display .fd-eq{
  font-size:1rem;font-weight:700;
  color:#fff;font-family:'Courier New',monospace;
}
#real-us-examples .formula-display .fd-result{
  margin-left:auto;
  font-family:'Montserrat',sans-serif;
  font-size:1.4rem;font-weight:900;color:#7dd3fc;
}

/* analysis grid */
#real-us-examples .analysis-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:14px;
  margin-bottom:18px;
}
#real-us-examples .a-tile{
  background:var(--bl);
  border:1px solid var(--b);
  border-radius:12px;
  padding:15px 16px;
}
#real-us-examples .a-tile h4{
  font-size:.88rem;margin-bottom:7px;
}
#real-us-examples .a-tile p{
  font-size:.93rem;line-height:1.7;
  color:#425466;
}

/* insight box */
#real-us-examples .insight{
  border-radius:12px;padding:14px 18px;
  border-left:4px solid var(--n);
  background:rgba(22,58,112,.07);
  font-size:.96rem;line-height:1.72;
  color:var(--c);
}
#real-us-examples .insight strong{color:var(--n);}
#real-us-examples .insight.green{
  border-left-color:var(--g);
  background:rgba(31,157,85,.07);
}
#real-us-examples .insight.red{
  border-left-color:var(--r);
  background:rgba(214,64,69,.07);
}

/* separator */
#real-us-examples .ex-divider{
  height:1px;
  background:linear-gradient(90deg,rgba(22,58,112,0),rgba(22,58,112,.15),rgba(22,58,112,0));
  margin:32px 0 10px;
}

/* comparison summary table */
#real-us-examples .summary-table-wrap{
  overflow-x:auto;
  border:1px solid var(--b);
  border-radius:16px;
  background:var(--wh);
  box-shadow:var(--sh);
  margin:22px 0 0;
}
#real-us-examples table{width:100%;border-collapse:collapse;min-width:620px;}
#real-us-examples th,#real-us-examples td{
  padding:12px 16px;text-align:left;
  border-bottom:1px solid var(--b);
  font-size:.95rem;line-height:1.6;
  vertical-align:middle;
}
#real-us-examples th{
  background:#edf2fb;color:var(--n);
  font-weight:800;font-size:.9rem;
}
#real-us-examples tr:last-child td{border-bottom:none;}
#real-us-examples .verdict-pill{
  display:inline-block;padding:4px 10px;
  border-radius:999px;font-size:.78rem;font-weight:700;
}

/* note callout */
#real-us-examples .note{
  background:rgba(22,58,112,.06);
  border-left:4px solid var(--n);
  border-radius:12px;
  padding:14px 18px;
  font-size:.95rem;line-height:1.72;
  margin-top:22px;
}

/* Responsive */
@media(max-width:860px){
  #real-us-examples .ex-header{flex-wrap:wrap;}
  #real-us-examples .ex-ratio-badge{width:100%;text-align:left;}
  #real-us-examples .bs-grid{grid-template-columns:1fr 1fr;}
  #real-us-examples .analysis-grid{grid-template-columns:1fr;}
}
@media(max-width:560px){
  #real-us-examples .ex-header,
  #real-us-examples .ex-body{padding:18px;}
  #real-us-examples .bs-grid{grid-template-columns:1fr;}
  #real-us-examples .formula-display{flex-direction:column;align-items:flex-start;}
  #real-us-examples .formula-display .fd-result{margin-left:0;}
  #real-us-examples h2{font-size:1.55rem;}
}

/* ── Scoped entirely to #pro-tips-us ─────────────────────── */
#pro-tips-us{
  --n:#163a70;
  --r:#d64045;
  --g:#1f9d55;
  --o:#d97706;
  --c:#2f3a45;
  --b:#d9e2ec;
  --bl:#f7fafc;
  --wh:#ffffff;
  --sh:0 2px 8px rgba(16,24,40,.07);
  --shm:0 10px 32px rgba(16,24,40,.11);
  color:var(--c);
  font-family:'Inter',sans-serif;
  
  /* 🚨 MOBILE LOCK FIXES 🚨 */
  width: 100%;
  max-width: 100vw;
  overflow-x: hidden;
  box-sizing: border-box;
}
#pro-tips-us *{box-sizing:border-box;}

/* ── Typography ───────────────────────────────────────────── */
#pro-tips-us h2{
  font-family:'Montserrat',sans-serif;
  font-size:clamp(1.75rem,1.4rem + 1vw,2.25rem);
  font-weight:800;color:var(--n);
  margin:0 0 12px;line-height:1.2;
  word-wrap: break-word; /* Prevents long titles from breaking screen */
}
#pro-tips-us h3{
  font-family:'Montserrat',sans-serif;
  font-size:clamp(1.12rem,.98rem + .45vw,1.4rem);
  font-weight:800;color:var(--n);
  margin:0 0 10px;line-height:1.25;
}
#pro-tips-us h4{
  font-size:.99rem;font-weight:700;
  color:var(--n);margin:0 0 8px;line-height:1.35;
}
#pro-tips-us p{
  margin:0 0 13px;line-height:1.78;
  font-size:1rem;color:var(--c);
}
#pro-tips-us p:last-child{margin-bottom:0;}
#pro-tips-us .lead{
  font-size:1.06rem;color:#3d4f5e;
  max-width:940px;margin-bottom:30px;line-height:1.78;
}

/* ── Tip number accent strip ──────────────────────────────── */
#pro-tips-us .tip-strip{
  display:grid;
  grid-template-columns:repeat(5,1fr);
  gap:0;
  border-radius:16px;
  overflow:hidden;
  margin-bottom:36px;
  box-shadow:var(--shm);
  width: 100%; /* Fix */
}
#pro-tips-us .tip-strip-item{
  padding:14px 12px;
  text-align:center;
  cursor:pointer;
  transition:filter .18s ease;
}
#pro-tips-us .tip-strip-item:hover{filter:brightness(1.08);}
#pro-tips-us .tip-strip-item .sn{
  font-family:'Montserrat',sans-serif;
  font-size:1.6rem;font-weight:900;
  color:#fff;line-height:1;margin-bottom:5px;
}
#pro-tips-us .tip-strip-item .sl{
  font-size:.72rem;font-weight:700;
  color:rgba(255,255,255,.88);
  letter-spacing:.04em;text-transform:uppercase;
  line-height:1.35;
}
#pro-tips-us .ts-1{background:#163a70;}
#pro-tips-us .ts-2{background:#1a4d8a;}
#pro-tips-us .ts-3{background:#1f9d55;}
#pro-tips-us .ts-4{background:#c95a1b;}
#pro-tips-us .ts-5{background:#d64045;}

/* ── Main tip cards ───────────────────────────────────────── */
#pro-tips-us .tip-card{
  display:grid;
  grid-template-columns:80px 1fr;
  gap:0;
  border:1px solid var(--b);
  border-radius:20px;
  overflow:hidden;
  box-shadow:var(--sh);
  margin-bottom:28px;
  background:var(--wh);
  transition:box-shadow .2s ease, transform .2s ease;
  width: 100%; /* Fix */
}
#pro-tips-us .tip-card:hover{
  box-shadow:var(--shm);
  transform:translateY(-2px);
}
#pro-tips-us .tip-sidebar{
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:flex-start;
  padding:26px 0 20px;
  gap:10px;
}
#pro-tips-us .tip-sidebar .tip-num{
  font-family:'Montserrat',sans-serif;
  font-size:2rem;font-weight:900;
  color:#fff;line-height:1;
}
#pro-tips-us .tip-sidebar .tip-icon{
  width:34px;height:34px;
  opacity:.85;
}
#pro-tips-us .tip-sidebar .tip-tag{
  writing-mode:vertical-rl;
  text-orientation:mixed;
  transform:rotate(180deg);
  font-size:.65rem;font-weight:700;
  letter-spacing:.08em;text-transform:uppercase;
  color:rgba(255,255,255,.7);
  margin-top:6px;
}

/* sidebar accent colors per tip */
#pro-tips-us .tc-1 .tip-sidebar{background:linear-gradient(180deg,#163a70,#0e2a56);}
#pro-tips-us .tc-2 .tip-sidebar{background:linear-gradient(180deg,#1a4d8a,#123462);}
#pro-tips-us .tc-3 .tip-sidebar{background:linear-gradient(180deg,#1f9d55,#14703c);}
#pro-tips-us .tc-4 .tip-sidebar{background:linear-gradient(180deg,#c95a1b,#9a3f0d);}
#pro-tips-us .tc-5 .tip-sidebar{background:linear-gradient(180deg,#d64045,#a42830);}

/* ── Card body ────────────────────────────────────────────── */
#pro-tips-us .tip-body{
  padding:24px 26px 26px;
  border-left:1px solid var(--b);
}
#pro-tips-us .tip-eyebrow{
  display:inline-block;
  padding:4px 11px;border-radius:999px;
  font-size:.74rem;font-weight:700;
  letter-spacing:.04em;text-transform:uppercase;
  margin-bottom:10px;
}
#pro-tips-us .tc-1 .tip-eyebrow{background:rgba(22,58,112,.10);color:var(--n);}
#pro-tips-us .tc-2 .tip-eyebrow{background:rgba(26,77,138,.10);color:#1a4d8a;}
#pro-tips-us .tc-3 .tip-eyebrow{background:rgba(31,157,85,.12);color:#0d7a38;}
#pro-tips-us .tc-4 .tip-eyebrow{background:rgba(201,90,27,.12);color:#7a3000;}
#pro-tips-us .tc-5 .tip-eyebrow{background:rgba(214,64,69,.12);color:#a4282d;}

/* ── Sub-grids inside each tip ────────────────────────────── */
#pro-tips-us .tip-grid-2{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:14px;margin-top:18px;
}
#pro-tips-us .tip-grid-3{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:12px;margin-top:16px;
}
#pro-tips-us .sub-tile{
  background:var(--bl);
  border:1px solid var(--b);
  border-radius:12px;padding:14px 16px;
}
#pro-tips-us .sub-tile h4{font-size:.88rem;margin-bottom:6px;}
#pro-tips-us .sub-tile p{font-size:.9rem;color:#425466;line-height:1.68;}

/* ── Data table inside tip ────────────────────────────────── */
#pro-tips-us .tip-table-wrap{
  width: 100%; /* Fix */
  display: block; /* Fix */
  overflow-x: auto;
  -webkit-overflow-scrolling: touch; /* Smooth mobile scrolling */
  border:1px solid var(--b);
  border-radius:14px;
  background:var(--wh);
  box-shadow:var(--sh);
  margin-top:18px;
}
#pro-tips-us table{width:100%;border-collapse:collapse;min-width:540px;}
#pro-tips-us th,#pro-tips-us td{
  padding:11px 14px;text-align:left;
  border-bottom:1px solid var(--b);
  font-size:.93rem;line-height:1.6;vertical-align:top;
}
#pro-tips-us th{
  background:#edf2fb;color:var(--n);
  font-weight:800;font-size:.88rem;
}
#pro-tips-us tr:last-child td{border-bottom:none;}

/* ── Highlight/callout boxes ──────────────────────────────── */
#pro-tips-us .hlt-navy{
  background:rgba(22,58,112,.07);
  border-left:4px solid var(--n);
  border-radius:12px;padding:14px 18px;
  margin-top:16px;font-size:.96rem;line-height:1.72;
}
#pro-tips-us .hlt-green{
  background:rgba(31,157,85,.08);
  border-left:4px solid var(--g);
  border-radius:12px;padding:14px 18px;
  margin-top:16px;font-size:.96rem;line-height:1.72;
}
#pro-tips-us .hlt-red{
  background:rgba(214,64,69,.08);
  border-left:4px solid var(--r);
  border-radius:12px;padding:14px 18px;
  margin-top:16px;font-size:.96rem;line-height:1.72;
}
#pro-tips-us .hlt-orange{
  background:rgba(201,90,27,.08);
  border-left:4px solid var(--o);
  border-radius:12px;padding:14px 18px;
  margin-top:16px;font-size:.96rem;line-height:1.72;
}

/* ── Inline formula pill ──────────────────────────────────── */
#pro-tips-us .formula-pill{
  display:inline-block;
  background:linear-gradient(135deg,#163a70,#0e2a56);
  color:#fff;border-radius:10px;
  padding:10px 18px;margin:14px 0;
  font-family:'Courier New',monospace;
  font-size:.97rem;font-weight:700;
  letter-spacing:.01em;
  word-break: break-word; /* Fix: prevents long formulas from expanding screen */
  white-space: normal;
}

/* ── Benchmark row ────────────────────────────────────────── */
#pro-tips-us .bench-row{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:12px;margin-top:16px;
}
#pro-tips-us .bench-tile{
  background:var(--bl);
  border:1px solid var(--b);
  border-radius:12px;
  padding:13px 14px;text-align:center;
}
#pro-tips-us .bench-tile .bv{
  font-family:'Montserrat',sans-serif;
  font-size:1.4rem;font-weight:900;
  color:var(--n);line-height:1;margin-bottom:5px;
}
#pro-tips-us .bench-tile .bi{
  font-size:.76rem;font-weight:700;
  color:#6b7a8d;text-transform:uppercase;
  letter-spacing:.04em;
}

/* ── Action checklist ─────────────────────────────────────── */
#pro-tips-us .checklist{
  list-style:none;padding:0;margin:14px 0 0;
}
#pro-tips-us .checklist li{
  display:flex;align-items:flex-start;
  gap:10px;padding:8px 0;
  border-bottom:1px solid rgba(22,58,112,.08);
  font-size:.97rem;line-height:1.7;color:var(--c);
}
#pro-tips-us .checklist li:last-child{border-bottom:none;}
#pro-tips-us .checklist li::before{
  content:'✓';
  font-weight:900;color:var(--g);
  flex-shrink:0;margin-top:2px;
  font-size:1rem;
}

/* ── Summary strip at bottom ──────────────────────────────── */
#pro-tips-us .summary-strip{
  display:grid;
  grid-template-columns:repeat(5,1fr);
  gap:14px;
  margin-top:32px;
}
#pro-tips-us .ss-tile{
  background:var(--wh);
  border:1px solid var(--b);
  border-radius:14px;
  padding:18px 16px;
  box-shadow:var(--sh);
  text-align:center;
}
#pro-tips-us .ss-tile .ss-num{
  font-family:'Montserrat',sans-serif;
  font-size:1.1rem;font-weight:900;
  color:#fff;
  width:36px;height:36px;
  border-radius:50%;
  display:inline-flex;align-items:center;
  justify-content:center;
  margin:0 auto 10px;
}
#pro-tips-us .ss-tile:nth-child(1) .ss-num{background:var(--n);}
#pro-tips-us .ss-tile:nth-child(2) .ss-num{background:#1a4d8a;}
#pro-tips-us .ss-tile:nth-child(3) .ss-num{background:var(--g);}
#pro-tips-us .ss-tile:nth-child(4) .ss-num{background:var(--o);}
#pro-tips-us .ss-tile:nth-child(5) .ss-num{background:var(--r);}
#pro-tips-us .ss-tile .ss-title{
  font-family:'Montserrat',sans-serif;
  font-size:.88rem;font-weight:800;
  color:var(--n);line-height:1.3;
  margin-bottom:6px;
}
#pro-tips-us .ss-tile .ss-desc{
  font-size:.82rem;color:#5a6a78;line-height:1.6;
}

/* ── Responsive ───────────────────────────────────────────── */
@media(max-width:980px){
  #pro-tips-us .tip-strip{grid-template-columns:repeat(5,1fr);}
  #pro-tips-us .tip-grid-3,
  #pro-tips-us .bench-row,
  #pro-tips-us .summary-strip{grid-template-columns:repeat(2,1fr);}
  #pro-tips-us .tip-grid-2{grid-template-columns:1fr;}
}
@media(max-width:680px){
  #pro-tips-us .tip-card{grid-template-columns:64px 1fr;}
  #pro-tips-us .tip-sidebar .tip-tag{display:none;}
  #pro-tips-us .tip-strip-item .sl{font-size:.62rem;}
  #pro-tips-us .tip-grid-3,
  #pro-tips-us .bench-row,
  #pro-tips-us .summary-strip{grid-template-columns:1fr;}
}
@media(max-width:480px){
  #pro-tips-us .tip-card{grid-template-columns:1fr;grid-template-rows:auto 1fr;}
  #pro-tips-us .tip-sidebar{
    flex-direction:row;padding:14px 16px; /* Slightly reduced padding */
    border-bottom:1px solid rgba(255,255,255,.15);
  }
  #pro-tips-us .tip-body{border-left:none;border-top:1px solid var(--b); padding: 20px 16px;}
  #pro-tips-us .tip-strip{grid-template-columns:1fr 1fr;}
}

/* ── Scoped to #faq-current-ratio only ─────────────────────── */
#faq-current-ratio{
  --n:#163a70;--r:#d64045;--g:#1f9d55;
  --o:#c95a1b;--pu:#5a3ea1;
  --c:#2f3a45;--b:#d9e2ec;--bl:#f7fafc;--wh:#ffffff;
  --sh:0 2px 8px rgba(16,24,40,.07);
  --shm:0 10px 32px rgba(16,24,40,.11);
  color:var(--c);font-family:'Inter',sans-serif;
}
#faq-current-ratio *{box-sizing:border-box;}

#faq-current-ratio h2{
  font-family:'Montserrat',sans-serif;
  font-size:clamp(1.75rem,1.4rem + 1vw,2.25rem);
  font-weight:800;color:var(--n);
  margin:0 0 12px;line-height:1.2;
}
#faq-current-ratio .lead{
  font-size:1.06rem;color:#3d4f5e;
  max-width:940px;margin-bottom:28px;line-height:1.78;
}

/* ── Stats bar ─────────────────────────────────────────────── */
#faq-current-ratio .faq-stats{
  display:flex;flex-wrap:wrap;gap:12px;
  margin-bottom:28px;
}
#faq-current-ratio .faq-stat{
  background:var(--wh);
  border:1px solid var(--b);
  border-radius:10px;
  padding:10px 18px;
  box-shadow:var(--sh);
  display:flex;align-items:center;gap:8px;
  font-size:.9rem;color:var(--c);
}
#faq-current-ratio .faq-stat strong{
  font-family:'Montserrat',sans-serif;
  font-weight:800;color:var(--n);font-size:1.1rem;
}

/* ── Search bar ────────────────────────────────────────────── */
#faq-current-ratio .faq-search-wrap{
  position:relative;margin-bottom:20px;
}
#faq-current-ratio .faq-search{
  width:100%;padding:13px 46px 13px 18px;
  border:1.5px solid var(--b);
  border-radius:12px;
  background:var(--wh);
  font-size:1rem;color:var(--c);
  font-family:'Inter',sans-serif;
  box-shadow:var(--sh);
  transition:border-color .18s ease,box-shadow .18s ease;
  outline:none;
}
#faq-current-ratio .faq-search:focus{
  border-color:var(--n);
  box-shadow:0 0 0 3px rgba(22,58,112,.12);
}
#faq-current-ratio .faq-search::placeholder{color:#9baab8;}
#faq-current-ratio .search-icon{
  position:absolute;right:16px;top:50%;
  transform:translateY(-50%);
  color:#9baab8;pointer-events:none;
}

/* ── Category filter tabs ──────────────────────────────────── */
#faq-current-ratio .faq-cats{
  display:flex;flex-wrap:wrap;gap:8px;
  margin-bottom:24px;
}
#faq-current-ratio .faq-cat-btn{
  padding:8px 16px;
  border-radius:999px;
  border:1.5px solid var(--b);
  background:var(--wh);
  font-size:.85rem;font-weight:700;
  color:#5a6a78;cursor:pointer;
  transition:all .18s ease;
  font-family:'Inter',sans-serif;
  display:flex;align-items:center;gap:6px;
}
#faq-current-ratio .faq-cat-btn:hover{
  border-color:var(--n);color:var(--n);
  background:rgba(22,58,112,.05);
}
#faq-current-ratio .faq-cat-btn.active{
  background:var(--n);color:#fff;
  border-color:var(--n);
}
#faq-current-ratio .faq-cat-btn .cat-count{
  background:rgba(255,255,255,.25);
  border-radius:999px;
  padding:1px 7px;
  font-size:.75rem;
}
#faq-current-ratio .faq-cat-btn:not(.active) .cat-count{
  background:rgba(22,58,112,.10);color:var(--n);
}

/* ── Category group heading ────────────────────────────────── */
#faq-current-ratio .faq-group{
  margin-bottom:10px;
}
#faq-current-ratio .faq-group-label{
  display:flex;align-items:center;gap:10px;
  margin:20px 0 12px;
}
#faq-current-ratio .faq-group-label .glabel{
  font-family:'Montserrat',sans-serif;
  font-size:.82rem;font-weight:800;
  letter-spacing:.06em;text-transform:uppercase;
  padding:5px 13px;border-radius:999px;
}
#faq-current-ratio .gl-basics .glabel{background:rgba(22,58,112,.10);color:var(--n);}
#faq-current-ratio .gl-formula .glabel{background:rgba(90,62,161,.10);color:var(--pu);}
#faq-current-ratio .gl-benchmark .glabel{background:rgba(31,157,85,.11);color:#0d7a38;}
#faq-current-ratio .gl-interpret .glabel{background:rgba(201,90,27,.11);color:#7a3000;}
#faq-current-ratio .gl-improve .glabel{background:rgba(214,64,69,.11);color:#a4282d;}
#faq-current-ratio .gl-lending .glabel{background:rgba(22,58,112,.10);color:var(--n);}
#faq-current-ratio .faq-group-label hr{flex:1;border:none;height:1px;background:var(--b);}

/* ── Individual FAQ item ───────────────────────────────────── */
#faq-current-ratio .faq-item{
  border:1px solid var(--b);
  border-radius:14px;
  background:var(--wh);
  margin-bottom:10px;
  box-shadow:var(--sh);
  overflow:hidden;
  transition:box-shadow .2s ease;
}
#faq-current-ratio .faq-item:hover{box-shadow:var(--shm);}
#faq-current-ratio .faq-item.hidden{display:none;}

/* Question button */
#faq-current-ratio .faq-q{
  width:100%;
  display:flex;align-items:center;
  gap:12px;
  padding:18px 20px;
  background:none;border:none;
  cursor:pointer;
  text-align:left;
  font-family:'Inter',sans-serif;
}
#faq-current-ratio .faq-q:focus-visible{
  outline:2px solid var(--n);
  outline-offset:-2px;
}
#faq-current-ratio .faq-q-num{
  flex-shrink:0;
  width:30px;height:30px;
  border-radius:50%;
  background:rgba(22,58,112,.09);
  color:var(--n);
  font-weight:800;
  font-size:.8rem;
  display:flex;align-items:center;
  justify-content:center;
  font-family:'Montserrat',sans-serif;
}
#faq-current-ratio .faq-q-text{
  flex:1;
  font-size:1rem;font-weight:700;
  color:var(--n);line-height:1.4;
}
#faq-current-ratio .faq-q-arrow{
  flex-shrink:0;
  width:28px;height:28px;
  border-radius:50%;
  background:rgba(22,58,112,.08);
  display:flex;align-items:center;justify-content:center;
  transition:transform .25s cubic-bezier(.16,1,.3,1),
             background .18s ease;
  color:var(--n);
}
#faq-current-ratio .faq-item.open .faq-q-arrow{
  transform:rotate(180deg);
  background:var(--n);color:#fff;
}
#faq-current-ratio .faq-item.open .faq-q{
  border-bottom:1px solid var(--b);
}

/* Answer panel */
#faq-current-ratio .faq-a{
  max-height:0;
  overflow:hidden;
  transition:max-height .32s cubic-bezier(.16,1,.3,1);
}
#faq-current-ratio .faq-a-inner{
  padding:18px 20px 20px;
}
#faq-current-ratio .faq-a-inner p{
  font-size:.98rem;
  line-height:1.78;
  color:var(--c);
  margin:0 0 11px;
}
#faq-current-ratio .faq-a-inner p:last-child{margin-bottom:0;}
#faq-current-ratio .faq-a-inner strong{color:var(--n);}
#faq-current-ratio .faq-a-inner ul{
  padding-left:18px;margin:8px 0 11px;
}
#faq-current-ratio .faq-a-inner ul li{
  font-size:.97rem;line-height:1.75;
  margin-bottom:7px;color:var(--c);
}
#faq-current-ratio .faq-a-inner .formula-inline{
  display:inline-block;
  background:linear-gradient(135deg,#163a70,#0e2a56);
  color:#fff;border-radius:8px;
  padding:8px 16px;margin:8px 0;
  font-family:'Courier New',monospace;
  font-size:.92rem;font-weight:700;
}
#faq-current-ratio .faq-a-inner .note-mini{
  background:rgba(22,58,112,.07);
  border-left:3px solid var(--n);
  border-radius:8px;padding:10px 14px;
  margin-top:10px;font-size:.91rem;
  line-height:1.68;
}

/* ── No-results message ────────────────────────────────────── */
#faq-current-ratio .faq-no-results{
  display:none;text-align:center;
  padding:36px 20px;color:#8594a5;
  font-size:.97rem;
}
#faq-current-ratio .faq-no-results.visible{display:block;}

/* ── Schema note ───────────────────────────────────────────── */
#faq-current-ratio .schema-note{
  background:rgba(22,58,112,.05);
  border:1px solid rgba(22,58,112,.14);
  border-radius:10px;
  padding:12px 16px;
  margin-top:22px;
  font-size:.84rem;color:#5a6a78;
  line-height:1.65;
}

/* ── Responsive ────────────────────────────────────────────── */
@media(max-width:600px){
  #faq-current-ratio .faq-q{padding:15px 16px;gap:10px;}
  #faq-current-ratio .faq-a-inner{padding:15px 16px 18px;}
  #faq-current-ratio .faq-q-text{font-size:.95rem;}
  #faq-current-ratio h2{font-size:1.55rem;}
}

/* ── Scoped to #related-calculators-cr only ─────────────────── */
#related-calculators-cr{
  --n:#163a70;--r:#d64045;--g:#1f9d55;--o:#c95a1b;--t:#0c7c8a;
  --c:#2f3a45;--b:#d9e2ec;--bl:#f7fafc;--wh:#ffffff;
  --sh:0 2px 8px rgba(16,24,40,.07);
  --shm:0 10px 28px rgba(16,24,40,.12);
  color:var(--c);font-family:'Inter',sans-serif;
}
#related-calculators-cr *{box-sizing:border-box;}

/* ── Headings ─────────────────────────────────────────────── */
#related-calculators-cr h2{
  font-family:'Montserrat',sans-serif;
  font-size:clamp(1.75rem,1.4rem + 1vw,2.25rem);
  font-weight:800;color:var(--n);
  margin:0 0 12px;line-height:1.2;
}
#related-calculators-cr h3{
  font-family:'Montserrat',sans-serif;
  font-size:.82rem;font-weight:800;
  letter-spacing:.06em;text-transform:uppercase;
  color:var(--n);margin:0 0 16px;
  display:flex;align-items:center;gap:10px;
}
#related-calculators-cr h3::after{
  content:'';flex:1;height:1px;
  background:var(--b);
}
#related-calculators-cr p.lead{
  font-size:1.04rem;color:#3d4f5e;
  max-width:900px;margin-bottom:30px;line-height:1.78;
}

/* ── Category group ───────────────────────────────────────── */
#related-calculators-cr .rc-group{
  margin-bottom:36px;
}

/* ── Card grid ────────────────────────────────────────────── */
#related-calculators-cr .rc-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:16px;
}

/* ── Individual card ──────────────────────────────────────── */
#related-calculators-cr .rc-card{
  display:flex;
  flex-direction:column;
  background:var(--wh);
  border:1px solid var(--b);
  border-radius:16px;
  padding:20px;
  text-decoration:none;
  color:inherit;
  box-shadow:var(--sh);
  transition:transform .2s cubic-bezier(.16,1,.3,1),
             box-shadow .2s cubic-bezier(.16,1,.3,1),
             border-color .18s ease;
  position:relative;
  overflow:hidden;
}
#related-calculators-cr .rc-card::before{
  content:'';
  position:absolute;top:0;left:0;right:0;
  height:3px;
  background:var(--card-accent,var(--n));
  transform:scaleX(0);
  transform-origin:left;
  transition:transform .25s cubic-bezier(.16,1,.3,1);
}
#related-calculators-cr .rc-card:hover{
  transform:translateY(-4px);
  box-shadow:var(--shm);
  border-color:rgba(22,58,112,.20);
}
#related-calculators-cr .rc-card:hover::before{
  transform:scaleX(1);
}

/* Accent color variants */
#related-calculators-cr .rc-navy{--card-accent:var(--n);}
#related-calculators-cr .rc-red{--card-accent:var(--r);}
#related-calculators-cr .rc-green{--card-accent:var(--g);}
#related-calculators-cr .rc-teal{--card-accent:var(--t);}
#related-calculators-cr .rc-orange{--card-accent:var(--o);}

/* Card icon badge */
#related-calculators-cr .rc-icon{
  width:42px;height:42px;
  border-radius:10px;
  display:flex;align-items:center;justify-content:center;
  margin-bottom:14px;flex-shrink:0;
  transition:background .18s ease;
}
#related-calculators-cr .rc-navy .rc-icon{background:rgba(22,58,112,.10);color:var(--n);}
#related-calculators-cr .rc-red .rc-icon{background:rgba(214,64,69,.10);color:var(--r);}
#related-calculators-cr .rc-green .rc-icon{background:rgba(31,157,85,.11);color:#0d7a38;}
#related-calculators-cr .rc-teal .rc-icon{background:rgba(12,124,138,.10);color:var(--t);}
#related-calculators-cr .rc-orange .rc-icon{background:rgba(201,90,27,.10);color:var(--o);}

#related-calculators-cr .rc-card:hover .rc-icon{
  background:var(--card-accent);
  color:#fff;
}

/* Card title */
#related-calculators-cr .rc-title{
  font-family:'Montserrat',sans-serif;
  font-size:.97rem;font-weight:800;
  color:var(--n);line-height:1.3;
  margin-bottom:6px;
}

/* Card description */
#related-calculators-cr .rc-desc{
  font-size:.85rem;line-height:1.65;
  color:#5a6a78;flex:1;
}

/* Card CTA arrow */
#related-calculators-cr .rc-cta{
  display:flex;align-items:center;gap:5px;
  font-size:.8rem;font-weight:700;
  color:var(--card-accent,var(--n));
  margin-top:14px;
  transition:gap .18s ease;
}
#related-calculators-cr .rc-card:hover .rc-cta{gap:8px;}

/* Category label pill */
#related-calculators-cr .cat-pill{
  display:inline-block;padding:3px 10px;
  border-radius:999px;font-size:.72rem;font-weight:700;
  letter-spacing:.03em;text-transform:uppercase;
  margin-bottom:18px;
}
#related-calculators-cr .cat-liquidity{background:rgba(22,58,112,.09);color:var(--n);}
#related-calculators-cr .cat-profit{background:rgba(31,157,85,.10);color:#0d7a38;}
#related-calculators-cr .cat-cost{background:rgba(201,90,27,.10);color:#7a3000;}
#related-calculators-cr .cat-ops{background:rgba(12,124,138,.10);color:var(--t);}
#related-calculators-cr .cat-val{background:rgba(214,64,69,.10);color:#a4282d;}

/* Bottom promo strip */
#related-calculators-cr .rc-promo{
  display:flex;align-items:center;justify-content:space-between;
  flex-wrap:wrap;gap:16px;
  background:linear-gradient(135deg,#163a70,#0e2a56);
  border-radius:18px;
  padding:24px 28px;
  margin-top:10px;
  box-shadow:var(--shm);
}
#related-calculators-cr .rc-promo-text h3{
  font-family:'Montserrat',sans-serif;
  font-size:1.12rem;font-weight:800;
  color:#fff;margin:0 0 5px;
  letter-spacing:normal;text-transform:none;
}
#related-calculators-cr .rc-promo-text h3::after{display:none;}
#related-calculators-cr .rc-promo-text p{
  font-size:.92rem;color:rgba(255,255,255,.82);
  margin:0;line-height:1.6;
}
#related-calculators-cr .rc-promo-btn{
  display:inline-flex;align-items:center;gap:7px;
  background:#fff;color:var(--n);
  font-family:'Montserrat',sans-serif;
  font-size:.9rem;font-weight:800;
  padding:11px 22px;border-radius:10px;
  text-decoration:none;white-space:nowrap;
  transition:background .18s ease,transform .18s ease;
  box-shadow:0 2px 8px rgba(0,0,0,.18);
  flex-shrink:0;
}
#related-calculators-cr .rc-promo-btn:hover{
  background:#eef4fb;transform:translateY(-1px);
}

/* Responsive */
@media(max-width:1100px){
  #related-calculators-cr .rc-grid{grid-template-columns:repeat(3,minmax(0,1fr));}
}
@media(max-width:760px){
  #related-calculators-cr .rc-grid{grid-template-columns:repeat(2,minmax(0,1fr));}
  #related-calculators-cr .rc-promo{flex-direction:column;align-items:flex-start;}
}
@media(max-width:480px){
  #related-calculators-cr .rc-grid{grid-template-columns:1fr;}
  #related-calculators-cr h2{font-size:1.55rem;}
}

/* ── Legal disclaimer styles ──────────────────────────────── */
#legal-disclaimer-cr{
  margin-top:16px;
}
.cr-legal-outer{
  background:#f7fafc;
  border:1px solid #d9e2ec;
  border-radius:16px;
  overflow:hidden;
  box-shadow:0 2px 8px rgba(16,24,40,.06);
}

/* Header bar */
.cr-legal-header{
  display:flex;align-items:center;gap:12px;
  background:#edf2fb;
  border-bottom:1px solid #d9e2ec;
  padding:14px 22px;
}
.cr-legal-header .lh-icon{
  width:34px;height:34px;
  border-radius:8px;
  background:rgba(22,58,112,.10);
  display:flex;align-items:center;justify-content:center;
  flex-shrink:0;color:#163a70;
}
.cr-legal-header .lh-title{
  font-family:'Montserrat',sans-serif;
  font-size:.95rem;font-weight:800;
  color:#163a70;line-height:1.2;
}
.cr-legal-header .lh-date{
  font-size:.76rem;color:#6b7a8d;
  font-weight:600;margin-left:auto;
  white-space:nowrap;
}

/* Body */
.cr-legal-body{
  padding:20px 22px 22px;
}
.cr-legal-body p{
  font-size:.88rem;line-height:1.76;
  color:#425466;margin:0 0 12px;
}
.cr-legal-body p:last-child{margin-bottom:0;}
.cr-legal-body strong{color:#163a70;}

/* Key points grid */
.cr-legal-points{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:10px;
  margin:14px 0 16px;
}
.cr-legal-point{
  background:#fff;
  border:1px solid #d9e2ec;
  border-radius:10px;
  padding:12px 14px;
  display:flex;align-items:flex-start;gap:9px;
}
.cr-legal-point .lp-dot{
  width:6px;height:6px;
  border-radius:50%;
  background:#163a70;
  flex-shrink:0;margin-top:6px;
}
.cr-legal-point p{
  font-size:.82rem;line-height:1.65;
  color:#3d4f5e;margin:0;
}
.cr-legal-point p strong{
  display:block;font-size:.84rem;
  color:#163a70;margin-bottom:2px;
}

/* Gov links in disclaimer */
.cr-legal-govlinks{
  display:flex;flex-wrap:wrap;gap:7px;
  margin-top:14px;
  padding-top:14px;
  border-top:1px solid #d9e2ec;
}
.cr-legal-govlinks span{
  font-size:.77rem;font-weight:700;
  color:#6b7a8d;letter-spacing:.03em;
  text-transform:uppercase;margin-right:4px;
  align-self:center;
}
.cr-legal-govlink{
  display:inline-flex;align-items:center;gap:4px;
  background:#fff;
  border:1px solid #d9e2ec;
  border-radius:6px;
  padding:5px 11px;
  font-size:.78rem;font-weight:700;
  color:#163a70;text-decoration:none;
  transition:background .18s ease,border-color .18s ease;
}
.cr-legal-govlink:hover{
  background:#edf2fb;border-color:#b8cce0;
  color:#0e2a56;
}
.cr-legal-govlink svg{opacity:.6;}

/* Professional advice notice */
.cr-legal-notice{
  display:flex;align-items:flex-start;gap:11px;
  background:rgba(214,64,69,.06);
  border:1px solid rgba(214,64,69,.18);
  border-radius:10px;
  padding:13px 16px;
  margin-top:14px;
}
.cr-legal-notice .ln-icon{
  flex-shrink:0;color:#d64045;margin-top:1px;
}
.cr-legal-notice p{
  font-size:.84rem;line-height:1.7;
  color:#3d4f5e;margin:0;
}
.cr-legal-notice p strong{color:#a4282d;}

/* Responsive */
@media(max-width:760px){
  .cr-legal-points{grid-template-columns:1fr 1fr;}
  .cr-legal-header{flex-wrap:wrap;}
  .cr-legal-header .lh-date{width:100%;margin-left:0;}
}
@media(max-width:480px){
  .cr-legal-points{grid-template-columns:1fr;}
  .cr-legal-body,.cr-legal-header{padding-left:16px;padding-right:16px;}
}

/* ── Scoped styles ─────────────────────────────────────────── */
#transparency-independence {
  font-family:'Inter',sans-serif;
  margin-top: 48px;
}
#transparency-independence * { box-sizing: border-box; }

/* ── Transparency section outer ──────────────────────────── */
.arc-transparency-section {
  background: linear-gradient(145deg, #0d2248, #163a70);
  border-radius: 20px;
  padding: 36px 40px;
  margin-bottom: 0;
  box-shadow: 0 12px 40px rgba(14,34,72,.25);
  position: relative;
  overflow: hidden;
}
.arc-transparency-section::before {
  content: '';
  position: absolute; top: -60px; right: -60px;
  width: 240px; height: 240px;
  border-radius: 50%;
  background: rgba(255,255,255,.04);
  pointer-events: none;
}
.arc-transparency-section::after {
  content: '';
  position: absolute; bottom: -80px; left: 20%;
  width: 320px; height: 320px;
  border-radius: 50%;
  background: rgba(255,255,255,.03);
  pointer-events: none;
}

/* ── Inner layout ─────────────────────────────────────────── */
.arc-transparency-inner {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 28px;
  align-items: flex-start;
  position: relative; z-index: 1;
}

/* ── Logo badge ───────────────────────────────────────────── */
.arc-trans-logo-wrap { flex-shrink: 0; }
.arc-trans-logo {
  width: 68px; height: 68px;
  border-radius: 16px;
  background: rgba(255,255,255,.12);
  border: 1.5px solid rgba(255,255,255,.2);
  display: flex; align-items: center; justify-content: center;
  backdrop-filter: blur(4px);
}
.arc-trans-initials {
  font-family: 'Montserrat', sans-serif;
  font-size: .85rem; font-weight: 900;
  color: #fff; text-align: center;
  line-height: 1.1; letter-spacing: .02em;
}

/* ── Content ──────────────────────────────────────────────── */
.arc-trans-title {
  font-family: 'Montserrat', sans-serif;
  font-size: clamp(1.2rem, 1rem + .6vw, 1.55rem);
  font-weight: 800; color: #fff;
  margin: 0 0 12px; line-height: 1.25;
}
.arc-trans-text {
  font-size: .97rem; color: rgba(255,255,255,.88);
  line-height: 1.78; margin: 0 0 18px;
  max-width: 820px;
}
.arc-trans-text strong { color: #fff; }

/* ── Badges ───────────────────────────────────────────────── */
.arc-trans-badges {
  display: flex; flex-wrap: wrap; gap: 9px;
  margin-bottom: 20px;
}
.arc-trans-badge {
  display: inline-flex; align-items: center; gap: 6px;
  background: rgba(255,255,255,.12);
  border: 1px solid rgba(255,255,255,.2);
  border-radius: 999px;
  padding: 6px 14px;
  font-size: .8rem; font-weight: 700;
  color: #fff; letter-spacing: .02em;
  backdrop-filter: blur(4px);
}
.arc-trans-chk { color: #6ee7b7; font-size: .85rem; }

/* ── Stats row ────────────────────────────────────────────── */
.arc-trans-stats {
  display: flex; flex-wrap: wrap; gap: 20px;
  padding-top: 18px;
  border-top: 1px solid rgba(255,255,255,.14);
}
.arc-trans-stat {
  display: flex; flex-direction: column;
  gap: 2px;
}
.arc-trans-stat .sv {
  font-family: 'Montserrat', sans-serif;
  font-size: 1.4rem; font-weight: 900;
  color: #fff; line-height: 1;
}
.arc-trans-stat .sl {
  font-size: .76rem; font-weight: 600;
  color: rgba(255,255,255,.65);
  text-transform: uppercase; letter-spacing: .04em;
}

/* ── Authority sources row ────────────────────────────────── */
.arc-trans-sources {
  margin-top: 20px;
  padding-top: 18px;
  border-top: 1px solid rgba(255,255,255,.14);
}
.arc-trans-sources p {
  font-size: .8rem; color: rgba(255,255,255,.6);
  margin: 0 0 10px; font-weight: 600;
  text-transform: uppercase; letter-spacing: .05em;
}
.arc-trans-links {
  display: flex; flex-wrap: wrap; gap: 8px;
}
.arc-trans-link {
  display: inline-flex; align-items: center; gap: 5px;
  background: rgba(255,255,255,.09);
  border: 1px solid rgba(255,255,255,.16);
  border-radius: 8px;
  padding: 6px 12px;
  font-size: .79rem; font-weight: 700;
  color: rgba(255,255,255,.9);
  text-decoration: none;
  transition: background .18s ease, border-color .18s ease;
}
.arc-trans-link:hover {
  background: rgba(255,255,255,.18);
  border-color: rgba(255,255,255,.35);
  color: #fff;
}
.arc-trans-link svg { flex-shrink: 0; opacity: .7; }

/* Responsive */
@media(max-width:680px) {
  .arc-transparency-section { padding: 24px 20px; }
  .arc-transparency-inner { grid-template-columns: 1fr; }
  .arc-trans-logo-wrap { display: none; }
  .arc-trans-stats { gap: 14px; }
}



/* ── DEFAULT STATE: explicit dark text on all cards ── */
.bt,
.cat-card,
.role-card,
.ind-card,
.bracket-btn {
  color: var(--g900, #0f172a);
}

/* ── INNER LABELS: always inherit from parent card ── */
.bt .bl, .bt .bs,
.cat-card .cl, .cat-card .cr,
.role-card .rl, .role-card .rm,
.ind-card .il, .ind-card .ir,
.bracket-btn .bv, .bracket-btn .bl {
  color: inherit !important;
}

/* ── HOVER STATE: navy text on light blue background ── */
.bt:hover,
.cat-card:hover,
.role-card:hover,
.ind-card:hover,
.bracket-btn:hover {
  color: var(--navy, #002868) !important;
}

/* ── ACTIVE / SELECTED STATE: always white text ── */
.bt.active, .bt.on,
.cat-card.on,
.role-card.on,
.ind-card.on,
.bracket-btn.on {
  color: #fff !important;
}

/* ── ALSO FIX: opacity on .cr / .ir / .rm / .bs 
     Stays 65% in default & selected, 
     but goes to 80% on hover for readability ── */
.bt:hover .bs,
.cat-card:hover .cr,
.role-card:hover .rm,
.ind-card:hover .ir {
  opacity: 0.85 !important;
}

/* ── ALSO FIX: btype-grid (.bt) for CLV calculator ── */
.bt.active .bs {
  color: rgba(255,255,255,0.65) !important;
  opacity: 1 !important;
}


