/* desentupidoraligouchegou.app.br — responsivo mobile-first */
html, body {
  overflow-x: hidden !important;
  max-width: 100% !important;
  width: 100% !important;
  position: relative;
}
*, *::before, *::after {
  box-sizing: border-box;
}

@media(max-width:1080px){
  .grid-servicos{grid-template-columns:repeat(3,1fr)}
  .grid-dif{grid-template-columns:repeat(2,1fr)}
  .grid-cidades{grid-template-columns:repeat(3,1fr)}
}
@media(max-width:900px){
  section{padding:52px 0}
  .article-grid{grid-template-columns:1fr}
  .sidebar{position:static}
  .autoridade{grid-template-columns:1fr;gap:32px}
  .form-wrap{grid-template-columns:1fr;gap:32px}
  .grid-blog{grid-template-columns:repeat(2,1fr)}
  .footer-grid{grid-template-columns:1fr 1fr;gap:32px}
  .cta-band{padding:34px 26px}
}
@media(max-width:640px){
  .hero-top-banner video.hero-video-desktop{display:none}
  .hero-top-banner video.hero-video-mobile{display:block;width:100%;height:auto}
  .hero-top-banner .video-sound-toggle{display:flex;right:14px;bottom:14px;padding:9px 14px;font-size:.78rem}
  .hero-top-banner .video-play-overlay{display:flex}
  .hero-top-banner .video-play-btn{width:66px;height:66px}
  .hero-top-banner .video-play-label{font-size:.78rem}
  .grid-servicos{grid-template-columns:1fr 1fr;gap:12px}
  .card-servico{padding:18px 15px}
  .grid-cidades{grid-template-columns:1fr 1fr;gap:10px}
  .grid-dif{grid-template-columns:1fr;gap:14px}
  .grid-blog{grid-template-columns:1fr}
  .footer-grid{grid-template-columns:1fr}
  .stats{grid-template-columns:1fr 1fr}
  .hero-ctas .btn{width:100%}
  .topbar .container{justify-content:center}
  .brand img{height:38px}
  .footer-bottom .container{justify-content:center;text-align:center}
  .hero-media .tag-24h{left:10px;bottom:-14px;font-size:.85rem;padding:10px 16px}
  .form-card{padding:22px 18px}
  .wa-float{width:auto;height:auto;bottom:16px;right:16px;padding:10px 18px;font-size:.85rem}
  .tel-float{width:54px !important;height:54px !important;bottom:16px !important;left:16px !important}
}

.mobile-quality-bar {
  display: none;
}

@media (max-width: 767px) {
  .mobile-quality-bar {
    display: flex;
    min-height: 42px;
    align-items: center;
    justify-content: center;
    gap: 12px;
    padding: 7px 12px;
    background: #001f5c;
    color: #fff;
    font-size: 0.68rem;
    font-weight: 700;
    letter-spacing: 0.01em;
    line-height: 1.15;
    text-align: center;
  }

  .mobile-quality-bar p {
    margin: 0;
  }

  .mobile-quality-bar p span {
    margin: 0 3px;
    color: #55b9ff;
  }

  .mobile-quality-icons {
    display: flex;
    align-items: center;
    gap: 7px;
    color: #fff;
  }

  .quality-icon {
    display: inline-flex;
    width: 18px;
    height: 18px;
    align-items: center;
    justify-content: center;
  }

  .quality-icon svg {
    display: block;
    width: 100%;
    height: 100%;
  }
}

