/* =========================================================
   Nanas Seguras Perú - FOOTER GLOBAL AISLADO
   Archivo único para el footer público y menú inferior móvil.
   NO usar en formularios. Cargar siempre después de home.css.
   ========================================================= */

:root{
  --ns-footer-bg:#03045e;
  --ns-footer-text:#ffffff;
  --ns-footer-muted:rgba(255,255,255,.78);
  --ns-footer-soft:rgba(255,255,255,.62);
  --ns-footer-line:rgba(255,255,255,.14);
  --ns-footer-accent:#ffd166;
  --ns-footer-dot:#ffafcc;
  --ns-footer-shadow:0 -18px 45px rgba(3,4,94,.16);
}

/* ---------- Base footer: mismo HTML para PC y celular ---------- */
body .footer-redesign,
body footer.footer-redesign.site-footer{
  position:relative !important;
  isolation:isolate !important;
  overflow:hidden !important;
  background:var(--ns-footer-bg) !important;
  color:var(--ns-footer-text) !important;
  padding:58px 18px 28px !important;
  margin:0 !important;
  font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif !important;
  box-shadow:var(--ns-footer-shadow) !important;
}

body .footer-redesign *,
body .footer-redesign *::before,
body .footer-redesign *::after{
  box-sizing:border-box !important;
}

body .footer-redesign a{
  color:inherit !important;
  text-decoration:none !important;
}

body .footer-redesign svg{
  display:block !important;
  width:1em !important;
  height:1em !important;
  fill:none !important;
  stroke:currentColor !important;
  stroke-width:1.75 !important;
  stroke-linecap:round !important;
  stroke-linejoin:round !important;
}

body .footer-redesign svg path,
body .footer-redesign svg circle{
  vector-effect:non-scaling-stroke !important;
}

/* ---------- Columnas superiores ---------- */
body .footer-redesign__top{
  width:min(1180px,100%) !important;
  margin:0 auto !important;
  display:grid !important;
  grid-template-columns:minmax(150px,1fr) minmax(150px,1fr) minmax(300px,1.35fr) minmax(175px,1fr) !important;
  gap:30px !important;
  align-items:start !important;
  border:0 !important;
  padding:0 0 28px !important;
}

body .footer-redesign .footer-col{
  min-width:0 !important;
  width:100% !important;
  text-align:left !important;
}

body .footer-redesign .footer-col h2,
body .footer-redesign .footer-social-block h2{
  margin:0 0 16px !important;
  padding:0 !important;
  color:var(--ns-footer-accent) !important;
  font-size:18px !important;
  line-height:1.2 !important;
  font-weight:800 !important;
  letter-spacing:-.01em !important;
}

body .footer-redesign .footer-col > a:not(.footer-book-card){
  position:relative !important;
  display:flex !important;
  align-items:flex-start !important;
  justify-content:flex-start !important;
  gap:10px !important;
  width:fit-content !important;
  max-width:100% !important;
  margin:0 0 11px !important;
  padding:0 !important;
  color:var(--ns-footer-muted) !important;
  font-size:15px !important;
  line-height:1.35 !important;
  font-weight:500 !important;
  white-space:normal !important;
  word-break:normal !important;
  overflow-wrap:normal !important;
  text-align:left !important;
  transition:opacity .2s ease, transform .2s ease, color .2s ease !important;
}

body .footer-redesign .footer-col:not(.footer-contact) > a:not(.footer-book-card)::before{
  content:"" !important;
  width:5px !important;
  height:5px !important;
  min-width:5px !important;
  margin-top:.55em !important;
  border-radius:999px !important;
  background:var(--ns-footer-dot) !important;
  flex:0 0 5px !important;
}

body .footer-redesign .footer-col > a:hover{
  color:#fff !important;
  opacity:.95 !important;
  transform:translateX(2px) !important;
}

/* ---------- Contacto: evita dirección letra por letra ---------- */
body .footer-redesign .footer-contact{
  min-width:300px !important;
}

body .footer-redesign .footer-contact a,
body .footer-redesign .footer-contact p{
  display:grid !important;
  grid-template-columns:20px minmax(0,1fr) !important;
  column-gap:10px !important;
  align-items:start !important;
  width:100% !important;
  max-width:100% !important;
  margin:0 0 12px !important;
  padding:0 !important;
  color:var(--ns-footer-muted) !important;
  font-size:15px !important;
  line-height:1.45 !important;
  font-weight:500 !important;
  text-align:left !important;
  white-space:normal !important;
  word-break:normal !important;
  overflow-wrap:break-word !important;
  text-wrap:pretty !important;
}

body .footer-redesign .footer-contact svg{
  color:var(--ns-footer-accent) !important;
  width:19px !important;
  height:19px !important;
  margin-top:2px !important;
  flex:0 0 19px !important;
}

body .footer-redesign .footer-contact strong{
  display:inline !important;
  margin-right:4px !important;
  color:#fff !important;
  font-weight:800 !important;
  white-space:nowrap !important;
}

