/* Batch 2B inactive presentation layer. Every rule is public and namespaced. */
.hybrid-v3-content,
.hybrid-v3-form {
    --hybrid-v3-ink: #000;
    --hybrid-v3-orange: #ff630c;
    --hybrid-v3-sand: #f6f3ee;
    --hybrid-v3-blush: #eee5dc;
    --hybrid-v3-sage: #dfe8dd;
    color: var(--hybrid-v3-ink);
}

.hybrid-v3-content > section,
.hybrid-v3-content > article {
    border-color: rgb(0 0 0 / .1);
}

.hybrid-v3-content :where(h1, h2, h3, h4) {
    font-family: 'Cormorant Garamond', 'Noto Sans Arabic', Georgia, serif;
    letter-spacing: -.03em;
}

.hybrid-v3-content :where(p, li, dt, dd),
.hybrid-v3-form :where(label, input, select, textarea, button) {
    overflow-wrap: anywhere;
}

.hybrid-v3-content :where(.border-line, .border-ink\/10) {
    border-color: rgb(0 0 0 / .1);
}

.hybrid-v3-content :where(.bg-paper, .bg-warm-white) {
    background: var(--hybrid-v3-sand);
}

.hybrid-v3-content :where(.bg-white) {
    box-shadow: 0 10px 40px rgb(0 0 0 / .04);
}

.hybrid-v3-content :where(.home-eyebrow, .eyebrow) {
    color: var(--hybrid-v3-orange);
    font-size: .6875rem;
    font-weight: 700;
    letter-spacing: .16em;
    text-transform: uppercase;
}

.hybrid-v3-content :where(.editorial-link, a) {
    text-underline-offset: .25em;
}

.hybrid-v3-content :where(.editorial-link):focus-visible,
.hybrid-v3-form :where(:focus-visible) {
    outline: 3px solid var(--hybrid-v3-orange);
    outline-offset: 4px;
}

.hybrid-v3-content :where(img, video) {
    max-width: 100%;
}

.hybrid-v3-content :where(form, .card, article) {
    border-radius: 1.5rem;
}

.hybrid-v3-form :where(input, select, textarea) {
    border-radius: 1rem;
    border-color: rgb(0 0 0 / .15);
    background: var(--hybrid-v3-sand);
}

.hybrid-v3-form :where(button, [type='submit']) {
    border-radius: 999px;
    background: var(--hybrid-v3-ink);
    color: #fff;
    font-weight: 700;
}

.hybrid-v3-form :where(button, [type='submit']):hover {
    background: var(--hybrid-v3-orange);
}

@media (max-width: 48rem) {
    .hybrid-v3-content :where(.grid) {
        min-width: 0;
    }

    .hybrid-v3-content :where(.text-\[clamp\(3rem\,5vw\,5\.6rem\)\]) {
        font-size: clamp(2.5rem, 12vw, 4rem);
    }
}

@media (prefers-reduced-motion: reduce) {
    .hybrid-v3-content *,
    .hybrid-v3-form * {
        animation: none !important;
        transition: none !important;
    }
}