/* =====================================================
   ESTANDAR VISUAL ISPControl V1.3.2
   Footer + mockup principal para productos del ecosistema.
   Se carga al final para evitar conflictos con estilos propios.
===================================================== */

/* Footer: misma reticula y posicion de redes que ISPControl V1.3.2 */
.site-footer{padding:38px 0 42px!important;border-top:1px solid #e7f0f7!important;background:#fff!important}
.site-footer .footer-grid{display:grid!important;grid-template-columns:1.45fr .78fr .85fr .82fr 1fr!important;gap:34px!important;align-items:start!important}
.site-footer .footer-brand{display:block!important}
.site-footer .footer-brand>a{display:inline-flex!important;align-items:center!important;width:auto!important;max-width:220px!important}
.site-footer .footer-brand img{display:block!important;width:auto!important;max-width:210px!important;max-height:58px!important;height:auto!important;object-fit:contain!important}
.site-footer .footer-brand p{max-width:245px!important;margin:13px 0 0!important;color:#748ba3!important;font-size:11px!important;line-height:1.55!important}
.site-footer .footer-col{display:flex!important;flex-direction:column!important;align-items:flex-start!important;min-width:0}
.site-footer h4{margin:0 0 12px!important;color:#0b2858!important;font-size:13px!important;font-weight:800!important}
.site-footer .footer-col>a{margin:3px 0!important;color:#66809b!important;font-size:11px!important;line-height:1.45!important;text-decoration:none!important}
.site-footer .footer-social{justify-self:start!important;align-self:start!important;width:100%!important;max-width:220px!important;margin-top:0!important}
.site-footer .socials{display:flex!important;align-items:center!important;justify-content:flex-start!important;gap:8px!important;flex-wrap:nowrap!important;margin:0 0 12px!important;width:auto!important}
.site-footer .socials a,.site-footer .socials button{flex:0 0 32px!important;width:32px!important;height:32px!important;min-width:32px!important;min-height:32px!important;margin:0!important;padding:0!important;border:1px solid #dce8f2!important;border-radius:9px!important;display:grid!important;place-items:center!important;background:#f1f6fa!important;color:#6c87a1!important;line-height:1!important;box-shadow:none!important}
.site-footer .socials .social-whatsapp{color:#0ca85a!important}
.site-footer .socials i{display:block!important;width:auto!important;height:auto!important;margin:0!important;padding:0!important;font-size:12px!important;line-height:1!important;transform:none!important}
.site-footer .copyright{margin:0!important;color:#748ba3!important;font-size:10px!important;line-height:1.55!important}

/* Mockup: misma caja visual de ISPControl, contenido propio de cada producto */
.hero-visual{position:relative!important;min-height:520px!important}
.hero-visual .hand-note{right:25px!important;top:-5px!important;z-index:10!important;font-size:13px!important;line-height:1.15!important}
.hero-visual .laptop{position:absolute!important;left:2%!important;right:4%!important;top:54px!important}
.hero-visual .laptop-screen{position:relative!important;overflow:hidden!important;border:8px solid #17365e!important;border-radius:23px!important;background:#fff!important;box-shadow:0 35px 70px rgba(18,70,123,.23)!important}
.hero-visual .laptop-base{width:100%!important;height:10px!important;margin:0!important;border-radius:0 0 50px 50px!important;box-shadow:0 8px 14px rgba(30,77,124,.15)!important}
.hero-visual .browser-top{height:34px!important;padding:0 14px!important}
.hero-visual .browser-url{max-width:250px!important}
.hero-visual .phone-ai{position:absolute!important;right:-10px!important;bottom:12px!important;z-index:12!important;width:150px!important;height:300px!important;border:7px solid #0b2547!important;border-radius:30px!important;background:#f8fbff!important;box-shadow:0 25px 55px rgba(13,55,105,.30)!important;padding:22px 10px 12px!important;transform:rotate(4deg)!important;overflow:hidden!important;isolation:isolate!important}
.hero-visual .phone-notch{width:66px!important;height:14px!important}
.hero-visual .phone-brand{min-width:0!important;max-width:100%!important;overflow:hidden!important}
.hero-visual .phone-brand img{flex:0 0 auto!important;max-width:30px!important;max-height:30px!important;object-fit:contain!important}
.hero-visual .phone-brand b{min-width:0!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}
.hero-visual .phone-thread,.hero-visual .phone-actions,.hero-visual .phone-pay-title,.hero-visual .phone-success,.hero-visual .ai-row,.hero-visual .ai-input{max-width:100%!important}

@media(max-width:1100px){
  .site-footer .footer-grid{grid-template-columns:1.3fr 1fr 1fr!important;gap:30px!important}
  .site-footer .footer-grid>div:nth-child(4),.site-footer .footer-grid>div:nth-child(5){margin-top:4px!important}
  .site-footer .footer-social{max-width:none!important}
}

@media(max-width:900px){
  .hero-visual{min-height:510px!important;margin-top:20px!important}
  .hero-visual .laptop{left:5%!important;right:5%!important;top:40px!important}
  .hero-visual .phone-ai{right:0!important;bottom:8px!important}
}

@media(max-width:760px){
  .site-footer .footer-grid{grid-template-columns:1fr 1fr!important;gap:25px!important}
  .site-footer .footer-brand{grid-column:1/-1!important}
  .site-footer .footer-brand p{max-width:420px!important}
}

@media(max-width:620px){
  .site-footer{padding:32px 0 92px!important}
  .site-footer .footer-grid{grid-template-columns:1fr!important;gap:20px!important}
  .site-footer .footer-brand{grid-column:auto!important}
  .site-footer .footer-grid>div:nth-child(4),.site-footer .footer-grid>div:nth-child(5){margin-top:0!important}
  .site-footer .footer-social{max-width:none!important}
  .hero-visual{min-height:395px!important;margin-top:14px!important}
  .hero-visual .hand-note{display:none!important}
  .hero-visual .laptop{left:0!important;right:0!important;top:30px!important}
  .hero-visual .laptop-screen{border-width:5px!important;border-radius:18px 18px 9px 9px!important}
  .hero-visual .laptop-base{display:none!important}
  .hero-visual .phone-ai{width:104px!important;height:214px!important;border-width:5px!important;border-radius:22px!important;padding:15px 6px 8px!important;right:-4px!important;bottom:0!important}
  .hero-visual .phone-notch{width:46px!important;height:9px!important}
  .hero-visual .phone-brand img{max-width:22px!important;max-height:22px!important}
}