/* Imagens quadradas na seção Projetos Executados */
#projetos img {
  width: 100%;
  aspect-ratio: 1 / 1;
  object-fit: cover;
  border-radius: 8px;
  margin: 10px 0;
}
#projetos .grid, 
#projetos .galeria, 
#projetos .cards, 
#projetos .row {
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
  justify-content: center;
}
#projetos .grid img, 
#projetos .galeria img, 
#projetos .cards img, 
#projetos .row img {
  flex: 1 1 30%;
  max-width: 30%;
}



/* Fundo branco para a seção Projetos Executados */
section#projetos {
  background-color: #ffffff !important;
}
section#projetos, section#projetos h2, section#projetos p, section#projetos .card, section#projetos .card * {
  color: #111 !important;
}



section#nossos-servicos,
section.servicos,
section.nossos-servicos {
  text-align: center;
}

section#nossos-servicos h2,
section.servicos h2,
section.nossos-servicos h2 {
  text-align: center;
  margin-bottom: 20px;
}

section#nossos-servicos p,
section.servicos p,
section.nossos-servicos p {
  text-align: center;
  margin: 0 auto;
}


      :root {
        --bg:#0b0d10; --card:#11151b; --text:#e7edf3; --muted:#9fb0c0;
        --brand:#6ee7b7; --brand-strong:#34d399; --stroke:rgba(255,255,255,.08);
      }
      *{box-sizing:border-box}
      html,body{margin:0;padding:0;scroll-behavior:smooth}
      body{font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;background:var(--bg);color:var(--text)}
      .container{max-width:1120px;margin:0 auto;padding:0 20px}

      /* Bloco 1 - Menu Superior */
      .site-header{position:sticky;top:0;z-index:50;background:rgba(11,13,16,.7);backdrop-filter:saturate(160%) blur(8px);border-bottom:1px solid var(--stroke)}
      .site-header .container{display:flex;align-items:center;gap:20px;min-height:68px}
      .logo{font-weight:800;letter-spacing:.3px;text-decoration:none;color:var(--text)}
      .nav{display:flex;gap:16px;margin-left:auto;flex-wrap:wrap}
      .nav a{color:var(--muted);text-decoration:none;font-size:14px}
      .nav a:hover{color:var(--text)}
      .btn{display:inline-flex;align-items:center;justify-content:center;height:44px;padding:0 18px;border-radius:999px;border:1px solid var(--brand);
            background:var(--brand);color:#0b0d10;font-weight:700;text-decoration:none}
      .btn--ghost{background:transparent;color:var(--brand)}

      /* Bloco 2 - Slide Principal */
      .hero{position:relative;height:78vh;min-height:520px;width:100%;overflow:hidden;border-bottom:1px solid var(--stroke)}
      .slide{position:absolute;inset:0;opacity:0;transition:opacity 1s ease}
      .slide.is-active{opacity:1;z-index:1}
      .slide__bg{position:absolute;inset:0;background-size:cover;background-position:center}

      /* Seções padrão */
      section.section{padding:64px 0;border-bottom:1px solid var(--stroke)}
      section.section.alt{background:#0f1318}
      h2.title{font-size:28px;margin:0 0 18px}
      p.lead{color:var(--muted);max-width:840px;margin:.3rem 0 1rem}

      /* Bloco 4 - Produtos */
      .grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
      .card{background:var(--card);border:1px solid var(--stroke);border-radius:16px;padding:18px}
      .card h3{margin:0 0 8px}
      .pill{display:inline-block;padding:6px 10px;border-radius:999px;background:rgba(110,231,183,.12);color:var(--brand)}

      /* Bloco 5 - MVV */
      .grid-3 .mvv{text-align:left}
      .mvv h3{margin:0 0 8px}
      .mvv p{color:var(--muted)}

      /* Bloco 6 - Projetos (galeria) */
      .gallery{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
      .gallery .ph{aspect-ratio:16/10;background:#0f1318;border:1px dashed var(--stroke);border-radius:12px;display:grid;place-items:center;color:var(--muted)}

      /* Bloco 7 - Depoimentos */
      .quotes{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
      blockquote.quote{background:var(--card);border:1px dashed var(--stroke);border-radius:16px;padding:18px;margin:0}
      blockquote.quote footer{color:var(--muted);margin-top:8px}

      /* Bloco 8 - Mapa */
      .map-wrap{border:1px solid var(--stroke);border-radius:12px;overflow:hidden}
      .map-wrap iframe{width:100%;height:420px;border:0;filter:grayscale(20%)}

      /* Bloco 9 - Rodapé */
      .site-footer{padding:28px 0}
      .footer__grid{display:flex;align-items:center;justify-content:space-between;gap:18px;flex-wrap:wrap}
      .footer__nav{display:flex;gap:14px}
      .footer__nav a{color:var(--muted);text-decoration:none}
      .footer__nav a:hover{color:var(--text)}

      /* Responsivo */
      @media(max-width:900px){
        .grid-3{grid-template-columns:1fr}
        .gallery{grid-template-columns:1fr 1fr}
        .quotes{grid-template-columns:1fr}
      }
    
      /* Bloco 3 - Sobre (texto + imagem lado a lado) */
      .about-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px;align-items:center}
      .about-grid .about-img{width:100%;border-radius:14px;border:1px solid var(--stroke);box-shadow:0 8px 28px rgba(0,0,0,.25);display:block}
      @media(max-width:900px){.about-grid{grid-template-columns:1fr}}

    
      /* HERO overlay text (replaced) */
      .hero{position:relative}
      .hero::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg, rgba(0,0,0,.35), rgba(0,0,0,.55));pointer-events:none}
      .hero-overlay{
        position:absolute; inset:0; z-index:5; display:grid; place-items:center; text-align:center; padding:0 20px;
        animation:fadeIn .9s ease both .2s;
      }
      .hero-overlay .title{font-size:46px; line-height:1.1; margin:0 0 10px}
      .hero-overlay .subtitle{
        display:inline-block; margin:0; padding:8px 14px; border-radius:999px;
        background:rgba(0,0,0,.45); color:#fff; font-weight:600; letter-spacing:.2px;
        backdrop-filter:saturate(130%) blur(4px);
      }
      @keyframes fadeIn{from{opacity:0; transform:translateY(6px)} to{opacity:1; transform:none}}
      @media(max-width:900px){ .hero-overlay .title{font-size:30px} }

    
      /* Accent color and hero styling (The7-like) */
      :root{ --accent:#c82020; }
      .hero{position:relative}
      .hero::after{
        content:""; position:absolute; inset:0;
        /* darker overlay for readability */
        background:linear-gradient(180deg, rgba(0,0,0,.65), rgba(0,0,0,.75));
        pointer-events:none;
      }
      .hero-overlay{
        position:absolute; inset:0; z-index:6; display:grid; place-items:center;
        text-align:left; /* align left like example */
        padding:0 24px;
        animation:fadeIn .7s ease both .1s;
      }
      .hero-overlay .inner{ width:min(1120px, 94%); margin:0 auto; }
      .hero-overlay .title{
        font-size:clamp(32px, 6vw, 72px);
        line-height:1.05; margin:0 0 14px; color:#fff;
        text-shadow:0 6px 24px rgba(0,0,0,.7);
      }
      .hero-overlay .title .accent{ color: var(--accent); }
      .hero-overlay .subtitle{
        margin:0 0 22px; color:#e9ecef; font-size:clamp(16px,2.2vw,22px);
        max-width:820px;
      }
      .cta-row{ display:flex; gap:14px; flex-wrap:wrap }
      .btn-cta{
        display:inline-flex; align-items:center; justify-content:center;
        height:48px; padding:0 22px; border-radius:999px; font-weight:700;
        text-decoration:none; transition:transform .06s ease, box-shadow .2s ease, background .2s ease, border-color .2s ease;
      }
      .btn-cta.primary{ background:var(--accent); color:#fff; border:1px solid var(--accent); box-shadow:0 10px 28px rgba(200,32,32,.32) }
      .btn-cta.primary:hover{ transform:translateY(-1px) }
      .btn-cta.ghost{ background:transparent; color:#fff; border:1px solid rgba(255,255,255,.7) }
      .btn-cta.ghost:hover{ border-color:#fff; transform:translateY(-1px) }

    
      /* Header styled like hero (accent red, translucent bg) */
      .site-header{
        position:sticky; top:0; z-index:70;
        background:linear-gradient(180deg, rgba(0,0,0,.72), rgba(0,0,0,.50));
        backdrop-filter:saturate(160%) blur(8px);
        border-bottom:1px solid var(--stroke);
      }
      .site-header .container{display:flex;align-items:center;gap:20px;min-height:68px}
      .logo{font-weight:800; letter-spacing:.2px; text-decoration:none; color:#fff}
      .logo .accent{color:var(--accent)}
      .nav{display:flex; gap:18px; margin-left:auto; align-items:center; flex-wrap:wrap}
      .nav a{color:#eaeef3; opacity:.85; text-decoration:none; font-size:14px; font-weight:600}
      .nav a:hover{opacity:1; color:#fff}
      .nav a.link-accent:hover{color:var(--accent)}
      .site-header .btn-cta{height:42px; padding:0 18px}

    
      /* Dimming hero images for better text contrast */
      .slide__bg{
        filter: brightness(0.62) contrast(1.02);
        opacity: 0.9;
      }

    
      /* Logo image in header */
      .logo{display:flex;align-items:center;gap:10px;text-decoration:none}
      .logo-img{max-height:60px;width:auto;object-fit:contain;display:block}
      

    @media (max-width:900px){ .logo-img{max-height:46px} }
    
/* --- inject: imagens para cards de produtos --- */
.card-img{
  width:100%;
  height:180px;
  object-fit:cover;
  border-radius:1rem;
  margin-bottom:0.75rem;
}


/* Emphasize bottom-right @handle (visibility boost, no color change) */
.footer-savio .ft-bottom-right { 
  opacity: 1 !important;
  font-weight: 600;
  font-size: 15px;
  letter-spacing: .02em;
}
.footer-savio .ft-bottom-right a { 
  color: inherit; 
  text-decoration: none;
}
.footer-savio .ft-bottom-right a:hover { 
  text-decoration: underline;
}
@media (max-width: 900px){
  .footer-savio .ft-bottom-right { font-size: 14px; }
}

/* Opacidade suave nas imagens do HERO */
.slide__bg { opacity: 0.7 !important; }

@media (max-width: 640px) {
  .hero-overlay .button, .hero-overlay button, .hero-overlay a {
    margin-left: auto !important;
    margin-right: auto !important;
    display: block !important;
    text-align: center !important;
  }
}


@media (max-width: 640px) {
  .hero-overlay .button, .hero-overlay button, .hero-overlay a {
    line-height: 1.2 !important;
    padding-top: 10px !important;
    padding-bottom: 10px !important;
  }
}


/* Header MOBILE: logo maior, centralizada e com respiro */
@media (max-width: 640px) {
  header img {
    max-width: 250px !important; /* tamanho maior */
    height: auto !important;
    display: block !important;
    margin: 20px auto 0 auto !important; /* desce um pouco e centraliza */
  }
  header { text-align: center !important; }
}


/* Centralizar bloco Sobre a Empresa e empilhar números */
.about-company, .sobre, .empresa {
  text-align: center !important;
}

.about-company .numbers, .sobre .numbers, .empresa .numbers {
  display: block !important;
}

.about-company .numbers div, .sobre .numbers div, .empresa .numbers div {
  display: block !important;
  margin-bottom: 15px !important;
}

/* Imagens quadradas na seção Projetos Executados */
#projetos img {
  width: 100%;
  aspect-ratio: 1 / 1;
  object-fit: cover;
  border-radius: 8px;
  margin: 10px 0;
}
#projetos .grid, 
#projetos .galeria, 
#projetos .cards, 
#projetos .row {
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
  justify-content: center;
}
#projetos .grid img, 
#projetos .galeria img, 
#projetos .cards img, 
#projetos .row img {
  flex: 1 1 30%;
  max-width: 30%;
}



/* Fundo branco para a seção Projetos Executados */
section#projetos {
  background-color: #ffffff !important;
}
section#projetos, section#projetos h2, section#projetos p, section#projetos .card, section#projetos .card * {
  color: #111 !important;
}



section#nossos-servicos,
section.servicos,
section.nossos-servicos {
  text-align: center;
}

section#nossos-servicos h2,
section.servicos h2,
section.nossos-servicos h2 {
  text-align: center;
  margin-bottom: 20px;
}

section#nossos-servicos p,
section.servicos p,
section.nossos-servicos p {
  text-align: center;
  margin: 0 auto;
}


/* MVV Card Styles - Glass/Teal palette with fallbacks and dark-mode tweaks */
:root {
  --mvv-bg: var(--surface, #ffffff);
  --mvv-text: var(--text, #0f172a);
  --mvv-muted: var(--muted, #475569);
  --mvv-accent: var(--primary, #0ea5a5); /* teal fallback */
  --mvv-border: color-mix(in oklab, var(--mvv-text) 10%, transparent);
  --mvv-shadow: 0 10px 28px rgba(2, 6, 23, 0.10);
}
@media (prefers-color-scheme: dark) {
  :root {
    --mvv-bg: var(--surface, #0b1220);
    --mvv-text: var(--text, #e2e8f0);
    --mvv-muted: var(--muted, #94a3b8);
    --mvv-border: color-mix(in oklab, var(--mvv-text) 18%, transparent);
    --mvv-shadow: 0 12px 32px rgba(0,0,0,0.35);
  }
}

#mvv { max-width: 1100px; margin: 72px auto; padding: 0 20px; }
#mvv .title { 
  font-size: clamp(1.6rem, 2.2vw, 2.1rem); 
  margin: 0 0 24px 0; 
  font-weight: 800; 
  letter-spacing: -0.02em;
  color: var(--mvv-text);
}
#mvv .title::after{
  content: "";
  display: block;
  width: 72px;
  height: 3px;
  margin-top: 10px;
  background: linear-gradient(90deg, var(--mvv-accent), transparent);
  border-radius: 6px;
}
#mvv .grid { display: grid; grid-template-columns: 1fr; gap: 22px; }

/* Card with subtle glass effect */
#mvv .card {
  background: color-mix(in oklab, var(--mvv-bg) 88%, white);
  border-radius: 18px;
  padding: 22px;
  box-shadow: var(--mvv-shadow);
  border: 1px solid var(--mvv-border);
  backdrop-filter: saturate(1.1) blur(2px);
}
#mvv .card h3 { 
  margin: 0 0 10px 0; 
  font-size: 1.125rem; 
  color: var(--mvv-accent);
}
#mvv .card p, #mvv .card li { 
  line-height: 1.7; 
  color: var(--mvv-muted);
  font-size: 1rem;
}
#mvv .card ul { margin: 0; padding-left: 18px; }

@media (min-width: 768px) {
  #mvv .grid { grid-template-columns: repeat(3, 1fr); }
}

/* Optional: compact spacing if page uses dense layout */
@media (max-width: 420px) {
  #mvv { margin: 56px auto; }
  #mvv .card { padding: 18px; border-radius: 16px; }
}

/* Imagens quadradas na seção Projetos Executados */
#projetos img {
  width: 100%;
  aspect-ratio: 1 / 1;
  object-fit: cover;
  border-radius: 8px;
  margin: 10px 0;
}
#projetos .grid, 
#projetos .galeria, 
#projetos .cards, 
#projetos .row {
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
  justify-content: center;
}
#projetos .grid img, 
#projetos .galeria img, 
#projetos .cards img, 
#projetos .row img {
  flex: 1 1 30%;
  max-width: 30%;
}



/* Fundo branco para a seção Projetos Executados */
section#projetos {
  background-color: #ffffff !important;
}
section#projetos, section#projetos h2, section#projetos p, section#projetos .card, section#projetos .card * {
  color: #111 !important;
}



section#nossos-servicos,
section.servicos,
section.nossos-servicos {
  text-align: center;
}

section#nossos-servicos h2,
section.servicos h2,
section.nossos-servicos h2 {
  text-align: center;
  margin-bottom: 20px;
}

section#nossos-servicos p,
section.servicos p,
section.nossos-servicos p {
  text-align: center;
  margin: 0 auto;
}


/* MVV - Forced Dark Theme */
#mvv { 
  background: #000000; 
  margin: 0; 
  padding: 56px 20px; 
}
#mvv .title { color: #e5e7eb; }
#mvv .title::after { background: linear-gradient(90deg, #14b8a6, transparent); }
#mvv .card { 
  background: #111318; 
  border: 1px solid rgba(255,255,255,0.12); 
  box-shadow: 0 14px 36px rgba(0,0,0,0.55); 
}
#mvv .card h3 { color: #14b8a6; } /* teal accent */
#mvv .card p, #mvv .card li { color: #cbd5e1; }
#mvv .card strong { color: #e2e8f0; }