/* ---------- Bloque medio: libro + empresa + redes ---------- */
body .footer-redesign__middle{
  width:min(1180px,100%) !important;
  margin:0 auto !important;
  padding:24px 0 20px !important;
  border-top:1px solid var(--ns-footer-line) !important;
  border-bottom:0 !important;
  display:grid !important;
  grid-template-columns:minmax(190px,.85fr) minmax(360px,1.45fr) minmax(260px,.85fr) !important;
  gap:26px !important;
  align-items:center !important;
}

body .footer-redesign__middle::before,
body .footer-redesign__middle::after,
body .footer-redesign__top::before,
body .footer-redesign__top::after{
  display:none !important;
  content:none !important;
}

body .footer-book-card{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:flex-start !important;
  gap:12px !important;
  width:max-content !important;
  max-width:100% !important;
  margin:0 !important;
  padding:0 !important;
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
  color:#fff !important;
  transition:transform .2s ease, opacity .2s ease !important;
}

body .footer-book-card:hover{
  transform:translateY(-1px) !important;
  opacity:.9 !important;
}

body .footer-book-card__icon{
  width:58px !important;
  height:58px !important;
  min-width:58px !important;
  color:var(--ns-footer-accent) !important;
  stroke-width:1.45 !important;
}

body .footer-book-card strong{
  display:block !important;
  color:#fff !important;
  font-size:16px !important;
  line-height:1.08 !important;
  font-weight:800 !important;
}

body .footer-book-card em{
  display:block !important;
  margin-top:4px !important;
  color:var(--ns-footer-dot) !important;
  font-style:normal !important;
  font-size:13px !important;
  line-height:1.1 !important;
  font-weight:700 !important;
}

body .footer-company{
  text-align:center !important;
  color:var(--ns-footer-muted) !important;
  min-width:0 !important;
}

body .footer-company p{
  margin:0 0 6px !important;
  padding:0 !important;
  font-size:14px !important;
  line-height:1.5 !important;
  font-weight:500 !important;
  color:var(--ns-footer-muted) !important;
  white-space:normal !important;
  word-break:normal !important;
  overflow-wrap:break-word !important;
}

body .footer-company strong{
  color:#fff !important;
  font-weight:800 !important;
}

/* ---------- Redes: sin círculos, blancos, alineados ---------- */
body .footer-social-block{
  display:flex !important;
  align-items:center !important;
  justify-content:flex-end !important;
  gap:18px !important;
  min-width:0 !important;
  text-align:right !important;
}

body .footer-social-block h2{
  margin:0 !important;
  white-space:nowrap !important;
  font-size:18px !important;
}

body .footer-social-premium{
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap:18px !important;
  margin:0 !important;
  padding:0 !important;
  line-height:1 !important;
}

body .footer-social-premium .social-premium,
body .footer-redesign a.social-premium{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  width:28px !important;
  height:28px !important;
  min-width:28px !important;
  margin:0 !important;
  padding:0 !important;
  background:transparent !important;
  border:0 !important;
  border-radius:0 !important;
  box-shadow:none !important;
  color:#fff !important;
  opacity:1 !important;
  transform:none !important;
  transition:transform .2s ease, opacity .2s ease !important;
}

body .footer-social-premium .social-premium svg,
body .footer-redesign a.social-premium svg{
  width:22px !important;
  height:22px !important;
  color:#fff !important;
  fill:#fff !important;
  stroke:none !important;
}

body .footer-social-premium .social-premium:hover,
body .footer-redesign a.social-premium:hover{
  transform:translateY(-2px) scale(1.04) !important;
  opacity:.82 !important;
  background:transparent !important;
  color:#fff !important;
}

/* ---------- Disclaimer legal: pequeño, delgado y sin doble línea ---------- */
body .footer-redesign__legal-disclaimer{
  width:min(980px,100%) !important;
  margin:0 auto !important;
  padding:12px 0 0 !important;
  border-top:1px solid var(--ns-footer-line) !important;
  border-bottom:0 !important;
  text-align:center !important;
  color:var(--ns-footer-soft) !important;
}

body .footer-redesign__legal-disclaimer::before,
body .footer-redesign__legal-disclaimer::after{
  display:none !important;
  content:none !important;
}

body .footer-redesign__legal-disclaimer p{
  max-width:900px !important;
  margin:0 auto 4px !important;
  padding:0 !important;
  color:var(--ns-footer-soft) !important;
  font-size:11px !important;
  line-height:1.45 !important;
  font-weight:400 !important;
  letter-spacing:0 !important;
  text-align:center !important;
}

/* ---------- Menú inferior móvil ---------- */
body .footer-redesign .bottom-nav{
  display:none !important;
}

