/* ============================================================
   Daylight compat layer (redesign 2026, batch 4)
   Loaded LAST on legacy-structured pages (blog, faq, glossary,
   cities, legal) after style.css + redesign.css. style.css keeps
   every component working; this sheet remaps the legacy design
   tokens to the light Daylight palette and reshapes the shared
   primitives (headings -> Fraunces, buttons -> pills). Page-scoped
   style blocks still win ties, which is intended — layout stays,
   color flows through the remapped variables.
   ============================================================ */

:root {
    /* Core backgrounds — paper instead of dark two-tone */
    --bg-body: #f6f7f9;
    --bg-surface: #ffffff;
    --bg-card: #ffffff;
    --bg-card-hover: #f8f9fb;
    --border-card: rgba(16, 22, 35, 0.1);
    --border-subtle: rgba(16, 22, 35, 0.06);

    /* Gold accent — deep enough for WCAG AA on paper */
    --accent: #a8842f;
    --accent-hover: #8f6f24;
    --accent-glow: rgba(168, 132, 47, 0.15);
    --accent-dim: rgba(168, 132, 47, 0.08);

    /* Green — success states (sage family) */
    --green: #4c7a53;
    --green-dim: #e4ece2;

    /* Red — negative/cost states (muted clay) */
    --red: #a04b3c;
    --red-dim: rgba(160, 75, 60, 0.1);

    /* Text hierarchy — ink on paper */
    --text: #101623;
    --text-mid: #3c4454;
    --text-dim: #5b6472;

    /* Warm amber secondary accent */
    --amber: #9c6434;
    --amber-dim: rgba(156, 100, 52, 0.1);

    /* Gold variants */
    --gold-glow: rgba(168, 132, 47, 0.12);
    --gold-dim: rgba(168, 132, 47, 0.07);

    /* Deep / Lifted section tokens — paper / sky wash */
    --deep-bg: #f6f7f9;
    --lifted-bg: #eef3fa;
    --deep-card-bg: #ffffff;
    --deep-card-border: rgba(16, 22, 35, 0.1);
    --lifted-card-bg: #ffffff;
    --lifted-card-border: rgba(16, 22, 35, 0.1);

    /* Fonts — Fraunces takes over headings */
    --font-heading: 'Fraunces', Georgia, serif;
}

/* ---------- Base surface: dot-grid paper ---------- */
body {
    background-color: var(--bg-body);
    background-image: radial-gradient(rgba(16, 22, 35, 0.06) 1px, transparent 1px);
    background-size: 24px 24px;
    color: var(--text);
}
.section-deep,
.section-lifted,
.final-cta {
    background-image: radial-gradient(rgba(16, 22, 35, 0.055) 1px, transparent 1px);
    background-size: 24px 24px;
}

/* ---------- Headings: editorial serif ---------- */
h1, h2, h3, h4,
.section-headline, .spotlight-heading {
    font-family: 'Fraunces', Georgia, serif;
    font-weight: 600;
    letter-spacing: -0.01em;
}

/* ---------- Eyebrows / content labels ---------- */
.content-label { color: #7a5d1a; }

/* ---------- Buttons: pill shapes, ink primary ---------- */
.btn {
    border-radius: 999px;
    font-family: var(--font);
}
.btn-accent {
    background: #101623;
    color: #ffffff;
    box-shadow: none;
}
.btn-accent:hover {
    background: #1c2434;
    color: #ffffff;
    box-shadow: 0 10px 32px rgba(16, 22, 35, 0.12);
    transform: translateY(-1px);
}
.btn-outline {
    border: 1.5px solid #101623;
    color: #101623;
    background: transparent;
}
.btn-outline:hover {
    background: #101623;
    color: #ffffff;
    border-color: #101623;
}
.btn-ghost {
    color: var(--text-mid);
    border-color: var(--border-card);
}

/* ---------- Links ---------- */
.link-gold { color: #7a5d1a; }
.link-gold:hover { color: #a8842f; }

/* ---------- Cards pick up soft shadows instead of glows ---------- */
.section-deep [class*="card"],
.section-lifted [class*="card"] {
    box-shadow: 0 2px 24px rgba(16, 22, 35, 0.06);
}

/* ---------- Fixed pill nav clearance ----------
   Legacy heroes were sized for a static top nav; the Daylight pill
   nav is fixed, so the first section needs extra headroom. */
main > section:first-child { padding-top: 170px !important; }
main > .breadcrumbs:first-child { padding-top: 118px; }
main > .breadcrumbs:first-child + section { padding-top: 56px !important; }

/* ---------- Lists: redesign.css resets list-style globally;
   restore bullets inside long-form content ---------- */
.article-body ul { list-style: disc; padding-left: 24px; }
.article-body ol { list-style: decimal; padding-left: 24px; }
.legal-content ul, .legal-content ol,
.term-body-section ul, .term-body-section ol {
    list-style: disc;
    padding-left: 24px;
}

/* ---------- Signup / capture card (blog + article pages) ---------- */
.signup-card {
    background: #ffffff;
    border: 1px solid rgba(16, 22, 35, 0.1);
    box-shadow: 0 2px 24px rgba(16, 22, 35, 0.06);
}
.signup-form input[type="email"] {
    background: #ffffff;
    border: 1.5px solid rgba(16, 22, 35, 0.18);
    color: var(--text);
    border-radius: 999px;
}
.signup-form input[type="email"]::placeholder { color: #8a90a0; }

/* ---------- Legacy hero glows / gradients off ---------- */
.hero::before, .hero::after { display: none; }

/* ---------- Neutralize style.css bare-element nav styling ----------
   style.css styles the <nav> ELEMENT as the old dark sticky header;
   on Daylight pages nav elements are the pill nav and the footer
   link row, which carry their own classes. */
nav {
    position: static;
    background: none;
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
    border-bottom: none;
    padding: 0;
}
.nav-outer { position: fixed; }
footer::before { display: none; }
