/* Content remains visible even when motion scripts are blocked or delayed. */
:root {
    --font-sans: "Segoe UI Variable Text", "Segoe UI", Arial, sans-serif;
    --font-display: Constantia, Georgia, "Times New Roman", serif;
}

[data-reveal] {
    opacity: 1 !important;
    transform: none !important;
}

body {
    overflow-x: hidden;
    font-family: var(--font-sans);
    line-height: 1.7;
    text-rendering: optimizeLegibility;
    font-kerning: normal;
    font-feature-settings: "kern" 1, "liga" 1;
}

.hero {
    background-image: url('../images/hero-source.jpg');
}

h1,
h2,
h3,
.lead-copy,
.hero-stat strong,
.metric strong {
    font-family: var(--font-display);
    text-wrap: balance;
}

.hero-copy h1 {
    line-height: .98;
    letter-spacing: -.038em;
}

.section-title h2,
.page-hero h1,
.product-detail-copy h1 {
    line-height: 1.07;
    letter-spacing: -.025em;
}

.brand strong {
    font-family: var(--font-sans);
    font-weight: 800;
    letter-spacing: .055em;
}

.primary-nav,
.button,
.eyebrow,
.product-category,
.post-meta {
    font-family: var(--font-sans);
}

.primary-nav {
    letter-spacing: .012em;
}

.prose {
    font-size: 17px;
    line-height: 1.82;
}

.brand-mark {
    display: block;
    width: 40px;
    height: 40px;
    flex: 0 0 40px;
    object-fit: contain;
}

.brand-footer .brand-mark {
    width: 42px;
    height: 42px;
    flex-basis: 42px;
}

.hero-copy,
.hero-stat {
    min-width: 0;
}

@media (max-width: 560px) {
    .hero-copy h1 {
        max-width: 100%;
        font-size: 41px;
        line-height: 1.02;
        overflow-wrap: break-word;
    }

    .hero-copy > p {
        max-width: 100%;
        font-size: 15px;
        overflow-wrap: break-word;
    }

    .hero-stat span {
        font-size: 9px;
        letter-spacing: .08em;
    }
}