/* Shared mobile header and contact section. */
@media (max-width: 640px) {
    :is(.page-home, .page-about, .page-video, .page-calendar, .page-privacy) .site-header {
        height: 11.6vw;
        min-height: 44px;
        display: grid;
        grid-template-columns: 1fr auto 1fr;
        gap: 2vw;
        padding: 0 3%;
    }
    :is(.page-home, .page-about, .page-video, .page-calendar, .page-privacy) .header-socials { display: flex; gap: 1.4vw; }
    :is(.page-home, .page-about, .page-video, .page-calendar, .page-privacy) .header-socials a {
        width: 4.6vw;
        height: 4.6vw;
        color: #fff;
        border: 1px solid currentColor;
        background: transparent;
    }
    :is(.page-home, .page-about, .page-video, .page-calendar, .page-privacy) .header-name { font-size: 5.2vw; white-space: nowrap; }
    :is(.page-home, .page-about, .page-video, .page-calendar, .page-privacy) .menu-toggle { justify-self: end; padding: 8px 0 8px 8px; gap: 1.4vw; }
    :is(.page-home, .page-about, .page-video, .page-calendar, .page-privacy) .menu-toggle span { width: 5.5vw; height: 1.5px; }
    :is(.page-home, .page-about, .page-video, .page-calendar, .page-privacy) .menu-toggle::after { content: ""; width: 5.5vw; height: 1.5px; background: currentColor; }
    :is(.page-home, .page-about, .page-video, .page-calendar, .page-privacy) .site-header nav { top: 100%; }

    :is(.page-home, .page-about, .page-video, .page-calendar, .page-privacy) .contact {
        display: grid;
        grid-template-columns: minmax(0, 1fr);
        padding: 4vw 0 5vw;
        min-height: 0;
        height: auto;
        background: #000;
    }
    :is(.page-home, .page-about, .page-video, .page-calendar, .page-privacy) .contact::before {
        content: "";
        position: static;
        inset: auto;
        grid-column: 1;
        grid-row: 1 / 4;
        height: auto;
        margin-top: -4vw;
        background: url('/images/mob/mob page_1_4.webp') center top / 100% auto no-repeat;
        z-index: -1;
    }
    :is(.page-home, .page-about, .page-video, .page-calendar, .page-privacy) .contact h2, :is(.page-home, .page-about, .page-video, .page-calendar, .page-privacy) .contact-links, :is(.page-home, .page-about, .page-video, .page-calendar, .page-privacy) .contact-brand > a,
    :is(.page-home, .page-about, .page-video, .page-calendar, .page-privacy) .footer-socials, :is(.page-home, .page-about, .page-video, .page-calendar, .page-privacy) #contact-form { grid-column: 1; }
    :is(.page-home, .page-about, .page-video, .page-calendar, .page-privacy) .contact-brand, :is(.page-home, .page-about, .page-video, .page-calendar, .page-privacy) .contact-copy { display: contents; }
    :is(.page-home, .page-about, .page-video, .page-calendar, .page-privacy) .contact h2 { grid-row: 1; text-align: center; font-size: 8.8vw; line-height: 1; margin: 0 0 4vw; }
    :is(.page-home, .page-about, .page-video, .page-calendar, .page-privacy) .contact-links { grid-row: 2; text-align: center; font-size: 4.1vw; gap: 2vw; padding-inline: 3%; }
    :is(.page-home, .page-about, .page-video, .page-calendar, .page-privacy) .contact-brand > a {
        grid-row: 3;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: end;
        min-height: 109vw;
        padding-bottom: 5vw;
    }
    :is(.page-home, .page-about, .page-video, .page-calendar, .page-privacy) .contact-brand img { width: 39%; height: 43vw; }
    :is(.page-home, .page-about, .page-video, .page-calendar, .page-privacy) .contact-brand span { font-size: 6.2vw; line-height: 1.1; margin: 3vw 0 0; }
    :is(.page-home, .page-about, .page-video, .page-calendar, .page-privacy) .contact-brand br { display: none; }
    :is(.page-home, .page-about, .page-video, .page-calendar, .page-privacy) .footer-socials { grid-row: 4; justify-content: center; gap: 4.5vw; margin: 0; padding: 4vw 0; background: #000; }
    :is(.page-home, .page-about, .page-video, .page-calendar, .page-privacy) .footer-socials a { width: 6.8vw; height: 6.8vw; border: 1px solid #fff; background: transparent; color: #fff; }
    :is(.page-home, .page-about, .page-video, .page-calendar, .page-privacy) #contact-form { grid-row: 5; width: 76%; margin: 0 auto; gap: 2vw; background: #000; }
    :is(.page-home, .page-about, .page-video, .page-calendar, .page-privacy) #contact-form input, :is(.page-home, .page-about, .page-video, .page-calendar, .page-privacy) #contact-form textarea { font-size: max(16px, 3.5vw); padding: 1vw 1.5vw; }
    :is(.page-home, .page-about, .page-video, .page-calendar, .page-privacy) #contact-form textarea { min-height: 68px; height: 17vw; }
    :is(.page-home, .page-about, .page-video, .page-calendar, .page-privacy) .send-button { font-size: 4.5vw; padding: 1.5vw 3.5vw; margin-top: 3vw; border-radius: 5px; }
    :is(.page-home, .page-about, .page-video, .page-calendar, .page-privacy) .form-status:empty { display: none; }
    :is(.page-home, .page-about, .page-video, .page-calendar, .page-privacy) .site-footer { height: 3vw; min-height: 9px; }
}