/* Noise awareness */

.health-layout {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--space-8);
}

.health-layout .home-section__header {
    width: 100%;
        max-width: none;
        margin: 0;
}

.health-layout .home-section__header p {
    max-width: none;
}

.health-topics {
    border-block-start: 1px solid var(--color-border);
}

.health-topics article {
    padding-block: var(--space-4);
        display: grid;
        grid-template-columns: 13rem 1fr;
        gap: var(--space-6);
        border-block-end: 1px solid var(--color-border);
}

.health-topics span {
    color: var(--color-cyan);
        font-weight: var(--font-weight-semibold);
}

.health-topics p {
    color: var(--color-text-secondary);
        font-size: var(--text-sm);
}

.health-caution,
.health-layout > .source-note {
    margin-block-start: 0;
}

.health-caution {
        width: 100%;
        max-width: none;
        padding: var(--space-6);
        border-radius: var(--radius-md);
        background: color-mix(in srgb, var(--color-warning) 13%, var(--color-surface));
        color: var(--color-text-secondary);
        border: 1px solid color-mix(in srgb, var(--color-warning) 38%, var(--color-border));
}

.health-layout > .source-note {
        max-width: none;
        align-self: start;
}

@media (max-width: 56rem) {
    .health-layout {
        gap: var(--space-6);
    }
    
    .health-caution,
    .health-layout > .source-note {
        margin-block-start: 0;
        grid-column: auto;
        grid-row: auto;
    }
}

@media (max-width: 42rem) {
    .health-topics article {
        grid-template-columns: 1fr;
                gap: var(--space-2);
    }
}
