:root{
  --bg: #0f1115;
  --bg-alt: #151923;
  --card: #ffffffff;
  --text: #e7ecf3;
  --muted: #9aa8bf;
  --brand: #29a36a;
  --brand-2: #17d37e;
  --stroke: #283046;
  --shadow: 0 10px 30px rgba(0, 0, 0, 0.06);
}

*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0; font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,"Helvetica Neue",Arial;
  color:var(--text); background:var(--bg);
  line-height:1.6;
  overflow-x: hidden; /* 🔥 remove scroll lateral */
  width: 100%;
}

img{max-width:100%; display:block}
a{color:inherit; text-decoration:none}
.container{width:min(1100px,92%); margin-inline:auto}

.header{
  position:sticky; top:0; z-index:50;
  background:rgba(255, 255, 255, 1); backdrop-filter:saturate(140%) blur(10px);
  border-bottom:1px solid var(--stroke);}

.header__inner{display:flex; align-items:center; justify-content:space-between; gap:16px; padding:12px 0}
.brand{display:flex; gap:10px; align-items:center; font-weight:700}
.brand__logo{width:130px; height:auto; }
.brand__name{letter-spacing:.3px}

.nav{display:flex; gap:18px; align-items:center}
.nav a {
  color: #004d48de;
  font-weight: 700;
  padding: 8px 5px;
  border-radius: 10px;
  transition: background .2s ease, transform .2s ease, color .2s ease;}

.nav a:hover {
  background: #e5e5e5b9;
  color: #353535ff;
  transform: translateY(-1px);}

