/* Source of truth: live MLS Ready color-theme-1 (Coastal Navy)
   /var/www/mls-ready/app/globals.css + /var/www/mls-ready/public/hero-theme-fix.css
   Load AFTER /assets/offer.css on static resources/guides only.
   Do NOT promote offer.css onto the MLS Next app. Deploy 2026-09-02 */

:root {
  color-scheme: light;
  --mls-paper: #f8fafc;
  --mls-card: #ffffff;
  --mls-line: #e2e8f0;
  --mls-ink: #0f172a;
  --mls-mute: #64748b;
  --mls-foot: #94a3b8;
  --mls-accent: #1e3a8a;
  --mls-accent-soft: #3b82f6;
  --mls-on-accent: #f8fafc;
  --mls-danger: #dc2626;
  --mls-hero-from: #e8eef7;
  --mls-hero-to: #f8fafc;
  --mls-flyer-mat: #e8eef7;
  --mls-header-bg: rgba(248, 250, 252, 0.94);
  --mls-logo-filter: none;
  --bg: var(--mls-paper);
  --card: var(--mls-card);
  --line: var(--mls-line);
  --text: var(--mls-ink);
  --muted: var(--mls-mute);
  --cyan: var(--mls-accent);
  --ink: var(--mls-on-accent);
  --foot: var(--mls-foot);
  --alt: #f1f5f9;
}

html, body {
  background: var(--mls-paper) !important;
  color: var(--mls-ink) !important;
}

header {
  background: var(--mls-header-bg);
  border-bottom: 1px solid var(--mls-line);
  backdrop-filter: saturate(1.1) blur(10px);
}

.brand-name { color: var(--mls-ink); }
.brand-name span { color: var(--mls-accent); font-weight: 600; }

nav a { color: var(--mls-ink); }
nav a:hover,
nav a.is-active { color: var(--mls-accent); }

/* Beat offer.css a.btn / a.btn-ghost specificity (empty CTA was ink-on-navy mismatch / prose fade) */
.btn,
a.btn {
  background: var(--mls-accent) !important;
  color: #ffffff !important;
  border: 1px solid var(--mls-accent) !important;
}
.btn:hover,
a.btn:hover { filter: brightness(1.05); text-decoration: none; }
.btn-ghost,
a.btn-ghost {
  background: transparent !important;
  color: var(--mls-accent) !important;
  border: 1px solid var(--mls-accent) !important;
}

.hero,
.hero-brand,
.page-hero {
  background: linear-gradient(180deg, var(--mls-hero-from), var(--mls-hero-to));
}
.hero-brand .hero-on-dark { color: var(--mls-ink) !important; }
.hero-brand .hero-on-dark-mute { color: var(--mls-mute) !important; }
.hero-brand .hero-on-dark-accent { color: var(--mls-accent) !important; }

/* Beat offer.css .prose p/#e4e4e7 faded body on light paper */
.prose,
.prose p,
.prose li,
.prose ul,
.prose ol,
.prose td,
.prose th,
.body-copy,
.body-copy p {
  color: var(--mls-ink) !important;
}
.prose h1, .prose h2, .prose h3, .prose h4 { color: var(--mls-ink) !important; }
.prose a { color: var(--mls-accent) !important; }
.prose strong { color: var(--mls-ink) !important; }
.crumb, .crumb a { color: var(--mls-mute) !important; }
.crumb a:hover { color: var(--mls-accent) !important; }
.cta-row { gap: 0.75rem; margin: 1rem 0 1.5rem; }
.lead, .fine { color: var(--mls-mute) !important; }

footer {
  background: var(--alt);
  border-top: 1px solid var(--mls-line);
  color: var(--mls-foot);
}
footer a { color: var(--mls-accent); }

.events a, .card {
  background: var(--mls-card);
  border: 1px solid var(--mls-line);
  color: var(--mls-ink);
}
.events a:hover { border-color: var(--mls-accent); }
.section { background: var(--mls-paper); color: var(--mls-ink); }
