/* Mobile layout corrections for the restored 4 September version.
   Preserve the existing content, colours, images and typefaces. */
@media (max-width: 950px) {
    /* The footer must grow with wrapped links instead of covering the reviews. */
    footer .footer-grid > .footer-nav,
    footer .footer-grid > .footer-contact,
    footer .footer-nav-list,
    footer .footer-contact-items-wrapper {
        height: auto !important;
        min-width: 0;
    }

    /* Keep the invitation box inside the footer, clear of the preceding text. */
    footer .footer-cta-box {
        transform: none !important;
        margin-top: 0 !important;
    }

    /* Long menu labels must fit inside the phone's available width. */
    .mobile-menu-links a {
        max-width: 100%;
        font-size: clamp(1.375rem, 6.6vw, 2rem) !important;
        letter-spacing: 0.12em !important;
        white-space: normal;
        overflow-wrap: anywhere;
    }

    /* The consent panel must not cover an open menu or gallery controls.
       It returns unchanged as soon as the overlay is closed. */
    body.mobile-menu-open .cookie-consent,
    body.mobile-lightbox-open .cookie-consent {
        visibility: hidden !important;
        pointer-events: none !important;
    }

    /* Expanded partner descriptions must show their entire original text. */
    .description-content.is-expanded {
        max-height: none !important;
    }
}

@media (max-width: 760px) {
    /* Two link columns, followed by the contact details at full width. */
    footer .footer-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 32px 24px !important;
    }

    footer .footer-grid > .footer-nav {
        width: 100%;
        justify-self: stretch !important;
    }

    footer .footer-grid > .footer-contact {
        grid-column: 1 / -1;
        justify-self: stretch !important;
        align-items: flex-start !important;
    }

    footer .footer-contact .footer-nav-title,
    footer .footer-contact-items-wrapper {
        width: 100%;
        max-width: none !important;
    }

    footer .footer-contact-items-wrapper {
        gap: 12px;
    }

    footer .footer-contact-item {
        grid-template-columns: 24px minmax(0, 1fr);
    }

    footer .footer-contact-value {
        min-width: 0;
        overflow-wrap: anywhere;
    }

    /* Allow long links inside paragraphs to wrap with the surrounding text. */
    .text-link {
        white-space: normal !important;
        overflow-wrap: anywhere;
    }
}

@media (max-width: 360px) {
    /* Fit the existing long legal heading on narrow screens. */
    .legal-header h1 {
        font-size: 1.65rem;
        overflow-wrap: anywhere;
    }
}

@media (max-width: 950px) and (max-height: 500px) and (orientation: landscape) {
    /* Keep the gallery close button within a short landscape viewport. */
    .lightbox .lightbox-close {
        position: fixed;
        top: 12px !important;
        right: 12px !important;
    }
}

/* 8 September: precise dimension fixes on the restored version. */
@media (max-width: 950px) {
    /* Home consent labels contain direct text and a link. A grid places that
       link in the checkbox column; keep the entire sentence in one flow. */
    .contact-section .checkbox-label:has(> a) {
        display: block;
        position: relative;
        padding-inline-start: 52px;
    }

    .contact-section .checkbox-label:has(> a) > input[type="checkbox"] {
        position: absolute;
        inset-inline-start: 16px;
        top: 16px;
    }
}

@media (max-width: 760px) {
    /* Respect the section's existing gutters instead of sizing to the viewport. */
    .contact-section .contact-form-container:not(.contact-form-luxury) {
        max-width: 100% !important;
    }

    /* Long translated headings must not enlarge the single-column grid. */
    .sejour-destination-layout {
        grid-template-columns: minmax(0, 1fr);
    }

    .sejour-destination-layout > * {
        min-width: 0;
    }
}

@media (max-width: 360px) {
    /* The 60.8px minimum title was wider than the available phone column. */
    .sejour-destination-copy h2 {
        font-size: clamp(2rem, 16vw, 3.8rem);
    }
}