/* ─── DEEP NAVY GLASS THEME ───────────────────────────────────────────────
   Additive overrides that convert cream sections to dark navy gradient +
   glass-panel cards. Load order: this file last in <head> so all overrides
   win on equal specificity without !important.
   Radial highlight alternates per section: 80% / 20% / 80% / 20% …
─────────────────────────────────────────────────────────────────────────── */

/* ─── PAGE BODY BACKGROUND ─────────────────────────────────────────────── */
/* Overrides design-system.css body { background-color: var(--color-paper) }
   Eliminates the cream flash before sections paint and any gap between sections. */
body {
  background:
    radial-gradient(85% 50% at 80% 0%, rgba(230,193,90,.10), transparent 60%),
    linear-gradient(180deg, #0A1428, #101E3C 55%, #0A1428);
}

/* ─── SECTION BACKGROUNDS ─────────────────────────────────────────────── */

/* 1 — WHY TRUST + STATS BAR */
.testimonials-section {
  background:
    radial-gradient(85% 50% at 80% 0%, rgba(230,193,90,.10), transparent 60%),
    linear-gradient(180deg, #0A1428, #101E3C 55%, #0A1428);
}

/* 2 — COMPARISON TABLE (scoped div inside #bundle — bundle bg untouched) */
.comparison-section {
  background:
    radial-gradient(85% 50% at 20% 0%, rgba(230,193,90,.10), transparent 60%),
    linear-gradient(180deg, #0A1428, #101E3C 55%, #0A1428);
}

/* 3 — FREE GUIDE */
.lead-magnet-section {
  background:
    radial-gradient(85% 50% at 80% 0%, rgba(230,193,90,.10), transparent 60%),
    linear-gradient(180deg, #0A1428, #101E3C 55%, #0A1428);
}

/* 4 — FAQ */
.faq-section {
  background:
    radial-gradient(85% 50% at 20% 0%, rgba(230,193,90,.10), transparent 60%),
    linear-gradient(180deg, #0A1428, #101E3C 55%, #0A1428);
}

/* 5 — NEWSLETTER */
.newsletter-section {
  background:
    radial-gradient(85% 50% at 80% 0%, rgba(230,193,90,.10), transparent 60%),
    linear-gradient(180deg, #0A1428, #101E3C 55%, #0A1428);
}

/* 6 — HONESTY BAND — also updated inline in the <style> block inside index.html */
.np-honest-section {
  background:
    radial-gradient(85% 50% at 20% 0%, rgba(230,193,90,.10), transparent 60%),
    linear-gradient(180deg, #0A1428, #101E3C 55%, #0A1428);
}


/* ─── WHY TRUST — stats bar ────────────────────────────────────────────── */

.testimonials-section .stats-bar {
  background-color: rgba(16,26,52,.88);
  background-image:
    linear-gradient(160deg, rgba(255,255,255,.12), rgba(255,255,255,.05) 45%, rgba(230,193,90,.07));
  border: 1px solid rgba(230,193,90,.22);
  box-shadow: 0 8px 32px rgba(6,12,24,.24);
}
.testimonials-section .stat-item           { border-right-color: rgba(230,193,90,.15); }
.testimonials-section .stat-item strong    { color: #E6C15A; }
.testimonials-section .stat-item span      { color: #C7D3E6; }

/* ─── WHY TRUST — section header ─────────────────────────────────────── */

.testimonials-section .section-eyebrow { color: rgba(230,193,90,.82); }
.testimonials-section .section-title   { color: #FFFFFF; }
.testimonials-section .section-sub     { color: #C7D3E6; }

/* ─── WHY TRUST — testimonial cards (glass) ──────────────────────────── */

.testimonials-section .testimonial-card {
  background-color: rgba(16,26,52,.88);
  background-image:
    linear-gradient(160deg, rgba(255,255,255,.12), rgba(255,255,255,.05) 45%, rgba(230,193,90,.07));
  border: 1px solid rgba(230,193,90,.22);
  box-shadow: 0 8px 32px rgba(6,12,24,.24);
}
.testimonials-section .testimonial-card:hover { box-shadow: 0 12px 40px rgba(6,12,24,.40); }
.testimonials-section .tc-quote { color: #C7D3E6; }
.testimonials-section .tc-author { border-top-color: rgba(255,255,255,.12); }
/* Founder byline "— Angie / Founder" has inline color:var(--color-muted) */
.testimonials-section .testimonial-card p[style*="color:var(--color-muted)"] {
  color: rgba(199,211,230,.65) !important;
}


/* ─── COMPARISON TABLE ───────────────────────────────────────────────── */

.comparison-section .comparison-title { color: #FFFFFF; }

.comparison-section .comparison-table-wrap {
  background-color: rgba(16,26,52,.88);
  background-image:
    linear-gradient(160deg, rgba(255,255,255,.12), rgba(255,255,255,.05) 45%, rgba(230,193,90,.07));
  border: 1px solid rgba(230,193,90,.22);
  border-radius: var(--radius-lg);
  box-shadow: 0 8px 32px rgba(6,12,24,.24);
  overflow: hidden;
}
.comparison-section .comparison-table th,
.comparison-section .comparison-table td {
  color: #C7D3E6;
  border-color: rgba(255,255,255,.10);
}
.comparison-section .comparison-table th {
  background: rgba(16,26,52,.50);
  color: #C7D3E6;
}
.comparison-section .comparison-table td:first-child { color: #FFFFFF; }
.comparison-section .comparison-table .col-bundle {
  background: rgba(230,193,90,.12);
  color: #E6C15A;
  border-color: rgba(230,193,90,.30);
}
.comparison-section .comparison-table th.col-bundle {
  background: rgba(230,193,90,.28);
  color: #FFFFFF;
  border-color: rgba(230,193,90,.50);
}
.comparison-section .comparison-table tr:hover td { background: rgba(230,193,90,.06); }


/* ─── FREE GUIDE ─────────────────────────────────────────────────────── */

.lead-magnet-section .lead-magnet-grid { border-color: rgba(230,193,90,.22); }

/* Right panel glass — left gold panel stays as-is */
.lead-magnet-section .lead-right {
  background-color: rgba(16,26,52,.88);
  background-image:
    linear-gradient(160deg, rgba(255,255,255,.12), rgba(255,255,255,.05) 45%, rgba(230,193,90,.07));
}
.lead-magnet-section .lead-title { color: #FFFFFF; }
.lead-magnet-section .lead-sub   { color: #C7D3E6; }
.lead-magnet-section .lead-legal { color: rgba(199,211,230,.55); }
.lead-magnet-section .form-label { color: #C7D3E6; }
.lead-magnet-section .form-input,
.lead-magnet-section .form-select {
  background: rgba(8,14,28,.60);
  border-color: rgba(255,255,255,.22);
  color: #FFFFFF;
}
.lead-magnet-section .form-input::placeholder { color: rgba(199,211,230,.50); }
.lead-magnet-section .form-input:focus,
.lead-magnet-section .form-select:focus {
  border-color: #E6C15A;
  box-shadow: 0 0 0 3px rgba(230,193,90,.22);
}
.lead-magnet-section .form-select option { background: #101E3C; color: #FFFFFF; }


/* ─── FAQ ────────────────────────────────────────────────────────────── */

.faq-section .section-eyebrow { color: rgba(230,193,90,.82); }
.faq-section .section-title   { color: #FFFFFF; }
.faq-section .section-sub     { color: #C7D3E6; }
.faq-section .section-sub a   { color: #E6C15A; }

.faq-section .faq-accordion {
  background-color: rgba(16,26,52,.88);
  background-image:
    linear-gradient(160deg, rgba(255,255,255,.12), rgba(255,255,255,.05) 45%, rgba(230,193,90,.07));
  border-color: rgba(230,193,90,.22);
}
.faq-section .faq-accordion-item         { border-bottom-color: rgba(255,255,255,.10); }
.faq-section .faq-question               { color: #FFFFFF; }
.faq-section .faq-question:hover         { background: rgba(230,193,90,.07); }
.faq-section .faq-accordion-item.open .faq-question {
  background: rgba(230,193,90,.10);
  color: #E6C15A;
  border-left-color: #E6C15A;
}
.faq-section .faq-arrow                            { color: rgba(199,211,230,.60); }
.faq-section .faq-accordion-item.open .faq-arrow  { color: #E6C15A; }
.faq-section .faq-answer-inner                     { color: #C7D3E6; }
.faq-section .faq-link                             { color: #E6C15A; }


/* ─── NEWSLETTER ─────────────────────────────────────────────────────── */

/* newsletter-content text (paper/rgba whites) reads fine on navy — no change needed */

.newsletter-section .newsletter-form {
  background-color: rgba(16,26,52,.88);
  background-image:
    linear-gradient(160deg, rgba(255,255,255,.12), rgba(255,255,255,.05) 45%, rgba(230,193,90,.07));
  border-color: rgba(230,193,90,.22);
}
.newsletter-section .form-input,
.newsletter-section .form-select {
  background: rgba(8,14,28,.60);
  border-color: rgba(255,255,255,.22);
  color: #FFFFFF;
}
.newsletter-section .form-input::placeholder { color: rgba(199,211,230,.50); }
.newsletter-section .form-input:focus,
.newsletter-section .form-select:focus {
  border-color: #E6C15A;
  box-shadow: 0 0 0 3px rgba(230,193,90,.22);
}
.newsletter-section .form-select option { background: #101E3C; color: #FFFFFF; }


/* ─── BLOG PREVIEW (inside .newsletter-section) ──────────────────────── */
/* Neighbors: newsletter form (navy @ 80% above), np-honest (navy @ 20% below).
   Use 20% radial to differ from the newsletter form directly above it.       */

/* 6 — BLOG PREVIEW */
.blog-preview-section {
  background:
    radial-gradient(85% 50% at 20% 0%, rgba(230,193,90,.10), transparent 60%),
    linear-gradient(180deg, #0A1428, #101E3C 55%, #0A1428);
}

/* Section header */
.blog-preview-section .section-eyebrow { color: rgba(230,193,90,.82); }
.blog-preview-section .section-title   { color: #FFFFFF; }

/* "View All Articles →" header link */
.blog-preview-section .blog-header .btn-ghost {
  color: #E6C15A;
  text-decoration-color: rgba(230,193,90,.50);
}
.blog-preview-section .blog-header .btn-ghost:hover {
  color: #FFFFFF;
  text-decoration-color: rgba(255,255,255,.50);
}

/* Blog cards — glass */
.blog-preview-section .blog-card {
  background-color: rgba(16,26,52,.88);
  background-image:
    linear-gradient(160deg, rgba(255,255,255,.12), rgba(255,255,255,.05) 45%, rgba(230,193,90,.07));
  border: 1px solid rgba(230,193,90,.22);
  box-shadow: 0 8px 32px rgba(6,12,24,.24);
}
.blog-preview-section .blog-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 12px 40px rgba(6,12,24,.42);
}
.blog-preview-section .blog-card h3   { color: #FFFFFF; }
.blog-preview-section .blog-card p    { color: #C7D3E6; }
.blog-preview-section .blog-meta      { color: rgba(199,211,230,.60); }
.blog-preview-section .blog-author    { color: rgba(199,211,230,.85); }

/* "Read Article →" inside each card */
.blog-preview-section .blog-card .btn-ghost {
  color: #E6C15A;
  text-decoration-color: rgba(230,193,90,.50);
}
.blog-preview-section .blog-card .btn-ghost:hover {
  color: #FFFFFF;
  text-decoration-color: rgba(255,255,255,.50);
}

/* Category chips — readable on glass dark background */
/* badge-gold: already gold text, nudge bg opacity for dark context */
.blog-preview-section .badge-gold {
  background: rgba(200,150,62,.22);
  border-color: rgba(200,150,62,.40);
}
/* badge-blue: var(--color-blue)=#1A3A6B is too dark for dark bg → sky blue */
.blog-preview-section .badge-blue {
  background: rgba(100,160,255,.15);
  color: #7BB8F0;
  border-color: rgba(100,160,255,.30);
}
/* badge-green: var(--color-success)=#2A6B42 is too dark for dark bg → sage green */
.blog-preview-section .badge-green {
  background: rgba(80,180,110,.15);
  color: #7FBF95;
  border-color: rgba(80,180,110,.30);
}


/* ─── HONESTY BAND — reinforcement ───────────────────────────────────── */
/* Gradient bg defined in inline <style> in index.html; no blur needed. */
