/* @import url("https://use.typekit.net/wyg3jij.css"); */
/* css imports */
/* @import url('base.css');
@import url('header.css');
@import url('rodape.css');
@import url('banner.css');
@import url('carrossel.css');
@import url('sobre.css'); */

.aller-light {    
    font-family: "aller", sans-serif;
    font-weight: 300;
    font-style: normal;
}

.aller-light-italic {    
    font-family: "aller", sans-serif;
    font-weight: 300;
    font-style: italic;
}

.aller-regular {    
    font-family: "aller", sans-serif;
font-weight: 400;
font-style: normal;
}

.aller-regular-italic {    
    font-family: "aller", sans-serif;
font-weight: 400;
font-style: italic;
}

.aller-bold {    
    font-family: "aller", sans-serif;
font-weight: 700;
font-style: normal;
}
.aller-bold-italic {    
    font-family: "aller", sans-serif;
font-weight: 700;
font-style: italic;
}

body, html {
    margin: 0;
    padding: 0;
    overflow-x: hidden;
    font-family: 'aller', sans-serif;
    background-color: #f8f9fa;
}

/* Footer Reveal Setup */
body {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
}

main {
    /* O JS vai adicionar margin-bottom dinamicamente igual à altura do rodapé */
    position: relative;
    z-index: 10;
    background-color: #ffffff;
    box-shadow: 0 20px 40px rgba(0,0,0,0.15);
}

footer {
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
    z-index: 1;
}

/* Parallax Hero Wrapper */
.hero-bg-wrapper {
    position: absolute;
    top: -20%;
    left: 0;
    width: 100%;
    height: 140%; /* Altura maior para permitir parallax sem mostrar bordas */
    z-index: 0;
    pointer-events: none;
}

/* Marquee / Endless Slider (Left to Right) */
@keyframes marquee {
    0% { transform: translateX(-50%); }
    100% { transform: translateX(0%); }
}

.marquee-container {
    display: flex;
    width: 200%; /* Espaço suficiente para dupicar o conteúdo */
    animation: marquee 20s linear infinite;
}

.marquee-container:hover {
    animation-play-state: paused;
}

/* Formas orgânicas para imagens */
.organic-shape-1 {
    border-radius: 60% 40% 30% 70% / 60% 30% 70% 40%;
    box-shadow: 0 10px 30px rgba(0,0,0,0.1);
}

.organic-shape-2 {
    border-radius: 40% 60% 70% 30% / 40% 50% 60% 50%;
    box-shadow: 0 10px 30px rgba(0,0,0,0.1);
}

/* Dividers (Ondas) */
.wave-divider {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    overflow: hidden;
    line-height: 0;
    transform: translateY(2px);
    z-index: 5;
}

.wave-divider svg {
    position: relative;
    display: block;
    width: calc(100% + 1.3px);
    height: 80px;
}

/* Oculta scrollbar na atuação para mobile se der overlow, mas o grid lida com isso */
.no-scrollbar::-webkit-scrollbar {
    display: none;
}
.no-scrollbar {
    -ms-overflow-style: none;  /* IE and Edge */
    scrollbar-width: none;  /* Firefox */
}