@media (max-width: 767px){
  body .footer-redesign,
  body footer.footer-redesign.site-footer{
    padding:38px 18px 74px !important;
  }

  body .footer-redesign__top{
    display:grid !important;
    grid-template-columns:1fr !important;
    gap:24px !important;
    padding-bottom:22px !important;
    text-align:center !important;
  }

  body .footer-redesign .footer-col{
    text-align:center !important;
    display:flex !important;
    flex-direction:column !important;
    align-items:center !important;
    justify-content:flex-start !important;
  }

  body .footer-redesign .footer-col h2,
  body .footer-redesign .footer-social-block h2{
    font-size:18px !important;
    margin-bottom:12px !important;
    text-align:center !important;
  }

  body .footer-redesign .footer-col > a:not(.footer-book-card){
    display:inline-flex !important;
    align-items:flex-start !important;
    justify-content:flex-start !important;
    width:auto !important;
    max-width:min(300px,100%) !important;
    margin:0 auto 9px !important;
    text-align:left !important;
    font-size:14.5px !important;
    line-height:1.35 !important;
  }

  body .footer-redesign .footer-col:not(.footer-contact) > a:not(.footer-book-card)::before{
    margin-top:.55em !important;
  }

  body .footer-redesign .footer-contact{
    min-width:0 !important;
  }

  body .footer-redesign .footer-contact a,
  body .footer-redesign .footer-contact p{
    width:min(330px,100%) !important;
    max-width:100% !important;
    margin-left:auto !important;
    margin-right:auto !important;
    grid-template-columns:20px minmax(0,1fr) !important;
    font-size:14.5px !important;
    line-height:1.42 !important;
    text-align:left !important;
  }

  body .footer-redesign__middle{
    grid-template-columns:1fr !important;
    gap:18px !important;
    padding:22px 0 16px !important;
    text-align:center !important;
  }

  body .footer-book-card{
    justify-content:center !important;
    margin:0 auto !important;
  }

  body .footer-company{
    text-align:center !important;
  }

  body .footer-company p{
    font-size:13px !important;
    line-height:1.45 !important;
  }

  body .footer-social-block{
    flex-direction:column !important;
    align-items:center !important;
    justify-content:center !important;
    gap:10px !important;
    text-align:center !important;
  }

  body .footer-social-premium{
    gap:22px !important;
  }

  body .footer-social-premium .social-premium,
  body .footer-redesign a.social-premium{
    width:28px !important;
    height:28px !important;
    min-width:28px !important;
  }

  body .footer-social-premium .social-premium svg,
  body .footer-redesign a.social-premium svg{
    width:22px !important;
    height:22px !important;
  }

  body .footer-redesign__legal-disclaimer{
    padding-top:10px !important;
  }

  body .footer-redesign__legal-disclaimer p{
    font-size:10.5px !important;
    line-height:1.42 !important;
    max-width:320px !important;
  }

  body .footer-redesign .bottom-nav{
    position:fixed !important;
    left:0 !important;
    right:0 !important;
    bottom:0 !important;
    z-index:9999 !important;
    width:100% !important;
    height:66px !important;
    min-height:66px !important;
    padding:6px 8px calc(6px + env(safe-area-inset-bottom,0px)) !important;
    display:grid !important;
    grid-template-columns:repeat(5,1fr) !important;
    align-items:end !important;
    justify-items:center !important;
    gap:0 !important;
    background:#fff !important;
    border-radius:20px 20px 0 0 !important;
    box-shadow:0 -8px 24px rgba(3,4,94,.15) !important;
    border:0 !important;
    margin:0 !important;
    overflow:visible !important;
  }

  body .footer-redesign .bottom-nav a{
    position:relative !important;
    width:100% !important;
    height:54px !important;
    min-width:0 !important;
    display:flex !important;
    flex-direction:column !important;
    align-items:center !important;
    justify-content:center !important;
    gap:2px !important;
    padding:0 !important;
    margin:0 !important;
    color:#03045e !important;
    background:transparent !important;
    border:0 !important;
    box-shadow:none !important;
    border-radius:0 !important;
    font-size:10.5px !important;
    line-height:1.05 !important;
    font-weight:700 !important;
    text-align:center !important;
    text-decoration:none !important;
  }

  body .footer-redesign .bottom-nav a svg{
    width:22px !important;
    height:22px !important;
    color:#ffd166 !important;
    stroke:currentColor !important;
    fill:none !important;
    stroke-width:1.85 !important;
  }

  body .footer-redesign .bottom-nav a .wa-icon{
    color:#22c55e !important;
    fill:#22c55e !important;
    stroke:none !important;
  }

  body .footer-redesign .bottom-nav a span{
    display:block !important;
    color:#03045e !important;
    font-size:10.5px !important;
    line-height:1.05 !important;
    font-weight:800 !important;
    white-space:nowrap !important;
  }

  body .footer-redesign .bottom-nav a.bottom-main{
    width:58px !important;
    height:58px !important;
    min-width:58px !important;
    border-radius:999px !important;
    background:#ffafcc !important;
    color:#03045e !important;
    box-shadow:0 10px 24px rgba(255,175,204,.38) !important;
    transform:translateY(-12px) !important;
  }

  body .footer-redesign .bottom-nav a.bottom-main svg{
    width:22px !important;
    height:22px !important;
    color:#03045e !important;
  }

  body .footer-redesign .bottom-nav a.bottom-main span{
    font-size:9.5px !important;
    color:#03045e !important;
  }
}

