/* Configuração do Scroll Snap para telas maiores (desktop) */
@media (min-width: 768px) {
    html {

        scroll-behavior: smooth; /* Adicionado para rolagem suave */
    }

    header, section {
        scroll-snap-align: start;
    }
}

/* Pequeno reset para garantir comportamento consistente */
body {
    font-family: 'Inter', sans-serif;
}

/* Garante que o carrossel ocupe todo o espaço do seu contêiner */
.services-carousel {
    height: 100%;
    width: 100%;
}

/* Estilos para os botões do Swiper para combinar com o design */
.swiper-button-next, .swiper-button-prev {
    color: white !important;
    background-color: rgba(0, 0, 0, 0.5);
    width: 44px !important;
    height: 44px !important;
    border-radius: 50%;
}

.swiper-button-next:after, .swiper-button-prev:after {
    font-size: 1.25rem !important;
    font-weight: bold;
}

/* --- ESTILOS DO MENU HAMBÚRGUER --- */

/* Evita a rolagem da página quando o menu está aberto */
body.menu-open {
    overflow: hidden;
}

/* Estilos para o botão de menu (hambúrguer -> X) */
#menu-toggle span {
    transition: all 0.3s ease-in-out;
}

body.menu-open #menu-toggle span {
    background-color: white;
}

body.menu-open #menu-toggle span:nth-child(1) {
    transform: rotate(45deg) translate(6px, 6px);
}

body.menu-open #menu-toggle span:nth-child(2) {
    opacity: 0;
}

body.menu-open #menu-toggle span:nth-child(3) {
    transform: rotate(-45deg) translate(6px, -6px);
}

/* Mostra a sobreposição do menu */
body.menu-open #menu-overlay {
    transform: translateX(0);
}

/* --- ESTILOS DA GALERIA HORIZONTAL --- */

.works-gallery {
    overflow: hidden; /* Garante que o conteúdo extra não seja visível */
    position: relative; /* Estabelece um contexto de empilhamento */
    z-index: 60; /* Garante que a galeria fique abaixo de elementos com z-index maior, como o menu */
}