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

.container {
  width: 90%;
  margin: auto;
}

.header {
  background: linear-gradient(135deg, #03274a,#1a2f5f); /* rgba(23, 45, 95, 0.95);*/
  color: rgb(102, 22, 22);
  padding: 10px 0;
  position: sticky;
  top: 0;
  z-index: 1000;
  transition: all 0.4s ease;
  backdrop-filter: blur(6px);
}

.header.scrolled {
  padding: 8px 0;
  box-shadow: 0 6px 20px rgba(0, 0, 0, 0.55);
}

.header-content {
  display: flex;
  justify-content: space-between;
  align-items: center;
  min-height: 55px;
}

.logo {
  height: 90px;
  width: auto;
  display: block;
  transition: 0.5s;
}

.header.scrolled .logo {
  height: 40px;
}

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

.menu a {
  color:rgba(255, 255, 255, 0.95);
  text-decoration: none;
  font-size: 15px;
  position: relative;
  transition: 0.4s;
}

.menu a::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -3px;
  width: 0;
  height: 2px;
  background: #C10101;
  transition: 0.4s;
}

.menu a:hover::after {
  width: 100%;
}

.hero {
  background: linear-gradient(135deg, #03274a,#1a2f5f);
  color: white;
  padding: 60px 0;
  text-align: center;
}

.hero h2 {
  font-size: 26px;
  font-weight: 700;
}

.hero p {
  margin-top: 10px;
  font-size: 15px;
  opacity: 0.9;
}

.btn {
  display: inline-block;
  padding: 12px 25px;
  margin-top: 15px;
  background: #C10101;
  color: white;
  text-decoration: none;
  border-radius: 6px;
  font-weight: 600;
  transition: 0.4s;
}

.btn:hover {
  background:  #03274a;
}

.servicos {
  padding: 40px 0;
}

.cards {
  display: flex;
  flex-direction: column;
  gap: 15px;
  margin-top: 20px;
}

.card {
  background: white;
  border-radius: 12px;
  padding: 25px;
  box-shadow: 0 10px 25px rgba(0,0,0,0.08);
  transition: 0.3s;
}

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

.sobre {
  padding: 40px 0;
}

.cta {
  background: linear-gradient(135deg, #03274a,#1a2f5f);
  color: white;
  text-align: center;
  padding: 60px 20px;
}

.cta h2 {
  font-size: 24px;
  margin-bottom: 10px;
}

.cta p {
  margin-bottom: 20px;
  opacity: 0.9;
}

.cta .btn {
  background: #C10101;
  font-size: 16px;
  padding: 14px 28px;
}

.cta .btn:hover {
  background: #03274a;
}

.footer {
  background: linear-gradient(135deg, #03274a,#1a2f5f);
  color: rgb(0, 0, 0);
  text-align: center;
  padding: 15px;
}


.whatsapp {
  position: fixed;
  bottom: 20px;
  right: 20px;
  background: #25d366;
  color: white;
  font-size: 24px;
  padding: 15px;
  border-radius: 50%;
  text-decoration: none;
  box-shadow: 0 4px 10px rgba(0,0,0,0.2);
}

.modal{
display:none;
position:fixed;
inset:0;
background:rgba(0,0,0,.65);
z-index:999999;
align-items:center;
justify-content:center;
overflow:auto;
padding:30px;
}

.modal-content {
  background: white;
  width: 90%;
  max-width: 400px;
  margin: 10% auto;
  padding: 20px;
  border-radius: 10px;
  text-align: center;
  position: relative;
}

.modal-content input,
.modal-content textarea {
  width: 100%;
  margin: 10px 0;
  padding: 10px;
  border: 1px solid #ccc;
  border-radius: 5px;
}

.modal-content button {
  background: #03274a;
  color: white;
  border: none;
  padding: 12px;
  width: 100%;
  border-radius: 5px;
  cursor: pointer;
}

.close {
  position: absolute;
  top: 10px;
  right: 15px;
  font-size: 22px;
  cursor: pointer;
}

.menu-toggle {
  display: none;
  font-size: 24px;
  cursor: pointer;
}

.diferenciais {
  background: #f1f5f9;
  text-align: center;
}

.itens {
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.item h3 {
  font-size: 20px;
  color: #03274a;
}

.item p {
  color: #555;
}

.hero-buttons {
  display: flex;
  flex-direction: column;
  gap: 10px;
  align-items: center;
}

.btn-secondary {
  background: transparent;
  border: 2px solid#03274a;
  color: #03274a;
}

.btn-secondary:hover {
  background: #03274a;
  color: white;
}

.btn i {
  margin-right: 8px;
}

.card i {
  font-size: 30px;
  color: #C10101;
  margin-bottom: 10px;
}

.contato {
  background: #f1f5f9;
}

.contato-grid {
  display: flex;
  flex-direction: column;
  gap: 20px;
  margin-top: 20px;
}

.info p {
  margin-bottom: 10px;
}

.reveal {
  opacity: 0;
  transform: translateY(40px);
  transition: all 0.6s ease;
}

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

.folder-nav a{
text-decoration:none;
font-size:13px;
font-weight:700;
letter-spacing:.5px;
color:#031d3b;
transition:.3s ease;
}


@media (max-width: 768px) {
  .menu {
    display: none;
    flex-direction: column;
    background:#03274a;
    position: absolute;
    top: 60px;
    right: 0;
    width: 200px;
    padding: 15px;
  }

  .menu.active {
    display: flex;
  }

  .menu-toggle {
    display: block;
  }
}

@media (min-width: 768px) {
  .cards {
    flex-direction: row;
  }

  .itens {
    flex-direction: row;
    justify-content: space-around;
  }

  .hero-buttons {
    flex-direction: row;
    justify-content: center;
  }

  .contato-grid {
    flex-direction: row;
    position: relative;
  }

  .contato-grid::before {
    content: "";
    position: absolute;
    left: 50%;
    top: 0;
    width: 1px;
    height: 100%;
    background: #e2e8f0;
  }

  .info, .mapa {
    width: 50%;
    padding: 0 20px;
  }
}

@media (min-width: 1024px) {
  .hero h2 {
    font-size: 32px;
  }
}

.servicos-premium{
  padding:60px 0;
  background:#f8fafc;
}

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

.service-card{
  background:white;
  border-radius:18px;
  padding:28px;
  box-shadow:0 10px 25px rgba(0,0,0,.08);
  border-top:4px solid #C10101;
  transition:.35s;
}

.service-card:hover{
  transform:translateY(-6px);
  box-shadow:0 20px 45px rgba(0,0,0,.12);
}

.service-card i{
  font-size:34px;
  color:#C10101;
  margin-bottom:18px;
}

.service-card h3{
  color:#03274a;
  margin-bottom:18px;
  font-size:24px;
}

.service-card h4{
  color:#03274a;
  margin-top:18px;
  margin-bottom:10px;
  font-size:17px;
}

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

.service-card ul li{
  padding:6px 0;
  color:#475569;
  border-bottom:1px solid #e2e8f0;
}

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

.service-card ul li::before{
  content:"✔";
  color:#C10101;
  margin-right:8px;
  font-weight:bold;
}

.hero p{
  max-width:700px;
  margin:auto;
  margin-top:12px;
}

@media(max-width:768px){
.service-card{
  padding:22px;
}

.service-card h3{
  font-size:21px;
}
}

.servicos-hero{
background:linear-gradient(135deg,#031b35,#062b4f);
}

.escopo-section{
padding:70px 0;
background:#ffffff;
}

.manutencao-bg{
background:#f8fafc;
}

.escopo-title{
text-align:center;
margin-bottom:40px;
}

.escopo-title h2{
font-size:42px;
color:#031b35;
margin-bottom:10px;
font-weight:800;
}

.escopo-title p{
color:#64748b;
font-size:16px;
}

.escopo-grid{
display:grid;
grid-template-columns:repeat(2,1fr);
gap:28px;
}

.escopo-card{
background:white;
border-radius:18px;
padding:28px;
box-shadow:0 10px 30px rgba(0,0,0,.08);
border-top:4px solid #C10101;
transition:.35s;
}

.escopo-card:hover{
transform:translateY(-6px);
box-shadow:0 18px 45px rgba(0,0,0,.12);
}

.escopo-card i{
font-size:34px;
color:#C10101;
margin-bottom:18px;
}

.escopo-card h3{
font-size:28px;
color:#031b35;
margin-bottom:20px;
line-height:1.2;
}

.escopo-card ul{
list-style:none;
padding:0;
margin:0;
}

.escopo-card ul li{
padding:8px 0;
border-bottom:1px solid #e2e8f0;
color:#334155;
}

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

.escopo-card ul li::before{
content:"✔";
color:#C10101;
font-weight:bold;
margin-right:8px;
}

@media(max-width:768px){

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

.escopo-title h2{
font-size:30px;
}

.escopo-card{
padding:22px;
}

.escopo-card h3{
font-size:22px;
}

}

.folder-page{
background:#fff;
position:relative;
overflow:hidden;
min-height:100vh;
padding-top:120px;
font-family:'Inter',sans-serif;
}

.folder-curve{
position:absolute;
top:0;
left:0;
width:200px;
height:220px;
background:linear-gradient(
135deg,
#031d3b 0%,
#0a3b73 100%
);
clip-path:polygon(
0 0,
100% 0,
65% 35%,
0 100%
);
z-index:30;
pointer-events:none;
}

.folder-header{
position:fixed;
top:0;
left:0;
width:100%;
height:110px;
background:#fff;
z-index:20;
box-shadow:0 2px 12px rgba(0,0,0,.04);
}

.folder-nav{
display:flex;
align-items:center;
justify-content:center;
gap:28px;
height:100%;
position:relative;
z-index:25;
}


.folder-logo{
margin:0 42px;
}

.folder-nav a{
text-decoration:none;
font-size:13px;
font-weight:700;
letter-spacing:.5px;
color:#031d3b;
transition:.3s ease;
}

.folder-logo{
position:relative;
display:flex;
flex-direction:column;
align-items:center;
justify-content:center;
z-index:50;
transition:.35s ease;
}

.folder-logo.small-logo{
transform:scale(.68);
}

.folder-logo-img{
width:210px;
transition:.35s ease;
animation:floatLogo 4s ease-in-out infinite;
background:transparent !important;
mix-blend-mode:multiply;
}

.folder-logo.small-logo .folder-logo-img{
width:150px;
}

.folder-logo p{
font-size:13px;
margin-top:2px;
color:#333;
}

.folder-logo.small-logo p{
font-size:11px;
}

.folder-hero{
padding:90px 20px 70px;
text-align:center;
position:relative;
overflow:hidden;
}

.folder-hero h1{
font-size:52px;
font-weight:900;
line-height:1.05;
color:#031d3b;
margin-bottom:10px;
}

.folder-hero p{
font-size:18px;
line-height:1.7;
max-width:680px;
margin:auto;
color:#444;
}

.folder-content{
max-width:1320px;
margin:auto;
padding:90px 30px;
}

.folder-content h2{
position:relative;
font-size:40px;
font-weight:900;
text-align:center;
margin-bottom:60px;
color:#032B56;
letter-spacing:1px;
}
.folder-content h2 span{
color:#0B4EA2;
}

.folder-content h2::after{
    content:"";
    display:block;
    width:90px;
    height:4px;
    margin:18px auto 0;
    border-radius:30px;
    background:#0B4EA2;
}

.folder-content h2 span{
color:#c10101;
}

.folder-grid{
display:grid;
grid-template-columns:repeat(3,1fr);
margin-bottom:55px;
}

/*==================================================
  CARDS PREMIUM
==================================================*/

.folder-grid{

display:grid;
grid-template-columns:repeat(auto-fit,minmax(280px,1fr));
gap:28px;
margin-top:45px;

}

.folder-card{
position:relative;
background:#fff;
border-radius:22px;
padding:28px 26px;
overflow:hidden;
border:1px solid #edf2f7;
box-shadow:
0 8px 25px rgba(0,0,0,.05);
transition:
transform .35s ease,
box-shadow .35s ease,
border-color .35s ease;
display:flex;
flex-direction:column;
justify-content:space-between;
min-height:250px;
}

.folder-card::before{
content:"";
position:absolute;
top:0;
left:0;
width:100%;
height:6px;
background:#0B4EA2;
}

.folder-card:hover{
transform:translateY(-10px);
box-shadow:
0 18px 45px rgba(0,0,0,.12);
border-color:#0B4EA2;
}

.folder-icons{
display:flex;
justify-content:center;
align-items:center;
gap:14px;
margin-bottom:24px;
font-size:42px;
color:#0B4EA2;
transition:.35s;
}
.folder-card:hover .folder-icons{
transform:scale(1.08);
}

.folder-card h3{
font-size:20px;
font-weight:800;
text-align:center;
color:#032B56;
margin-bottom:18px;
line-height:1.3;
}

.folder-card p{
font-size:15px;
line-height:1.8;
text-align:center;
color:#5f6b7a;
margin-bottom:28px;
flex:1;
}

.folder-btn{
display:flex;
justify-content:center;
align-items:center;
width:46px;
height:46px;
margin:auto;
border-radius:50%;
background:#0B4EA2;
color:#fff;
font-size:18px;
transition:.35s;
}
.folder-card:hover .folder-btn{
transform:translateX(6px);
background:#032B56;
}

.folder-icons{
display:flex;
gap:12px;
font-size:48px;
color:#031d3b;
margin-bottom:16px;
flex-wrap:wrap;
}

.folder-card h3{
font-size:19px;
line-height:1.15;
font-weight:900;
color:#c10101;
margin-bottom:14px;
}

.folder-card p{
font-size:15px;
line-height:1.5;
color:#333;
max-width:90%;
}

.folder-btn{
margin-top:16px;
width:36px;
height:36px;
border-radius:50%;
background:#031d3b;
display:flex;
align-items:center;
justify-content:center;
color:#fff;
font-size:16px;
}

.maintenance-title{
margin-top:40px;
}

/* FOOTER */
.folder-footer{
background:#031d3b;
padding:34px 5%;
display:grid;
grid-template-columns:repeat(4,1fr);
gap:20px;
align-items:center;
border-top-left-radius:70px;
color:#fff;
}

.footer-box{
display:flex;
align-items:center;
gap:14px;
}

.footer-box i{
font-size:30px;
}

.footer-box h4{
font-size:18px;
margin-bottom:4px;
}

.footer-box p{
font-size:15px;
line-height:1.5;
}

/* DOTS */
.folder-dots{
position:absolute;
width:120px;
height:120px;
background-image:radial-gradient(#031d3b 2px, transparent 2px);
background-size:18px 18px;
}

.top-dots{
top:120px;
right:70px;
}

.bottom-dots{
bottom:90px;
right:70px;
}

/* ANIMAÇÃO */
@keyframes floatLogo{
0%{transform:translateY(0px);}
50%{transform:translateY(-8px);}
100%{transform:translateY(0px);}
}

/* TABLET */
@media(max-width:1024px){

.folder-grid{
grid-template-columns:repeat(2,1fr);
}

.folder-footer{
grid-template-columns:repeat(2,1fr);
}

}

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

.folder-page{
padding-top:100px;
}


.folder-nav a{
font-size:11px;
}

.folder-logo.small-logo{
transform:scale(.82);
}

.folder-logo-img{
width:150px;
}

.folder-logo.small-logo .folder-logo-img{
width:120px;
}

.folder-hero h1{
font-size:30px;
}

.folder-hero p{
font-size:15px;
}

.folder-content h2{
font-size:24px;
}

.folder-grid{
grid-template-columns:1fr;
}

.folder-card{
min-height:auto;
padding:20px;
}

.folder-icons{
font-size:40px;
}

.folder-card h3{
font-size:22px;
}

.folder-card p{
font-size:15px;
max-width:100%;
}

.folder-footer{
grid-template-columns:1fr;
border-top-left-radius:35px;
}

.folder-curve{
position:absolute;
top:0;
left:0;
width:60px;
height:70px;
background:linear-gradient(
135deg,
#031d3b 0%,
#0a3b73 100%
);
clip-path:polygon(
0 0,
100% 0,
65% 35%,
0 100%
);
z-index:30;
pointer-events:none;
}

.folder-dots{
display:none;
}

}

/* RESPONSIVIDADE ORIGINAL */
/* TABLET */
@media (max-width: 1024px){

  .container{
    width: 94%;
  }

  .header-content{
    gap: 20px;
  }

  .hero{
    padding: 50px 20px;
  }

  .hero h2{
    font-size: 24px;
  }

}


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

  html,
  body{
    overflow-x: hidden;
  }

  .container{
    width: 95%;
  }

  /* HEADER */
  .header{
    padding: 12px 0;
  }

  .header-content{
    flex-direction: column;
    justify-content: center;
    gap: 12px;
    text-align: center;
  }

  .logo{
    height: 70px;
  }

  .header.scrolled .logo{
    height: 50px;
  }

  /* MENU */
  .menu{
    flex-wrap: wrap;
    justify-content: center;
    gap: 12px;
  }

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

  /* HERO */
  .hero{
    padding: 45px 15px;
  }

  .hero h2{
    font-size: 22px;
    line-height: 1.3;
  }

  .hero p{
    font-size: 14px;
    line-height: 1.6;
  }

  /* BOTÕES */
  .btn{
    width: 100%;
    max-width: 320px;
    text-align: center;
  }

  /* CARDS */
  .card{
    padding: 20px;
  }

  /* CTA */
  .cta{
    padding: 45px 15px;
  }

  .cta h2{
    font-size: 22px;
  }

  .cta p{
    font-size: 14px;
  }

  /* MODAL */
  .modal-content{
    width: 95%;
    margin-top: 25%;
  }

}


/* CELULARES PEQUENOS */
@media (max-width: 480px){

  .logo{
    height: 60px;
  }

  .header.scrolled .logo{
    height: 42px;
  }

  .menu{
    gap: 10px;
  }

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

  .hero h2{
    font-size: 20px;
  }

  .hero p{
    font-size: 13px;
  }

  .card{
    padding: 18px;
  }

  .whatsapp{
    right: 15px;
    bottom: 15px;
    font-size: 22px;
    padding: 13px;
  }

}



/* MOBILE - SEM LOGO SCROLL */
@media(max-width:768px){
.folder-logo.small-logo{
transform:none !important;
}

.folder-logo.small-logo .folder-logo-img{
width:140px !important;
}
}


/* =========================================================
   MOBILE FINAL ESTÁVEL
========================================================= */

.mobile-logo{
display:none;
}

.mobile-title{
display:none;
}

.menu-toggle{
display:none;
}

@media(max-width:768px){

html,
body{
overflow-x:hidden;
}

/* HEADER */

.folder-header{
height:80px;
display:flex;
align-items:center;
justify-content:center;
}


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

.mobile-menu-panel{
position:fixed;
top:80px;
left:0;
width:100%;
height:calc(100vh - 80px);
background:#ffffff;
display:flex;
flex-direction:column;
align-items:center;
justify-content:flex-start;
gap:18px;
padding:40px 24px;
z-index:999990;
overflow-y:auto;
opacity:0;
visibility:hidden;
transform:translateY(-20px);
transition:
opacity .3s ease,
transform .3s ease,
visibility .3s;
box-shadow:
0 14px 40px rgba(0,0,0,.08);
border-top:
1px solid rgba(3,39,74,.06);
}

.mobile-menu-panel.active{
opacity:1;
visibility:visible;
transform:translateY(0);
}


/* ESCONDE LOGO DESKTOP */
.folder-nav .folder-logo{
display:none;
}


/* =========================================================
   HAMBURGER PREMIUM
========================================================= */

.menu-toggle{
display:flex;
flex-direction:column;
justify-content:center;
align-items:center;
gap:5px;
position:fixed;
top:22px;
right:16px;
width:38px;
height:38px;
background:#fff;
border-radius:10px;
cursor:pointer;
z-index:1000000;
transition:.3s ease;
box-shadow:
0 4px 12px rgba(0,0,0,.12);
}


/* BARRAS */

.menu-toggle span{
display:block;
width:20px;
height:2px;
background:#03274a;
border-radius:10px;
transition:.35s ease;
}


/* LOGO MOBILE */
.mobile-logo{
display:flex !important;
align-items:center;
justify-content:flex-start;
position:fixed;
top:12px;
left:8px;
transform:none !important;
z-index:1000001;
}

.mobile-logo img{
width:125px !important;
animation:floatLogo 4s ease-in-out infinite;
}


/* ESCONDER AO ABRIR MENU */

body.menu-open .mobile-logo{
opacity:0;
pointer-events:none;
transition:.3s ease;
}

/* TITLE */

.mobile-title{
display:block;
color:#fff;
font-size:14px;
font-weight:800;
letter-spacing:3px;
opacity:.55;
margin-bottom:18px;
}

/* REMOVE SHRINK */

.folder-logo.small-logo{
transform:none !important;
}

.folder-logo.small-logo .folder-logo-img{
width:140px !important;
}
}

/* REMOVE CURVA AZUL MOBILE */
@media(max-width:768px){
.folder-curve{
display:none;
}
}

.menu-toggle:hover{
transform:scale(1.05);
}

.menu-toggle:active{
transform:scale(.95);
}


/* =========================================================
   ANIMAÇÃO MENU
========================================================= */

.menu-toggle.active span:nth-child(1){
transform:
translateY(7px)
rotate(45deg);
}

.menu-toggle.active span:nth-child(2){
opacity:0;
}

.menu-toggle.active span:nth-child(3){
transform:
translateY(-7px)
rotate(-45deg);
}

.mobile-menu-panel a{
display:flex;
align-items:center;
justify-content:center;
width:100%;
max-width:340px;
padding:16px 20px;
border-radius:14px;
background:#f5f7fb;
color:#03274a;
font-size:17px;
font-weight:700;
text-decoration:none;
transition:.3s ease;
border:1px solid rgba(3,39,74,.06);
}

.mobile-menu-panel a:hover{
background:#03274a;
color:#ffffff;
transform:translateY(-2px);
}


/* =========================================================
   MOBILE NAV CONTROL
========================================================= */

.mobile-menu-panel{
display:none;
}

@media(max-width:768px){

.mobile-menu-panel{
display:flex;
}

.folder-nav a{
display:none;
}


}