
body{
margin:0;
font-family:Inter,sans-serif;
background:#030b15;
color:white;
overflow-x:hidden;
}
*{box-sizing:border-box}
.hero-bg{
background:
radial-gradient(circle at top left, rgba(0,255,170,0.12), transparent 30%),
radial-gradient(circle at bottom right, rgba(0,174,255,0.12), transparent 30%),
#030b15;
}
.glass{
background:rgba(255,255,255,.05);
backdrop-filter:blur(12px);
border:1px solid rgba(255,255,255,.08);
}
.card{
transition:.4s;
}
.card:hover{
transform:translateY(-10px);
box-shadow:0 0 40px rgba(0,255,170,.2);
}
.loader{
width:120px;
height:120px;
border-radius:50%;
border:4px solid rgba(255,255,255,.1);
border-top:4px solid #00ffaa;
animation:spin 1s linear infinite;
}
@keyframes spin{
100%{transform:rotate(360deg)}
}


/* =========================================
   RESPONSIVIDADE INTRO CINEMATOGRÁFICA
========================================= */

#intro{
position:fixed;
inset:0;
width:100%;
height:100vh;
height:100dvh;
overflow:hidden;
background:#000;
display:flex;
align-items:center;
justify-content:center;
}

#intro .slide{
position:absolute;
inset:0;
width:100%;
height:100%;
display:flex;
align-items:center;
justify-content:center;
}

#intro .slide img{
width:100%;
height:100%;
object-fit:cover;
object-position:center center;
display:block;
}

/* MOBILE GERAL */
@media(max-width:768px){

#intro p{
font-size:12px;
letter-spacing:4px;
padding:0 20px;
text-align:center;
}

.loader{
width:80px;
height:80px;
}

}

/* PORTRAIT MOBILE — mostra mais conteúdo da imagem widescreen.
   100vmax = maior dimensão do viewport (= altura em portrait).
   A imagem fica maior que a tela em largura (cortada pelo overflow:hidden),
   mas exibe ~56 % da altura da tela e ~46 % da largura da imagem
   (vs apenas 26 % em cover puro), com barras escuras acima/abaixo
   que se fundem com o fundo #000 do #intro.                          */
@media(max-width:768px) and (orientation:portrait){

#intro .slide{
overflow:hidden;
}

#intro .slide img{
width:100vmax;
height:auto;
min-height:unset;
object-fit:initial;
position:relative;
flex-shrink:0;
}

}

/* TELAS MUITO PEQUENAS */
@media(max-width:480px){

#intro p{
font-size:11px;
letter-spacing:3px;
}

.loader{
width:70px;
height:70px;
}

}


.hero-carousel img{
min-width:100%;
}

@media(max-width:768px){

.hero-carousel img{
height:300px;
object-fit:cover;
}

}


.sector-carousel .min-w-full{
min-width:100%;
}

@media(max-width:768px){

.sector-carousel img{
height:300px;
}

}

/* =========================================
   MENU MOBILE HAMBURGER
========================================= */

#mobile-menu{
display:none;
}
#mobile-menu.open{
display:block;
}
.hamburger-line{
display:block;
width:22px;
height:2px;
background:white;
border-radius:2px;
transition:transform 0.3s ease, opacity 0.3s ease;
}
#menu-btn.active .hamburger-line:nth-child(1){
transform:translateY(7px) rotate(45deg);
}
#menu-btn.active .hamburger-line:nth-child(2){
opacity:0;
transform:scaleX(0);
}
#menu-btn.active .hamburger-line:nth-child(3){
transform:translateY(-7px) rotate(-45deg);
}

/* =========================================
   BOTAO VOLTAR AO TOPO
========================================= */
#scroll-top{
position:fixed;
bottom:1.5rem;
right:1.5rem;
z-index:50;
width:48px;
height:48px;
border-radius:50%;
background:rgba(0,255,170,.12);
border:1px solid rgba(0,255,170,.35);
display:flex;
align-items:center;
justify-content:center;
cursor:pointer;
opacity:0;
transform:translateY(16px);
transition:opacity .3s ease,transform .3s ease,background .2s ease;
backdrop-filter:blur(12px);
}
#scroll-top.visible{
opacity:1;
transform:translateY(0);
}
#scroll-top:hover{
background:rgba(0,255,170,.3);
box-shadow:0 0 20px rgba(0,255,170,.2);
}
