/* ================================================
   default-red.css
   Experimental dark theme: black + red + ice blue
   Covers: header, hero, body, footer colours
   Load order: reset.css → global.css → default-red.css
   ================================================ */

/* ── TOKENS ──────────────────────────────────── */
:root {
    /* Global palette */
    --bg-1:                #0d0d0d;
    --bg-2:                #111111;
    --bg-3:                #1a1a1a;
    --color-link:          #BE0F17;
    --color-hover:         #9ecfe8;
    --color-highlight:     #e8453d;

    /* Header */
    --h-bg:                rgba(13,13,13,0.97);
    --h-border:            rgba(190,15,23,0.35);
    --h-brand:             #BE0F17;
    --h-brand-hover:       #ffffff;
    --h-accent:            #BE0F17;
    --h-nav-link:          rgba(245,242,237,0.55);
    --h-nav-hover:         #9ecfe8;
    --h-nav-hover-bg:      rgba(158,207,232,0.12);
    --h-dropdown-bg:       #111111;
    --h-dropdown-divider:  rgba(190,15,23,0.12);
    --h-dropdown-link:     rgba(245,242,237,0.55);
    --h-dropdown-hover:    #ffffff;
    --h-dropdown-hover-bg: rgba(190,15,23,0.07);
    --h-cta-bg:            #BE0F17;
    --h-cta-text:          #ffffff;
    --h-cta-hover-bg:      #9ecfe8;
    --h-cta-hover-text:    #0d0d0d;
    --h-burger-border:     rgba(190,15,23,0.30);
    --h-burger-bar:        #f5f2ed;

    /* Body */
    --b-bg:                #0d0d0d;
    --b-bg-alt:            #111111;
    --b-bg-alt2:           #0a0a0a;
    --b-text:              #f5f2ed;
    --b-text-dim:          rgba(245,242,237,0.55);
    --b-accent:            #BE0F17;
    --b-accent-hover:      #9ecfe8;
    --b-accent-dim:        rgba(190,15,23,0.25);
    --b-accent-dimmer:     rgba(190,15,23,0.08);
    --b-ink:               #ffffff;

    /* Footer */
    --ft-top-bg:           #111111;
    --ft-bottom-bg:        #0d0d0d;
    --ft-accent:           #BE0F17;
    --ft-border:           rgba(190,15,23,0.35);
    --ft-divider:          rgba(190,15,23,0.15);
    --ft-bottom-divider:   rgba(190,15,23,0.12);
    --ft-heading:          #ffffff;
    --ft-text:             rgba(245,242,237,0.65);
    --ft-text-strong:      #f5f2ed;
    --ft-link:             #BE0F17;
    --ft-link-hover:       #9ecfe8;
    --ft-copy:             rgba(245,242,237,0.45);
    --ft-copy-link:        #BE0F17;
    --ft-copy-hover:       #9ecfe8;
    --ft-nav-link:         rgba(245,242,237,0.40);
    --ft-nav-hover:        #9ecfe8;
    --ft-separator:        rgba(255,255,255,1);
    --ft-soon-bg:          rgba(190,15,23,0.12);
    --ft-soon-text:        rgba(190,15,23,0.80);
}

/* ── HEADER ──────────────────────────────────── */
.nav-container { background: var(--h-bg); border-bottom-color: var(--h-border); }
.nav-logo      { filter: none; }
.nav-brand       { color: var(--h-brand); }
.nav-brand:hover { color: var(--h-brand-hover); }
.nav-links a { color: var(--h-nav-link); }
.nav-links a:hover { color: var(--h-nav-hover); background: var(--h-nav-hover-bg); }
.nav-cta       { background: var(--h-cta-bg); color: var(--h-cta-text); }
.nav-cta:hover { background: var(--h-cta-hover-bg); color: var(--h-cta-hover-text); }
.menu-icon { border-color: var(--h-burger-border); }
.menu-icon span,
.menu-icon span::before,
.menu-icon span::after       { background: var(--h-burger-bar); }
.menu-icon:hover             { border-color: var(--h-accent); }
.menu-icon:hover span,
.menu-icon:hover span::before,
.menu-icon:hover span::after { background: var(--h-accent); }

@media (max-width: 900px) {
    .nav-links {
        background: var(--h-dropdown-bg);
        border-top-color: var(--h-accent);
        border-bottom-color: var(--h-border);
    }
    .nav-links li      { border-bottom-color: var(--h-dropdown-divider); }
    .nav-links a       { color: var(--h-dropdown-link); }
    .nav-links a:hover { color: var(--h-dropdown-hover); background: var(--h-dropdown-hover-bg); }
}

