@import url('https://fonts.googleapis.com/css2?family=Manrope:wght@300;400;500;600;700;800&display=swap');
:root{--primary:#1479ff;--primary-dark:#0f5fd1;--text:#1f2937;--text-light:#6b7280;--white:#fff;--bg:#f7f9fc;--border:rgba(20,121,255,.10);--shadow:0 20px 60px rgba(15,35,95,.12);--radius:22px;--container:1400px;}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{font-family:'Manrope',sans-serif;color:var(--text);background:var(--bg);line-height:1.6;overflow-x:hidden}
body:before{content:"";position:fixed;inset:0;background:linear-gradient(rgba(255,255,255,.55),rgba(255,255,255,.70)),url("assets/images/background.webp") center/cover no-repeat;z-index:-2}
body:after{content:"";position:fixed;top:-200px;right:-200px;width:700px;height:700px;background:radial-gradient(circle,#7dc0ff55,transparent 70%);filter:blur(20px);z-index:-1}
.container{width:min(calc(100% - 48px),var(--container));margin:auto}
.header{position:fixed;inset:0 0 auto;height:84px;display:flex;align-items:center;z-index:1000;backdrop-filter:blur(18px);background:rgba(255,255,255,.65);border-bottom:1px solid rgba(255,255,255,.4)}
.header .container{display:grid;grid-template-columns:320px 1fr 320px;align-items:center;max-width:1400px;margin:0 auto;width:100%;padding:0 32px;}
.logo{display:flex;align-items:center;justify-content:flex-start;}
.logo img{height:80px;width:auto;display:block;}
.nav{display:flex;justify-content:center;align-items:center;gap:56px;}
.nav a{text-decoration:none;color:var(--text);font-size:1.18rem;font-weight:700;letter-spacing:.3px;transition:.3s;}
.nav a:hover{color:var(--primary)}
.btn-header,.btn-primary,.btn-secondary{display:inline-flex;align-items:center;justify-content:center;padding:18px 34px;border-radius:999px;text-decoration:none;font-weight:700;font-size:1.05rem;transition:.3s}
.btn-header,.btn-primary{background:linear-gradient(135deg,#0D7DFF,#45A8FF);color:#fff;box-shadow:0 15px 40px rgba(13,125,255,.35);font-weight:800;letter-spacing:.3px;}
.btn-primary:hover,.btn-header:hover{transform:translateY(-3px)}
.btn-secondary{background:#fff;color:var(--text);border:1px solid var(--border)}
.hero{min-height:100vh;display:flex;align-items:center;padding:150px 0 80px}
.hero .container{text-align:center}
.hero-tag{display:flex;justify-content:center;align-items:center;width:fit-content;margin:0 auto 34px;padding:14px 30px;font-size:1rem;font-weight:800;letter-spacing:.5px;border-radius:999px;background:#fff;color:#0D7DFF;border:1px solid rgba(13,125,255,.18);box-shadow:0 8px 20px rgba(13,125,255,.08);}
.hero h1{font-size:clamp(2rem,3vw,3.1rem);line-height:1.15;letter-spacing:-2px;font-weight:600;margin-bottom:22px;}
.hero p{max-width:980px;margin:0 auto;font-size:1.42rem;font-weight:600;line-height:1.75;color:#3d4655;}
.hero-buttons{display:flex;gap:18px;justify-content:center;flex-wrap:wrap;margin:46px 0 60px}
.hero-video{max-width:1300px;margin:0 auto;border-radius:var(--radius);overflow:hidden;background:#fff;padding:14px;box-shadow:var(--shadow)}
.hero-video video{width:100%;display:block;border-radius:16px}
.scroll-indicator{margin-top:40px;color:var(--text-light);animation:float 2s infinite}
.scroll-indicator span{display:block;width:2px;height:34px;background:var(--primary);margin:0 auto 10px}
.benefits{padding:100px 0}
.benefits .container{display:grid;grid-template-columns:repeat(4,1fr);gap:24px}
.benefit-card{background:rgba(255,255,255,.72);backdrop-filter:blur(20px);border:1px solid rgba(255,255,255,.7);border-radius:24px;padding:36px;box-shadow:var(--shadow);transition:.35s}
.benefit-card:hover{transform:translateY(-8px)}
.benefit-card h3{margin-bottom:18px;font-size:1.65rem;font-weight:800;line-height:1.35;}
.benefit-card p{font-size:1.25rem;font-weight:550;line-height:1.8;color:#475569;}
.placeholder,.cta{padding:100px 0;text-align:center}
.footer{padding:20px 0 10px;text-align:center;background:rgba(255,255,255,.82);backdrop-filter:blur(15px);border-top:1px solid rgba(20,121,255,.08);}
.footer img{height:50px;width:auto;display:block;margin:0 auto 2px;}
.footer-location{font-size:1.25rem;font-weight:700;color:#334155;margin:0 0 2px;}
.footer-email{display:inline-block;font-size:1.22rem;font-weight:800;color:#1479ff;text-decoration:none;margin-bottom:8px;transition:.3s;}
.footer-email:hover{color:#0f5fd1;}
.footer-links{display:flex;justify-content:center;gap:36px;margin-bottom:28px;flex-wrap:wrap;}
.footer-links a{font-size:1rem;font-weight:700;color:#64748b;text-decoration:none;transition:.3s;}
.footer-links a:hover{color:#1479ff;}
.footer-copy{font-size:1rem;font-weight:600;color:#94a3b8;margin-top:6px;}
.footer-text{font-size:1.08rem;font-weight:600;color:#64748b;margin-bottom:8px;}
.menu-toggle{display:none;background:none;border:none}
.menu-toggle span{display:block;width:26px;height:3px;background:#222;margin:5px 0;border-radius:99px}
@keyframes float{50%{transform:translateY(8px)}}
/*=========================
TABLETS
=========================*/

@media (max-width:1024px){

.header{
height:74px;
}

.header .container{
grid-template-columns:1fr auto;
padding:0 20px;
}

.logo img{
height:68px;
}

.nav{
display:none;
}

.btn-header{
display:none;
}

.menu-toggle{
display:block;
justify-self:end;
}

.hero{
padding:130px 0 60px;
}

.hero h1{
font-size:2rem;
line-height:1.15;
letter-spacing:-1px;
}

.hero p{
font-size:1.2rem;
line-height:1.8;
padding:0 20px;
}

.hero-video{
padding:10px;
}

.benefits .container{
grid-template-columns:repeat(2,1fr);
gap:22px;
}

}


/*=========================
CELULARES
=========================*/

@media (max-width:768px){

.container{
width:min(calc(100% - 28px),100%);
}

.hero{
padding:110px 0 50px;
}

.hero h1{
font-size:2rem;
line-height:1.12;
letter-spacing:-1px;
}

.hero p{
font-size:1.08rem;
line-height:1.75;
padding:0 6px;
}

.hero-video{
padding:8px;
margin-top:35px;
}

.hero-buttons{
flex-direction:column;
gap:15px;
}

.btn-primary,
.btn-secondary{
width:100%;
}

.benefits{
padding:70px 0;
}

.benefits .container{
grid-template-columns:1fr;
gap:20px;
}

.benefit-card{
padding:28px;
}

.benefit-card h3{
font-size:1.45rem;
}

.benefit-card p{
font-size:1.08rem;
}

.footer{
padding:30px 20px 15px;
}

.footer img{
height:42px;
}

.footer-location{
font-size:1.05rem;
}

.footer-email{
font-size:1.05rem;
}

.footer-text{
font-size:.98rem;
}

.footer-copy{
font-size:.92rem;
}

.whatsapp-float{
width:60px;
height:60px;
right:18px;
bottom:18px;
}

.whatsapp-float i{
font-size:34px;
}

}
.hidden{opacity:0;transform:translateY(40px);transition:opacity .7s ease,transform .7s ease;}
.show{opacity:1;transform:translateY(0);}

/* ===========================================================
   MÓDULO 2 - RECURSOS
=========================================================== */

.features{padding:50px 0;}

.section-title{text-align:center;max-width:900px;margin:0 auto 100px;}

.section-title span{display:inline-flex;align-items:center;justify-content:center;padding:20px 46px;min-height:78px;background:rgba(255,255,255,.88);border:1px solid rgba(20,121,255,.10);border-radius:999px;color:#1479ff;font-size:1.60rem;font-weight:800;letter-spacing:1px;text-transform:uppercase;box-shadow:0 12px 30px rgba(20,121,255,.08);margin-bottom:42px;}

.section-title h2{font-size:3rem;font-weight:800;line-height:1.12;letter-spacing:-2px;margin-bottom:34px;color:#1f2937;}

.section-title p{font-size:1.80rem;font-weight:600;line-height:1.85;color:#526070;max-width:1100px;margin:0 auto;}

.feature{display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:80px;margin-bottom:140px;}

.feature.reverse .feature-text{order:2;}

.feature.reverse .feature-image{order:1;}

.feature-number{display:inline-flex;align-items:center;justify-content:center;width:82px;height:82px;background:linear-gradient(135deg,#1479ff,#43a1ff);color:#fff;font-size:2rem;font-weight:800;border-radius:50%;margin-bottom:30px;box-shadow:0 20px 45px rgba(20,121,255,.30);}

.feature-text h3{font-size:2.6rem;font-weight:800;line-height:1.2;margin-bottom:28px;color:#1f2937;}

.feature-text p{font-size:1.35rem;line-height:1.9;color:#5f6978;}

.feature-image{display:flex;justify-content:center;align-items:center;}

.mockup{background:#fff;border-radius:26px;padding:16px;border:1px solid rgba(20,121,255,.08);box-shadow:0 30px 80px rgba(15,35,95,.12);transition:.35s ease;overflow:hidden;}

.mockup:hover{transform:translateY(-10px);box-shadow:0 45px 90px rgba(15,35,95,.18);}

.mockup img{display:block;width:100%;max-width:760px;border-radius:18px;}

@media(max-width:1100px){.feature{grid-template-columns:1fr;gap:50px;margin-bottom:100px;}.feature.reverse .feature-text,.feature.reverse .feature-image{order:initial;}.section-title h2{font-size:2.4rem;}.feature-text h3{text-align:center;}.feature-text p{text-align:center;}.feature-number{margin:0 auto 28px;}.feature-image{margin-top:10px;}}

@media(max-width:768px){.features{padding:90px 0;}.section-title{margin-bottom:70px;}.section-title h2{font-size:2rem;}.section-title p{font-size:1.05rem;}.feature-text h3{font-size:1.7rem;}.feature-text p{font-size:1.05rem;}.mockup{padding:10px;border-radius:18px;}}

/*==================================================
MÓDULO 3 - COMO FUNCIONA
==================================================*/

.workflow{padding:50px 0;}

.workflow-grid{display:grid;grid-template-columns:repeat(7,auto);justify-content:center;align-items:flex-start;gap:35px;margin-top:90px;}

.workflow-item{text-align:center;width:300px;}

.workflow-icon{width:120px;height:120px;border-radius:50%;background:linear-gradient(135deg,#0D7DFF,#45A8FF);color:#fff;font-size:3rem;font-weight:800;display:flex;align-items:center;justify-content:center;margin:0 auto 35px;box-shadow:0 25px 55px rgba(13,125,255,.28);}

.workflow-item h3{font-size:2.1rem;font-weight:900;margin-bottom:22px;color:#18212f;text-shadow:0 1px 1px rgba(255,255,255,.35);}

.workflow-item p{font-size:1.22rem;font-weight:700;line-height:1.85;color:#344155;text-shadow:0 1px 1px rgba(255,255,255,.30);}

.workflow-arrow{font-size:4rem;color:#1479ff;font-weight:800;margin-top:38px;}

@media(max-width:1200px){.workflow-grid{grid-template-columns:1fr;gap:50px;}.workflow-arrow{display:none;}.workflow-item{width:100%;max-width:450px;margin:auto;}}

/*=========================
FAQ
=========================*/

.faq{padding:50px 0;}

.faq-list{max-width:950px;margin:80px auto 0;}

.faq-item{background:#fff;border-radius:22px;box-shadow:0 15px 45px rgba(15,35,95,.08);margin-bottom:22px;overflow:hidden;border:1px solid rgba(20,121,255,.08);}

.faq-question{width:100%;background:none;border:none;padding:30px 35px;font-size:1.35rem;font-weight:800;color:#1f2937;display:flex;justify-content:space-between;align-items:center;text-align:left;cursor:pointer;}

.faq-question span{font-size:2rem;color:#1479ff;transition:.3s;}

.faq-answer{max-height:0;overflow:hidden;transition:max-height .35s ease;padding:0 35px;}

.faq-answer p{padding-bottom:30px;font-size:1.15rem;font-weight:600;line-height:1.9;color:#526070;}

.faq-item.active .faq-answer{max-height:300px;}

.faq-item.active .faq-question span{transform:rotate(45deg);}

/*=========================================
ANTES x DEPOIS
=========================================*/

.comparison{padding:100px 0;}

.comparison .section-title span{display:inline-block;padding:18px 42px;background:#eef6ff;color:#1479ff;font-size:1.35rem;font-weight:900;letter-spacing:1.2px;border-radius:999px;margin-bottom:35px;}

.comparison .section-title h2{font-size:3rem;font-weight:900;line-height:1.08;margin-bottom:28px;color:#1f2937;}

.comparison .section-title p{max-width:950px;margin:auto;font-size:1.5rem;font-weight:600;line-height:1.8;color:#5f6978;}

.comparison-grid{display:grid;grid-template-columns:1fr 1fr;gap:60px;margin-top:100px;}

.comparison-card{padding:70px 55px;background:#fff;border-radius:30px;box-shadow:0 25px 70px rgba(15,35,95,.10);transition:.35s ease;}

.comparison-card:hover{transform:translateY(-10px);box-shadow:0 35px 90px rgba(15,35,95,.16);}

.before{border-top:8px solid #ef4444;}

.after{border-top:8px solid #1479ff;}

.comparison-card h3{display:flex;align-items:center;justify-content:center;gap:16px;font-size:2.4rem;font-weight:900;margin-bottom:45px;}

.before h3{color:#ef4444;}

.after h3{color:#1479ff;}

.comparison-card ul{list-style:none;}

.comparison-card li{display:flex;align-items:center;gap:16px;padding:22px 0;font-size:1.35rem;font-weight:700;color:#334155;border-bottom:1px solid rgba(0,0,0,.08);}

.comparison-card li:last-child{border-bottom:none;}

.comparison-card li i{font-style:normal;font-size:1.45rem;width:34px;text-align:center;}

.before li i{color:#ef4444;}

.after li i{color:#1479ff;}

@media(max-width:900px){

.comparison{padding:100px 0;}

.comparison .section-title h2{font-size:2.7rem;}

.comparison .section-title p{font-size:1.15rem;}

.comparison-grid{grid-template-columns:1fr;gap:40px;}

.comparison-card{padding:45px 35px;}

.comparison-card h3{font-size:2rem;}

.comparison-card li{font-size:1.15rem;}

}

/*=========================================
CTA FINAL
=========================================*/

.cta-final{padding:140px 0;}

.cta-box{
background:linear-gradient(135deg,#1479ff,#4aa6ff);
border-radius:34px;
padding:90px 70px;
text-align:center;
color:#fff;
box-shadow:0 35px 90px rgba(20,121,255,.25);
}

.cta-tag{
display:inline-block;
padding:16px 34px;
background:rgba(255,255,255,.18);
border-radius:999px;
font-size:1.1rem;
font-weight:900;
letter-spacing:1px;
margin-bottom:30px;
}

.cta-box h2{
font-size:3.5rem;
font-weight:900;
line-height:1.15;
margin-bottom:30px;
}

.cta-box p{
max-width:900px;
margin:auto;
font-size:1.3rem;
line-height:1.8;
font-weight:500;
}

.cta-benefits{
display:flex;
justify-content:center;
gap:40px;
flex-wrap:wrap;
margin:45px 0 55px;
font-size:1.08rem;
font-weight:700;
}

.cta-buttons{
display:flex;
justify-content:center;
gap:24px;
flex-wrap:wrap;
}

.btn-whatsapp{
display:flex;
align-items:center;
justify-content:center;
gap:14px;
padding:18px 36px;
background:#25D366;
color:#fff;
text-decoration:none;
border-radius:999px;
font-size:1.12rem;
font-weight:800;
box-shadow:0 18px 45px rgba(37,211,102,.35);
transition:.3s;
}

.btn-whatsapp:hover{
background:#1EBE5A;
transform:translateY(-3px);
}

.btn-whatsapp svg{
flex-shrink:0;
}

.cta-buttons .btn-secondary{
padding:18px 36px;
border:2px solid rgba(255,255,255,.45);
color:#fff;
background:transparent;
}

.cta-buttons .btn-secondary:hover{
background:#fff;
color:#1479ff;
}

.hero-download{display:flex;justify-content:center;margin-top:30px;margin-bottom:25px;}

.whatsapp-float{
position:fixed;
right:28px;
bottom:28px;
width:72px;
height:72px;
border-radius:50%;
background:#25D366;
display:flex;
align-items:center;
justify-content:center;
text-decoration:none;
line-height:1;
box-shadow:0 15px 35px rgba(37,211,102,.45);
z-index:9999;
transition:.35s;
animation:whatsPulse 2s infinite;
}

.whatsapp-float:hover{
transform:scale(1.10);
}

.whatsapp-float i{
font-size:42px;
color:#fff;
line-height:1;
display:block;
}

@keyframes whatsPulse{

0%{
box-shadow:0 0 0 0 rgba(37,211,102,.55);
}

70%{
box-shadow:0 0 0 18px rgba(37,211,102,0);
}

100%{
box-shadow:0 0 0 0 rgba(37,211,102,0);
}

}

/*============================================
RESPONSIVIDADE
==============================================*/

/*=========================================
RESPONSIVIDADE - MÓDULO RECURSOS
=========================================*/

@media (max-width:1100px){

.feature{
grid-template-columns:1fr;
gap:50px;
margin-bottom:100px;
}

.feature{
    display:flex;
flex-direction:column;
}

.feature-text{
order:1;
}

.feature-image{
order:2;
}

.feature-text{
text-align:center;
}

.feature-number{
margin:0 auto 28px;
}

.feature-image{
margin-top:10px;
}

.feature.reverse .feature-text{
order:1 !important;
}

.feature.reverse .feature-image{
order:2 !important;
}

}

@media (max-width:768px){

.features{
padding:90px 0;
}

.feature{
gap:35px;
margin-bottom:70px;
}

.feature-number{
width:70px;
height:70px;
font-size:1.6rem;
}

.feature-text h3{
font-size:2rem;
}

.feature-text p{
font-size:1.15rem;
line-height:1.8;
}

.mockup{
padding:10px;
border-radius:18px;
}

.mockup img{
max-width:100%;
}

}

/*=========================
COMO FUNCIONA
=========================*/

@media (max-width:900px){

.workflow{
padding:90px 0;
}

.workflow-grid{
grid-template-columns:1fr;
gap:35px;
}

.workflow-arrow{
display:none;
}

.workflow-item{
text-align:center;
}

.workflow-icon{
margin:0 auto 20px;
}

.workflow-item h3{
font-size:1.8rem;
}

.workflow-item p{
font-size:1.08rem;
}

}

/*=========================
ANTES x DEPOIS
=========================*/

@media (max-width:900px){

.comparison{
padding:90px 0;
}

.comparison-grid{
grid-template-columns:1fr;
gap:30px;
}

.comparison-card{
padding:35px;
}

.comparison-card h3{
font-size:2.1rem;
}

.comparison-card li{
font-size:1.05rem;
padding:15px 0;
}

}

/*=========================
FAQ
=========================*/

@media (max-width:768px){

.faq{
padding:80px 0;
}

.faq-list{
margin-top:50px;
}

.faq-question{
padding:22px;
font-size:1.08rem;
}

.faq-question span{
font-size:1.7rem;
}

.faq-answer{
padding:0 22px;
}

.faq-answer p{
font-size:1rem;
padding-bottom:22px;
}

}

/*=========================
CTA FINAL
=========================*/

@media (max-width:768px){

.logo img{
height:42px;
}    

.cta{
padding:80px 0;
}

.cta-card{
padding:40px 25px;
}

.cta-box h2{
font-size:2rem;
line-height:1.25;
max-width:100%;
margin:auto auto 25px;
}

.cta-card p{
font-size:1.05rem;
}

.cta-buttons{
flex-direction:column;
gap:15px;
}

.cta-buttons a{
width:100%;
justify-content:center;
}

}

@media (max-width:768px){

.section-title{
margin-bottom:55px;
}

.section-title span{
font-size:1rem;
padding:14px 28px;
}

.section-title h2{
font-size:2.2rem;
line-height:1.2;
}

.section-title p{
font-size:1.08rem;
line-height:1.8;
}

.whatsapp-float{

width:50px;
height:50px;

bottom:15px;
right:15px;

}

.whatsapp-float i{
font-size:11px;
}

}

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

@media (max-width:1024px){

.nav{

position:fixed;

top:74px;

left:0;

width:100%;

background:#ffffffee;

backdrop-filter:blur(18px);

display:flex;

flex-direction:column;

align-items:center;

gap:30px;

padding:35px 0;

transform:translateY(-150%);

transition:.35s;

box-shadow:0 15px 40px rgba(0,0,0,.08);

z-index:999;

}

.nav.active{

transform:translateY(0);

}

.nav a{

font-size:1.2rem;

font-weight:800;

}

}

.menu-toggle{

cursor:pointer;

z-index:1001;

}

.menu-toggle span{

transition:.35s;

}

.menu-toggle.active span:nth-child(1){

transform:translateY(8px) rotate(45deg);

}

.menu-toggle.active span:nth-child(2){

opacity:0;

}

.menu-toggle.active span:nth-child(3){

transform:translateY(-8px) rotate(-45deg);

}