/* Imagens quadradas na seção Projetos Executados */
#projetos img {
  width: 100%;
  aspect-ratio: 1 / 1;
  object-fit: cover;
  border-radius: 8px;
  margin: 10px 0;
}
#projetos .grid, 
#projetos .galeria, 
#projetos .cards, 
#projetos .row {
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
  justify-content: center;
}
#projetos .grid img, 
#projetos .galeria img, 
#projetos .cards img, 
#projetos .row img {
  flex: 1 1 30%;
  max-width: 30%;
}



/* Fundo branco para a seção Projetos Executados */
section#projetos {
  background-color: #ffffff !important;
}
section#projetos, section#projetos h2, section#projetos p, section#projetos .card, section#projetos .card * {
  color: #111 !important;
}



section#nossos-servicos,
section.servicos,
section.nossos-servicos {
  text-align: center;
}

section#nossos-servicos h2,
section.servicos h2,
section.nossos-servicos h2 {
  text-align: center;
  margin-bottom: 20px;
}

section#nossos-servicos p,
section.servicos p,
section.nossos-servicos p {
  text-align: center;
  margin: 0 auto;
}


/* MVV Full-Width Fix */
#mvv { 
  background: #000000;
  width: 100%;
  margin: 0;
  padding: 72px 0;
}
#mvv .container {
  max-width: 1100px;
  margin: 0 auto;
  padding: 0 20px;
}
/* balance card spacing on small screens */
@media (max-width: 480px){
  #mvv { padding: 56px 0; }
}