@media (max-width: 380px){
  body .footer-redesign,
  body footer.footer-redesign.site-footer{
    padding-left:14px !important;
    padding-right:14px !important;
    padding-bottom:72px !important;
  }

  body .footer-redesign .footer-col > a:not(.footer-book-card),
  body .footer-redesign .footer-contact a,
  body .footer-redesign .footer-contact p{
    font-size:13.6px !important;
  }

  body .footer-redesign__legal-disclaimer p{
    max-width:290px !important;
    font-size:10px !important;
  }

  body .footer-redesign .bottom-nav{
    height:64px !important;
    min-height:64px !important;
    padding-left:4px !important;
    padding-right:4px !important;
    border-radius:18px 18px 0 0 !important;
  }

  body .footer-redesign .bottom-nav a{
    height:52px !important;
  }

  body .footer-redesign .bottom-nav a svg{
    width:20px !important;
    height:20px !important;
  }

  body .footer-redesign .bottom-nav a span{
    font-size:9.4px !important;
  }

  body .footer-redesign .bottom-nav a.bottom-main{
    width:54px !important;
    height:54px !important;
    min-width:54px !important;
  }

  body .footer-redesign .bottom-nav a.bottom-main span{
    font-size:8.8px !important;
  }
}

@media (min-width:768px) and (max-width:1024px){
  body .footer-redesign__top{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  }
  body .footer-redesign__middle{
    grid-template-columns:1fr !important;
    text-align:center !important;
  }
  body .footer-book-card{margin:0 auto !important;}
  body .footer-social-block{justify-content:center !important;}
}


/* =========================================================
   FIX QUIRURGICO FINAL - Footer único responsive
   - No crea otro footer
   - Corrige dirección letra por letra
   - Corrige bullets
   - Alinea redes
   - Mantiene menú móvil
   ========================================================= */

/* Contenedor principal */
body footer.footer-redesign,
body .footer-redesign{
  background:#03045e !important;
  color:#fff !important;
  overflow:hidden !important;
}

/* GRID PC estable */
@media (min-width: 1025px){
  body .footer-redesign__top{
    width:min(1180px,100%) !important;
    display:grid !important;
    grid-template-columns:minmax(170px,1fr) minmax(170px,1fr) minmax(360px,1.45fr) minmax(210px,1fr) !important;
    gap:42px !important;
    align-items:start !important;
  }
  body .footer-redesign .footer-contact{
    min-width:360px !important;
    max-width:420px !important;
  }
}

/* Links con puntos alineados */
body .footer-redesign .footer-col:not(.footer-contact) > a:not(.footer-book-card){
  display:flex !important;
  flex-direction:row !important;
  align-items:center !important;
  justify-content:flex-start !important;
  gap:10px !important;
  width:max-content !important;
  max-width:100% !important;
  margin:0 0 11px !important;
  padding:0 !important;
  text-align:left !important;
  white-space:normal !important;
  word-break:normal !important;
  overflow-wrap:normal !important;
}
body .footer-redesign .footer-col:not(.footer-contact) > a:not(.footer-book-card)::before{
  content:"" !important;
  display:block !important;
  width:5px !important;
  height:5px !important;
  min-width:5px !important;
  flex:0 0 5px !important;
  margin:0 !important;
  border-radius:50% !important;
  background:#ffafcc !important;
}

/* Contacto: NO usar grid, evita texto vertical */
body .footer-redesign .footer-contact a,
body .footer-redesign .footer-contact p{
  display:flex !important;
  flex-direction:row !important;
  align-items:flex-start !important;
  justify-content:flex-start !important;
  gap:10px !important;
  width:100% !important;
  max-width:100% !important;
  min-width:0 !important;
  margin:0 0 12px !important;
  padding:0 !important;
  text-align:left !important;
  white-space:normal !important;
  word-break:normal !important;
  overflow-wrap:normal !important;
  hyphens:none !important;
}
body .footer-redesign .footer-contact svg{
  flex:0 0 20px !important;
  width:20px !important;
  height:20px !important;
  margin-top:1px !important;
  color:#ffd166 !important;
}
body .footer-redesign .footer-contact .footer-address-text{
  display:inline-block !important;
  min-width:0 !important;
  max-width:100% !important;
  white-space:normal !important;
  word-break:normal !important;
  overflow-wrap:normal !important;
  hyphens:none !important;
  line-height:1.45 !important;
}
body .footer-redesign .footer-contact strong{
  display:inline !important;
  white-space:nowrap !important;
  margin-right:4px !important;
}

/* Línea única antes del disclaimer */
body .footer-redesign__middle{
  border-top:1px solid rgba(255,255,255,.14) !important;
  border-bottom:0 !important;
}
body .footer-redesign__legal-disclaimer{
  border-top:1px solid rgba(255,255,255,.14) !important;
  border-bottom:0 !important;
  padding-top:10px !important;
}

/* Redes alineadas */
body .footer-redesign .footer-social-block{
  display:flex !important;
  flex-direction:row !important;
  align-items:center !important;
  justify-content:flex-end !important;
  gap:18px !important;
  text-align:right !important;
}
body .footer-redesign .footer-social-block h2{
  margin:0 !important;
  line-height:1 !important;
  white-space:nowrap !important;
}
body .footer-redesign .footer-social-premium{
  display:flex !important;
  flex-direction:row !important;
  align-items:center !important;
  justify-content:center !important;
  gap:18px !important;
  margin:0 !important;
  padding:0 !important;
}
body .footer-redesign a.social-premium,
body .footer-social-premium .social-premium{
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
  border-radius:0 !important;
  width:28px !important;
  height:28px !important;
  min-width:28px !important;
  color:#fff !important;
  padding:0 !important;
}
body .footer-redesign a.social-premium svg,
body .footer-social-premium .social-premium svg{
  width:22px !important;
  height:22px !important;
  color:#fff !important;
  fill:#fff !important;
  stroke:none !important;
}

