/* ═══════════════════════════════════════════════════════════
   RESPONSIVO — Isagui Soluções
   !important é necessário para sobrescrever estilos inline.
   ═══════════════════════════════════════════════════════════ */

/* ── HEADER / NAVEGAÇÃO ────────────────────────────────────── */
/* Esconde links de texto no mobile, mantém só o botão WhatsApp */
@media (max-width:880px) {
  header nav > a:not(:last-child) { display:none !important; }
  header nav { gap:12px !important; }
  header > div { padding-left:16px !important; padding-right:16px !important; }
}

/* ── HERO: seção com padding 148px ──────────────────────────── */
@media (max-width:880px) {
  .rg-hero-sec {
    padding-top:108px !important;
    padding-left:16px !important;
    padding-right:16px !important;
    padding-bottom:56px !important;
  }
}

/* ── HERO GRID: 2 colunas → 1 coluna ────────────────────────── */
@media (max-width:880px) {
  .rg-h {
    grid-template-columns:1fr !important;
    gap:32px !important;
  }
  /* Imagem fica ABAIXO do texto. Restrito ao #inicio para não
     bloquear links em outras seções que também usam .rg-h */
  #inicio .rg-h > div:last-child { touch-action:pan-y; }
  #inicio .rg-h > div:last-child * { touch-action:pan-y; pointer-events:none; }
}

/* ── BOTÕES HERO: centralizar no mobile ─────────────────────── */
@media (max-width:880px) {
  .cta-row { justify-content:center !important; }
}
@media (max-width:380px) {
  .cta-row { flex-direction:column !important; align-items:center !important; }
  .cta-row > a { width:min(280px,100%) !important; justify-content:center !important; }
}

/* ── 2-COL CONTENT (seções com foto + texto) ─────────────────── */
@media (max-width:768px) {
  .rg-2 {
    grid-template-columns:1fr !important;
    gap:32px !important;
  }
}

/* ── SMALL 2-COL (features 01/02, campos de form) ───────────── */
@media (max-width:640px) {
  .rg-fw {
    grid-template-columns:1fr !important;
    gap:14px !important;
  }
}

/* ── QUEM SOMOS: alinha 01/02/03/04 quando empilhados ─────────── */
@media (max-width:640px) {
  #quem-somos .rg-fw > div {
    justify-content:flex-start !important;
    align-items:center !important;
  }
}

/* ── 3-COL GALERIA FIXA → 1 coluna ─────────────────────────── */
@media (max-width:640px) {
  .rg-3 {
    grid-template-columns:1fr !important;
    gap:14px !important;
  }
}

/* ── FOOTER GRID: 4 col → 2×2 → layout personalizado ──────── */
@media (max-width:860px) {
  .rg-f {
    grid-template-columns:1fr 1fr !important;
    gap:30px !important;
  }
}
@media (max-width:520px) {
  .rg-f {
    grid-template-columns:1fr 1fr !important;
    grid-template-areas:
      "logo logo"
      "nav  srv"
      "ctt  ctt" !important;
    gap:32px 20px !important;
  }
  /* Logo: centralizado */
  .rg-f > div:nth-child(1) {
    grid-area:logo;
    display:flex !important;
    flex-direction:column !important;
    align-items:center !important;
    text-align:center !important;
  }
  .rg-f > div:nth-child(1) > p { max-width:100% !important; }
  .rg-f > div:nth-child(1) > div { justify-content:center !important; }
  /* Navegação ao lado de Serviços */
  .rg-f > div:nth-child(2) { grid-area:nav; text-align:center; }
  .rg-f > div:nth-child(3) { grid-area:srv; text-align:center; }
  /* Contato abaixo, centralizado */
  .rg-f > div:nth-child(4) { grid-area:ctt; text-align:center; }
}

/* ── FOOTER BARRA INFERIOR: centralizar no mobile ───────────── */
@media (max-width:640px) {
  .rg-footer-bottom {
    flex-direction:column !important;
    align-items:center !important;
    text-align:center !important;
    gap:4px !important;
  }
  .rg-cnpj-sep { display:none !important; }
  .rg-cnpj { display:block !important; }
}

/* ── PADDING HORIZONTAL GERAL ────────────────────────────────── */
@media (max-width:640px) {
  section { padding-left:16px !important; padding-right:16px !important; }
  footer  { padding-left:16px !important; padding-right:16px !important; }
}

/* ── CONTATO: grid 2-col → stack ────────────────────────────── */
@media (max-width:640px) {
  .rg-contato {
    grid-template-columns:1fr !important;
    gap:40px !important;
  }
}

/* ── LOGOS MARQUEE ──────────────────────────────────────────── */
@media (max-width:480px) {
  .logo-card {
    width:130px !important;
    height:68px !important;
  }
}

/* ── STAT NÚMEROS (quem somos) ──────────────────────────────── */
@media (max-width:520px) {
  .rg-stats {
    grid-template-columns:1fr 1fr !important;
  }
}
@media (max-width:380px) {
  .rg-stats { grid-template-columns:1fr !important; }
}

/* ── PRODUTOS / DIFERENCIAIS (auto-fit already responsive) ───── */
/* Garantir min-width razoável em telas muito pequenas           */
@media (max-width:400px) {
  [style*="minmax(260px"] {
    grid-template-columns:1fr !important;
  }
  [style*="minmax(300px"] {
    grid-template-columns:1fr !important;
  }
}


/* ── BACK LINK (voltar para serviços) ───────────────────────── */
@media (max-width:640px) {
  .rg-hero-sec a[href*="index"] { font-size:12px !important; }
}

/* ── BADGE "3 em 1" no quem somos ───────────────────────────── */
@media (max-width:880px) {
  .badge-somos {
    right:8px !important;
    bottom:8px !important;
    padding:12px 16px !important;
  }
  .badge-somos > div:first-child { font-size:20px !important; }
}

/* ── BLOG CARDS GRID ────────────────────────────────────────── */
@media (max-width:640px) {
  .rg-blog {
    grid-template-columns:1fr !important;
    gap:20px !important;
  }
}