/* Imagens quadradas na seção Projetos Executados */
#projetos img {
  width: 100%;
  aspect-ratio: 1 / 1;
  object-fit: cover;
  border-radius: 8px;
  margin: 10px 0;
}
#projetos .grid, 
#projetos .galeria, 
#projetos .cards, 
#projetos .row {
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
  justify-content: center;
}
#projetos .grid img, 
#projetos .galeria img, 
#projetos .cards img, 
#projetos .row img {
  flex: 1 1 30%;
  max-width: 30%;
}



/* Fundo branco para a seção Projetos Executados */
section#projetos {
  background-color: #ffffff !important;
}
section#projetos, section#projetos h2, section#projetos p, section#projetos .card, section#projetos .card * {
  color: #111 !important;
}



section#nossos-servicos,
section.servicos,
section.nossos-servicos {
  text-align: center;
}

section#nossos-servicos h2,
section.servicos h2,
section.nossos-servicos h2 {
  text-align: center;
  margin-bottom: 20px;
}

section#nossos-servicos p,
section.servicos p,
section.nossos-servicos p {
  text-align: center;
  margin: 0 auto;
}


/* MVV OVERRIDES (ensure full-width background) */
html body #mvv {
  max-width: none !important;
  width: 100% !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  background: #000000 !important;
  display: block;
}
html body #mvv .container {
  max-width: 1100px;
  margin: 0 auto;
  padding: 0 20px;
}

/* Imagens quadradas na seção Projetos Executados */
#projetos img {
  width: 100%;
  aspect-ratio: 1 / 1;
  object-fit: cover;
  border-radius: 8px;
  margin: 10px 0;
}
#projetos .grid, 
#projetos .galeria, 
#projetos .cards, 
#projetos .row {
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
  justify-content: center;
}
#projetos .grid img, 
#projetos .galeria img, 
#projetos .cards img, 
#projetos .row img {
  flex: 1 1 30%;
  max-width: 30%;
}



/* Fundo branco para a seção Projetos Executados */
section#projetos {
  background-color: #ffffff !important;
}
section#projetos, section#projetos h2, section#projetos p, section#projetos .card, section#projetos .card * {
  color: #111 !important;
}



section#nossos-servicos,
section.servicos,
section.nossos-servicos {
  text-align: center;
}

section#nossos-servicos h2,
section.servicos h2,
section.nossos-servicos h2 {
  text-align: center;
  margin-bottom: 20px;
}

section#nossos-servicos p,
section.servicos p,
section.nossos-servicos p {
  text-align: center;
  margin: 0 auto;
}


/* Hide any remaining badge-like elements */
[class*="badge"], [role="badge"], [data-badge] {
  display: none !important;
  visibility: hidden !important;
}

/* Imagens quadradas na seção Projetos Executados */
#projetos img {
  width: 100%;
  aspect-ratio: 1 / 1;
  object-fit: cover;
  border-radius: 8px;
  margin: 10px 0;
}
#projetos .grid, 
#projetos .galeria, 
#projetos .cards, 
#projetos .row {
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
  justify-content: center;
}
#projetos .grid img, 
#projetos .galeria img, 
#projetos .cards img, 
#projetos .row img {
  flex: 1 1 30%;
  max-width: 30%;
}



/* Fundo branco para a seção Projetos Executados */
section#projetos {
  background-color: #ffffff !important;
}
section#projetos, section#projetos h2, section#projetos p, section#projetos .card, section#projetos .card * {
  color: #111 !important;
}



section#nossos-servicos,
section.servicos,
section.nossos-servicos {
  text-align: center;
}

section#nossos-servicos h2,
section.servicos h2,
section.nossos-servicos h2 {
  text-align: center;
  margin-bottom: 20px;
}

section#nossos-servicos p,
section.servicos p,
section.nossos-servicos p {
  text-align: center;
  margin: 0 auto;
}


/* ===== Projetos Executados (Galeria) ===== */
#projetos { padding: 72px 0; }
#projetos .container { max-width: 1200px; margin: 0 auto; padding: 0 20px; }
#projetos h2 { margin: 0 0 20px 0; }
.projetos-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
}
@media (max-width: 900px) { .projetos-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 560px) { .projetos-grid { grid-template-columns: 1fr; } }

.projeto-card {
  position: relative;
  background: #0f141a;
  border: 1px dashed rgba(255,255,255,0.12);
  border-radius: 16px;
  overflow: hidden;
  aspect-ratio: 16/10; /* 1200x750 recomendado */
  box-shadow: 0 10px 28px rgba(0,0,0,0.35);
}

.projeto-card img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.projeto-card .overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(0,0,0,0) 40%, rgba(0,0,0,0.55) 100%);
  opacity: 0.0;
  transition: opacity .25s ease;
}

.projeto-card:hover .overlay { opacity: 1; }

.projeto-card .caption {
  position: absolute;
  left: 16px; right: 16px; bottom: 14px;
  color: #e5e7eb;
  font-weight: 600;
  text-shadow: 0 2px 6px rgba(0,0,0,0.6);
}

/* Placeholder text when image missing */
.projeto-card .placeholder {
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  color: #9fb4c7;
  font-weight: 500;
}

/* Imagens quadradas na seção Projetos Executados */
#projetos img {
  width: 100%;
  aspect-ratio: 1 / 1;
  object-fit: cover;
  border-radius: 8px;
  margin: 10px 0;
}
#projetos .grid, 
#projetos .galeria, 
#projetos .cards, 
#projetos .row {
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
  justify-content: center;
}
#projetos .grid img, 
#projetos .galeria img, 
#projetos .cards img, 
#projetos .row img {
  flex: 1 1 30%;
  max-width: 30%;
}



/* Fundo branco para a seção Projetos Executados */
section#projetos {
  background-color: #ffffff !important;
}
section#projetos, section#projetos h2, section#projetos p, section#projetos .card, section#projetos .card * {
  color: #111 !important;
}



section#nossos-servicos,
section.servicos,
section.nossos-servicos {
  text-align: center;
}

section#nossos-servicos h2,
section.servicos h2,
section.nossos-servicos h2 {
  text-align: center;
  margin-bottom: 20px;
}

section#nossos-servicos p,
section.servicos p,
section.nossos-servicos p {
  text-align: center;
  margin: 0 auto;
}


/* ===== Produtos (forçar fundo branco / texto preto) ===== */
html body #produtos {
  background: #ffffff !important;
  color: #111111 !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 72px 0 !important;
}
html body #produtos .container {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 20px;
}
/* Tipografia dentro do bloco */
html body #produtos h2,
html body #produtos h3,
html body #produtos h4,
html body #produtos p,
html body #produtos li,
html body #produtos a,
html body #produtos span,
html body #produtos strong {
  color: #111111 !important;
}

/* Cartões e elementos comuns dentro do bloco */
html body #produtos .card,
html body #produtos .produto-card {
  background: #ffffff !important;
  border: 1px solid rgba(0,0,0,0.08) !important;
  box-shadow: 0 6px 16px rgba(0,0,0,0.06) !important;
  border-radius: 14px;
}
/* Botões claros */
html body #produtos .btn,
html body #produtos button,
html body #produtos .cta {
  background: #111111 !important;
  color: #ffffff !important;
  border: 1px solid #111111 !important;
}
html body #produtos .btn:hover,
html body #produtos button:hover,
html body #produtos .cta:hover {
  filter: brightness(0.9);
}

