/* ================================================================
   EVANS LEGACY FINANCIAL — Calculator Pages Theme Override
   Loaded AFTER inline styles to apply new design system
   ================================================================ */

@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=Playfair+Display:wght@700&display=swap');

:root {
  --brand:       #0B1F3A;
  --gold:        #C8A84A;
  --gold-light:  #E2C97E;
  --gold-pale:   #FAF5E4;
  --accent:      #C8A84A;
  --ink:         #1A1A2E;
  --muted:       #64748B;
  --bg:          #F8F7F4;
  --card:        #FFFFFF;
  --border:      #E5E7EB;
  --radius:      10px;
  --shadow:      0 4px 16px rgba(11,31,58,0.10);
  --nav-height:  76px;
}

/* ── Body ── */
body, body.site-wrapper {
  font-family: 'Inter', 'Segoe UI', system-ui, sans-serif !important;
  background: var(--bg) !important;
  color: var(--ink) !important;
}

/* Brand */
.brand { gap: 0.875rem !important; }
.brand img { height: 44px !important; width: auto !important; }
.brand-text span:first-child,
.brand-text span.brand-name {
  font-family: 'Playfair Display', Georgia, serif !important;
  font-size: 1rem !important; font-weight: 700 !important;
  color: #FFFFFF !important; line-height: 1.2 !important;
}
.brand-text span:last-child,
.brand-text span.brand-tagline {
  font-size: 0.68rem !important; color: #E2C97E !important;
  letter-spacing: 0.05em !important; font-weight: 500 !important;
}

/* Nav links */
.primary-nav a, .primary-nav > a {
  color: #fff !important;
  font-size: 0.875rem !important;
  font-weight: 600 !important;
  padding: 0.5rem 0.875rem !important;
  border-radius: 6px !important;
  transition: color 0.25s ease, background 0.25s ease !important;
  text-decoration: none !important;
}
.primary-nav a:hover {
  color: var(--gold-light) !important;
  background: rgba(255,255,255,0.07) !important;
}

/* ── Cards ── */
.card {
  border-radius: var(--radius) !important;
  border: 1px solid var(--border) !important;
  box-shadow: var(--shadow) !important;
  background: var(--card) !important;
}

/* ── Buttons ── */
.btn { font-family: 'Inter', sans-serif !important; font-weight: 600 !important; border-radius: 8px !important; }
.btn-primary {
  background: var(--gold) !important;
  color: var(--brand) !important;
  border-color: var(--gold) !important;
}
.btn-primary:hover {
  background: var(--gold-light) !important;
  border-color: var(--gold-light) !important;
}
.btn-secondary { background: var(--bg) !important; color: var(--ink) !important; border: 1px solid var(--border) !important; }

/* ── Headlines ── */
h1, h2,
.calculator-header h1,
h1.calc-title { font-family: 'Verdana', Geneva, sans-serif !important; }
.calculator-header h1,
h1.calc-title { color: var(--brand) !important; }

/* ── Footer ── */
footer.site-footer,
.site-footer {
  background: #050D1A !important;
  color: rgba(255,255,255,0.55) !important;
  padding: 2.5rem 0 !important;
}
.site-footer .inner { max-width: 1280px; margin: 0 auto; padding: 0 1.5rem; }
.site-footer a { color: rgba(255,255,255,0.5) !important; }
.site-footer a:hover { color: var(--gold-light) !important; }

/* ── Result highlights ── */
.result-value, .highlight-value, strong.result {
  color: var(--gold) !important;
  font-family: 'Playfair Display', Georgia, serif !important;
}

/* ── Focus/accessibility ── */
a:focus, button:focus, input:focus, select:focus, textarea:focus {
  outline: 2px solid rgba(200,168,74,0.5) !important;
  outline-offset: 2px !important;
}

/* ── Tables ── */
table { width: 100%; border-collapse: collapse; }
th { background: var(--brand) !important; color: white !important; padding: 0.75rem 1rem !important; font-size: 0.875rem !important; font-weight: 600 !important; }
td { padding: 0.625rem 1rem !important; border-bottom: 1px solid var(--border) !important; font-size: 0.875rem !important; }
tr:nth-child(even) td { background: var(--gold-pale) !important; }

/* ── Back link ── */
.back-link, a[href*="index"] {
  color: var(--brand) !important; font-weight: 600 !important;
}
