:root{
--primary:#0d6efd;
--dark:#081120;
--gray:#6b7280;
--light:#f8fafc;
--success:#22c55e;
}

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

body{
background:#fff;
overflow-x:hidden;
}

.navbar{
backdrop-filter:blur(12px);
background:rgba(255,255,255,.95);
box-shadow:0 4px 20px rgba(0,0,0,.05);
}

.hero{
min-height:100vh;
display:flex;
align-items:center;
background:
radial-gradient(circle at top left,#2563eb 0%,transparent 35%),
radial-gradient(circle at bottom right,#60a5fa 0%,transparent 30%),
linear-gradient(135deg,#081120,#10203b);
color:white;
position:relative;
overflow:hidden;
}

.hero::before{
content:"";
position:absolute;
width:500px;
height:500px;
background:rgba(255,255,255,.05);
border-radius:50%;
top:-150px;
right:-150px;
}

.hero h1{
font-size:4rem;
font-weight:800;
line-height:1.1;
}

.hero p{
font-size:1.2rem;
opacity:.9;
}

.hero-card{
background:rgba(255,255,255,.08);
backdrop-filter:blur(15px);
border:1px solid rgba(255,255,255,.15);
border-radius:20px;
padding:30px;
}

.btn-primary{
padding:14px 28px;
border-radius:12px;
font-weight:600;
}

.section{
padding:100px 0;
}

.section-title{
font-size:2.5rem;
font-weight:800;
margin-bottom:20px;
}

.section-subtitle{
max-width:700px;
margin:auto;
color:var(--gray);
}

.service-card{
background:white;
border-radius:20px;
padding:35px;
height:100%;
transition:.3s;
box-shadow:0 10px 30px rgba(0,0,0,.06);
}

.service-card:hover{
transform:translateY(-8px);
}

.service-icon{
font-size:2rem;
color:var(--primary);
margin-bottom:15px;
}

.counter{
font-size:3rem;
font-weight:800;
color:var(--primary);
}

.process-step{
padding:30px;
background:white;
border-radius:18px;
box-shadow:0 10px 25px rgba(0,0,0,.06);
height:100%;
}

.cta-section{
background:linear-gradient(135deg,#0d6efd,#003566);
color:white;
padding:100px 0;
}

.footer{
background:#081120;
color:#d1d5db;
padding:70px 0;
}

.floating-whatsapp{
position:fixed;
right:25px;
bottom:25px;
width:65px;
height:65px;
background:#25d366;
border-radius:50%;
display:flex;
align-items:center;
justify-content:center;
font-size:30px;
color:white;
text-decoration:none;
box-shadow:0 10px 25px rgba(0,0,0,.3);
z-index:999;
}

.fade-up{
opacity:0;
transform:translateY(40px);
transition:all .8s ease;
}

.fade-up.show{
opacity:1;
transform:none;
}

.badge-growth{
background:#e0e7ff;
color:#1d4ed8;
padding:10px 15px;
border-radius:30px;
font-weight:600;
}

@media(max-width:768px){

.hero h1{
font-size:2.5rem;
}

.section-title{
font-size:2rem;
}

}