*{
margin:0;
padding:0;
box-sizing:border-box;
font-family:'Space Grotesk', sans-serif;
}

body{
background:#05070d;;
color:#eafff3;
overflow-x:hidden;
}

body{
padding-top:95px;
}

/* Matrix */
canvas{
position:fixed;
top:0;
left:0;
width:100%;
height:100%;
z-index:-1;
}

/* Neon Cursor */
.cursor{
position:fixed;
width:14px;
height:14px;
border-radius:50%;
background:#005bf9;
pointer-events:none;
z-index:9999;
box-shadow:0 0 10px #005bf9,0 0 30px #005bf9;
transform:translate(-50%,-50%);
}

.services-section{
padding:80px 20px;
text-align:center;
}

.cards{
display:grid;
grid-template-columns:repeat(auto-fit,minmax(120px,1fr));
gap:25px;
margin-top:30px;
}

.card{
background:rgba(255,255,255,0.03);
backdrop-filter:blur(2px);
-webkit-backdrop-filter:blur(12px);

border-radius:14px;
padding:30px 15px;
cursor:pointer;
transition:0.3s;

border:1px solid rgba(0,191,255,0.35);

box-shadow:
0 0 18px rgba(0,191,255,0.08),
inset 0 0 12px rgba(255,255,255,0.015);
}

.card i{
font-size:42px;
color:#00f0ff;
display:block;
margin-bottom:10px;
}

.card span{
color:white;
font-weight:600;
}

.card:hover{
transform:translateY(-6px);
box-shadow:
0 0 25px rgba(0,191,255,0.28),
inset 0 0 12px rgba(255,255,255,0.03);
border:1px solid rgba(0,255,200,0.5);
}

.card.active{
box-shadow:0 0 25px #00f0ff;
}

.service-text{
margin-top:30px;
font-size:18px;
color:#e5e7eb;
min-height:40px;
}

.industry-section{
text-align:center;
padding:60px 20px;
}

.industry-icons{
display:flex;
justify-content:center;
gap:40px;
margin-top:30px;
flex-wrap:wrap;
}

.industry{
font-size:40px;
cursor:pointer;
transition:0.3s;
}

.industry span{
display:block;
font-size:14px;
margin-top:8px;
}

.industry:hover{
transform:scale(1.2);
}

.industry-content{
margin-top:40px;
font-size:18px;
max-width:700px;
margin-left:auto;
margin-right:auto;
min-height:120px;
}

/* Glass */
.glass{
background:rgba(0,0,0,.85);
backdrop-filter:blur(10px);
border:1px solid rgba(0,255,120,.25);
border-radius:14px;
box-shadow:0 0 20px rgba(0,255,120,.15);
}

.timeline-section{
padding:80px 20px;
max-width:1000px;
margin:auto;
}

.timeline{
position:relative;
margin-top:40px;
padding-left:30px;
border-left:2px solid rgba(0,255,200,0.4);
}

.timeline-item{
position:relative;
margin-bottom:50px;
}

.timeline-dot{
position:absolute;
left:-11px;
top:5px;
width:18px;
height:18px;
background:#00ffc8;
border-radius:50%;
box-shadow:0 0 15px #00ffc8;
}

.timeline-content{
background:rgba(0,0,0,0.6);
padding:20px 25px;
border-radius:12px;
border:1px solid rgba(0,255,200,0.2);
backdrop-filter:blur(6px);
}

.timeline-content h3{
margin-bottom:10px;
}

.timeline-content p{
opacity:0.85;
}

/* ANIMAÇÃO SCROLL */
.reveal {
opacity: 0;
transform: translateY(60px) scale(0.95);
transition: all 0.8s ease;
}

.reveal.show {
opacity: 1;
transform: translateY(0) scale(1);
}

/* Header */
header{
position:fixed;
top:0;
width:100%;
z-index:99;
padding:10px;
}

