/* Hero component layout. */

/* Hero layout */
.hero-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.08fr) minmax(360px, 0.92fr);
    align-items: center;
    gap: var(--space-xl);
    margin-bottom: var(--space-xl);
}

.hero-grid:last-child {
    margin-bottom: 0;
}

.media-card {
    position: relative;
    overflow: hidden;
    aspect-ratio: 16 / 9;
    border-radius: var(--radius-l);
}

.media-card::after {
    content: "";
    position: absolute;
    z-index: 2;
    inset: 0;
    border: 1px solid var(--purple);
    border-radius: inherit;
    pointer-events: none;
}

.benefit-grid {
    gap: var(--space-s);
}

/* Responsive layout */
@media (max-width: 1099px) {
    .hero-grid {
        grid-template-columns: 1fr;
    }
}