/* ── HERO ────────────────────────────────────── */
.bs-hero                { background-color: var(--b-bg); }
.bs-hero::before        { background: rgba(0,0,0,0.78); }
.bs-hero__ghost         { -webkit-text-stroke: 1px rgba(255,255,255,0.07); }
.bs-hero__stripe        { background: var(--b-accent); }
.bs-hero__kicker        { color: #ffffff; background: var(--b-accent); }
.bs-hero__title         { color: #ffffff; }
.bs-hero__title em      { color: #9ecfe8; }
.bs-hero__title mark    { background: var(--b-accent); color: var(--b-ink); }
.bs-hero__tagline       { color: rgba(245,242,237,0.75); }
.bs-hero__fn-line       { background: var(--b-accent); }
.bs-hero__footnote span { color: #9ecfe8; }
.btn-primary       { background: var(--b-accent); color: var(--b-ink); font-weight: 700; }
.btn-primary:hover { background: #9ecfe8; color: #0d0d0d; }
.btn-ghost-text       { color: var(--b-text); border-bottom-color: rgba(245,242,237,0.3); }
.btn-ghost-text:hover { color: #9ecfe8; border-bottom-color: #9ecfe8; }

/* ── BODY ────────────────────────────────────── */
body           { background: var(--b-bg); color: var(--b-text); }
a              { color: var(--b-accent); }
a:hover        { color: #9ecfe8; }

.section-label    { color: var(--b-accent); }
.section-title    { color: var(--b-text); }
.section-title em { color: #9ecfe8; }
.section--alt     { background: var(--b-bg-alt); }
.section--alt2    { background: var(--b-bg-alt2); }

.btn-outline       { color: var(--b-text); border-color: rgba(245,242,237,0.25); }
.btn-outline:hover { border-color: #9ecfe8; color: #9ecfe8; }

.quote-band            { background: var(--b-accent); }
.quote-band blockquote { color: var(--b-ink); }
.quote-band cite       { color: rgba(255,255,255,0.5); }

.explainer-grid    { background: var(--b-accent-dim); border-color: var(--b-accent-dim); }
.explainer-item    { background: var(--b-bg-alt); }
.explainer-num     { color: var(--b-accent); }
.explainer-item h3 { color: var(--b-text); }
.explainer-item p  { color: var(--b-text-dim); }
.explainer-item em { color: #9ecfe8; }

.stat-strip { background: var(--b-accent); }
.stat-num   { color: var(--b-ink); }
.stat-label { color: rgba(255,255,255,0.5); }

.plan-card               { border-color: var(--b-accent-dim); }
.plan-card.featured      { background: #141414; border-color: var(--b-accent); }
.plan-card:hover:not(.coming-soon) { border-color: var(--b-accent); }
.plan-badge              { background: var(--b-accent); color: var(--b-ink); }
.plan-badge.soon         { background: #3a3a3a; color: rgba(245,242,237,0.4); }
.plan-card-label         { color: #9ecfe8; }
.plan-card h3            { color: var(--b-text); }
.plan-desc               { color: rgba(245,242,237,0.5); }
.plan-price-label        { color: rgba(245,242,237,0.3); }
.plan-price-val          { color: var(--b-accent); }
.plan-price-sep          { background: var(--b-accent-dim); }
.plan-features           { border-top-color: var(--b-accent-dim); }
.plan-features li        { color: var(--b-text-dim); border-bottom-color: var(--b-accent-dimmer); }
.plan-features li::before { color: #9ecfe8; }

table             { border-color: var(--b-accent-dim); }
thead tr          { background: var(--b-accent-dimmer); }
th                { color: #9ecfe8; border-bottom-color: var(--b-accent-dim); }
td                { color: var(--b-text-dim); border-bottom-color: var(--b-accent-dimmer); }
tbody tr:hover td { background: rgba(190,15,23,0.04); color: var(--b-text); }

details          { border-bottom-color: var(--b-accent-dim); }
summary          { color: var(--b-text); }
summary:hover    { color: #9ecfe8; }
.faq-icon        { color: var(--b-accent); }
details p        { color: var(--b-text-dim); }

.testimonial         { border-color: var(--b-accent-dim); }
.testimonial::before { color: var(--b-accent); }
.testimonial p       { color: rgba(245,242,237,0.8); }
.testimonial cite    { color: #9ecfe8; }

.divider      { background: #1a0a0b; border-color: var(--b-accent-dim); }
.divider-text { color: rgba(245,242,237,0.75); }

/* ── FOOTER ──────────────────────────────────── */
.bs-ft { background: var(--ft-top-bg); border-top-color: var(--ft-border); }
.bs-ft__col { border-right-color: var(--ft-divider); border-bottom-color: var(--ft-divider); }
.bs-ft__name { color: var(--ft-accent); }
.bs-ft__logo-group:hover .bs-ft__name { color: #ffffff; }
.bs-ft__bio        { color: var(--ft-text); }
.bs-ft__bio strong { color: var(--ft-text-strong); }
.bs-ft__bio a      { color: var(--ft-accent); }
.bs-ft__bio a:hover { color: var(--ft-link-hover); }
.bs-ft__heading    { color: var(--ft-heading); }
.bs-ft__link       { color: var(--ft-link); }
.bs-ft__link:hover { color: var(--ft-link-hover); }
.bs-ft__soon { background: var(--ft-soon-bg); color: var(--ft-soon-text); }
.bs-ft__bottom { background: var(--ft-bottom-bg); border-top-color: var(--ft-bottom-divider); }
.bs-ft__copy         { color: var(--ft-copy); }
.bs-ft__copy a       { color: var(--ft-copy-link); }
.bs-ft__copy a:hover { color: var(--ft-copy-hover); }
.bs-ft__nav-link       { color: var(--ft-nav-link); }
.bs-ft__nav-link:hover { color: var(--ft-nav-hover); }
.bs-ft__nav-item + .bs-ft__nav-item::before { background: var(--ft-separator); }