.logo{
display:flex;
align-items:center;
gap:10px;
font-weight:600;
height:55px;
width:auto;
filter: drop-shadow(0 0 8px #00ffc8);
filter: drop-shadow(0 0 12px #00ffc8);
}

.logo img{
height:65px;
width:auto;
filter:drop-shadow(0 0 12px #00ffc8);
}

/* Sections */
section{
padding:120px 10%;
}

h2{
text-align:center;
font-size:2.6rem;
margin-bottom:40px;
background:linear-gradient(90deg,#00ffc8,#0099ff,#a855f7);
-webkit-background-clip:text;
-webkit-text-fill-color:transparent;
}

/* Hero */
.hero{
display:grid;
grid-template-columns:1fr 1fr;
gap:40px;
align-items:center;
}

.hero h1{
font-size:3rem;
color:#005bf9;
}

.hero p{
opacity:.85;
margin-top:10px;
}

.cta button{
padding:28px 38px;
margin-right:28px;
border:none;
border-radius:26px;
background:#005bf9;
color:#000;
font-weight:700;
cursor:pointer;
}

.hero-title{
font-family:'Space Grotesk', sans-serif;
font-weight:700;
font-size:clamp(3.5rem, 7vw, 6.5rem);
line-height:1.05;
font-weight:800;
letter-spacing:-1px;
background:linear-gradient(90deg,#00ffc8,#0099ff,#ff2d95);
-webkit-background-clip:text;
-webkit-text-fill-color:transparent;
}

.hero-subtitle{
margin-top:15px;
font-size:1.1rem;
color:#cbd5e1;
line-height:1.6;
}

.hero-section{
height:100vh;
display:flex;
flex-direction:column;
justify-content:center;
align-items:center;
text-align:center;
padding:0 20px;
}

/* TEXTO PEQUENO EM CIMA */
.hero-top{
font-family:'Space Grotesk', sans-serif;
font-weight:500;
letter-spacing:6px;
text-transform:uppercase;
font-size:12px;
color:#00ffc8;
opacity:0.7;
margin-bottom:18px;
}

/* TITULO PRINCIPAL */
.hero-title{
font-size:clamp(3rem, 6vw, 6rem);
font-weight:800;
line-height:1.1;
background:linear-gradient(90deg,#00ffc8,#0099ff,#ff2d95);
-webkit-background-clip:text;
-webkit-text-fill-color:transparent;
margin-bottom:25px;
}

/* SUBTEXTO */
.hero-subtitle{
max-width:700px;
font-size:1.1rem;
color:#cbd5e1;
line-height:1.7;
}

.highlight{
color:#00ffc8;
font-weight:600;
}

.navbar{
position:fixed;
top:0;
left:0;
width:100%;
height:85px;
background:rgba(0,0,0,0.7);
backdrop-filter:blur(8px);
border-bottom:1px solid rgba(0,255,200,0.2);
z-index:1000;
}

.nav-container{
max-width:1200px;
margin:auto;
height:100%;
display:flex;
align-items:center;
justify-content:space-between;
padding:0 30px;
}

.logo{
display:flex;
align-items:center;
gap:12px;
color:white;
font-weight:600;
gap: 16px;
}

.logo img{
height:80px;
width:auto;
}

.logo span{
font-size:20px;
font-weight:700;
}

.menu{
display:flex;
gap:30px;
}

.menu a{
color:#00bfff;
text-decoration:none;
font-weight:500;
transition:0.3s;
}

.menu a:hover{
color:#00ffc8;
}

.cta .ghost{
background:transparent;
border:2px solid #005bf9;
color:#005bf9;
}

/* Accordion */
.accordion-header{
display:flex;
justify-content:center;
align-items:center;
gap:12px;
cursor:pointer;
user-select:none;
}

.timeline-section.open .accordion-content{
max-height:2000px;
}

.arrow{
font-size:22px;
transition:0.3s;
}

.timeline-section.open .arrow{
transform:rotate(180deg);
}

.accordion-content{
max-height:0;
overflow:hidden;
transition:max-height 0.5s ease;
}

/* quando abre */
.accordion.open .accordion-content{
max-height:2000px;
}

/* gira seta */
.accordion.open .arrow{
transform:rotate(180deg);
}

/* animação dos itens */
.timeline-item{
opacity:0;
transform:translateY(30px);
transition:0.5s;
}

.timeline-item.show{
opacity:1;
transform:translateY(0);
}

/* Carousel */
.carousel {
  display: flex;
  gap: 20px;
  width: max-content;
  will-change: transform;
}

.carousel:active {
  cursor: grabbing;
}

.carousel .card {
  flex: 0 0 320px;
  transition: transform 0.3s ease;
}

.carousel .card:hover {
  transform: translateY(-8px) scale(1.02);
}

#projects {
  overflow: hidden;
}


.carousel .card{
min-width:280px;
padding:15px;
border-radius:16px;
background: rgba(255,255,255,0.03);
backdrop-filter: blur(12px);
border:1px solid #005bf9;
transition:.3s;
cursor:pointer;
flex: 0 0 320px;
}



@media (max-width: 768px) {
  .carousel .card {
    flex: 0 0 260px;
  }
}

.card img,.card video{
width:100%;
border-radius:8px;
}

.card:hover{
transform:scale(1.05);
box-shadow:0 0 25px #005bf9;
}

.service-text{
margin:40px auto;
max-width:900px;
padding:20px 30px;
background:rgba(0,0,0,0.55);
border-radius:14px;
border:1px solid rgba(0,255,200,0.25);
font-size:18px;
text-align:center;
backdrop-filter:blur(6px);
box-shadow:0 0 18px rgba(0,255,200,0.12);
}

.cta{
margin-top:40px;
text-align:center;
}

.cta-button{
padding:18px 45px;
font-size:25px;
font-weight:700;
background:linear-gradient(135deg, #00ffc8, #0099ff);
color:#000;
border:none;
border-radius:14px;
cursor:pointer;
transition:all 0.3s ease;
box-shadow:0 0 25px rgba(0,255,200,0.35);
}

.cta-button:hover{
transform:translateY(-3px);
box-shadow:0 0 35px rgba(0,255,200,0.6);
}

/* Contact */
.contact-icons{
text-align:center;
}

.contact-icons a{
font-size:36px;
margin:0 22px;
color:#005bf9;
text-decoration:none;
transition:.3s;
}

.contact-icons a:hover{
transform:scale(1.2);
color:#fff;
}

footer{
text-align:center;
padding:30px;
font-size:13px;
opacity:.6;
}

/* Modal */
#modal{
position:fixed;
top:0;
left:0;
width:100%;
height:100%;
background:rgba(0,0,0,.95);
display:none;
align-items:center;
justify-content:center;
z-index:9999;
}

#modalContent img{
width:90vw;
height:auto;
max-height:90vh;
object-fit:contain;
border:2px solid #005bf9;
border-radius:12px;
}


/* SCROOLLER */
html{
  scroll-behavior:smooth;
}

.scroll-btn {
  position: fixed;
  bottom: 30px;
  left: 50%;
  transform: translateX(-50%);
  
  background: rgba(0, 191, 255, 0.001);
  border: 1px solid rgba(0, 191, 255, 0.3);
  backdrop-filter: blur(1px);
  
  color: #00ffc8;
  font-size: 28px;
  
  padding: 12px 16px;
  border-radius: 50%;
  
  cursor: pointer;
  transition: 0.3s;
  
  box-shadow: 0 0 20px rgba(0, 191, 255, 0.2);
}

.scroll-btn:hover {
  transform: translateX(-50%) translateY(-6px);
  box-shadow: 0 0 30px rgba(0, 191, 255, 0.6);
}

.scroll-btn {
  animation: float 2s infinite ease-in-out;
}

@keyframes float {
  0%, 100% { transform: translateX(-50%) translateY(0); }
  50% { transform: translateX(-50%) translateY(8px); }
}

#meulink { color: #FFFFFF }

/* =========================
   COOKIE BANNER
========================= */

.cookie-banner{
position:fixed;
bottom:25px;
left:50%;
transform:translateX(-50%) translateY(40px);

width:90%;
max-width:620px;

padding:18px 22px;

background:rgba(10,15,25,0.88);
backdrop-filter:blur(14px);

border:1px solid rgba(0,191,255,0.18);
border-radius:18px;

box-shadow:
0 0 30px rgba(0,91,249,0.12),
inset 0 0 20px rgba(255,255,255,0.02);

z-index:99999;

opacity:0;
visibility:hidden;

transition:
opacity 0.4s ease,
transform 0.4s ease,
visibility 0.4s;
}

.cookie-banner.show{
opacity:1;
visibility:visible;
transform:translateX(-50%) translateY(0);
}

.cookie-content{
display:flex;
align-items:center;
justify-content:space-between;
gap:20px;
flex-wrap:wrap;
}

.cookie-content p{
flex:1;
font-size:14px;
line-height:1.6;
color:#cbd5e1;
}

.cookie-content a{
color:#00bfff;
text-decoration:none;
font-weight:600;
}

.cookie-content a:hover{
color:#00ffc8;
}

.cookie-content button{
padding:12px 22px;

border:none;
border-radius:12px;

background:linear-gradient(135deg,#00c3ff,#005bf9);

color:white;
font-weight:700;

cursor:pointer;

transition:0.3s ease;

box-shadow:0 0 18px rgba(0,91,249,0.25);
}

.cookie-content button:hover{
transform:translateY(-2px);
box-shadow:0 0 24px rgba(0,91,249,0.45);
}






/* =========================
   MOBILE - SEM ALTERAR DESKTOP
========================= */

@media (max-width: 768px){

.cursor{
display:none;
}

body{
padding-top:75px;
}

.navbar{
height:75px;
}

.nav-container{
padding:0 12px;
}

.logo img{
height:50px;
}

.logo span{
display:none;
}

.menu{
gap:10px;
}

.menu a{
font-size:12px;
}

.hero-section{
height:auto;
min-height:100vh;
padding:110px 20px 70px;
}

.hero-top{
font-size:10px;
letter-spacing:3px;
}

.hero-title{
font-size:2.6rem;
line-height:1.08;
}

.hero-subtitle{
font-size:0.95rem;
line-height:1.6;
}

.cta-button{
font-size:18px;
padding:15px 22px;
max-width:300px;
width:100%;
}

section{
padding:80px 20px;
}

h2{
font-size:2rem;
}

/* SOLUÇÕES AVANÇADAS */

.cards{
grid-template-columns:repeat(3,1fr);
gap:10px;
}

.cards .card{
min-width:0;
width:auto;
padding:18px 8px;
}

.cards .card i{
font-size:30px;
}

.cards .card span{
font-size:13px;
}

/* CARROSSEL */

.carousel .card{
flex:0 0 250px;
min-width:250px;
max-width:250px;
}

/* TIMELINE */

.timeline{
padding-left:18px;
}

.timeline-content{
padding:18px;
}

/* PENEIRA / CONTACT */

#peneira div,
#contact div{
padding:45px 22px !important;
}

#peneira h2,
#contact h2{
font-size:2.1rem !important;
}

.service-text{
font-size:16px;
padding:18px;
}

}

.titulo-degrade{
  background:linear-gradient(90deg,#00ffc8,#0099ff,#a855f7) !important;
  -webkit-background-clip:text !important;
  background-clip:text !important;
  -webkit-text-fill-color:transparent !important;
  color:transparent !important;
}



.carousel-wrapper{
position:relative;
display:flex;
align-items:center;
}

.carousel-btn{
position:absolute;
z-index:20;

width:48px;
height:48px;

border:none;
border-radius:50%;

background:rgba(0,0,0,0.45);
backdrop-filter:blur(8px);

color:#00ffc8;
font-size:24px;

cursor:pointer;
transition:0.3s;

border:1px solid rgba(0,255,200,0.2);

display:flex;
align-items:center;
justify-content:center;
}

.carousel-btn:hover{
transform:scale(1.08);
background:rgba(0,191,255,0.18);

box-shadow:0 0 18px rgba(0,255,200,0.35);
}

.carousel-btn.prev{
left:10px;
}

.carousel-btn.next{
right:10px;
}