/*
 * Header — minimalistische kopregel
 *
 * Wordmark links, tagline rechts, dunne hairline eronder. Geen navigatie,
 * geen CTA-knop, geen hamburger: het contactformulier staat direct in de
 * hero (desktop) of achter een knop (mobiel). De landingspagina's zijn
 * bereikbaar via de pills en de footer.
 */

.site-header {
    background: var(--color-white);
}

.site-header .row {
    padding-block: 22px;
}

.site-header-inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--gutter);
    border-bottom: 1px solid var(--color-border);
    padding-bottom: 22px;
}

/* Wordmark (logo) */
.site-header .logo {
    text-decoration: none;
    color: var(--color-primary);
}

.site-header .wordmark {
    font-family: var(--font-heading);
    font-weight: 700;
    font-size: 1.25rem;
    letter-spacing: -0.01em;
    color: var(--color-primary);
}

.site-header .wordmark-tld {
    color: var(--color-primary);
}

/* Tagline rechts — subtiel grijs, verdwijnt op smalle schermen */
.site-header-tagline {
    color: var(--color-primary-transparent);
    font-size: 1rem;
}

@media (max-width: 767px) {
    .site-header-tagline {
        display: none;
    }
}