/* Explain: Luxury layout helpers and responsive navigation behavior */
.page-wrap {
    width: min(1180px, calc(100% - 2rem));
    margin-inline: auto;
}

.section-pad {
    padding-block: clamp(4.5rem, 8vw, 7.5rem);
}

.hero-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 2rem;
}

@media (min-width: 1024px) {
    .hero-grid {
        grid-template-columns: minmax(0, 1fr) minmax(390px, 0.82fr);
        align-items: stretch;
    }
}

.mobile-menu {
    max-height: 0;
    overflow: hidden;
    transition: max-height 240ms ease;
}

.mobile-menu.is-open {
    max-height: 32rem;
}

.quote-panel {
    position: relative;
}

.quote-panel::before {
    content: '';
    position: absolute;
    inset: -1px;
    z-index: -1;
    border-radius: var(--radius-lg);
    background: linear-gradient(135deg, rgba(250, 204, 21, 0.52), rgba(249, 115, 22, 0.24), rgba(255, 255, 255, 0.08));
}

.luxury-image {
    filter: saturate(1.05) contrast(1.08);
}