/* Imagens quadradas na seção Projetos Executados */
#projetos img {
  width: 100%;
  aspect-ratio: 1 / 1;
  object-fit: cover;
  border-radius: 8px;
  margin: 10px 0;
}
#projetos .grid, 
#projetos .galeria, 
#projetos .cards, 
#projetos .row {
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
  justify-content: center;
}
#projetos .grid img, 
#projetos .galeria img, 
#projetos .cards img, 
#projetos .row img {
  flex: 1 1 30%;
  max-width: 30%;
}



/* Fundo branco para a seção Projetos Executados */
section#projetos {
  background-color: #ffffff !important;
}
section#projetos, section#projetos h2, section#projetos p, section#projetos .card, section#projetos .card * {
  color: #111 !important;
}



section#nossos-servicos,
section.servicos,
section.nossos-servicos {
  text-align: center;
}

section#nossos-servicos h2,
section.servicos h2,
section.nossos-servicos h2 {
  text-align: center;
  margin-bottom: 20px;
}

section#nossos-servicos p,
section.servicos p,
section.nossos-servicos p {
  text-align: center;
  margin: 0 auto;
}


/* Hide any remaining badge-like elements */
[class*="badge" i], [role="badge" i], [data-badge] { 
  display: none !important; 
  visibility: hidden !important; 
}

/* Imagens quadradas na seção Projetos Executados */
#projetos img {
  width: 100%;
  aspect-ratio: 1 / 1;
  object-fit: cover;
  border-radius: 8px;
  margin: 10px 0;
}
#projetos .grid, 
#projetos .galeria, 
#projetos .cards, 
#projetos .row {
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
  justify-content: center;
}
#projetos .grid img, 
#projetos .galeria img, 
#projetos .cards img, 
#projetos .row img {
  flex: 1 1 30%;
  max-width: 30%;
}



/* Fundo branco para a seção Projetos Executados */
section#projetos {
  background-color: #ffffff !important;
}
section#projetos, section#projetos h2, section#projetos p, section#projetos .card, section#projetos .card * {
  color: #111 !important;
}



section#nossos-servicos,
section.servicos,
section.nossos-servicos {
  text-align: center;
}

section#nossos-servicos h2,
section.servicos h2,
section.nossos-servicos h2 {
  text-align: center;
  margin-bottom: 20px;
}

section#nossos-servicos p,
section.servicos p,
section.nossos-servicos p {
  text-align: center;
  margin: 0 auto;
}


/* ===== Produtos no estilo 'Serviços' ===== */
#produtos { background: #ffffff; color: #111; padding: 72px 0; }
#produtos .container { max-width: 1200px; margin: 0 auto; padding: 0 20px; }
#produtos .subhead { text-align: center; max-width: 800px; margin: 8px auto 36px; color: #4b5563; }

.servicos-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 28px;
}
@media (max-width: 960px) { .servicos-grid { grid-template-columns: repeat(2, 1fr);} }
@media (max-width: 640px) { .servicos-grid { grid-template-columns: 1fr;} }

.servico-card {
  background: #fff;
  border: 1px solid rgba(0,0,0,0.08);
  border-radius: 16px;
  overflow: hidden;
  box-shadow: 0 10px 24px rgba(0,0,0,0.06);
  display: flex;
  flex-direction: column;
}

.servico-card .media { aspect-ratio: 16/10; background: #111318; }
.servico-card img { width: 100%; height: 100%; object-fit: cover; display: block; }

.servico-card .content { padding: 18px 20px 20px; }
.servico-card h3 { margin: 0 0 12px; font-size: 1.375rem; color: #111; }

.servico-card ul { list-style: none; padding: 0; margin: 0 0 16px 0; }
.servico-card li { display: flex; align-items: flex-start; gap: 10px; margin: 8px 0; color: #374151; }

.servico-card li::before {
  content: "✓";
  display: inline-flex;
  font-weight: 800;
  line-height: 1;
  margin-top: 2px;
  color: #0ea5a5; /* teal check */
}

.servico-card .cta {
  align-self: flex-start;
  background: #0ea5a5;
  color: #fff;
  border: 1px solid #0ea5a5;
  border-radius: 10px;
  padding: 10px 14px;
  text-decoration: none;
  font-weight: 600;
  transition: filter .2s ease;
}
.servico-card .cta:hover { filter: brightness(0.9); }

/* === Overrides: Projetos Realizados (quadrado, sem borda, grid alinhado) === */
#projetos .projetos-grid {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)) !important;
  gap: 18px !important;
  align-items: stretch !important;
}
#projetos .projeto-card {
  aspect-ratio: 1 / 1 !important;
  border: none !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  background: transparent !important;
}
#projetos .projeto-card img {
  width: 100% !important;
  height: 100% !important;
  aspect-ratio: 1 / 1 !important;
  object-fit: cover !important;
  border: none !important;
  border-radius: 0 !important;
  display: block !important;
}
#projetos .projeto-card .overlay { display: none !important; }
#projetos img {
  border: none !important;
  border-radius: 0 !important;
  aspect-ratio: 1 / 1 !important;
  object-fit: cover !important;
}
/* remove margens extras das imagens, se houver */
#projetos img { margin: 0 !important; }

/* === Grid fix: 3 imagens em cima e 3 em baixo === */
#projetos .projetos-grid {
  display: grid !important;
  grid-template-columns: repeat(3, 1fr) !important;
  gap: 20px !important;
  justify-items: center !important;
  align-items: stretch !important;
  padding: 20px !important;
}
#projetos .projeto-card {
  aspect-ratio: 1 / 1 !important;
  width: 100% !important;
  border: none !important;
  border-radius: 0 !important;
  overflow: hidden !important;
}
#projetos .projeto-card img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  border: none !important;
  border-radius: 0 !important;
  display: block !important;
}
@media (max-width: 900px) {
  #projetos .projetos-grid { grid-template-columns: repeat(2, 1fr) !important; }
}
@media (max-width: 600px) {
  #projetos .projetos-grid { grid-template-columns: 1fr !important; }
}

/* === Hover suave: zoom + sombra === */
#projetos .projeto-card {
  position: relative !important;
  overflow: hidden !important;
  border-radius: 0 !important;
  transition: box-shadow 0.3s ease !important;
}
#projetos .projeto-card img {
  transform: scale(1) !important;
  transition: transform 0.3s ease !important;
  will-change: transform !important;
}
#projetos .projeto-card:hover img {
  transform: scale(1.05) !important;
}
#projetos .projeto-card:hover {
  box-shadow: 0 10px 24px rgba(0,0,0,0.18) !important;
}

/* === Centralização e divisor tipo 'Our Services' === */
#projetos {
  text-align: center !important;
  padding: 60px 20px !important;
}
#projetos h2.titulo-centralizado {
  font-size: 2rem !important;
  font-weight: 600 !important;
  margin-bottom: 10px !important;
  position: relative !important;
  display: inline-block !important;
}
#projetos h2.titulo-centralizado::after {
  content: '';
  display: block;
  width: 60px;
  height: 2px;
  background-color: #000;
  margin: 12px auto 0 auto;
}
#projetos p.texto-centralizado {
  color: #555 !important;
  font-size: 1rem !important;
  max-width: 700px !important;
  margin: 0 auto 40px auto !important;
  line-height: 1.6 !important;
}

/* ===== Depoimentos - estilo inspirado no exemplo ===== */
#depoimentos {
  background: linear-gradient(180deg, rgba(246,248,255,0.9), rgba(240,244,255,0.7));
  padding: 70px 20px;
}
#depoimentos .depo-title {
  text-align: center;
  font-size: 1.8rem;
  font-weight: 700;
  color: #D62828; /* azul de destaque */
  margin: 0 0 30px 0;
}
#depoimentos .depo-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 28px;
}
@media (max-width: 1024px) {
  #depoimentos .depo-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 680px) {
  #depoimentos .depo-grid { grid-template-columns: 1fr; }
}
#depoimentos .depo-card {
  background: #fff;
  border-radius: 8px;
  box-shadow: 0 12px 28px rgba(0,0,0,0.08);
  padding: 28px;
  position: relative;
}
#depoimentos .depo-card blockquote {
  margin: 0 0 22px 0;
  position: relative;
  color: #333;
  line-height: 1.7;
}
#depoimentos .depo-card blockquote::before {
  content: "“";
  position: absolute;
  top: -8px;
  left: -6px;
  font-size: 34px;
  line-height: 1;
  color: #D62828;
}
#depoimentos .depo-card p {
  margin: 0;
  font-size: 1.02rem;
}
#depoimentos .depo-author {
  display: flex;
  align-items: center;
  gap: 12px;
}
#depoimentos .avatar {
  width: 48px;
  height: 48px;
  border-radius: 50%;
  background: radial-gradient(circle at 30% 30%, #ff8a80, #D62828);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  font-weight: 700;
  letter-spacing: 0.5px;
}
#depoimentos .avatar::after {
  content: attr(data-initials);
  font-size: 0.9rem;
}
#depoimentos .meta {
  display: flex;
  flex-direction: column;
}
#depoimentos .meta strong {
  font-weight: 700;
  color: #0f172a;
}
#depoimentos .meta span {
  font-size: 0.9rem;
  color: #6b7280;
}