/* Mobile: mismo footer, solo apilado */
@media (max-width: 767px){
  body footer.footer-redesign,
  body .footer-redesign{
    padding:34px 22px 72px !important;
  }
  body .footer-redesign__top{
    display:grid !important;
    grid-template-columns:1fr !important;
    gap:26px !important;
    align-items:start !important;
    text-align:left !important;
    padding-bottom:24px !important;
  }
  body .footer-redesign .footer-col{
    display:block !important;
    text-align:left !important;
    width:100% !important;
  }
  body .footer-redesign .footer-col h2,
  body .footer-redesign .footer-social-block h2{
    text-align:left !important;
    margin:0 0 12px !important;
  }
  body .footer-redesign .footer-col:not(.footer-contact) > a:not(.footer-book-card){
    width:max-content !important;
    max-width:100% !important;
    margin:0 0 9px !important;
    justify-content:flex-start !important;
    text-align:left !important;
  }
  body .footer-redesign .footer-contact{
    min-width:0 !important;
    max-width:none !important;
    width:100% !important;
  }
  body .footer-redesign .footer-contact a,
  body .footer-redesign .footer-contact p{
    width:100% !important;
    max-width:100% !important;
    margin-left:0 !important;
    margin-right:0 !important;
    text-align:left !important;
    justify-content:flex-start !important;
  }
  body .footer-redesign .footer-contact .footer-address-text{
    max-width:calc(100vw - 74px) !important;
  }
  body .footer-redesign__middle{
    display:grid !important;
    grid-template-columns:1fr !important;
    gap:18px !important;
    text-align:center !important;
    padding:22px 0 16px !important;
  }
  body .footer-book-card{
    margin:0 auto !important;
    justify-content:center !important;
  }
  body .footer-company{
    text-align:center !important;
  }
  body .footer-redesign .footer-social-block{
    flex-direction:column !important;
    justify-content:center !important;
    align-items:center !important;
    gap:12px !important;
    text-align:center !important;
  }
  body .footer-redesign .footer-social-block h2{
    text-align:center !important;
  }
  body .footer-redesign .footer-social-premium{
    gap:24px !important;
  }
  body .footer-redesign__legal-disclaimer p{
    font-size:10.5px !important;
    line-height:1.42 !important;
    font-weight:400 !important;
    max-width:330px !important;
  }
}

@media (max-width: 380px){
  body footer.footer-redesign,
  body .footer-redesign{
    padding-left:18px !important;
    padding-right:18px !important;
  }
  body .footer-redesign .footer-contact .footer-address-text{
    max-width:calc(100vw - 66px) !important;
  }
}


/* =========================================================
   FIX DEFINITIVO 2026-06-08 - Footer único + móvil real
   - Mismo footer en PC y celular
   - Dirección no se rompe letra por letra
   - Libro más visible
   - Menú app separado del contenido
   ========================================================= */

body footer.footer-redesign,
body .footer-redesign{
  max-width:100% !important;
}

/* PC: columnas más estables */
@media (min-width:1025px){
  body .footer-redesign__top{
    grid-template-columns:minmax(170px,1fr) minmax(170px,1fr) minmax(420px,1.8fr) minmax(210px,1fr) !important;
    column-gap:48px !important;
    width:min(1180px,100%) !important;
  }
  body .footer-redesign .footer-contact{
    min-width:420px !important;
    max-width:480px !important;
  }
  body .footer-redesign .footer-contact p,
  body .footer-redesign .footer-contact a{
    display:flex !important;
    flex-wrap:nowrap !important;
    align-items:center !important;
    gap:10px !important;
    width:auto !important;
    max-width:100% !important;
    white-space:nowrap !important;
    word-break:keep-all !important;
    overflow-wrap:normal !important;
    hyphens:none !important;
  }
  body .footer-redesign .footer-contact .footer-address-text{
    display:inline !important;
    white-space:nowrap !important;
    word-break:keep-all !important;
    overflow-wrap:normal !important;
    hyphens:none !important;
    max-width:none !important;
  }
}

/* móvil: mismo footer, solo apilado; contacto legible */
@media (max-width:767px){
  body .footer-redesign__top{
    display:grid !important;
    grid-template-columns:1fr !important;
    text-align:left !important;
    gap:24px !important;
  }
  body .footer-redesign .footer-col{
    text-align:left !important;
    align-items:flex-start !important;
  }
  body .footer-redesign .footer-col h2{
    text-align:left !important;
  }
  body .footer-redesign .footer-contact p,
  body .footer-redesign .footer-contact a{
    display:flex !important;
    flex-wrap:nowrap !important;
    align-items:flex-start !important;
    gap:10px !important;
    width:100% !important;
    max-width:100% !important;
    white-space:normal !important;
    word-break:normal !important;
    overflow-wrap:normal !important;
    hyphens:none !important;
  }
  body .footer-redesign .footer-contact .footer-address-text{
    display:inline-block !important;
    width:auto !important;
    max-width:calc(100vw - 88px) !important;
    white-space:normal !important;
    word-break:normal !important;
    overflow-wrap:normal !important;
    hyphens:none !important;
  }
}

