/* ===========================================================================
 * v5-pages.css — visuelle Kohäsion: bringt die Unterseiten (About, Pricing,
 * Legal …) auf den Look der neuen Startseite. Wird NACH dem jeweiligen
 * Seiten-CSS geladen, gewinnt also. Nutzt die globalen Theme-Tokens.
 * ======================================================================== */

/* --- Einheitlicher Seiten-Hero (wie Home: kein Karten-BG, großer fetter Titel) --- */
.about-header,
.legal-header,
.pricing-hero {
    text-align: center;
    padding: 2.5rem 1.5rem 3rem;
    background: none;
    border: none;
    box-shadow: none;
}
.about-header h1,
.legal-header h1,
.pricing-hero h1 {
    font-size: clamp(2.1rem, 5vw, 3.3rem);
    font-weight: 900;
    letter-spacing: -0.03em;
    line-height: 1.06;
    color: var(--fg);
    margin: 0.4rem 0 0.7rem;
}
.about-lead,
.pricing-hero-subtitle {
    color: var(--text-muted);
    font-size: 1.12rem;
    line-height: 1.6;
    max-width: 640px;
    margin: 0.6rem auto 0;
}
.legal-version { color: var(--text-muted); }

/* Gefüllte Pille → v5-Akzent-Eyebrow */
.about-header .about-badge,
.legal-header .product-badge {
    display: inline-block;
    background: none;
    box-shadow: none;
    color: var(--accent);
    padding: 0;
    border-radius: 0;
    font-size: 0.8rem;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    margin-bottom: 0.4rem;
}

/* --- Kräftige, dramatische Überschriften (vorher dünn, font-weight 300) --- */
.section-title,
.section-content h1,
.about-section h2,
.legal-section h2,
.pricing-section h2,
.product-header h2,
.coming-soon-section h2 {
    font-weight: 800;
    letter-spacing: -0.02em;
    color: var(--fg);
}

/* --- Karten: gleiche Rundung + Akzent-Links wie Home --- */
.about-product,
.about-highlight-card,
.about-industry,
.pricing-card,
.coming-soon-card,
.about-expertise-item {
    border-radius: 16px;
}
.about-link,
.docs-link,
.nuget-link,
.product-link {
    color: var(--accent);
}

/* CTA-Buttons bündig mit Home (Warm-Gradient ist über Tokens schon gesetzt) */
.about-cta-btn,
.pricing-btn-primary {
    border-radius: 12px;
}