/* Hero com conteúdo acessível sobre fotografia e overlay azul. */
.hero-custom.hero-designed {
  padding: 30px 0 0;
  background-image: linear-gradient(90deg, rgba(0, 24, 72, .97) 0%, rgba(0, 40, 108, .91) 42%, rgba(0, 57, 143, .59) 72%, rgba(0, 30, 85, .62) 100%), url('/img/hero-desentupimento.jpg');
  background-position: center;
}
.hero-custom.hero-designed::before { display: none; }
.hero-custom.hero-designed .container { display: block; }
.hero-heading-row { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-bottom: 38px; }
.hero-availability { display: inline-flex; align-items: center; gap: 10px; padding: 9px 15px; border: 1px solid #ffffff30; border-radius: 100px; background: #00173780; font-size: .82rem; font-weight: 700; }
.hero-availability > span { width: 9px; height: 9px; border-radius: 50%; background: #58ed8b; box-shadow: 0 0 0 5px #58ed8b1c; }
.hero-faith { color: #fff; font-family: Georgia, serif; font-style: italic; font-size: 2rem; transform: rotate(-5deg); white-space: nowrap; border-bottom: 2px solid #66d5ff; }
.hero-message { max-width: 700px; padding-bottom: 38px; }
.hero-eyebrow { color: #b6e5ff; font-size: .75rem; font-weight: 700; letter-spacing: .16em; margin-bottom: 16px; }
.hero-designed h1 { color: #fff; font-size: clamp(2.6rem, 5.5vw, 4.7rem); line-height: 1.02; letter-spacing: -.045em; font-weight: 900; }
.hero-designed h1 span { color: #65d4ff; }
.hero-description { max-width: 550px; margin: 22px 0; color: #e3eeff; font-size: 1.08rem; line-height: 1.65; }
.hero-benefits { list-style: none; display: grid; grid-template-columns: repeat(2, max-content); gap: 12px 28px; margin: 0 0 28px; padding: 0; font-size: .9rem; font-weight: 600; }
.hero-benefits li::before { content: '✓'; display: inline-block; margin-right: 9px; color: #83f3b1; font-weight: 800; }
.hero-contact-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 20px; }
.hero-designed .hero-whatsapp { min-height: 56px; padding: 16px 24px; border-radius: 12px; color: #032d19; background: #57ed93; box-shadow: 0 8px 30px #0003; }
.hero-designed .hero-whatsapp:hover { background: #8af5b4; }
.hero-phone { display: flex; flex-direction: column; color: #fff; }
.hero-phone span { font-size: .7rem; color: #c5d9f2; }
.hero-phone strong { font-size: 1.45rem; font-family: var(--font-head); }
.hero-payment { margin-top: 22px; color: #d1e1f6; font-size: .78rem; line-height: 1.8; }
.hero-payment span { color: #b3c9e5; font-size: .7rem; }
.hero-promises { border-top: 1px solid #ffffff30; display: flex; flex-wrap: wrap; align-items: center; gap: 14px 28px; padding: 21px 0; font-size: .73rem; color: #d9e8ff; }
.hero-promises span::before { content: '✓'; color: #65d4ff; margin-right: 7px; }
.hero-promises strong { margin-left: auto; color: #fff; }
.hero-designed a:focus-visible { outline: 3px solid #fff; outline-offset: 5px; }
@media(max-width:767px) {
  .hero-custom.hero-designed { padding-top: 22px; background-position: 58% center; background-image: linear-gradient(90deg, rgba(0, 24, 72, .94), rgba(0, 42, 110, .83)), url('/img/hero-desentupimento.jpg'); }
  .hero-custom.hero-designed .container { padding: 0 20px; }
  .hero-heading-row { gap: 12px; margin-bottom: 30px; }
  .hero-availability { font-size: .65rem; padding: 8px 10px; gap: 8px; }
  .hero-faith { font-size: 1.4rem; }
  .hero-eyebrow { font-size: .62rem; letter-spacing: .1em; }
  .hero-designed h1 { font-size: clamp(2.35rem, 9vw, 4rem); }
  .hero-description { font-size: .96rem; margin: 20px 0; }
  .hero-benefits { grid-template-columns: 1fr; gap: 10px; font-size: .85rem; }
  .hero-contact-actions { align-items: stretch; flex-direction: column; gap: 16px; }
  .hero-phone { align-items: center; }
  .hero-payment { text-align: center; }
  .hero-message { padding-bottom: 25px; }
  .hero-promises { gap: 12px; flex-direction: column; align-items: flex-start; }
  .hero-promises strong { margin-left: 0; }
}
@media(max-width:420px){
  .grid-servicos{grid-template-columns:1fr}
}