/* ============================================================
   Mobile fixes — sidebar menu, footer compaction, button layout
   Se carga DESPUÉS del CSS inline de cada página para sobrescribir
   ============================================================ */

@media (max-width: 640px) {

  body.menu-open { overflow: hidden; }

  /* ───── HAMBURGUESA EN MÓVIL ───── */
  .mb {
    display: flex !important;
    align-items: center;
    justify-content: center;
  }

  /* ───── MENÚ MÓVIL — display controlado por JS via setProperty ───── */
  .nv {
    display: none !important;
  }
  .nv a {
    font-size: 1.02rem !important;
    padding: .95rem 0 !important;
    border-bottom: 1px solid #e5e7eb !important;
    width: 100% !important;
    color: #1f2937 !important;
    text-align: left !important;
    font-weight: 500 !important;
    display: block !important;
  }
  .nv a.nv__ph {
    background: #D97706 !important;
    color: #fff !important;
    padding: .8rem 1.5rem !important;
    border-radius: 50px !important;
    text-align: center !important;
    margin-top: 1.5rem !important;
    border-bottom: none !important;
    width: fit-content !important;
    margin-left: auto !important;
    margin-right: auto !important;
    font-weight: 600 !important;
  }

  /* Backdrop oscuro detrás del menú */
  .nv-backdrop {
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,.4);
    z-index: 999;
    opacity: 0;
    pointer-events: none;
    transition: opacity .3s;
  }
  .nv-backdrop.show {
    opacity: 1;
    pointer-events: auto;
  }

  /* ───── FOOTER COMPACTO ───── */
  footer.ft { padding-top: 2rem !important; }
  .ft__g {
    grid-template-columns: 1fr !important;
    padding: 0 1.1rem 1.5rem !important;
    gap: 1.5rem !important;
  }

  /* Logo y texto centrados */
  .ft__g > div:first-child {
    text-align: center !important;
  }
  .ft__g > div:first-child a {
    display: block !important;
    text-align: center !important;
  }
  .ft__g > div:first-child a img {
    margin: 0 auto .75rem !important;
    height: 80px !important;
  }
  .ft__desc {
    font-size: .82rem !important;
    margin-bottom: .4rem !important;
    text-align: center !important;
  }

  .ft h4 { font-size: .75rem !important; margin-bottom: .5rem !important; }
  .ft li { margin-bottom: .35rem !important; }
  .ft__bt { padding: 1rem !important; }
  .ft__bt-in {
    padding: 0 .5rem 4.5rem !important;
    flex-direction: column !important;
    gap: .6rem !important;
    text-align: center !important;
  }
  .ft__lgl {
    flex-wrap: wrap !important;
    justify-content: center !important;
    gap: .4rem .9rem !important;
  }
  .ft__lgl a { font-size: .73rem !important; }

  /* ───── BOTONES EN PAREJA (lado a lado cuando hay espacio) ───── */
  .cta__b,
  .hero__btns {
    flex-direction: row !important;
    flex-wrap: wrap !important;
    justify-content: center !important;
    gap: .55rem !important;
  }
  .cta__b .btn,
  .hero__btns .btn {
    flex: 1 1 auto !important;
    min-width: 140px !important;
    justify-content: center !important;
    padding: .7rem 1rem !important;
    font-size: .9rem !important;
  }
}