/* Puntos de listas alineados */
body .footer-redesign .footer-col:not(.footer-contact) > a:not(.footer-book-card){
  display:flex !important;
  align-items:center !important;
  gap:10px !important;
  padding:0 !important;
  text-indent:0 !important;
  list-style:none !important;
}
body .footer-redesign .footer-col:not(.footer-contact) > a:not(.footer-book-card)::before{
  content:"" !important;
  display:inline-block !important;
  width:5px !important;
  height:5px !important;
  min-width:5px !important;
  border-radius:50% !important;
  margin:0 !important;
  background:#ffafcc !important;
  flex:0 0 5px !important;
}

/* Libro de reclamaciones más visible */
body .footer-book-card__icon{
  width:74px !important;
  height:74px !important;
  min-width:74px !important;
}
@media (max-width:767px){
  body .footer-book-card__icon{
    width:70px !important;
    height:70px !important;
    min-width:70px !important;
  }
}

/* Redes alineadas */
body .footer-redesign .footer-social-block{
  display:flex !important;
  align-items:center !important;
  justify-content:flex-end !important;
  gap:18px !important;
}
@media (max-width:767px){
  body .footer-redesign .footer-social-block{
    justify-content:center !important;
    align-items:center !important;
    text-align:center !important;
    flex-direction:column !important;
  }
}

/* espacio real para que el menu app no tape contenido al final de secciones */
@media (max-width:767px){
  body{
    padding-bottom:calc(78px + env(safe-area-inset-bottom, 0px)) !important;
  }
  main,
  .main,
  .page-content{
    padding-bottom:0 !important;
  }
  .districts-section,
  .process-section,
  .faq-section,
  section:last-of-type{
    padding-bottom:calc(42px + 78px + env(safe-area-inset-bottom, 0px)) !important;
  }
  body .footer-redesign .bottom-nav{
    position:fixed !important;
    left:0 !important;
    right:0 !important;
    bottom:0 !important;
    z-index:99999 !important;
  }
}

/* =========================================================
   AJUSTE FINAL LIBRO DE RECLAMACIONES
   Orden solicitado: texto arriba, icono abajo.
   Un solo footer responsive: PC, tablet y celular.
   ========================================================= */
body .footer-redesign .footer-book-card,
body .footer-book-card{
  display:flex !important;
  flex-direction:column !important;
  align-items:center !important;
  justify-content:center !important;
  text-align:center !important;
  gap:8px !important;
  width:max-content !important;
  max-width:100% !important;
  margin:0 !important;
}

body .footer-redesign .footer-book-card > span,
body .footer-book-card > span{
  order:1 !important;
  display:block !important;
  text-align:center !important;
}

body .footer-redesign .footer-book-card__icon,
body .footer-book-card__icon{
  order:2 !important;
  width:72px !important;
  height:72px !important;
  min-width:72px !important;
  margin:0 auto !important;
}

body .footer-redesign .footer-book-card strong,
body .footer-book-card strong{
  text-align:center !important;
}

body .footer-redesign .footer-book-card em,
body .footer-book-card em{
  text-align:center !important;
}

@media (min-width:768px){
  body .footer-redesign .footer-book-card,
  body .footer-book-card{
    align-items:center !important;
    justify-content:center !important;
  }
}

@media (max-width:767px){
  body .footer-redesign .footer-book-card,
  body .footer-book-card{
    margin:0 auto !important;
    gap:7px !important;
  }

  body .footer-redesign .footer-book-card__icon,
  body .footer-book-card__icon{
    width:68px !important;
    height:68px !important;
    min-width:68px !important;
  }
}

@media (max-width:380px){
  body .footer-redesign .footer-book-card__icon,
  body .footer-book-card__icon{
    width:62px !important;
    height:62px !important;
    min-width:62px !important;
  }
}


/* =========================================================
   FIX FINAL 2026-06-08: Distritos sin fondo celeste
   Deja visible el bloque y limpia fondos internos/tarjetas.
   ========================================================= */
body #distritos,
body .districts-section,
body section.districts-section{
  display:block !important;
  visibility:visible !important;
  opacity:1 !important;
  background:#ffffff !important;
  background-color:#ffffff !important;
  background-image:none !important;
  box-shadow:none !important;
}

body #distritos::before,
body #distritos::after,
body .districts-section::before,
body .districts-section::after{
  display:none !important;
  content:none !important;
  background:transparent !important;
  background-image:none !important;
  box-shadow:none !important;
}

body #distritos .section-heading,
body #distritos .district-grid,
body .districts-section .section-heading,
body .districts-section .district-grid{
  background:transparent !important;
  background-color:transparent !important;
  background-image:none !important;
  box-shadow:none !important;
}

