/* ═══════════════════════════════════════════════════════════════
   BDUSA-DARK.CSS — Dark Mode Stylesheet
   Version 1.0 | bridgingdividesusa.com
   Only activates when OS/browser is in dark mode.
   Pairs with bdusa.css (always loaded).

   Design intent:
   — Light surfaces  → deep slate/navy
   — Gold surfaces   → rich dark amber
   — Navy sections   → unchanged (already dark)
   — All text passes WCAG AA minimum contrast
═══════════════════════════════════════════════════════════════ */

@media (prefers-color-scheme: dark) {

  :root {
    --bg-base:        #181C28;
    --bg-section:     #1D2133;
    --bg-card:        #222638;
    --bg-gold:        #1A1505;
    --text-heading:   #F0EDE8;
    --text-body:      #CCC9C2;
    --text-secondary: #A8A59E;
    --text-tertiary:  #807D76;
    --text-ghost:     #5E5B55;
    --gold:           #D4A535;
    --gold-light:     #E8B84B;
    --on-gold-h:      #F0DC98;
    --on-gold-body:   #D4BC78;
    --on-gold-label:  #B8A060;
    --border:         #2A2F42;
    --border-strong:  #353A50;
    --shadow:         0 4px 28px rgba(0,0,0,0.4);
    --shadow-hover:   0 10px 36px rgba(0,0,0,0.55);
  }

  html, body { background-color: #181C28; color: #CCC9C2; }

  /* NAV — already navy, unchanged */
  #nav { background: rgba(11,29,58,0.99); }
  .mobile-menu { background: #0B1D3A; }

  /* HEROES — already navy, unchanged */
  .page-hero, .site-hero { background-color: #0B1D3A; }

  /* SECTION LABELS */
  .section-label span     { color: var(--gold); }
  .section-label-line     { background: var(--gold); }

  /* SECTION BACKGROUNDS */
  .section-cream  { background: #181C28; }
  .section-parch  { background: #1D2133; }
  .section-gold   { background: #1A1505; }
  .section-navy   { background: var(--navy); }
  .section-ink    { background: #0D1117; }
  .border-top     { border-top-color: var(--border); }
  .border-bottom  { border-bottom-color: var(--border); }

  /* TYPOGRAPHY */
  h1, h2, h3, h4, h5 { color: var(--text-heading); }
  .section-h      { color: var(--text-heading); }
  .section-h em   { color: var(--gold); }
  .section-deck   { color: var(--text-body); }

  /* BUTTONS */
  .btn-gold        { background: var(--gold-bright); color: #0B1D3A; }
  .btn-gold:hover  { background: #F5C85A; }
  .btn-navy        { background: #1E3F6F; color: #FFFFFF; }
  .btn-navy:hover  { background: #162D55; }
  .btn-outline     { color: var(--gold); border-color: var(--gold); background: transparent; }
  .btn-outline:hover { background: var(--gold); color: #0B1D3A; }

  /* CARDS */
  .card           { background: #222638; border-color: #2A2F42; }
  .card:hover     { box-shadow: 0 10px 36px rgba(0,0,0,0.55); }
  .card h3        { color: #F0EDE8; }
  .card p         { color: #A8A59E; }
  .card-footer    { background: #1D2133; border-top-color: #2A2F42; }
  .card-footer span { color: #5E5B55; }
  .card-tag       { background: #211C08; color: #D4A535; border-color: #3A3010; }
  .card-stripe-gold { background: var(--gold); }
  .card-stripe-navy { background: #1E3F6F; }
  .card-stripe-red  { background: #8B1515; }

  /* DARK CALLOUT CARD — already navy, unchanged */
  .card-dark { background: #0B1D3A; }

  /* GOLD CALLOUT */
  .callout-gold   { background: #1A1505; border-color: #2E2508; }
  .callout-gold::before { color: rgba(212,165,53,0.05); }
  .callout-gold h2 { color: #F0DC98; }
  .callout-gold .intro { color: #D4BC78; }
  .callout-gold .intro strong { color: #F0DC98; }
  .callout-gold .section-label span { color: #D4A535; }
  .callout-gold .section-label-line { background: #D4A535; }

  /* COVENANT */
  .covenant-point h4 { color: #EDD080; }
  .covenant-point p  { color: #B8A060; }
  .covenant-num      { color: #D4A535; opacity: 0.55; }

  /* PILLARS */
  .pillar              { border-top-color: var(--gold); }
  .pillar-num          { color: rgba(212,165,53,0.18); }
  .pillar h3           { color: var(--text-heading); }
  .pillar h3 .pillar-label { color: var(--gold); }
  .pillar p            { color: var(--text-body); }

  /* CONTRAST STRIP */
  .contrast-col.theirs h3 { color: #C84040; }
  .contrast-col.ours h3   { color: #D4A535; }
  .contrast-col.theirs li { color: var(--text-secondary); }
  .contrast-col.ours li   { color: var(--text-heading); }
  .contrast-divider        { background: var(--border); }
  .contrast-vs .big-vs     { color: var(--text-heading); }

  /* MANIFESTO */
  .manifesto-quote    { color: var(--text-heading); }
  .manifesto-ornament { color: var(--gold); }
  .manifesto-sub      { color: var(--text-secondary); }

  /* JOIN PATHS */
  .join-path { border-color: rgba(232,184,75,0.15); }
  .join-path:hover { border-color: var(--gold-bright); background: rgba(232,184,75,0.06); }

  /* CREDENTIAL BADGES */
  .credential { border-color: rgba(232,184,75,0.3); color: var(--on-dark-body); }

  /* CROSS SYMBOL */
  .cross-v { background: linear-gradient(to bottom, var(--gold), rgba(212,165,53,0.2)); }
  .cross-h { background: linear-gradient(to right, rgba(212,165,53,0.2), var(--gold), rgba(212,165,53,0.2)); }

  /* EMAIL FORM */
  .email-form input,
  .email-form select { background: rgba(255,255,255,0.05); border-color: rgba(255,255,255,0.15); color: #FFFFFF; }
  .email-form input::placeholder { color: rgba(255,255,255,0.3); }
  .email-form input:focus,
  .email-form select:focus { border-color: var(--gold-bright); }

  /* FOOTER — deepen */
  .site-footer      { background: #0D1117; }
  .footer-brand p   { color: rgba(255,255,255,0.58); }
  .footer-scripture { color: rgba(255,255,255,0.48); }
  .footer-col h4    { color: rgba(255,255,255,0.72); }
  .footer-col ul li a { color: rgba(255,255,255,0.52); }
  .footer-bottom p  { color: rgba(255,255,255,0.32); }

  /* FAITH SECTION — the broken section — left text must be light on dark */
  .faith-left h2  { color: var(--text-heading); }
  .faith-left p   { color: var(--text-body); }
  .faith-left .section-label span { color: var(--gold); }
  .faith-left .section-label-line { background: var(--gold); }
  .faith-right { background-color: #0B1D3A; }

  /* ── Homepage-specific components ── */

  /* Contrast split panels */
  .contrast-panel.theirs { background: #1C1F2C; }
  .contrast-panel.theirs h2 { color: var(--text-heading); }
  .contrast-panel.theirs .c-text strong { color: var(--text-heading); }
  .contrast-panel.theirs .c-text span   { color: var(--text-secondary); }
  .contrast-row { border-bottom-color: rgba(255,255,255,0.07); }
  .truth-strip  { background: #0F1421; }

  /* Mission pillars (navy bg — already dark, light text explicit) */
  .mission-pillar {
    background: rgba(255,255,255,0.03);
    border-color: rgba(232,184,75,0.12);
  }
  .mission-pillar:hover {
    background: rgba(255,255,255,0.07);
    border-color: rgba(232,184,75,0.35);
  }

  /* Quiz shell */
  .quiz-shell {
    background: rgba(255,255,255,0.03);
    border-color: rgba(232,184,75,0.15);
  }
  .quiz-opt {
    background: rgba(255,255,255,0.03);
    border-color: rgba(255,255,255,0.1);
    color: var(--text-body);
  }
  .quiz-opt:hover, .quiz-opt.selected {
    border-color: var(--gold-bright);
    background: rgba(232,184,75,0.08);
    color: var(--text-heading);
  }

  /* Pyramid levels (homepage navy bg — already correct, patch text) */
  .py-level { }
  .py-body strong { color: var(--on-dark-h); }
  .py-body span   { color: var(--on-dark-sub); }

  /* Manifesto wrap (navy — already dark) */
  .manifesto-wrap { background: var(--navy); }
  .manifesto-quote { color: var(--on-dark-h); }
  .manifesto-quote em { color: var(--gold-bright); }
  .manifesto-deck  { color: var(--on-dark-sub); }

  /* About page stat cards (navy bg — already dark) */
  .stat-card {
    background: rgba(255,255,255,0.03);
    border-color: rgba(232,184,75,0.12);
  }
  .stat-card:hover {
    background: rgba(255,255,255,0.07);
    border-color: rgba(232,184,75,0.3);
  }
  .stat-label { color: var(--on-dark-sub); }

  /* About faith section — light mode has light bg, dark needs explicit text */
  .faith-text h2  { color: var(--text-heading); }
  .faith-text h2 em { color: var(--gold); }
  .faith-text p   { color: var(--text-body); }

  /* About work cards */
  .work-cards .card { background: #222638; border-color: #2A2F42; }

  /* Workshops metrics strip */
  .metric-block { background: #222638; }
  .metric-label { color: var(--text-secondary); }

  /* Framework dimension cards */
  .dimension-card { background: #222638; border-color: #2A2F42; }
  .dimension-card h4 { color: var(--text-heading); }
  .dimension-card p  { color: var(--text-secondary); }
  .dim-source { color: var(--gold); }

  /* Contact page */
  .info-card  { background: #222638; border-color: #2A2F42; }
  .info-icon  { background: #1D2133; }
  .info-body h4 { color: var(--text-heading); }
  .info-body p  { color: var(--text-secondary); }
  .path-opt   { background: #222638; border-color: #2A2F42; }
  .path-opt:hover, .path-opt.active {
    border-color: var(--gold);
    background: rgba(212,165,53,0.07);
  }
  .path-opt strong { color: var(--text-heading); }
  .path-opt span   { color: var(--text-ghost); }
  .faq-item        { border-color: #2A2F42; }
  .faq-q           { color: var(--text-heading); }
  .faq-a           { color: var(--text-secondary); }

}
