/* ─── Steel & Signal Rebrand — override layer ──────────────────────────────
   Loaded last in <head> via server.js injection; wins over per-page <style>
   blocks at equal specificity; no !important needed for class overrides.
   ID selector #hero-home beats .hero by specificity for the image hero.
   ─────────────────────────────────────────────────────────────────────── */

@import url('https://fonts.googleapis.com/css2?family=Barlow+Condensed:wght@600;700;800&display=swap');

/* ── 1. COLOR SYSTEM ──────────────────────────────────────────────────── */
:root {
    --charcoal:     #0A0A0B;
    --steel:        #141416;
    --steel-2:      #232326;
    --chrome:       #F4F4F5;
    --chrome-dim:   rgba(244, 244, 245, 0.55);
    --chrome-muted: #71717A;
    --spark:        #DC2626;
    --spark-dim:    rgba(220, 38, 38, 0.12);
    --spark-border: rgba(220, 38, 38, 0.3);
    --white:        #ffffff;
}

/* ── 2. HEADLINE FONT — Space Grotesk → Barlow Condensed ─────────────── */
h1, h2, h3, h4, h5, h6,
.nav-brand,
.footer-brand,
.eyebrow,
.section-label,
.section-eyebrow,
.stat-number,
.proof-stat .num,
.plan-price .amount,
.featured-badge,
.plan-name,
.compare-label,
.promo-headline,
.founder-name,
.hero-eyebrow,
.blog-hero-eyebrow,
.plan-eyebrow,
.step h3,
.archetype-card h3,
.demo-content-text h3,
.newsletter-inner h3 {
    font-family: 'Barlow Condensed', sans-serif;
}

/* CTAs inherit headline font for visual punch */
.btn-primary,
.nav-cta,
.nav-cta-mobile,
.plan-cta,
.promo-cta,
.demo-cta-link,
.newsletter-form button,
.mobile-cta {
    font-family: 'Barlow Condensed', sans-serif;
    letter-spacing: 0.05em;
}

/* ── 3. SHARP CORNERS — remove border-radius from all buttons/CTAs ───── */
.btn-primary,
.btn-demo,
.nav-cta,
.nav-cta-mobile,
.plan-cta,
.plan-cta-outline,
.plan-cta-primary,
.promo-cta,
.demo-cta-link,
.newsletter-form button,
.mobile-cta {
    border-radius: 0;
}

/* ── 4. HOMEPAGE HERO — full-width photo with dark overlay ───────────── */
/* Targets the <section id="hero-home"> added to index.html.
   ID specificity (1,0,0) beats .hero class (0,1,0), no !important needed. */
#hero-home {
    background:
        linear-gradient(
            to bottom,
            rgba(10, 10, 11, 0.65) 0%,
            rgba(10, 10, 11, 0.50) 40%,
            rgba(10, 10, 11, 0.82) 100%
        ),
        url('https://pub-629428d185ca4960a0a73c850d32294b.r2.dev/generated-images/company_110459/9e6f8af3-5206-4ffd-83b1-ef2176286c88.jpg')
        center center / cover no-repeat;
}

/* Suppress the repeating grid-line pseudo-element defined on .hero */
#hero-home::before {
    display: none;
}