.nav__toggle{display:none; background:transparent; border:0; width:40px; height:40px}
.nav__toggle span{display:block; height:2px; background:#111; margin:7px 6px}

.hero--cover{
  padding:160px 0 160px; display: flex;  align-items: center;
  background: linear-gradient(0deg, rgba(0,0,0,.35), rgba(0,0,0,.35)), url("../img/capa-r18.jpg") center/cover no-repeat;
}

.hero__content{  width: 83%;  display: flex;  justify-content: flex-end; }
.hero__box{  max-width: 1000px;  background: rgba(0,0,0,.55);
  padding: 15px;  border-radius: 12px;  color: #fff;  text-align: left; }
.hero__box h1{  font-size: clamp(24px, 4vw, 40px);  line-height: 1.2;  margin: 0 0 20px; }

.hero__cta{display: flex;  gap: 14px;  flex-wrap: wrap;}
.btn{display:inline-block; padding: 10px 10px; border-radius: 8px; font-weight: 600; text-decoration:none; transition:.2s ease;}
.btn--primary{background: #25D366;  color: #fff;}
.btn--primary:hover{background: #1da955;}
.btn--ghost{border:1px solid #929292ff;  color: #fff;}
.btn--ghost:hover{background: #161616ff;  color: #fff;}

.section{color: #000000da;padding:40px 0; background:#fff; border-top:4px solid var(--stroke); border-bottom:4px solid var(--stroke)}
.section--alt{color: #ffffffff;padding:40px 0; background:#006837b0; border-top:1px solid var(--stroke); border-bottom:1px solid var(--stroke)}

.grid{display:grid; gap:16px}
.grid--2{grid-template-columns:1fr 1fr}
.grid--5{display:grid; grid-template-columns:repeat(5,1fr); gap:30px;}

.card{background: #fff; border:0; border-radius:16px; box-shadow:var(--shadow)}
.card--photo img{border-radius:16px;}
.cards{gap:20px}
.card.service {transition: transform 0.25s ease, box-shadow 0.25s ease;}
.card.service:hover {transform: translateY(-6px) scale(1.02);}

#sobre .card--photo, #sistema-eletrico .card--photo { margin-left:20px; margin-right:0;}
#manutencao-preparo-motor .card--photo { margin-left:0; margin-right:20px;}

.grid--2 { align-items:start; }
#manutencao-preparo-motor .card--photo, #sistema-eletrico .card--photo {
  align-self:start; padding:0; border-radius:16px; overflow:hidden;
}
#manutencao-preparo-motor .card--photo img, #sistema-eletrico .card--photo img {width:100%; height:auto; object-fit:cover;}
#manutencao-preparo-motor h2, #sistema-eletrico h2 { margin-top:40px; }
#manutencao-preparo-motor .card--photo, #sistema-eletrico .card--photo { margin-top:40px;}

#sobre figure{margin:0; display:flex; justify-content:flex-end;}
#sobre .card--photo { margin-top:40px;}

.icones-servico{ width:120px; height:auto; display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; margin:0 0 20px;}
.service{ display:flex; flex-direction:column; align-items:center; text-align:center; margin:0 0 50px; padding:15px}
.service h3{color:#000; margin:0 0 5px;}
.service p{margin:0; color:#141414ff}

.list-check{padding-left:0; list-style:none; margin:14px 0 0}
.list-check li{position:relative; padding-left:26px; margin:8px 0}
.list-check li::before{content:'✔'; position:absolute; left:0; top:0; opacity:.9; color:var(--brand-2); transform:translateY(2px);}

.accordion__group{margin:18px 0 26px}
details{background:var(--card); border:1px solid var(--stroke); border-radius:5px; padding:12px 15px; margin:10px 0; transition:transform .2s ease, border-color .2s ease;}
details[open]{transform:translateY(-1px); border-color:#2e3a5c}
summary{cursor:pointer; font-weight:600; margin:-4px 0 0px}
summary::-webkit-details-marker{display:none}
summary::after{content:'+'; float:right; transition:transform .2s}
details[open] summary::after{transform:rotate(45deg)}

/* Carrossel em faixa */
.ribbon-carousel{position:relative; width:100%; padding-top:4px; background:#283046; overflow:hidden;}
.ribbon__viewport{overflow:hidden; width:100%;}
.ribbon__track{display:flex; align-items:center; gap:5px; height:350px;}
.ribbon__item{height:350px; width:auto; object-fit:cover; flex:0 0 auto;}
.ribbon__btn{position:absolute; top:50%; transform:translateY(-50%); border:0; width:42px; height:42px; border-radius:50%; background:rgba(0,0,0,.5); color:#fff; font-size:22px; cursor:pointer; z-index:5;}
.ribbon__btn:hover{filter:brightness(1.2);}
.ribbon__btn.prev{left:12px;}
.ribbon__btn.next{right:12px;}

/* Contato */
.contato__grid{display:grid; grid-template-columns:1fr 1fr; gap:28px; align-items:start;}
#contato {background:#f0f0f0ff; color:#000000da; padding:40px 0;}
.pill{display:inline-block; padding:8px 14px; border-radius:999px; background:#fff; border:1px solid #e6e6e6; box-shadow:0 2px 8px rgba(0,0,0,.06); color:#111; font-weight:700; letter-spacing:.5px; margin-bottom:14px;}
.contato__label{margin:18px 0 6px; font-weight:700; color:#111;}
.contato__field{margin:0 0 8px; color:#222;}
.contato__field a{color:#111; text-decoration:underline;}
.contato__maplink{display:inline-block; margin-top:6px; font-size:14px;}
.btn.btn--whats{display:inline-flex; align-items:center; justify-content:center; gap:8px; padding:10px 16px; border-radius:20px; background:#25D366; color:#fff; font-weight:700; border:0; box-shadow:0 6px 18px rgba(37,211,102,.25); transition:transform .15s ease, filter .2s ease; margin-top:12px;}
.btn.btn--whats:hover{transform:translateY(-1px); filter:brightness(1.05);}
.contato__map{width:100%; aspect-ratio:16/11; background:#f2f2f2; border-radius:12px; overflow:hidden; border:1px solid #e6e6e6;}
.contato__map iframe{width:100%; height:100%; border:0;}

.footer{background:#111; color:#eee; padding:20px 0; font-size:14px; text-align:center;}
.footer__inner{display:flex; flex-direction:column; align-items:center; gap:12px;}
.footer__social{display:flex; gap:16px; justify-content:center;}
.footer__social a{display:inline-flex; align-items:center; justify-content:center; transition:transform .2s ease, filter .2s ease;}
.footer__social a:hover{transform:translateY(-2px); filter:brightness(1.2);}
.social-icon{width:36px; height:36px; display:block;}
.footer__text{line-height:1.4; color:#aaa;}
.footer__text p{margin:0;}
.fab-whatsapp{position:fixed; right:18px; bottom:18px; width:56px; height:56px; border-radius:50%; display:inline-grid; place-items:center; background:#25D366; box-shadow:var(--shadow); transition:transform .15s ease;}
.fab-whatsapp:hover{transform:translateY(-2px)}
.fab-whatsapp img{width:28px; height:28px; filter:drop-shadow(0 2px 4px rgba(0,0,0,.25))}

/* Tipografia fluida */
#sobre h2, #manutencao-preparo-motor h2, #sistema-eletrico h2 {
  font-size: clamp(22px, 2.6vw, 34px);
  line-height: 1.2;
}
#sobre p, #manutencao-preparo-motor p, #sistema-eletrico p,
#sobre li, #manutencao-preparo-motor li, #sistema-eletrico li {
  font-size: clamp(14px, 1.3vw, 17px);
  line-height: 1.65;
  max-width: 65ch;
}
#sobre .list-check li, #manutencao-preparo-motor .list-check li, #sistema-eletrico .list-check li {padding-left:26px;}
#sobre p + p, #manutencao-preparo-motor p + p, #sistema-eletrico p + p {margin-top:10px;}

/* Responsivo */
@media (max-width:1200px){.grid--5{grid-template-columns:repeat(4,1fr)}}
@media (max-width:900px){
  .grid--2{grid-template-columns:1fr}
  .grid--5{grid-template-columns:repeat(3,1fr)}
  .hero__inner{grid-template-columns:1fr; text-align:center}
  .nav{position:fixed; inset:60px 0 auto 0; background:#0f1115; padding:12px 4%; display:none; border-bottom:1px solid var(--stroke)}
  .nav.show{display:grid}
  .nav a{color:#fff;}
  .nav a:hover{background:rgba(255,255,255,0.12); color:#fff;}
  .nav__toggle{display:block}
}
@media (max-width:700px){
  .grid--5{grid-template-columns:repeat(2,1fr)}
  .contato__grid{grid-template-columns:1fr}
  .contato__map{aspect-ratio:16/12}
  #sobre .card--photo, #manutencao-preparo-motor .card--photo, #sistema-eletrico .card--photo {margin:0 auto; max-width:100%;}
  #sistema-eletrico .container{display:flex; flex-direction:column;}
  #sistema-eletrico .card--photo{order:-1; margin-bottom:20px;}
}
@media (max-width:500px){
  .grid--1{grid-template-columns:1fr}
  .grid--5{grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px;}
  .cards>.card, .service{min-width:0;}
  #sobre .card--photo, #manutencao-preparo-motor .card--photo, #sistema-eletrico .card--photo {margin:0 auto; max-width:100%;}
  .service h3 br{display:none;}
  .service h3{white-space:normal; overflow:hidden; overflow-wrap:anywhere; text-wrap:balance; text-align:center; margin:0 4px;}
  #sistema-eletrico .container{display:flex; flex-direction:column;}
  #sistema-eletrico .card--photo{order:-1; margin-bottom:20px;}
  #manutencao-preparo-motor h2 { margin-top:20px; }
  #sistema-eletrico h2 { margin-top:0px; }

  
}

.reveal{opacity:0; transform:translateY(8px); transition:opacity .5s ease, transform .5s ease}
.reveal.in{opacity:1; transform:none}