/* ====== Seção Depoimentos — aproximado ao exemplo ====== */
:root {
  --brand-blue: #D62828;
  --card-shadow: 0 16px 30px rgba(0, 38, 130, 0.18);
  --soft-shadow: 0 12px 28px rgba(9, 17, 65, 0.10);
}
#depoimentos {
  background: linear-gradient(180deg, #f7f9ff 0%, #eef3ff 55%, #f6f8ff 100%);
  padding: 90px 20px 100px;
}
#depoimentos .depo-container { max-width: 1180px; margin: 0 auto; }
#depoimentos .depo-title-en {
  text-align: center;
  font-size: 1.9rem;
  font-weight: 700;
  color: var(--brand-blue);
  letter-spacing: 0.2px;
  margin: 0 0 34px;
}
#depoimentos .depo-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 42px;
  align-items: start;
}
@media (max-width: 1100px) {
  #depoimentos .depo-grid { grid-template-columns: repeat(2, 1fr); gap: 32px; }
}
@media (max-width: 720px) {
  #depoimentos .depo-grid { grid-template-columns: 1fr; gap: 26px; }
}
#depoimentos .depo-col { display: flex; flex-direction: column; gap: 18px; }
#depoimentos .depo-card {
  background: #ffffff;
  border-radius: 8px;
  padding: 28px 28px 30px;
  box-shadow: var(--soft-shadow), 0 2px 0 rgba(255,255,255,0.9) inset;
  position: relative;
  transition: transform .25s ease, box-shadow .25s ease;
}
#depoimentos .depo-card::after {
  content: "";
  position: absolute;
  left: 12px;
  right: 12px;
  bottom: -10px;
  height: 20px;
  filter: blur(12px);
  background: radial-gradient(50% 50% at 50% 50%, rgba(46,108,246,0.35) 0%, rgba(46,108,246,0.0) 70%);
  z-index: -1;
}
#depoimentos .depo-card:hover {
  transform: translateY(-4px);
  box-shadow: var(--card-shadow);
}
#depoimentos .depo-quote {
  margin: 0;
  color: #0f172a;
  line-height: 1.7;
  position: relative;
}
#depoimentos .depo-quote::before {
  content: "“";
  position: absolute;
  top: -6px;
  left: -4px;
  font-size: 38px;
  line-height: 1;
  color: var(--brand-blue);
}
#depoimentos .depo-quote h3 {
  margin: 8px 0 12px;
  font-size: 1.25rem;
  font-weight: 800;
  color: #0f172a;
}
#depoimentos .depo-quote p {
  margin: 0;
  color: #4b5563;
  font-size: 1rem;
}
#depoimentos .depo-author {
  display: grid;
  grid-template-columns: 56px 1fr;
  align-items: center;
  gap: 14px;
  margin-left: 8px;
}
#depoimentos .depo-author .avatar {
  width: 56px;
  height: 56px;
  border-radius: 50%;
  background: radial-gradient(circle at 30% 30%, #ff8a80, var(--brand-blue));
  box-shadow: 0 8px 18px rgba(46,108,246,0.35);
  object-fit: cover;
  display: inline-block;
  position: relative;
}
#depoimentos .depo-author .avatar::after {
  content: attr(data-initials);
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  color: #fff;
  font-weight: 800;
}
#depoimentos .depo-author .meta {
  display: flex;
  flex-direction: column;
}
#depoimentos .depo-author .meta strong {
  color: #111827;
  font-weight: 800;
  font-size: 1.02rem;
}
#depoimentos .depo-author .meta span {
  color: #6b7280;
  font-size: 0.92rem;
}

/* === Carrossel de Depoimentos === */
        #depoimentos .depo-carousel {
          position: relative;
          margin: 0 auto;
          max-width: 1180px;
        }
        #depoimentos .depo-track {
          display: flex;
          overflow: hidden;
          scroll-behavior: smooth;
        }
        #depoimentos .depo-slide {
          flex: 0 0 33.3333%;
          padding: 0 14px;
          box-sizing: border-box;
        }
        @media (max-width: 1100px) {
          #depoimentos .depo-slide { flex-basis: 50%; }
        }
        @media (max-width: 720px) {
          #depoimentos .depo-slide { flex-basis: 100%; }
        }
        #depoimentos .depo-prev, #depoimentos .depo-next {
          position: absolute;
          top: 40%;
          transform: translateY(-50%);
          width: 44px;
          height: 44px;
          border-radius: 999px;
          border: none;
          background: #ffffff;
          color: #D62828;
          box-shadow: 0 8px 18px rgba(46,108,246,0.25);
          font-size: 26px;
          font-weight: 700;
          cursor: pointer;
          z-index: 5;
        }
        #depoimentos .depo-prev { left: -6px; }
        #depoimentos .depo-next { right: -6px; }
        #depoimentos .depo-prev:hover, #depoimentos .depo-next:hover { filter: brightness(0.98); }
        #depoimentos .depo-dots {
          display: flex;
          gap: 8px;
          justify-content: center;
          margin-top: 22px;
        }
        #depoimentos .depo-dots button {
          width: 8px;
          height: 8px;
          border-radius: 50%;
          border: none;
          background: #c7d2fe;
          cursor: pointer;
        }
        #depoimentos .depo-dots button[aria-selected="true"] { background: #D62828; width: 22px; border-radius: 6px; }
        /* Ajuste do padding lateral nos cards dentro do slide */
        #depoimentos .depo-col { gap: 18px; }

/* === Ajuste sem avatares nos depoimentos === */
#depoimentos .depo-author {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  text-align: center;
}
#depoimentos .depo-author .meta strong {
  font-weight: 700;
  color: #111827;
  font-size: 1.05rem;
}
#depoimentos .depo-author .meta span {
  color: #6b7280;
  font-size: 0.9rem;
}

/* === Tema Vermelho === */
#depoimentos {
  background: linear-gradient(180deg, #fff5f5 0%, #ffeaea 55%, #fff5f5 100%) !important;
}
#depoimentos .depo-quote::before {
  color: #D62828 !important;
}
#depoimentos .depo-title-en {
  color: #D62828 !important;
}
#depoimentos .depo-prev, #depoimentos .depo-next {
  color: #D62828 !important;
  box-shadow: 0 8px 18px rgba(214,40,40,0.25) !important;
}
#depoimentos .depo-dots button[aria-selected="true"] {
  background: #D62828 !important;
}

/* === MVV: override para vermelho puro === */
:root { --mvv-accent: #FF0000; }
#mvv .title::after { background: #FF0000 !important; }
#mvv .card h3 { color: #FF0000 !important; }

/* ===== Alinhamento das imagens nos produtos ===== */
section#produtos .cards,
section#produtos .grid-produtos,
section#produtos .servicos-grid,
section#produtos .grid,
section#produtos .container > .cards,
section#produtos .container > .grid,
section#servicos .cards,
section#servicos .grid {
  display: grid !important;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
  align-items: start;
}
section#produtos .cards > *,
section#produtos .grid-produtos > *,
section#produtos .servicos-grid > *,
section#produtos .grid > *,
section#servicos .cards > *,
section#servicos .grid > * {
  display: flex;
  flex-direction: column;
  gap: 12px;
}
section#produtos img,
section#servicos img {
  width: 100%;
  height: 240px;
  object-fit: cover;
  display: block;
  border-radius: 16px;
}
@media (max-width: 1024px) {
  section#produtos .cards,
  section#produtos .grid-produtos,
  section#produtos .servicos-grid,
  section#produtos .grid,
  section#servicos .cards,
  section#servicos .grid {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media (max-width: 640px) {
  section#produtos .cards,
  section#produtos .grid-produtos,
  section#produtos .servicos-grid,
  section#produtos .grid,
  section#servicos .cards,
  section#servicos .grid {
    grid-template-columns: 1fr;
  }
  section#produtos img,
  section#servicos img {
    height: 200px;
  }
}

