:root{--navy:#0a2f6f;--blue:#1267dc;--blue2:#0093dd;--ink:#0c1f3f;--muted:#48617f;--line:#dfe5ec;--green:#20a84a;--purple:#8b1fd2;--orange:#ff7a00;--white:#fff;--soft:#eff6ff;--shadow:0 8px 22px rgba(24,52,89,.14)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:"Segoe UI",Arial,sans-serif;background:#f4f6f8;color:var(--ink)}a{text-decoration:none;color:inherit}button{font:inherit}img{display:block;max-width:100%}.page{width:min(1440px,calc(100% - 24px));margin:12px auto;background:#fff;border-radius:22px;overflow:hidden;box-shadow:0 8px 30px rgba(17,35,60,.12)}
.topbar{height:108px;display:flex;align-items:center;justify-content:space-between;padding:0 54px;border-bottom:1px solid #e6e9ee;background:rgba(255,255,255,.97);position:relative;z-index:10}.brand img{width:205px;height:82px;object-fit:cover;object-position:left center}.nav{display:flex;gap:38px;align-items:center;font-weight:700}.nav a{display:flex;align-items:center;gap:8px;padding:37px 0 30px;border-bottom:3px solid transparent}.nav a.active{color:var(--blue);border-color:var(--blue)}.menu-btn{display:none;border:0;background:none;font-size:29px;color:var(--navy)}.mobile-menu{display:none}
.hero{min-height:470px;display:grid;grid-template-columns:48% 52%;position:relative;background:#fff}.hero-copy{padding:58px 0 30px 60px;position:relative;z-index:2;background:linear-gradient(90deg,#fff 0%,#fff 72%,rgba(255,255,255,.96) 88%,rgba(255,255,255,.25) 100%)}.hero-copy h1{font-size:54px;line-height:1;margin:0;color:var(--navy);letter-spacing:-2px}.hero-copy h1 span{color:var(--blue)}.hero-copy h2{font-size:28px;margin:10px 0 0;color:#182b49}.accent-line{width:64px;height:4px;background:linear-gradient(90deg,var(--blue),#5cc8ff);margin:28px 0}.hero-lead{font-size:23px;line-height:1.35;margin:0 0 26px}.trust-items{display:flex;gap:54px}.trust-item{display:flex;align-items:center;gap:14px;font-size:16px;line-height:1.25;color:#0b397c}.round-icon{width:54px;height:54px;border-radius:50%;display:grid;place-items:center;background:#eff7ff;border:1px solid #cfe4ff}.round-icon svg{width:30px;height:30px}.round-icon.blue{color:#0c5ed2}.hero-photo{background-image:url("assets/hero-ssp-agua-boa-1x1.png");background-size:cover;background-position:center 40%;position:relative}.hero-photo:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(255,255,255,.2),transparent 28%)}
.services{position:relative;margin-top:-8px;padding:0 34px 14px;z-index:3}.section-title{display:flex;align-items:center;justify-content:center;gap:15px;margin-bottom:14px}.section-title span{width:22px;height:2px;background:#1770df}.section-title b{font-size:15px}.service-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;max-width:740px}.service-card{background:#fff;border:1px solid #dfe4e9;border-radius:14px;padding:18px 18px 16px;text-align:center;box-shadow:var(--shadow);min-height:160px}.service-icon{width:45px;height:45px;margin:0 auto 7px;display:grid;place-items:center}.service-icon svg{width:40px;height:40px}.service-icon.filter{color:#1767d8}.service-icon.preventive{color:#24ad51}.service-icon.corrective{color:#ff7a00}.service-card h3{margin:0 0 8px;font-size:15px;color:#0b2f70}.service-card p{margin:0;color:#1e2c40;font-size:13px;line-height:1.45}
.contacts{padding:6px 34px 0}.contact-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:15px;max-width:1000px}.action{border:0;border-radius:10px;color:#fff;min-height:72px;padding:10px 18px;display:grid;grid-template-columns:46px 1fr 18px;align-items:center;text-align:left;box-shadow:0 7px 16px rgba(18,62,118,.18);cursor:pointer;transition:transform .18s,filter .18s}.action:hover{transform:translateY(-2px);filter:brightness(1.03)}.action-icon{width:40px;height:40px;display:grid;place-items:center}.action-icon svg{width:34px;height:34px}.action b,.action small{display:block}.action b{font-size:16px}.action small{font-size:12px;margin-top:2px}.action i{font-style:normal;font-size:30px;font-weight:200}.whatsapp{background:linear-gradient(135deg,#1ca13e,#25b34e)}.call{background:linear-gradient(135deg,#1264df,#0f99dc)}.email{background:linear-gradient(135deg,#8b20cf,#a827d9)}.pix{background:linear-gradient(135deg,#ff7b00,#ff8c09)}
.secondary-row{display:flex;gap:18px;justify-content:center;margin:16px 0}.secondary-btn{border:1px solid #dfe4eb;background:#fff;border-radius:9px;padding:10px 28px;min-width:220px;color:#0b2f70;box-shadow:0 4px 12px rgba(22,47,79,.08);cursor:pointer}.bottom-tools{display:grid;grid-template-columns:1fr 320px;gap:20px;align-items:stretch}.site-link{display:grid;grid-template-columns:50px 1fr 30px;align-items:center;border-radius:10px;background:linear-gradient(90deg,#eaf4ff,#f7fbff);padding:14px 20px;border:1px solid #dce9f8}.site-icon{font-size:34px;color:#0a55bf}.site-link b,.site-link small{display:block}.site-link b{color:#0b50b8}.site-link small{font-size:12px;margin-top:4px;color:#23476f}.site-link i{font-size:33px;font-style:normal;color:#0b55c0}.qr-box{border:1px solid #e2e5e9;border-radius:10px;padding:10px 14px;display:grid;grid-template-columns:78px 1fr 36px;align-items:center;gap:10px}.qr-box img{width:72px;height:72px}.qr-box p{font-size:12px;line-height:1.4;margin:0}.phone-dot{width:36px;height:36px;border-radius:50%;display:grid;place-items:center;border:1px solid #d5dce5;color:#0c3c81}
footer{margin-top:0;position:relative;background:#073b82;color:#fff}.wave{height:42px;background:linear-gradient(178deg,transparent 0 43%,#0b56b6 44% 53%,#073b82 54%);position:relative}.wave:before{content:"";position:absolute;left:0;right:0;top:10px;height:18px;background:radial-gradient(90px 18px at 7% 100%,#39bdf0 0 17%,transparent 18%),radial-gradient(120px 22px at 20% 100%,#0e8ddb 0 18%,transparent 19%)}.footer-content{height:72px;display:flex;align-items:center;justify-content:center;gap:34px}.footer-content strong{font-size:14px}.footer-content span{width:1px;height:25px;background:rgba(255,255,255,.55)}.footer-content p{margin:0;font-size:14px}
.modal-backdrop{position:fixed;inset:0;background:rgba(9,28,56,.45);backdrop-filter:blur(5px);z-index:100;display:grid;place-items:center;padding:18px}.modal-backdrop[hidden]{display:none}.pix-modal{width:min(360px,100%);background:#fff;border-radius:16px;padding:26px 24px 18px;box-shadow:0 24px 70px rgba(0,0,0,.22);position:relative}.modal-close{position:absolute;right:17px;top:12px;border:0;background:transparent;font-size:30px;color:#15315d;cursor:pointer}.pix-modal h2{font-size:17px;margin:0;color:#0a3f91;text-align:center}.modal-line{width:35px;height:3px;background:#1684ef;margin:12px auto 24px}.pix-modal dl{margin:0;display:grid;gap:18px}.pix-modal dl div{display:grid;gap:3px}.pix-modal dt{font-size:12px;color:#243955}.pix-modal dd{font-size:14px;margin:0;color:#0d1f38}.copy-pix{width:100%;border:0;border-radius:7px;background:linear-gradient(90deg,#0750c2,#0b75e8);color:#fff;padding:13px;margin-top:24px;font-weight:700;cursor:pointer}.pix-success{text-align:center;color:#18a443;font-size:13px}.close-secondary{width:100%;border:0;border-radius:7px;background:#f4f4f4;color:#0750b8;padding:12px;font-weight:700;cursor:pointer}.toast{position:fixed;left:50%;bottom:24px;transform:translate(-50%,16px);background:#102d57;color:#fff;padding:12px 18px;border-radius:999px;opacity:0;pointer-events:none;transition:.2s;z-index:120}.toast.show{opacity:1;transform:translate(-50%,0)}
@media(max-width:900px){body{background:#fff}.page{width:100%;margin:0;border-radius:0;box-shadow:none}.topbar{height:82px;padding:0 24px}.brand img{width:155px;height:62px}.nav{display:none}.menu-btn{display:block}.mobile-menu{position:absolute;right:18px;top:76px;background:#fff;border:1px solid #dfe5ec;border-radius:12px;box-shadow:var(--shadow);padding:8px;z-index:20;min-width:150px}.mobile-menu[hidden]{display:none}.mobile-menu:not([hidden]){display:grid}.mobile-menu a{padding:10px 12px}.hero{display:block;min-height:0}.hero-photo{height:285px;order:-1;background-position:62% 36%}.hero-copy{padding:24px 28px 18px;background:#fff;text-align:center}.hero-copy h1{font-size:31px;letter-spacing:-1px}.hero-copy h2{font-size:18px;margin-top:4px}.accent-line{display:none}.hero-lead{font-size:15px;margin:15px 0}.trust-items{display:grid;gap:10px;justify-content:start;text-align:left;max-width:310px;margin:0 auto}.trust-item{font-size:13px}.round-icon{width:34px;height:34px}.round-icon svg{width:20px;height:20px}.services{padding:0 18px 10px;margin-top:0}.section-title{display:none}.service-grid{display:none}.contacts{padding:0 18px}.contact-grid{grid-template-columns:1fr;gap:9px}.action{min-height:58px;border-radius:8px;padding:7px 14px}.action-icon{width:36px;height:36px}.action-icon svg{width:29px;height:29px}.action b{font-size:14px}.action small{font-size:11px}.secondary-row{gap:8px;margin:12px 0}.secondary-btn{min-width:0;flex:1;padding:9px 8px;font-size:12px}.bottom-tools{grid-template-columns:1fr;gap:8px}.site-link{padding:12px 14px;grid-template-columns:38px 1fr 20px}.site-icon{font-size:27px}.site-link small{display:none}.qr-box{grid-template-columns:70px 1fr;padding:8px 10px}.qr-box img{width:64px;height:64px}.phone-dot{display:none}.footer-content{height:70px;display:grid;gap:2px;text-align:center;padding:11px}.footer-content span{display:none}.footer-content strong,.footer-content p{font-size:11px}.wave{height:0}.modal-backdrop{align-items:end;padding:0}.pix-modal{width:100%;border-radius:22px 22px 0 0;padding-bottom:max(22px,env(safe-area-inset-bottom))}}
@media(max-width:390px){.hero-photo{height:245px}.hero-copy{padding-left:20px;padding-right:20px}.brand img{width:142px}.topbar{padding:0 18px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}


/* ===== Hero SSP Água Boa 1:1 — atualização ===== */
.hero-photo {
    background-image: url("assets/hero-ssp-agua-boa-1x1.png") !important;
    background-repeat: no-repeat !important;
    background-position: center center !important;
}

@media (min-width: 901px) {
    .hero-photo {
        background-size: cover !important;
        background-position: center center !important;
    }
}

@media (max-width: 900px) {
    .hero-photo {
        width: 100% !important;
        aspect-ratio: 1 / 1 !important;
        height: auto !important;
        min-height: 0 !important;
        background-size: contain !important;
        background-position: center top !important;
        background-color: #fff !important;
    }
}


/* =========================================================
   AJUSTE EXCLUSIVO DO TOPO — NÃO ALTERA FOTO NEM OUTRAS SEÇÕES
   ========================================================= */
.hero-company-name{
  margin:0;
  color:var(--navy);
  font-size:clamp(36px,4vw,56px);
  line-height:.98;
  letter-spacing:-1.5px;
  font-weight:800;
}

.hero-company-name span{
  color:var(--blue);
}

.hero-services-title{
  margin:18px 0 12px;
  color:#182b49;
  font-size:20px;
  line-height:1.1;
  font-weight:800;
}

.hero-services-mini{
  list-style:none;
  margin:0;
  padding:0;
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:8px 22px;
  max-width:600px;
}

.hero-services-mini li{
  position:relative;
  padding-left:17px;
  color:#0b397c;
  font-size:14px;
  line-height:1.25;
  font-weight:700;
}

.hero-services-mini li::before{
  content:"";
  position:absolute;
  left:0;
  top:.48em;
  width:7px;
  height:7px;
  border-radius:50%;
  background:#1267dc;
}

@media(max-width:900px){
  .hero-company-name{
    font-size:30px;
    line-height:1.02;
    letter-spacing:-.8px;
    text-align:center;
  }

  .hero-services-title{
    font-size:16px;
    margin:10px 0 9px;
    text-align:center;
  }

  .hero-services-mini{
    grid-template-columns:1fr;
    gap:5px;
    max-width:300px;
    margin:0 auto;
    text-align:left;
  }

  .hero-services-mini li{
    font-size:12.5px;
    line-height:1.18;
    padding-left:15px;
  }

  .hero-services-mini li::before{
    width:6px;
    height:6px;
  }
}

@media(max-width:390px){
  .hero-company-name{
    font-size:27px;
  }
}


/* =========================================================
   TOPO LIMPO — alteração solicitada
   1) remove logo do canto superior
   2) remove menu hamburger no celular
   3) remove apenas o título "6 tipos de serviços"
   Nenhuma outra seção é alterada.
   ========================================================= */

/* No desktop, mantém somente a navegação já existente e a centraliza. */
.topbar{
  justify-content:center;
}

/* No celular, a barra superior ficaria vazia após remover logo e menu;
   por isso ela é ocultada sem alterar o conteúdo abaixo. */
@media(max-width:900px){
  .topbar{
    display:none !important;
  }

  .mobile-menu{
    display:none !important;
  }

  /* pequeno respiro entre o nome e a lista, já que o subtítulo foi removido */
  .hero-services-mini{
    margin-top:12px !important;
  }
}


/* TOPO COM A IMAGEM EXATA ENVIADA PELO USUARIO */
.hero-image-only {
  display:block !important;
  min-height:0 !important;
  padding:0 !important;
  margin:0 !important;
  background:#fff !important;
}
.hero-banner {
  width:100% !important;
  margin:0 !important;
  padding:0 !important;
  border-radius:0 !important;
  overflow:hidden !important;
  background:#fff !important;
  box-shadow:none !important;
}
.hero-banner img {
  display:block !important;
  width:100% !important;
  height:auto !important;
  max-width:100% !important;
  object-fit:contain !important;
  object-position:center top !important;
  margin:0 !important;
}
@media (max-width:900px) {
  .hero-image-only, .hero-banner {
    width:100% !important;
    padding:0 !important;
    margin:0 !important;
  }
  .hero-banner img {
    width:100% !important;
    height:auto !important;
    aspect-ratio:1 / 1 !important;
    object-fit:contain !important;
  }
}


/* =========================================================
   AJUSTE SOLICITADO: PIX + SITE + RODAPÉ
   Nenhum outro elemento visual foi alterado.
   ========================================================= */

/* Ícone PIX mais limpo e moderno */
.pix .pix-icon svg{
  width:32px !important;
  height:32px !important;
  display:block;
}

/* Ícone do site: globo moderno em SVG */
.site-icon{
  width:34px;
  height:34px;
  display:grid;
  place-items:center;
  font-size:0 !important;
}
.site-icon svg{
  width:30px;
  height:30px;
  display:block;
}

/* Corrige a linha/onda que vazava sobre o rodapé no celular */
@media(max-width:900px){
  footer{
    overflow:hidden !important;
  }

  footer .wave,
  footer .wave::before{
    display:none !important;
    content:none !important;
  }
}


/* =========================================================
   AJUSTE EXCLUSIVO PARA DESKTOP — SSP ÁGUA BOA
   IMPORTANTE: estas regras começam em 901px.
   A versão celular (<= 900px) permanece exatamente igual.
   ========================================================= */
@media (min-width:901px){

  /* Mantém o cartão com proporção visual mais agradável em monitores */
  .page{
    width:min(1180px,calc(100% - 32px)) !important;
    margin:16px auto !important;
  }

  /* O banner 1:1 continua inteiro, porém não ocupa altura excessiva */
  .hero.hero-image-only{
    padding:24px 28px 18px !important;
    background:#fff !important;
  }

  .hero-banner{
    width:min(700px,72vw) !important;
    max-width:700px !important;
    margin:0 auto !important;
  }

  .hero-banner img{
    width:100% !important;
    height:auto !important;
    aspect-ratio:1 / 1 !important;
    object-fit:contain !important;
    object-position:center center !important;
  }

  /* Centraliza as seções seguintes no desktop sem modificar seu design */
  .services{
    padding-left:40px !important;
    padding-right:40px !important;
  }

  .service-grid{
    max-width:840px !important;
    margin-left:auto !important;
    margin-right:auto !important;
  }

  .contacts{
    padding-left:40px !important;
    padding-right:40px !important;
  }

  .contact-grid{
    max-width:1000px !important;
    margin-left:auto !important;
    margin-right:auto !important;
  }

  .secondary-row{
    max-width:1000px !important;
    margin-left:auto !important;
    margin-right:auto !important;
  }

  .bottom-tools{
    max-width:1000px !important;
    margin-left:auto !important;
    margin-right:auto !important;
  }
}
