/* =================================================================
   RESPONSIVE — Breakpoints mobile-first (min-width)
   Source : Maquette approuvée Simplement Vous
   ================================================================= */

/* -----------------------------------------------------------------
   TABLET (768px+)
----------------------------------------------------------------- */

@media (min-width: 768px) {

    /* Header */
    .header-phone {
        display: flex;
    }

    /* Philosophy */
    .philo-badge {
        width: auto;
        max-width: 220px;
    }

    /* Gallery Mosaic */
    .gallery-mosaic {
        column-count: 3;
        column-gap: 12px;
    }

    .gallery-item {
        margin-bottom: 12px;
    }

    /* Contact */
    .contact-wrapper {
        grid-template-columns: 1fr;
    }

    .map-wrapper {
        height: 500px;
    }

    /* Gift cards */
    .gift-options {
        grid-template-columns: 1fr;
    }

    /* Apéro Shopping */
    .apero-perks {
        flex-direction: column;
        gap: 0.5rem;
    }

    .apero-perk-item {
        width: 100%;
    }

    /* Video grids */
    .video-grid {
        grid-template-columns: repeat(3, 1fr);
    }

    .video-grid--duo {
        grid-template-columns: repeat(2, 1fr);
    }

    /* VAD */
    .vad-steps-modern {
        grid-template-columns: 1fr auto 1fr auto 1fr;
        align-items: center;
    }

    .vad-step-arrow {
        display: flex;
        align-items: center;
        justify-content: center;
        color: var(--c-primary);
        opacity: 0.5;
    }
}

/* -----------------------------------------------------------------
   DESKTOP (1024px+)
----------------------------------------------------------------- */

@media (min-width: 1024px) {

    /* Header */
    .nav-menu {
        display: flex;
    }

    .mobile-toggle {
        display: none;
    }

    .header-actions .btn {
        display: inline-flex;
    }

    /* Hero */
    .hero-bg-wrapper {
        width: 50%;
        opacity: 1;
    }

    .hero-content {
        width: 55%;
        padding-right: var(--s-gap-lg);
        text-align: left;
    }

    .hero-desc {
        margin-inline: 0;
    }

    .hero-buttons {
        justify-content: flex-start;
    }

    .hero-stats {
        justify-content: flex-start;
    }

    /* Philosophy */
    .philo-image-wrapper {
        order: 0;
        margin-bottom: 0;
    }

    .philo-badge {
        bottom: -2rem;
        right: -2rem;
        transform: none;
    }

    /* Gallery Mosaic */
    .gallery-mosaic {
        column-count: 4;
        column-gap: 16px;
    }

    .gallery-item {
        margin-bottom: 16px;
    }

    /* Contact */
    .contact-wrapper {
        grid-template-columns: 4fr 6fr;
    }

    .contact-info {
        padding: var(--s-gap-lg);
        border-right: 1px solid var(--c-border-light);
        border-bottom: none;
    }

    .contact-form-container {
        padding: var(--s-gap-lg);
    }

    .form-row {
        grid-template-columns: 1fr 1fr;
    }

    /* Service cards */
    .service-card {
        padding: var(--s-gap-sm) var(--s-gap-xs);
    }

    /* Gift cards layout */
    .gift-split-layout {
        flex-direction: row;
        justify-content: space-between;
    }
    .gift-content {
        padding-right: var(--s-gap-lg);
    }

    /* Apéro Shopping */
    .apero-grid {
        grid-template-columns: 5fr 7fr;
        align-items: center;
    }

    .apero-info {
        padding-left: var(--s-gap-xl);
    }
    
    .apero-perks {
        display: flex;
        flex-direction: column;
        gap: 0.5rem;
    }
    
    .apero-perk-item {
        width: 100%;
    }

}

/* -----------------------------------------------------------------
   WIDE (1400px+)
----------------------------------------------------------------- */

@media (min-width: 1400px) {
    .contact .container {
        max-width: var(--s-container-wide);
        width: 95%;
    }
}