/* ===== Espaçamento fixo de 36px no bloco Produtos ===== */
section#produtos .card button,
section#produtos .card .btn,
section#produtos .card a.btn,
section#produtos button,
section#produtos .btn,
section#produtos a.btn,
section#produtos .servico-card .cta,
section#produtos .produto-card .cta {
  margin-top: 36px !important;
  display: inline-block;
}

/* ===== Centralização completa no mobile ===== */
@media (max-width: 640px) {
  section#produtos,
  section#produtos .container,
  section#produtos .cards,
  section#produtos .grid,
  section#produtos .servicos-grid,
  section#produtos .grid-produtos {
    text-align: center !important;
    justify-items: center !important;
  }
  section#produtos .cards > *,
  section#produtos .grid > *,
  section#produtos .servicos-grid > *,
  section#produtos .grid-produtos > * {
    align-items: center !important;
  }
  section#produtos img {
    margin: 0 auto !important;
    display: block;
  }
  section#produtos .btn,
  section#produtos a.btn,
  section#produtos button {
    margin-left: auto !important;
    margin-right: auto !important;
    display: inline-block !important;
  }
  /* Títulos e descrições */
  section#produtos h3, 
  section#produtos p {
    text-align: center !important;
  }
}

@media (max-width: 640px) {
  /* ===== HERO ===== */
  section#hero, .hero, .banner, .principal {
    text-align: center !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
  }
  section#hero img, .hero img, .banner img, .principal img {
    margin: 0 auto !important;
    display: block !important;
  }
  section#hero h1, section#hero h2, section#hero p,
  .hero h1, .hero h2, .hero p {
    text-align: center !important;
  }
  section#hero .btn, .hero .btn {
    margin-left: auto !important;
    margin-right: auto !important;
    display: inline-block !important;
  }

  /* ===== NOSSA EMPRESA ===== */
  section#empresa, section#sobre, section#nossa-empresa {
    text-align: center !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
  }
  section#empresa img, section#sobre img, section#nossa-empresa img {
    margin: 0 auto !important;
    display: block !important;
  }
  section#empresa h2, section#empresa p,
  section#sobre h2, section#sobre p,
  section#nossa-empresa h2, section#nossa-empresa p {
    text-align: center !important;
  }

  /* ===== PRODUTOS ===== */
  section#produtos, section#servicos {
    text-align: center !important;
    justify-items: center !important;
  }
  section#produtos .cards > *, section#produtos .grid > *,
  section#servicos .cards > *, section#servicos .grid > * {
    align-items: center !important;
    text-align: center !important;
  }
  section#produtos img, section#servicos img {
    margin: 0 auto !important;
    display: block !important;
  }
  section#produtos .btn, section#servicos .btn,
  section#produtos a.btn, section#servicos a.btn {
    margin-left: auto !important;
    margin-right: auto !important;
    display: inline-block !important;
  }
}

@media (max-width: 640px) {
  header, .header, .topbar {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
    gap: 12px;
    width: 100%;
  }
  header .container, .header .container, .topbar .container {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
    width: 100% !important;
  }
  header .logo, .header .logo, .topbar .logo,
  header img.logo, .header img.logo, .topbar img.logo {
    margin: 0 auto !important;
    display: block !important;
    height: auto;
    max-height: 64px;
  }
  header nav, .header nav, .topbar nav {
    width: 100% !important;
  }
  header nav ul, .header nav ul, .topbar nav ul {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    gap: 10px;
    width: 100%;
  }
  header nav li, .header nav li, .topbar nav li {
    width: auto;
  }
  header nav a, .header nav a, .topbar nav a {
    display: inline-block;
    text-align: center;
  }
  /* Botões do header (se existirem) centralizados */
  header .btn, .header .btn, .topbar .btn,
  header a.btn, .header a.btn, .topbar a.btn,
  header button, .header button, .topbar button {
    margin-left: auto !important;
    margin-right: auto !important;
    display: inline-block !important;
  }
}

/* ===== Correções de header no mobile ===== */
@media (max-width: 640px) {
  /* Centralização e espaçamento */
  header nav ul, .header nav ul, .topbar nav ul {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: wrap !important;
    justify-content: center !important;
    align-items: center !important;
    gap: 10px 16px !important; /* row-gap / column-gap */
    width: 100% !important;
  }
  /* Links menores para caber em uma linha quando possível */
  header nav a, .header nav a, .topbar nav a {
    padding: 6px 10px !important;
    font-size: 14px !important;
    line-height: 1.2 !important;
  }
  /* Deixar o CTA em uma linha abaixo, centralizado */
  header nav a.btn, .header nav a.btn, .topbar nav a.btn,
  header nav .btn, .header nav .btn, .topbar nav .btn {
    order: 99 !important;             /* empurra para a última linha */
    flex-basis: 100% !important;      /* quebra para linha inteira */
    max-width: 260px !important;      /* largura confortável */
    margin: 8px auto 0 !important;    /* centralizado com margem superior */
    text-align: center !important;
    display: inline-block !important;
    white-space: nowrap !important;
  }
  /* Evitar sublinhado/decoração estranha no container */
  header, .header, .topbar {
    border-bottom: none !important;
  }
}

/* === Hamburger button === */
#menu-toggle {
  background: transparent;
  border: 0;
  padding: 10px;
  cursor: pointer;
  border-radius: 10px;
}
#menu-toggle .bar {
  display: block;
  width: 26px;
  height: 3px;
  margin: 5px 0;
  background: #fff;
  transition: transform .2s ease, opacity .2s ease, background .2s ease;
}

/* Desktop keeps default layout */
@media (max-width: 768px) {
  /* Show hamburger on mobile */
  #menu-toggle { display: inline-block !important; }
  /* Hide menu by default */
  header nav ul, .header nav ul, .topbar nav ul {
    display: none !important;
  }
  /* When open, show menu as vertical list */
  header.nav-open nav ul, .header.nav-open nav ul, .topbar.nav-open nav ul {
    display: flex !important;
    flex-direction: column !important;
    gap: 12px !important;
    padding: 12px 0 !important;
    align-items: center !important;
  }
  /* Button "X" animation */
  header.nav-open #menu-toggle .bar:nth-child(1) {
    transform: translateY(8px) rotate(45deg);
  }
  header.nav-open #menu-toggle .bar:nth-child(2) {
    opacity: 0;
  }
  header.nav-open #menu-toggle .bar:nth-child(3) {
    transform: translateY(-8px) rotate(-45deg);
  }
}

@media (max-width: 768px) {
  /* Garante contexto para o overlay do menu */
  header, .header, .topbar {
    position: relative;
    z-index: 1000;
  }
  /* Overlay de fundo quando o menu está aberto */
  header .menu-overlay,
  .header .menu-overlay,
  .topbar .menu-overlay {
    display: none;
  }
  header.nav-open .menu-overlay,
  .header.nav-open .menu-overlay,
  .topbar.nav-open .menu-overlay {
    display: block;
    position: absolute;
    left: 0; right: 0;
    top: 100%; /* logo abaixo do header */
    background: rgba(0,0,0,0.95);
    width: 100%;
    padding: 16px 20px 24px;
    border-bottom: 1px solid rgba(255,255,255,0.08);
    animation: slideDown .18s ease-out;
  }

  /* UL vira coluna, centralizada, sem wrap */
  header.nav-open nav ul, .header.nav-open nav ul, .topbar.nav-open nav ul {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 12px !important;
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
    width: 100% !important;
  }

  /* Itens ocupam largura auto, centralizados */
  header.nav-open nav li, .header.nav-open nav li, .topbar.nav-open nav li {
    width: 100%;
    display: flex;
    justify-content: center;
  }

  /* Links com click-area confortável */
  header.nav-open nav a, .header.nav-open nav a, .topbar.nav-open nav a {
    display: inline-block;
    padding: 10px 14px;
    font-size: 16px;
    line-height: 1.2;
    text-align: center;
    width: auto;
    white-space: nowrap;
  }

  /* CTA por último, largura confortável */
  header.nav-open nav a.btn, .header.nav-open nav a.btn, .topbar.nav-open nav a.btn,
  header.nav-open nav .btn, .header.nav-open nav .btn, .topbar.nav-open nav .btn {
    order: 99;
    margin-top: 8px;
    max-width: 280px;
    width: 100%;
    text-align: center;
  }

  /* Esconde a UL padrão e usa overlay para conter o menu */
  header nav ul, .header nav ul, .topbar nav ul {
    display: none !important;
  }
  /* Quando nav-open, mostramos dentro do overlay para 100% de largura */
  header.nav-open .menu-overlay nav ul,
  .header.nav-open .menu-overlay nav ul,
  .topbar.nav-open .menu-overlay nav ul {
    display: flex !important;
  }

  /* Animação */
  @keyframes slideDown {
    from { transform: translateY(-6px); opacity: .0; }
    to { transform: translateY(0); opacity: 1; }
  }
}

