/*
 * Visual refinement v5
 * Loads after the v4 reference layer so existing WordPress markup stays intact.
 */
:root {
    --shell: min(1160px, calc(100% - 80px));
}

/* The first featured question stays dark; the mint second card needs ink copy. */
.popular-question-card.is-featured:not(:first-child) {
    background: #dcebe2;
}

.popular-question-card.is-featured:not(:first-child) h3,
.popular-question-card.is-featured:not(:first-child) .question-card-copy,
.popular-question-card.is-featured:not(:first-child) .question-category {
    color: var(--v4-ink);
}

/* Keep homepage sections substantial without pushing useful content below fold. */
.question-stage,
.daily-compass-section,
.signal-hub,
.journal-section {
    padding-block: clamp(4rem, 6.4vw, 6rem);
}

.evidence-section {
    padding-block: clamp(4.5rem, 7vw, 6.5rem);
}

/* Category hubs use a deliberate copy-and-photo starting point. */
.category-hub,
.search-results {
    padding-block: clamp(2.75rem, 4.5vw, 4.5rem) clamp(4rem, 6vw, 6rem);
}

.category-hub__intro {
    display: grid;
    grid-template-columns: minmax(0, 1.03fr) minmax(300px, .97fr);
    align-items: stretch;
    max-width: none;
    min-height: 360px;
    margin-bottom: clamp(2.5rem, 4.5vw, 4.5rem);
    padding: 0;
    overflow: hidden;
}

.category-hub__intro::after {
    display: none;
}

.category-hub__copy {
    position: relative;
    z-index: 1;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: clamp(2rem, 4vw, 3.5rem);
}

.category-hub__intro h1 {
    max-width: 11ch;
}

.category-hub__summary {
    max-width: 38rem;
    margin: 1.25rem 0 0;
    color: var(--v4-muted);
    font-size: clamp(.98rem, 1.35vw, 1.1rem);
    line-height: 1.8;
}

.category-hub__keywords {
    width: auto;
    margin-top: 1.65rem;
}

.category-hub__banner {
    min-height: 100%;
    margin: 0;
    background: #dcebe2;
}

.category-hub__banner img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}

.category-hub__featured,
.category-hub__latest,
.search-results__route,
.search-results__matches {
    margin-top: clamp(2.5rem, 4.5vw, 4.5rem);
}

.category-hub__featured {
    padding: clamp(1.35rem, 2.7vw, 2rem);
}

@media (max-width: 1020px) {
    :root {
        --shell: min(1160px, calc(100% - clamp(48px, 7.8125vw, 80px)));
    }

    .category-hub__intro {
        grid-template-columns: minmax(0, 1fr) minmax(260px, .82fr);
        min-height: 330px;
    }

    .category-hub__copy {
        padding: clamp(1.75rem, 4.2vw, 2.75rem);
    }
}

@media (max-width: 620px) {
    :root {
        --shell: min(1160px, calc(100% - 32px));
    }

    .question-stage,
    .daily-compass-section,
    .signal-hub,
    .journal-section {
        padding-block: 3.75rem;
    }

    .evidence-section {
        padding-block: 4rem;
    }

    .category-hub,
    .search-results {
        padding-block: 2.5rem 4rem;
    }

    .category-hub__intro {
        grid-template-columns: 1fr;
        min-height: 0;
        border-radius: 20px;
    }

    .category-hub__copy {
        padding: 1.5rem;
    }

    .category-hub__intro h1 {
        max-width: 12ch;
    }

    .category-hub__banner {
        min-height: auto;
        aspect-ratio: 16 / 9;
    }

    .category-hub__banner img {
        height: 100%;
    }

    .category-hub__keywords {
        width: calc(100% + 1.5rem);
        margin-right: -1.5rem;
        padding-right: 1.5rem;
    }
}
