/* ============================================
   MOBILE RESPONSIVE OVERRIDES
   Mobile-first: single column, stacked layout
   ============================================ */

/* Mobile: Force single column for all sections */
@media (max-width: 767px) {
    /* Show hamburger menu, hide desktop nav */
    .menu-toggle {
        display: flex;
        align-items: center;
        background: none;
        border: none;
        cursor: pointer;
        padding: 0;
        width: 20px;
        height: 20px;
    }
    
    .menu-icon {
        display: block;
        width: 20px;
        height: 20px;
        border-radius: 50%;
        background-color: var(--color-text);
    }
    
    header {
        align-items: center;
    }
    
    .main-nav {
        display: none;
    }
    
    .window {
        justify-content: center;
    }
    
    .window-image {
        height: auto;
        max-height: none;
        justify-content: center;
        align-items: center;
    }
    
    .window-image img,
    .window-image picture img {
        max-width: 100%;
        width: auto;
        height: auto;
        max-height: 70vh;
        object-fit: contain;
    }
    
    .window-text {
        margin-top: var(--margin-global);
    }
    
    .window-text figcaption {
        max-width: 100%;
    }
    
    /* Horizontal gallery on mobile - one image at a time */
    .horizontal-gallery {
        display: flex;
        flex-direction: column;
        width: 100%;
    }
    
    .horizontal-gallery .gallery-container {
        position: relative;
        width: 100%;
        overflow: hidden;
        margin-bottom: 1rem;
                margin: 0 1rem;
        width: calc(100% - 2rem);
    }

    .gallery {
                margin: 0 1rem;
        width: calc(100% - 2rem);
    }

    .gallery figcaption {
        margin-top: 1rem;
        margin-bottom: 1rem;
    }

    .gallery img {
        width: 100%;
        max-height: 100% !important;
    }
    
    .horizontal-gallery .gallery-item {
        display: none;
        width: 100%;
    }
    
    .horizontal-gallery .gallery-item.active {
        display: block;
    }
    
    .horizontal-gallery .gallery-item img {
        width: 100%;
        height: auto;
        display: block;
    }
    
    .horizontal-gallery .gallery-nav-row {
        display: flex;
        justify-content: space-between;
        align-items: center;
        width: 92.5%;
       padding: 1rem 0;
        overflow: visible;
    }
    
    .horizontal-gallery .gallery-nav {
        background: none;
        border: none;
        cursor: pointer;
        padding: 0;
        display: flex;
        align-items: center;
        flex-shrink: 0;
        min-width: 8px;
    }
    
    .horizontal-gallery .gallery-nav svg {
        width: 30px;
        height: 30px;
        display: block;
    }
    
    .horizontal-gallery .gallery-counter {
        font-size: var(--font-size-s);
        white-space: nowrap;
        flex-shrink: 0;
    }
    
    .horizontal-gallery .gallery-caption {
        display: none;
        margin-top: 1rem;
        text-align: left;
        max-width: 100%;
        width: 100%;
        word-wrap: break-word;
        text-align: center;
    }
    
    .horizontal-gallery .gallery-caption.active {
        display: block;
    }
    
    .contact-columns {
        grid-template-columns: 1fr;
    }
    
    .left-column {
        order: 2; /* Links below image on mobile */
    }
    
    .right-column {
        order: 1; /* Image on top */
    }
}

/* Tablet adjustments */
@media (min-width: 768px) and (max-width: 1023px) {
    :root {
        --margin-global: 1.5rem;
    }
    
    .window-image {
        height: auto;
        justify-content: center;
        align-items: center;
    }
    
    .window-image img {
        width: clamp(75%, 85vw, 95%);
        height: auto;
        max-height: 70vh;
    }
    
    .window {
        justify-content: center;
    }
}