/* ===== Restaurar comportamento no DESKTOP ===== */
@media (min-width: 769px) {
  /* Esconde o hambúrguer e overlay */
  #menu-toggle { display: none !important; }
  .menu-overlay { display: contents !important; } /* deixa o nav no fluxo normal */
  /* Menu horizontal padrão */
  header nav ul, .header nav ul, .topbar nav ul {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    justify-content: initial !important; /* volta ao padrão do tema */
    gap: inherit !important;            /* usa o espaçamento do tema */
    padding: 0 !important;
    margin: 0 !important;
  }
  /* Itens e CTA sem forçar largura/ordem */
  header nav li, .header nav li, .topbar nav li {
    width: auto !important;
  }
  header nav a.btn, .header nav a.btn, .topbar nav a.btn,
  header nav .btn, .header nav .btn, .topbar nav .btn {
    order: initial !important;
    max-width: none !important;
    width: auto !important;
    margin: 0 !important;
  }
}

/* ===== Tamanho da logo responsivo ===== */
header .logo img,
.header .logo img,
.topbar .logo img,
header img.logo,
.header img.logo,
.topbar img.logo,
header .brand img,
.header .brand img,
.topbar .brand img {
  height: auto;
  width: auto;
  max-width: 100%;
  display: block;
}

/* Desktop */
@media (min-width: 769px) {
  header .logo img,
  .header .logo img,
  .topbar .logo img,
  header img.logo,
  .header img.logo,
  .topbar img.logo,
  header .brand img,
  .header .brand img,
  .topbar .brand img {
    max-height: 70px !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }
}

/* Mobile */
@media (max-width: 768px) {
  header .logo img,
  .header .logo img,
  .topbar .logo img,
  header img.logo,
  .header img.logo,
  .topbar img.logo,
  header .brand img,
  .header .brand img,
  .topbar .brand img {
    max-height: 50px !important;
    margin-left: 15px !important;
    margin-right: 15px !important;
  }
}

/* ===== Logo em 300x300 apenas no Desktop ===== */
@media (min-width: 769px) {
  header .logo img,
  .header .logo img,
  .topbar .logo img,
  header img.logo,
  .header img.logo,
  .topbar img.logo,
  header .brand img,
  .header .brand img,
  .topbar .brand img {
    width: 300px !important;
    height: 300px !important;
    object-fit: contain !important;
    margin: 0 auto !important;
  }
}

/* ===== Correções da seção 'Sobre a Empresa' no MOBILE ===== */
@media (max-width: 640px) {
  /* Container da seção */
  section#empresa, section#sobre, section#nossa-empresa {
    padding-left: 16px !important;
    padding-right: 16px !important;
    overflow: visible !important;
  }
  /* Evitar cortes por containers internos */
  section#empresa *, section#sobre *, section#nossa-empresa * {
    max-width: 100% !important;
    overflow-wrap: break-word !important; /* quebra longa */
    word-wrap: break-word !important;
    word-break: normal !important;
    hyphens: auto;
  }
  /* Título centralizado e com espaçamento */
  section#empresa h2, section#sobre h2, section#nossa-empresa h2 {
    text-align: center !important;
    margin: 0 0 14px 0 !important;
  }
  /* Parágrafos mais legíveis e sem cortes */
  section#empresa p, section#sobre p, section#nossa-empresa p {
    font-size: clamp(14px, 4vw, 16px) !important;
    line-height: 1.6 !important;
    margin: 10px 0 !important;
    white-space: normal !important;
  }
  /* Evitar que elementos posicionados absolutos cortem conteúdo */
  section#empresa, section#sobre, section#nossa-empresa {
    position: relative;
  }
  /* Espaçamento do bloco de indicadores abaixo do texto */
  .empresa-stats {
    margin-top: 20px !important;
  }
}

/* ===== Footer: layout responsivo e centralizado ===== */
footer, .footer {
  color: inherit;
}
footer .footer-inner {
  max-width: 1200px;
  margin: 0 auto;
  padding: 32px 20px;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
  align-items: start;
}
footer .footer-col {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
footer .footer-col h4 {
  margin: 0 0 8px 0;
  font-size: 18px;
}
footer .footer-col a {
  text-decoration: none;
  opacity: 0.9;
}
footer .footer-col a:hover {
  opacity: 1;
  text-decoration: underline;
}
footer .brand-area {
  display: flex;
  align-items: center;
  gap: 12px;
}
footer .brand-area img {
  max-height: 42px;
  width: auto;
  display: block;
}
footer .social {
  display: flex;
  gap: 12px;
  align-items: center;
}
footer .social a {
  display: inline-block;
}

/* Barra inferior */
footer .copy {
  border-top: 1px solid rgba(255,255,255,0.12);
  margin-top: 12px;
  padding: 12px 20px;
  text-align: center;
  opacity: 0.9;
  font-size: 14px;
}

/* Mobile */
@media (max-width: 768px) {
  footer .footer-inner {
    grid-template-columns: 1fr;
    text-align: center;
  }
  footer .brand-area {
    justify-content: center;
  }
  footer .footer-col {
    align-items: center;
  }
  footer .copy {
    text-align: center;
  }
}

/* === FOOTER (layout only; palette preserved) === */
.footer-savio{ padding:16px 0 14px; color:var(--text); background:var(--bg); }
.footer-savio .container{ max-width:1120px; margin:0 auto; padding:0 20px; }

/* Top row */
.footer-savio .footer-top{ display:grid; grid-template-columns:1fr auto 1fr; align-items:center; column-gap:24px; }
.footer-savio .ft-col{ display:flex; flex-direction:column; }
.footer-savio .ft-left{ align-items:flex-start; text-align:left; }
.footer-savio .ft-center{ align-items:center; text-align:center; }
.footer-savio .ft-right{ align-items:flex-end; text-align:right; }

.footer-savio .ft-line{ margin:0 0 3px; }
.footer-savio .ft-logo{ height:48px; width:auto; display:block; }
@media (min-width:1024px){ .footer-savio .ft-logo{ height:72px; } }

.footer-savio .ft-address{ margin:0; line-height:1.45; }
.footer-savio .ft-address strong{ display:inline-block; margin-bottom:6px; }
.footer-savio .ft-social{ display:flex; gap:12px; margin-top:10px; justify-content:flex-end; }
@media (max-width:900px){
  .footer-savio .footer-top{ grid-template-columns:1fr; row-gap:14px; }
  .footer-savio .ft-left, .footer-savio .ft-right{ align-items:center; text-align:center; }
  .footer-savio .ft-social{ justify-content:center; }
}

/* Divider */
.footer-savio .ft-divider{ border:0; border-top:1px solid rgba(255,255,255,.12); margin:12px 0 8px; }

/* Bottom band */
.footer-savio .footer-bottom{ display:grid; grid-template-columns:1fr auto 1fr; align-items:center; row-gap:6px; }
.footer-savio .ft-bottom-left{ justify-self:start; font-size:14px; opacity:.9; }
.footer-savio .ft-bottom-center{ justify-self:center; }
.footer-savio .ft-vibbe-img{ height:32px; width:auto; display:block; }
.footer-savio .ft-bottom-right{ justify-self:end; font-size:14px; opacity:.9; }
.footer-savio .ft-bottom-right a{ color:inherit; text-decoration:none; }
.footer-savio .ft-bottom-right a:hover{ text-decoration:underline; }
.footer-savio .ft-bottom-copyright{ grid-column:1/-1; justify-self:center; text-align:center; font-size:14px; line-height:1.2; opacity:.9; }
@media (max-width:900px){
  .footer-savio .footer-bottom{ grid-template-columns:1fr; }
  .footer-savio .ft-bottom-left, .footer-savio .ft-bottom-right{ justify-self:center; text-align:center; }
  .footer-savio .ft-vibbe-img{ height:26px; }
}

/* === Mobile fix v3: stack stats inside #sobre .empresa-stats === */
@media (max-width: 768px) {
  /* Target the direct flex wrapper inside .empresa-stats */
  #sobre .empresa-stats > div {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 18px !important;
    width: 100% !important;
    text-align: center !important;
  }
  /* Each stat block takes full width and centers its content */
  #sobre .empresa-stats > div > div {
    width: 100% !important;
    margin: 0 auto !important;
    display: block !important;
    text-align: center !important;
  }
}