body #distritos .district-card,
body .districts-section .district-card,
body .district-grid .district-card,
body .district-grid > article,
body .district-grid > a{
  background:#ffffff !important;
  background-color:#ffffff !important;
  background-image:none !important;
  border-color:rgba(3,4,94,.10) !important;
  box-shadow:0 18px 42px rgba(3,4,94,.08) !important;
}

body #distritos .district-card::before,
body #distritos .district-card::after,
body .districts-section .district-card::before,
body .districts-section .district-card::after,
body .district-grid .district-card::before,
body .district-grid .district-card::after{
  display:none !important;
  content:none !important;
  background:transparent !important;
  background-image:none !important;
  box-shadow:none !important;
}

body #distritos .district-icon,
body .districts-section .district-icon{
  background:#ffffff !important;
  background-color:#ffffff !important;
  background-image:none !important;
  box-shadow:0 12px 28px rgba(3,4,94,.06) !important;
}

@media (max-width:767px){
  body #distritos,
  body .districts-section{
    background:#ffffff !important;
    background-color:#ffffff !important;
    background-image:none !important;
    padding-bottom:calc(122px + env(safe-area-inset-bottom,0px)) !important;
  }

  body #distritos .district-card,
  body .districts-section .district-card,
  body .district-grid .district-card,
  body .district-grid > article,
  body .district-grid > a{
    background:#ffffff !important;
    background-color:#ffffff !important;
    background-image:none !important;
  }
}

/* ==========================================================
   FIX QUIRURGICO 2026-06-08: BLOQUE AMARILLO / PROCESO
   Objetivo:
   - quitar espacios excesivos en PC y móvil
   - evitar que los números choquen con las tarjetas
   - mantener diseño responsive sin tocar footer, menú app ni distritos
   ========================================================== */

body #proceso.process-wrap,
body section#proceso.process-wrap,
body section.process-wrap#proceso{
  min-height: auto !important;
  height: auto !important;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  padding-top: clamp(44px, 4.2vw, 64px) !important;
  padding-bottom: clamp(46px, 4vw, 66px) !important;
  overflow: visible !important;
}

body #proceso.process-wrap .section-heading,
body section#proceso.process-wrap .section-heading{
  margin: 0 auto clamp(22px, 2.4vw, 34px) !important;
  padding: 0 16px !important;
  max-width: 980px !important;
}

body #proceso.process-wrap .section-heading h2,
body section#proceso.process-wrap .section-heading h2{
  margin: 0 !important;
  line-height: 1.08 !important;
}

body #proceso .process-grid,
body .process-wrap .process-grid{
  width: min(1240px, 92vw) !important;
  max-width: 1240px !important;
  margin: 0 auto !important;
  padding: 0 !important;
  display: grid !important;
  grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
  gap: 16px !important;
  align-items: stretch !important;
  overflow: visible !important;
}

body #proceso .process-card,
body .process-wrap .process-card{
  position: relative !important;
  min-height: 132px !important;
  height: auto !important;
  margin: 0 !important;
  padding: 46px 16px 22px !important;
  border-radius: 18px !important;
  text-align: center !important;
  overflow: visible !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
}

body #proceso .process-card span,
body .process-wrap .process-card span{
  position: absolute !important;
  top: 13px !important;
  left: 50% !important;
  transform: translateX(-50%) !important;
  width: 34px !important;
  height: 34px !important;
  min-width: 34px !important;
  min-height: 34px !important;
  margin: 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  z-index: 2 !important;
  font-size: 15px !important;
  line-height: 1 !important;
}

body #proceso .process-card h3,
body .process-wrap .process-card h3{
  margin: 0 0 8px !important;
  line-height: 1.14 !important;
}

body #proceso .process-card p,
body .process-wrap .process-card p{
  margin: 0 !important;
  line-height: 1.36 !important;
}

/* Tablet */
@media (max-width: 1100px){
  body #proceso .process-grid,
  body .process-wrap .process-grid{
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    max-width: 920px !important;
    gap: 16px !important;
  }
}

/* Celular y tablets pequeñas: compacto y sin choques */
@media (max-width: 767px){
  body #proceso.process-wrap,
  body section#proceso.process-wrap,
  body section.process-wrap#proceso{
    padding-top: 42px !important;
    padding-bottom: 44px !important;
  }

  body #proceso.process-wrap .section-heading,
  body section#proceso.process-wrap .section-heading{
    margin-bottom: 20px !important;
  }

  body #proceso.process-wrap .section-heading h2,
  body section#proceso.process-wrap .section-heading h2{
    font-size: clamp(30px, 8vw, 42px) !important;
    line-height: 1.08 !important;
  }

  body #proceso .process-grid,
  body .process-wrap .process-grid{
    width: calc(100% - 32px) !important;
    max-width: 560px !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 14px !important;
  }

  body #proceso .process-card,
  body .process-wrap .process-card{
    min-height: 126px !important;
    padding: 44px 11px 18px !important;
    border-radius: 18px !important;
  }

  body #proceso .process-card span,
  body .process-wrap .process-card span{
    top: 10px !important;
    width: 32px !important;
    height: 32px !important;
    min-width: 32px !important;
    min-height: 32px !important;
    font-size: 14px !important;
    border-width: 3px !important;
  }

  body #proceso .process-card h3,
  body .process-wrap .process-card h3{
    font-size: clamp(15px, 4.2vw, 18px) !important;
    line-height: 1.12 !important;
    margin-bottom: 7px !important;
  }

  body #proceso .process-card p,
  body .process-wrap .process-card p{
    font-size: clamp(12px, 3.6vw, 14px) !important;
    line-height: 1.32 !important;
  }
}

