/* Explain: Dynamic grid layouts and broadcast stages */
.container-rosso {
    width: min(100% - 2.5rem, 1280px);
    margin-inline: auto;
}

.hero-split {
    min-height: calc(100vh - 82px);
    display: grid;
    align-items: center;
    gap: clamp(2rem, 5vw, 5rem);
    padding-block: clamp(2.5rem, 6vw, 4.5rem);
}

.hero-car-stage {
    position: relative;
    overflow: hidden;
    border-radius: var(--radius-soft);
    background: radial-gradient(circle at center, rgba(40, 40, 40, 0.9), rgba(5, 5, 5, 0.95));
    border: 1px solid var(--border-color);
    box-shadow: var(--shadow-luxury);
    display: flex;
    align-items: center;
    justify-content: center;
}

/* Abstract diagonal lines for a dynamic studio feel */
.hero-car-stage::before {
    position: absolute;
    inset: -20%;
    width: 140%;
    height: 140%;
    content: "";
    background: repeating-linear-gradient(
        45deg,
        transparent,
        transparent 15px,
        rgba(255, 255, 255, 0.02) 15px,
        rgba(255, 255, 255, 0.02) 30px
    );
    pointer-events: none;
    z-index: 0;
}

.arch-image {
    border-radius: var(--radius-soft);
}

@media (min-width: 900px) {
    .hero-split {
        grid-template-columns: minmax(0, 0.95fr) minmax(0, 1.05fr);
    }
}