/* Override: reduzir ainda mais a opacidade das imagens do HERO */
.slide__bg{
  opacity: 0.3 !important;               /* antes: 0.7 !important / 0.9 */
  filter: brightness(0.55) contrast(1);   /* leve escurecida para legibilidade */
}
/* Escurece um pouco mais o overlay para reforçar contraste do texto */
.hero::after{
  background: linear-gradient(180deg, rgba(0,0,0,.70), rgba(0,0,0,.80)) !important;
}

/* Respeita usuários que preferem reduzir animações */
@media (prefers-reduced-motion: reduce) {
  * { animation-duration: 0.001ms !important; animation-iteration-count: 1 !important; transition-duration: 0.001ms !important; scroll-behavior: auto !important; }
}

/* Base: revelação suave ao entrar na tela */
.reveal { opacity: 0; transform: translateY(16px); transition: opacity .6s ease, transform .6s ease; will-change: opacity, transform; }
.reveal.is-in { opacity: 1; transform: none; }

/* Variações declarativas via data-anim */
[data-anim="fade-up"]   { transform: translateY(18px); }
[data-anim="fade-left"] { transform: translateX(18px); }
[data-anim="fade-right"]{ transform: translateX(-18px); }
[data-anim="zoom-in"]   { transform: scale(.96); }
[data-anim].is-in       { transform: none; }

/* Hover lifts (cartões) */
.card, .servico-card, .produto-card, .projeto-card, blockquote.quote, .depo-card {
  transition: transform .25s ease, box-shadow .25s ease;
}
.card:hover, .servico-card:hover, .produto-card:hover, .projeto-card:hover, blockquote.quote:hover, .depo-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 12px 26px rgba(0, 0, 0, 0.18);
}

/* Imagens: zoom sutil no hover (sem quebrar layout) */
.gallery img, #projetos .projeto-card img, section#produtos img, .card-img, .servico-card .media img {
  transition: transform .5s ease;
}
.gallery img:hover, #projetos .projeto-card:hover img, section#produtos img:hover, .servico-card:hover .media img {
  transform: scale(1.03);
}

/* Botões: feedback de foco/hover consistente */
.btn, .btn-cta, .servico-card .cta, a.btn {
  transition: box-shadow .2s ease, transform .06s ease, filter .2s ease, border-color .2s ease;
  outline: none;
}
.btn:hover, .btn-cta:hover, .servico-card .cta:hover, a.btn:hover { transform: translateY(-1px); }
.btn:focus-visible, .btn-cta:focus-visible, .servico-card .cta:focus-visible, a.btn:focus-visible {
  box-shadow: 0 0 0 3px rgba(14,165,233,.35);
}

/* Hero: parallax suave (aplicado via JS) */
.hero .slide__bg, .hero .hero-overlay { will-change: transform; }

/* Fundo cinza claro aplicado corretamente na seção de produtos/serviços */
#produtos .servico-card {
  background-color: #f0f0f0 !important;
  border: 1px solid rgba(0,0,0,0.06);
  border-radius: 14px;
  box-shadow: 0 6px 20px rgba(0,0,0,0.08);
  transition: background-color .3s ease, box-shadow .3s ease, transform .22s ease;
}

#produtos .servico-card:hover {
  background-color: #eaeaea !important;
  box-shadow: 0 10px 26px rgba(0,0,0,0.12);
  transform: translateY(-4px);
}

/* Garante que a área interna não sobreescreva o fundo */
#produtos .servico-card .content { background: transparent !important; }
#produtos .servico-card .media img { border-top-left-radius: 14px; border-top-right-radius: 14px; }

@media (max-width: 768px) {
  .nav#site-menu {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
  }

  .nav#site-menu a {
    width: 100%;
    text-align: center;
    display: block;
    margin: 8px 0;
  }

  .nav#site-menu .btn-cta {
    margin-top: 12px;
  }
}

header .logo img,
.site-header .logo img,
.logo-img {
  height: 70px !important;
  max-height: 70px !important;
  width: auto;
  transition: height 0.3s ease;
}

footer .logo img,
.site-footer .logo img,
footer .logo-img {
  height: 70px !important;
  max-height: 70px !important;
  width: auto;
  transition: height 0.3s ease;
}

/* === Aumentar logos do HEADER e FOOTER em 50% === */

/* HEADER: garante proporção automática e limita por altura */
.site-header .logo-img,
header .logo img,
.header .logo img,
.topbar .logo img,
header img.logo,
.header img.logo,
.topbar img.logo,
header .brand img,
.header .brand img,
.topbar .brand img {
  width: auto !important;
  height: auto !important;
  max-height: 105px !important; /* ~70px x 1.5 */
}

/* MOBILE header */
@media (max-width: 768px){
  .site-header .logo-img,
  header .logo img,
  .header .logo img,
  .topbar .logo img,
  header img.logo,
  .header img.logo,
  .topbar img.logo,
  header .brand img,
  .header .brand img,
  .topbar .brand img {
    max-height: 75px !important; /* ~50px x 1.5 */
  }
}

/* FOOTER: cobre diferentes seletores usados no arquivo */
.footer-savio .ft-logo,
footer .logo img,
.site-footer .logo img,
footer .logo-img,
footer .brand-area img {
  width: auto !important;
  height: auto !important;
  max-height: 105px !important; /* ~70px x 1.5 */
}

/* MOBILE footer */
@media (max-width: 768px){
  .footer-savio .ft-logo,
  footer .logo img,
  .site-footer .logo img,
  footer .logo-img,
  footer .brand-area img {
    max-height: 75px !important; /* ~50px x 1.5 */
  }
}

/* === Footer Mobile Cleanup (melhor legibilidade) === */
@media (max-width: 768px){
  /* Container do footer Savio: mais respiro */
  .footer-savio{
    padding: 22px 0 18px !important;
  }
  .footer-savio .container{
    padding: 0 18px !important;
  }

  /* Top row vira coluna com espaçamento confortável */
  .footer-savio .footer-top{
    display: grid !important;
    grid-template-columns: 1fr !important;
    row-gap: 16px !important;
  }
  .footer-savio .ft-col{
    align-items: center !important;
    text-align: center !important;
    gap: 8px !important;
  }

  /* Logo com respiro extra */
  .footer-savio .ft-logo{
    margin-bottom: 6px !important;
  }

  /* Endereço/linhas com mais altura e separação */
  .footer-savio .ft-address{
    line-height: 1.55 !important;
    margin: 6px 0 2px !important;
  }
  .footer-savio .ft-line{
    margin: 2px 0 !important;
  }

  /* Ícones sociais centralizados com gap maior */
  .footer-savio .ft-social{
    justify-content: center !important;
    gap: 14px !important;
    margin-top: 8px !important;
  }

  /* Divisor com mais espaço vertical */
  .footer-savio .ft-divider{
    margin: 14px 0 10px !important;
  }

  /* Bottom band empilhado, central e espaçado */
  .footer-savio .footer-bottom{
    display: grid !important;
    grid-template-columns: 1fr !important;
    row-gap: 10px !important;
  }
  .footer-savio .ft-bottom-left,
  .footer-savio .ft-bottom-center,
  .footer-savio .ft-bottom-right,
  .footer-savio .ft-bottom-copyright{
    justify-self: center !important;
    text-align: center !important;
  }

  /* Texto levemente menor p/ evitar quebra e aumentar legibilidade */
  .footer-savio .ft-bottom-left,
  .footer-savio .ft-bottom-right{
    font-size: 13.5px !important;
    line-height: 1.45 !important;
  }
  .footer-savio .ft-bottom-copyright{
    font-size: 13.5px !important;
    margin-top: 2px !important;
  }

  /* Links com click-area confortável */
  .footer-savio a{
    display: inline-block !important;
    padding: 4px 6px !important;
  }
}

/* Força fundo cinza bem clarinho na seção de depoimentos */
  #depoimentos {
    background: #eeeeee !important;
    background-color: #eeeeee !important;
  }

#imgModal {
  display: none;
  position: fixed;
  z-index: 9999;
  padding-top: 60px;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  overflow: auto;
  background-color: rgba(0,0,0,0.9);
}
#imgModal img {
  margin: auto;
  display: block;
  max-width: 90%;
  max-height: 80%;
  border-radius: 4px;
}
#imgModal span {
  position: absolute;
  top: 15px;
  right: 35px;
  color: #fff;
  font-size: 40px;
  font-weight: bold;
  cursor: pointer;
}
#imgModal span:hover {
  color: #bbb;
}