/* Responsive Media Queries - Mobile First & Tweaks */
@media screen and (max-width: 768px) {
    /* Manifesto Fix Spacing */
    .manifesto { padding: 4rem 5vw; }
    .manifesto-wrap {
        flex-direction: column;
        text-align: center;
        gap: 0;
        margin-bottom: 2rem;
    }
    .manifesto-wrap h2 {
        white-space: normal;
        line-height: 1.2;
    }

    .cta-mid { padding: 3rem 2rem; }

    /* Processo — horizontal no mobile (scroll lateral suave) */
    .proc-steps {
        flex-direction: row;
        flex-wrap: nowrap;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        justify-content: flex-start;
        align-items: flex-start;
        gap: 2rem;
        padding: 0 4vw;
        scroll-snap-type: x mandatory;
    }
    .step {
        min-width: 130px;
        max-width: 160px;
        flex-shrink: 0;
        scroll-snap-align: start;
        width: auto;
    }
    .proc-linha-progresso {
        top: 30px;
        left: 4vw;
        width: calc(100% - 8vw);
        height: 1px;
        transform: none;
    }

    /* Contato CTA */
    .cta-btns {
        flex-direction: column;
        width: 100%;
        padding: 0 2rem;
    }
    .btn-outline {
        text-align: center;
    }
    
    /* Ambiente Entry Fix */
    .ambiente-entry h2 {
        font-size: clamp(3rem, 15vw, 6rem);
    }
    /* Setas só no desktop — ocultar no mobile */
    .amb-arrow { display: none !important; }
    /* Mobile track: sem overflow-x preso (o swipe é nativo) */
    .ambiente-track {
        overflow-x: auto;
        padding-left: 0;
    }

    .hero-logo {
        font-size: 25vw;
    }
    
    .hero-content .main-logo-img {
        height: var(--hero-logo-size-mobile, 25vw);
    }

    .section-entry-word {
        font-size: clamp(2rem, 10vw, 4rem);
        padding: 0 5vw;
    }

    /* Native Horizontal Scrolling para mobile */
    .ambiente-pin-wrap {
        height: auto;
        min-height: 65vh; /* Reduzido: mostra mais largura de cada foto */
        align-items: center;
    }
    .ambiente-track {
        height: 65vh; /* Menos corte vertical nas fotos paisagem */
        overflow-x: auto;
        scroll-snap-type: x mandatory;
        padding-left: 0;
        width: 100vw;
        display: flex;
        -webkit-overflow-scrolling: touch;
    }
    .gallery-item {
        scroll-snap-align: center;
        height: 65vh;
    }
    .gallery-item img {
        object-position: var(--pos-mob, center center);
    }

    /* Ajuste para as novas legendas não sumirem */
    .gallery-item .micro-caption {
        bottom: 1.5rem;
        right: 1rem;
        left: 1rem;
        width: auto;
        text-align: center;
    }

    /* Parceiros — horizontal no mobile */
    .parceiros-title { top: 5vh; font-size: clamp(2rem, 8vw, 3rem); }
    .parceiros-spotlight { padding-top: 4vh; padding-bottom: 4vh; gap: 5vw; }
    .parc-logo { width: 90px; max-width: 28vw; margin: 1vh 0; }

    /* Materialidade — centralização simétrica no mobile */
    .acabamentos-wrapper {
        min-height: auto;
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        gap: 1.15rem;
        padding: 0 4vw 4rem;
        width: 100%;
        overflow: visible;
    }
    .swatch {
        position: relative !important;
        left: auto !important;
        top: auto !important;
        transform: none !important; /* block GSAP parallax on mobile */
        width: 100%;
        height: 200px;
    }
    .swatch .name {
        opacity: 1; /* always visible on mobile */
        padding: 0.5rem;
        font-size: 10px;
    }
}

/* Swipe Icon Animation */
.swipe-icon-container {
    position: absolute;
    bottom: 5rem;
    left: 50%;
    transform: translateX(-50%);
    z-index: 100;
    display: flex;
    flex-direction: column;
    align-items: center;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.5s ease;
}
.swipe-icon-container.visible {
    opacity: 1;
}
.swipe-text {
    font-size: 10px;
    letter-spacing: 0.2rem;
    text-transform: uppercase;
    color: var(--noce-white);
    margin-bottom: 5px;
}
.swipe-hand {
    width: 30px;
    height: 30px;
    fill: var(--noce-white);
    animation: swipeAnim 2s infinite ease-in-out;
}

@keyframes swipeAnim {
    0% { transform: translateX(10px) rotate(5deg); opacity: 0; }
    30% { opacity: 1; }
    70% { opacity: 1; }
    100% { transform: translateX(-20px) rotate(-5deg); opacity: 0; }
}

/* ── TABLET (769px–1024px) ───────────────────────────────────── */
@media screen and (min-width: 769px) and (max-width: 1024px) {
    /* Swatches menores para caber sem overflow em telas médias */
    .swatch { width: 200px; height: 300px; }

    /* Botões do contato em coluna em tablet */
    .cta-btns {
        flex-direction: column;
        align-items: center;
        gap: 1rem;
    }
    .btn-outline { text-align: center; }

    /* Parceiros: logos um pouco menores */
    .parc-logo { width: 160px; margin: 5vh 0; }

    /* Processo: steps com mais espaço */
    .proc-steps { gap: 0.5rem; }
    .step { max-width: 130px; }
}