/* Celulares muy angostos: 1 columna para que no se rompa ni se monten textos */
@media (max-width: 340px){
  body #proceso .process-grid,
  body .process-wrap .process-grid{
    grid-template-columns: 1fr !important;
    max-width: 300px !important;
    gap: 14px !important;
  }

  body #proceso .process-card,
  body .process-wrap .process-card{
    min-height: 116px !important;
  }
}

/* Compactar separación entre Distritos y bloque amarillo sin tocar tarjetas */
body .districts-section{
  padding-bottom: clamp(34px, 4vw, 54px) !important;
}

body .districts-section + #proceso.process-wrap,
body .districts-section + section.process-wrap{
  margin-top: 0 !important;
}

/* ==========================================================
   FIX FINAL DISTRITOS 8 CENTRADOS - 2026-06-08
   Objetivo: centrar bloque, mostrar solo 8 distritos visibles,
   no alterar footer/header.
   ========================================================== */
body #distritos.districts-section,
body section#distritos.districts-section{
  width:100% !important;
  max-width:100% !important;
  margin-left:auto !important;
  margin-right:auto !important;
  padding-left:20px !important;
  padding-right:20px !important;
  background:#fff !important;
}

body #distritos .section-heading{
  width:100% !important;
  max-width:920px !important;
  margin-left:auto !important;
  margin-right:auto !important;
  text-align:center !important;
}

body #distritos .section-heading h2,
body #distritos .section-heading p{
  text-align:center !important;
  margin-left:auto !important;
  margin-right:auto !important;
}

body #distritos .district-grid{
  width:min(100%, 1180px) !important;
  max-width:1180px !important;
  margin:42px auto 0 !important;
  display:grid !important;
  grid-template-columns:repeat(4, minmax(220px, 1fr)) !important;
  justify-content:center !important;
  justify-items:stretch !important;
  align-items:stretch !important;
  gap:26px !important;
}

body #distritos .district-card{
  width:100% !important;
  min-width:0 !important;
  max-width:none !important;
  margin:0 !important;
  display:flex !important;
  flex-direction:column !important;
  align-items:center !important;
  justify-content:flex-start !important;
  text-align:center !important;
}

/* Solo 8 distritos visibles: los extras quedan ocultos aunque JS intente mostrarlos */
body #distritos .district-extra,
body #distritos [data-extra-district]{
  display:none !important;
  visibility:hidden !important;
}

body #distritos .district-actions{
  width:100% !important;
  max-width:1180px !important;
  margin:30px auto 0 !important;
  display:flex !important;
  justify-content:center !important;
  align-items:center !important;
  gap:14px !important;
  text-align:center !important;
}

/* No mostrar botón de más distritos si solo deben verse 8 */
body #distritos .btn-district-toggle{
  display:none !important;
}

@media (max-width:1100px){
  body #distritos .district-grid{
    grid-template-columns:repeat(3, minmax(220px, 1fr)) !important;
    max-width:860px !important;
  }
}

@media (max-width:767px){
  body #distritos.districts-section,
  body section#distritos.districts-section{
    padding-left:18px !important;
    padding-right:18px !important;
  }
  body #distritos .district-grid{
    width:100% !important;
    max-width:640px !important;
    margin-top:32px !important;
    grid-template-columns:repeat(2, minmax(0, 1fr)) !important;
    gap:16px !important;
  }
  body #distritos .district-card{
    min-height:230px !important;
  }
}

@media (max-width:370px){
  body #distritos .district-grid{
    grid-template-columns:1fr !important;
    max-width:300px !important;
  }
}

/* =========================================================
   FIX MENÚ APP SOBRE FOOTER - 2026-06-09
   Causa: el menú inferior vive dentro del footer y el footer tenía
   isolation/overflow que podía dejar el menú por debajo o recortado.
   Resultado: el menú queda siempre encima del footer al hacer scroll.
   ========================================================= */
@media (max-width: 767px){
  body footer.footer-redesign,
  body .footer-redesign,
  body footer.footer-redesign.site-footer{
    position:relative !important;
    z-index:1 !important;
    isolation:auto !important;
    overflow:visible !important;
    padding-bottom:calc(110px + env(safe-area-inset-bottom, 0px)) !important;
  }

  body .bottom-nav,
  body footer.footer-redesign .bottom-nav,
  body .footer-redesign .bottom-nav{
    position:fixed !important;
    left:0 !important;
    right:0 !important;
    bottom:0 !important;
    width:100vw !important;
    max-width:100vw !important;
    z-index:2147483647 !important;
    transform:translateZ(0) !important;
    visibility:visible !important;
    opacity:1 !important;
    pointer-events:auto !important;
  }
}
