/* =========================================================
   EL ÁGUILA · Professional UI Theme
   Capa visual no invasiva: conserva la lógica PHP existente.
   ========================================================= */
:root{
  --pro-navy:#0b1220;
  --pro-navy-2:#111c33;
  --pro-blue:#1d4ed8;
  --pro-blue-2:#2563eb;
  --pro-cyan:#0ea5e9;
  --pro-gold:#f5b700;
  --pro-red:#dc2626;
  --pro-green:#059669;
  --pro-bg:#f5f7fb;
  --pro-surface:#ffffff;
  --pro-surface-2:#f8fafc;
  --pro-text:#0f172a;
  --pro-muted:#64748b;
  --pro-line:#e2e8f0;
  --pro-shadow:0 10px 30px rgba(15,23,42,.08);
  --pro-shadow-lg:0 22px 55px rgba(15,23,42,.14);
  --pro-radius:20px;
  --pro-radius-sm:12px;
}

html{scroll-behavior:smooth;background:var(--pro-bg)}
body.app-page{
  font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif !important;
  color:var(--pro-text) !important;
  background:
    radial-gradient(circle at 8% 0%,rgba(37,99,235,.08),transparent 30rem),
    radial-gradient(circle at 100% 20%,rgba(245,183,0,.08),transparent 26rem),
    var(--pro-bg) !important;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
body.app-page *{scrollbar-width:thin;scrollbar-color:#cbd5e1 transparent}
body.app-page *::-webkit-scrollbar{width:9px;height:9px}
body.app-page *::-webkit-scrollbar-thumb{background:#cbd5e1;border-radius:999px}
body.app-page *::-webkit-scrollbar-track{background:transparent}
body.app-page a{transition:color .2s ease,background .2s ease,border-color .2s ease,transform .2s ease,box-shadow .2s ease}
body.app-page button,body.app-page input,body.app-page select,body.app-page textarea{font:inherit}
body.app-page button,body.app-page .btn,body.app-page [class*="btn-"]{transition:transform .18s ease,box-shadow .18s ease,filter .18s ease,background .18s ease}
body.app-page button:hover,body.app-page .btn:hover,body.app-page [class*="btn-"]:hover{transform:translateY(-1px)}
body.app-page input:focus,body.app-page select:focus,body.app-page textarea:focus{
  outline:none !important;border-color:#60a5fa !important;box-shadow:0 0 0 4px rgba(37,99,235,.12) !important;
}

/* ---------- Encabezados generales / admin ---------- */
body.app-page .topbar{
  background:linear-gradient(115deg,#08111f 0%,#112448 55%,#1d4ed8 100%) !important;
  border-bottom:1px solid rgba(255,255,255,.09) !important;
  box-shadow:0 12px 36px rgba(8,17,31,.20) !important;
  position:relative;
  overflow:hidden;
}
body.app-page .topbar::after{
  content:"";position:absolute;right:-80px;top:-120px;width:330px;height:330px;border-radius:50%;
  background:radial-gradient(circle,rgba(255,255,255,.13),rgba(255,255,255,0) 66%);pointer-events:none;
}
body.app-page .topbar-grid,body.app-page .header-main{max-width:1540px;margin:0 auto}
body.app-page .topbar h1,body.app-page .titulo{letter-spacing:-.025em;font-weight:850 !important}
body.app-page .top-actions a,body.app-page .btn-top{
  border:1px solid rgba(255,255,255,.16) !important;
  backdrop-filter:blur(8px);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.06);
}
body.app-page .brand-logo,body.app-page .brand-icon,body.app-page .logo-icon{
  box-shadow:0 12px 25px rgba(0,0,0,.14) !important;
}
body.app-page .contenedor{max-width:1580px;margin-left:auto !important;margin-right:auto !important}

/* ---------- Cards / paneles ---------- */
body.app-page .card,
body.app-page .productos-panel,
body.app-page .sidebar,
body.app-page .panel-busqueda,
body.app-page .resumen,
body.app-page .modal-box{
  border:1px solid rgba(226,232,240,.95) !important;
  box-shadow:var(--pro-shadow) !important;
  background:rgba(255,255,255,.96) !important;
  backdrop-filter:blur(12px);
}
body.app-page .card{border-radius:var(--pro-radius) !important}
body.app-page .card:hover{box-shadow:0 16px 40px rgba(15,23,42,.11) !important}

/* ---------- Botones ---------- */
body.app-page .btn-primary,body.app-page .btn-buscar,body.app-page .btn-guardar,body.app-page .btn-finalizar{
  background:linear-gradient(135deg,#1d4ed8,#2563eb) !important;color:#fff !important;
  border:none !important;box-shadow:0 9px 20px rgba(37,99,235,.22) !important;
}
body.app-page .btn-success{background:linear-gradient(135deg,#047857,#059669) !important;color:#fff !important;border:none !important}
body.app-page .btn-danger,body.app-page .btn-salir,body.app-page .btn-eliminar{background:linear-gradient(135deg,#b91c1c,#dc2626) !important;color:#fff !important;border:none !important}
body.app-page .btn-light,body.app-page .btn-limpiar,body.app-page .btn-volver{
  background:#fff !important;color:#334155 !important;border:1px solid var(--pro-line) !important;
}
body.app-page .btn,body.app-page .btn-top,body.app-page .btn-buscar,body.app-page .btn-limpiar{
  border-radius:12px !important;font-weight:750 !important;
}

/* ---------- Formularios ---------- */
body.app-page input[type="text"],body.app-page input[type="email"],body.app-page input[type="password"],body.app-page input[type="number"],
body.app-page input[type="date"],body.app-page input[type="datetime-local"],body.app-page input[type="search"],body.app-page select,body.app-page textarea,
body.app-page .input,body.app-page .select{
  border:1px solid #dbe3ee !important;background:#fff !important;color:var(--pro-text) !important;
  border-radius:12px !important;min-height:44px;
}
body.app-page textarea{min-height:110px;resize:vertical}
body.app-page label{color:#334155;font-weight:700}

/* ---------- Tablas ---------- */
body.app-page table{border-collapse:separate !important;border-spacing:0 !important;width:100%}
body.app-page thead th{
  background:#f8fafc !important;color:#475569 !important;font-size:11px !important;text-transform:uppercase;letter-spacing:.06em;
  border-bottom:1px solid var(--pro-line) !important;
}
body.app-page tbody tr{transition:background .18s ease}
body.app-page tbody tr:hover{background:#f8fbff !important}
body.app-page td{border-bottom:1px solid #eef2f7 !important}
body.app-page .tabla-wrap{border:1px solid var(--pro-line);border-radius:16px;overflow:auto;background:#fff}

/* ---------- Badges ---------- */
body.app-page .badge,body.app-page .tag,body.app-page .estado{
  border-radius:999px !important;font-weight:800 !important;letter-spacing:.01em;
}
body.app-page .alerta-ok,body.app-page .alert-success{border-radius:14px !important;border:1px solid #a7f3d0 !important;background:#ecfdf5 !important;color:#065f46 !important}
body.app-page .alerta-error,body.app-page .alert-error,body.app-page .error{border-radius:14px !important}

/* =========================================================
   TIENDA / INDEX
   ========================================================= */
body.page-index .top-strip{
  background:#07101d !important;padding:8px clamp(16px,4vw,48px) !important;border-bottom:1px solid rgba(255,255,255,.06)
}
body.page-index .header{
  background:linear-gradient(115deg,#091321 0%,#12284b 58%,#1e40af 100%) !important;
  border-bottom:3px solid var(--pro-gold) !important;
  box-shadow:0 14px 38px rgba(8,17,31,.22) !important;
}
body.page-index .header-main{grid-template-columns:minmax(250px,320px) minmax(320px,1fr) minmax(250px,340px) !important;padding:16px clamp(18px,4vw,48px) !important}
body.page-index .brand-icon{border-radius:15px !important;background:linear-gradient(145deg,#fff,#f8fafc) !important;color:#1e40af !important}
body.page-index .brand h1{font-size:clamp(21px,2vw,29px) !important;letter-spacing:-.035em}
body.page-index .search-main{
  border-radius:14px !important;padding:5px !important;box-shadow:0 8px 25px rgba(0,0,0,.16) !important;border:1px solid rgba(255,255,255,.16)
}
body.page-index .search-main button{background:linear-gradient(135deg,#dc2626,#b91c1c) !important;border-radius:10px !important}
body.page-index .nav-categorias{padding:8px clamp(18px,4vw,48px) 13px !important;gap:8px !important}
body.page-index .nav-categorias a{background:rgba(255,255,255,.08) !important;border-color:rgba(255,255,255,.12) !important;padding:8px 13px !important}
body.page-index .nav-categorias a:hover{background:rgba(255,255,255,.16) !important}
body.page-index .nav-categorias a.activa{background:var(--pro-gold) !important;color:#111827 !important;border-color:#ffd45a !important}
body.page-index .contenedor{
  width:min(100%,1500px) !important;
  margin:0 auto !important;
  padding:22px clamp(16px,2.5vw,34px) 46px !important
}
body.page-index .hero-layout{gap:16px !important;margin-bottom:20px !important}
body.page-index .hero-layout.hero-side-count-0{grid-template-columns:1fr !important}
body.page-index .hero-side.hero-side-items-1{grid-template-rows:1fr !important}
body.page-index .slider{height:310px !important;border-radius:24px !important;border:1px solid rgba(255,255,255,.5) !important;box-shadow:var(--pro-shadow-lg) !important}
body.page-index .slide-overlay{background:linear-gradient(90deg,rgba(4,12,25,.82),rgba(13,36,73,.35),rgba(8,17,31,.05)) !important}
body.page-index .slide-content{left:clamp(24px,3vw,42px) !important;bottom:30px !important}
body.page-index .slide-content h2{font-size:clamp(28px,2.5vw,40px) !important;letter-spacing:-.035em}
body.page-index .mini-promo{border-radius:20px !important;border:1px solid #e2e8f0 !important;box-shadow:var(--pro-shadow) !important}
body.page-index .mini-promo{min-height:147px !important}
body.page-index .hero-side.hero-side-items-1 .mini-promo{height:310px !important}
body.page-index .beneficios{gap:12px !important}
body.page-index .beneficio{border-radius:16px !important;padding:16px !important;box-shadow:0 8px 24px rgba(15,23,42,.06) !important}
body.page-index .beneficio .ico{background:linear-gradient(145deg,#eff6ff,#dbeafe) !important}
body.page-index .contenido{grid-template-columns:260px minmax(0,1fr) !important;gap:22px !important}
body.page-index .sidebar{border-radius:18px !important;border-top:0 !important;padding:16px !important;top:145px !important}
body.page-index .sidebar h3{font-size:17px !important;padding:5px 6px 10px;border-bottom:1px solid #eef2f7}
body.page-index .cat-link{border-radius:11px !important;margin-bottom:6px !important;padding:10px 11px !important;border-color:#edf2f7 !important}
body.page-index .cat-link.active{background:linear-gradient(135deg,#0f2343,#1d4ed8) !important;border-color:#1d4ed8 !important}
body.page-index .productos-grid{grid-template-columns:repeat(auto-fill,minmax(220px,1fr)) !important;gap:16px !important}
body.page-index .producto-card{
  min-height:0 !important;padding:13px !important;border-radius:18px !important;border:1px solid #e8edf4 !important;
  box-shadow:0 6px 22px rgba(15,23,42,.065) !important;
}
body.page-index .producto-card::before{height:3px !important;background:linear-gradient(90deg,#1d4ed8,#0ea5e9,#f5b700) !important}
body.page-index .producto-card:hover{transform:translateY(-4px) !important;box-shadow:0 18px 42px rgba(15,23,42,.13) !important;border-color:#cbdaf4 !important}
body.page-index .img-wrap{height:205px !important;border-radius:14px !important;background:#fff !important;border-color:#edf1f6 !important;padding:8px}
body.page-index .img-wrap img{object-fit:contain !important;border-radius:8px}
body.page-index .codigo{font-size:11px !important;color:#94a3b8 !important;letter-spacing:.015em}
body.page-index .nombre{font-size:15px !important;line-height:1.35 !important;min-height:41px !important;margin-bottom:7px !important}
body.page-index .descripcion{font-size:12px !important;min-height:0 !important;line-height:1.45 !important;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
body.page-index .precio{font-size:25px !important;color:#047857 !important;letter-spacing:-.025em}
body.page-index .precio-mayorista{border-radius:10px !important;background:#eff6ff !important;color:#1e40af !important;padding:8px !important}
body.page-index .precios-unidades{border-radius:12px !important;background:#f8fafc !important;padding:8px !important;margin-bottom:10px !important}
body.page-index .existencia{border-radius:10px !important;padding:7px 9px !important;background:#ecfdf5 !important;border-color:#a7f3d0 !important;color:#047857 !important}
body.page-index .btn-carrito{border-radius:11px !important;box-shadow:0 8px 18px rgba(37,99,235,.16)}

/* =========================================================
   PRODUCTOS ADMIN
   ========================================================= */
body.page-admin_productos .layout{gap:18px !important}
body.page-admin_productos .sidebar{border-radius:18px !important}
body.page-admin_productos .panel-busqueda{border-radius:18px !important;padding:17px !important}
body.page-admin_productos .productos-panel{border-radius:18px !important;overflow:hidden}
body.page-admin_productos .producto-row{border-bottom:1px solid #eef2f7 !important;transition:background .18s ease}
body.page-admin_productos .producto-row:hover{background:#f8fbff !important}
body.page-admin_productos .img-producto{border-radius:12px !important;border:1px solid #e2e8f0 !important;background:#fff !important;object-fit:contain !important}
body.page-admin_productos .categoria-link{border-radius:10px !important}
body.page-admin_productos .categoria-activa{background:linear-gradient(135deg,#0f2343,#1d4ed8) !important}

/* =========================================================
   CARRITO / PEDIDOS
   ========================================================= */
body.page-carrito .layout{grid-template-columns:minmax(0,1fr) 360px !important;gap:20px !important}
body.page-carrito .card,body.page-carrito .resumen{border-radius:18px !important}
body.page-carrito .item-img{object-fit:contain !important;background:#fff !important}
body.page-carrito .resumen{position:sticky;top:20px}
body.page-pedidos .card{border-radius:18px !important}
body.page-pedidos .filtros{gap:10px !important}
body.page-pedido_detalle .card{max-width:1180px;margin:26px auto !important;border-radius:20px !important}

/* =========================================================
   CONFIGURACIÓN / PROMOCIONES / USUARIOS
   ========================================================= */
body.page-configuracion .grid{gap:18px !important}
body.page-configuracion .card{padding:24px !important;border-radius:18px !important}
body.page-configuracion .card::before{height:4px !important;background:linear-gradient(90deg,#1d4ed8,#0ea5e9) !important}
body.page-configuracion .icono{width:62px !important;height:62px !important;border-radius:16px !important;font-size:29px !important;background:linear-gradient(145deg,#eff6ff,#dbeafe) !important}
body.page-promociones .promo{border-radius:18px !important;overflow:hidden;border:1px solid var(--pro-line) !important;box-shadow:var(--pro-shadow) !important}
body.page-promociones .promo img{object-fit:cover}
body.page-usuarios .card{border-radius:18px !important}
body.page-usuarios .grid{gap:18px !important}

/* =========================================================
   LOGIN
   ========================================================= */
body.page-login,body.page-login_admin{
  background:
    radial-gradient(circle at 15% 15%,rgba(37,99,235,.36),transparent 30rem),
    radial-gradient(circle at 90% 90%,rgba(245,183,0,.20),transparent 27rem),
    linear-gradient(135deg,#07101d 0%,#10264d 58%,#1d4ed8 100%) !important;
}
body.page-login .login-box,body.page-login_admin .login-box{
  max-width:455px !important;border-radius:24px !important;padding:38px !important;
  border:1px solid rgba(255,255,255,.65) !important;box-shadow:0 30px 75px rgba(2,8,23,.30) !important;
}
body.page-login .login-box::before,body.page-login_admin .login-box::before{
  height:4px !important;background:linear-gradient(90deg,#1d4ed8,#0ea5e9,#f5b700) !important;
}
body.page-login .logo-img,body.page-login_admin .logo-img{filter:drop-shadow(0 8px 16px rgba(15,23,42,.12))}
body.page-login h2,body.page-login_admin h2{font-weight:850 !important;letter-spacing:-.025em}

/* ---------- Responsive ---------- */
@media(max-width:1100px){
  body.page-index .header-main{grid-template-columns:1fr !important}
  body.page-index .header-actions,body.page-index .user-info{justify-content:flex-start !important;text-align:left !important}
  body.page-index .hero-layout{grid-template-columns:1fr !important}
  body.page-index .hero-side{grid-template-columns:1fr 1fr !important}
  body.page-index .hero-side.hero-side-items-1{grid-template-columns:1fr !important}
  body.page-index .contenido{grid-template-columns:220px minmax(0,1fr) !important}
  body.page-index .beneficios{grid-template-columns:repeat(2,1fr) !important}
}
@media(max-width:760px){
  body.app-page .contenedor{padding-left:14px !important;padding-right:14px !important}
  body.page-index .top-strip{display:none !important}
  body.page-index .header{position:relative !important}
  body.page-index .header-main{padding:14px !important;gap:13px !important}
  body.page-index .brand-icon{width:48px !important;height:48px !important}
  body.page-index .search-main input{min-width:0}
  body.page-index .nav-categorias{padding-left:14px !important;padding-right:14px !important}
  body.page-index .contenedor{padding-top:16px !important}
  body.page-index .slider{height:250px !important;border-radius:18px !important}
  body.page-index .slide-content{left:20px !important;right:20px !important;bottom:28px !important}
  body.page-index .hero-side{grid-template-columns:1fr !important}
  body.page-index .hero-side.hero-side-items-1 .mini-promo{height:190px !important}
  body.page-index .beneficios{grid-template-columns:1fr !important}
  body.page-index .contenido{grid-template-columns:1fr !important}
  body.page-index .sidebar{position:relative !important;top:auto !important;max-height:none !important}
  body.page-index .productos-grid{grid-template-columns:repeat(2,minmax(0,1fr)) !important;gap:10px !important}
  body.page-index .producto-card{padding:10px !important;border-radius:14px !important}
  body.page-index .img-wrap{height:150px !important}
  body.page-index .nombre{font-size:13px !important;min-height:36px !important}
  body.page-index .descripcion{display:none}
  body.page-index .precio{font-size:20px !important}
  body.page-index .precios-unidades{font-size:11px}
  body.page-carrito .layout{grid-template-columns:1fr !important}
  body.page-carrito .resumen{position:relative;top:auto}
}
@media(max-width:420px){
  body.page-index .productos-grid{grid-template-columns:1fr !important}
  body.page-index .img-wrap{height:220px !important}
}

@media print{
  body.app-page{background:#fff !important;color:#000 !important}
  body.app-page .topbar,body.app-page .header,body.app-page .top-strip,body.app-page .no-print{display:none !important}
  body.app-page .card,body.app-page .ticket{box-shadow:none !important;border-color:#d1d5db !important;background:#fff !important}
  body.app-page::before,body.app-page::after{display:none !important}
}


/* =========================================================
   REDISEÑO COMERCIAL PREMIUM - 2026-09-16
   ========================================================= */
body.page-index{
  --pro-navy:#0b1730;
  --pro-blue:#173f8f;
  --pro-blue-2:#1d4ed8;
  --pro-gold:#f6b900;
  --pro-green:#0f8a5f;
  --pro-bg:#f5f7fb;
  --pro-card:#ffffff;
  --pro-text:#172033;
  --pro-muted:#718096;
  --pro-line:#e4e9f2;
  --pro-shadow-soft:0 10px 30px rgba(15,23,42,.07);
  --pro-shadow-hover:0 20px 46px rgba(15,23,42,.13);
  background:#f5f7fb !important;
  color:var(--pro-text) !important;
  font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif !important;
}
body.page-index .top-strip{
  background:#08111f !important;
  padding:8px max(24px,calc((100vw - 1460px)/2)) !important;
  border-bottom:1px solid rgba(255,255,255,.06) !important;
  font-size:12px !important;
  letter-spacing:.01em;
}
body.page-index .header{
  position:sticky !important;
  top:0 !important;
  z-index:1000 !important;
  background:linear-gradient(110deg,#0a1730 0%,#12356f 55%,#194aa9 100%) !important;
  border-bottom:0 !important;
  box-shadow:0 8px 28px rgba(5,15,35,.14) !important;
}
body.page-index .header::after{
  content:"";
  display:block;
  height:3px;
  background:linear-gradient(90deg,#f7b500,#ffd34e,#f7b500);
}
body.page-index .header-main{
  max-width:1460px !important;
  margin:0 auto !important;
  padding:17px 28px 14px !important;
  grid-template-columns:minmax(315px,360px) minmax(420px,1fr) auto !important;
  gap:28px !important;
}
body.page-index .brand-profesional{
  display:flex !important;
  align-items:center !important;
  gap:14px !important;
  color:white !important;
  min-width:0;
}
body.page-index .brand-logo-shell{
  width:84px !important;
  height:68px !important;
  border-radius:14px !important;
  background:white !important;
  padding:5px 8px !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  box-shadow:0 6px 20px rgba(0,0,0,.18) !important;
  flex:0 0 auto !important;
}
body.page-index .brand-logo-img{
  width:100% !important;
  height:100% !important;
  object-fit:contain !important;
  display:block !important;
}
body.page-index .brand-copy h1{
  margin:0 !important;
  font-size:28px !important;
  line-height:1.05 !important;
  font-weight:800 !important;
  letter-spacing:-.03em !important;
}
body.page-index .brand-copy p{
  margin:6px 0 0 !important;
  color:#dbe7ff !important;
  font-size:13px !important;
  font-weight:500 !important;
}
body.page-index .search-main{
  background:white !important;
  border-radius:14px !important;
  padding:5px !important;
  border:1px solid rgba(255,255,255,.7) !important;
  box-shadow:0 8px 24px rgba(5,15,35,.13) !important;
}
body.page-index .search-main input{
  border:0 !important;
  background:transparent !important;
  font-size:15px !important;
  padding:14px 16px !important;
  outline:none !important;
}
body.page-index .search-main button{
  border:0 !important;
  border-radius:10px !important;
  background:#d9222a !important;
  color:white !important;
  min-width:112px !important;
  font-weight:750 !important;
  box-shadow:none !important;
}
body.page-index .search-main button:hover{background:#bd1820 !important;transform:translateY(-1px)}
body.page-index .header-actions{gap:10px !important;align-items:center !important}
body.page-index .header-actions .user-info{
  font-size:12px !important;
  color:#dce8ff !important;
  margin-right:4px !important;
}
body.page-index .btn-top{
  border-radius:10px !important;
  padding:11px 14px !important;
  font-size:12px !important;
  font-weight:750 !important;
  border:1px solid rgba(255,255,255,.18) !important;
  background:rgba(8,17,31,.80) !important;
  color:white !important;
  box-shadow:none !important;
}
body.page-index .btn-top:hover{background:#08111f !important;transform:translateY(-1px)}
body.page-index .btn-cart{background:#0d9b66 !important;border-color:#16b978 !important}
body.page-index .nav-categorias{
  max-width:1460px !important;
  margin:0 auto !important;
  padding:0 28px 14px !important;
  display:flex !important;
  gap:8px !important;
  overflow-x:auto !important;
  scrollbar-width:none;
}
body.page-index .nav-categorias::-webkit-scrollbar{display:none}
body.page-index .nav-categorias a{
  padding:9px 14px !important;
  border-radius:9px !important;
  background:rgba(255,255,255,.09) !important;
  border:1px solid rgba(255,255,255,.12) !important;
  color:#f6f8fc !important;
  font-size:12px !important;
  font-weight:700 !important;
  white-space:nowrap !important;
}
body.page-index .nav-categorias a:hover{background:rgba(255,255,255,.16) !important}
body.page-index .nav-categorias a.activa{background:var(--pro-gold) !important;color:#172033 !important;border-color:var(--pro-gold) !important}
body.page-index .contenedor{
  max-width:1460px !important;
  margin:0 auto !important;
  padding:28px 28px 52px !important;
}
body.page-index .hero-layout{
  gap:16px !important;
  margin-bottom:18px !important;
  grid-template-columns:minmax(0,2.55fr) minmax(280px,.85fr) !important;
}
body.page-index .slider{
  height:285px !important;
  border-radius:16px !important;
  border:0 !important;
  box-shadow:var(--pro-shadow-soft) !important;
  background:#dfe7f3 !important;
}
body.page-index .slide-content{left:34px !important;bottom:28px !important;max-width:610px !important}
body.page-index .slide-content h2{font-size:34px !important;letter-spacing:-.025em !important;text-shadow:0 2px 10px rgba(0,0,0,.35) !important}
body.page-index .slide-content p{font-size:14px !important;max-width:560px}
body.page-index .slide-btn{border-radius:9px !important;padding:10px 15px !important;font-size:13px !important;box-shadow:none !important}
body.page-index .mini-promo{
  min-height:134px !important;
  border-radius:16px !important;
  border:0 !important;
  box-shadow:var(--pro-shadow-soft) !important;
}
body.page-index .mini-content{left:16px !important;bottom:15px !important}
body.page-index .mini-content h3{font-size:18px !important;letter-spacing:-.015em}
body.page-index .mini-content span{border-radius:8px !important;padding:7px 10px !important;font-size:11px !important}
body.page-index .beneficios{
  gap:12px !important;
  margin:18px 0 26px !important;
}
body.page-index .beneficio{
  padding:14px 16px !important;
  border-radius:13px !important;
  border:1px solid var(--pro-line) !important;
  box-shadow:none !important;
  background:#fff !important;
}
body.page-index .beneficio .ico{width:38px !important;height:38px !important;border-radius:10px !important;font-size:18px !important}
body.page-index .beneficio strong{font-size:13px !important}
body.page-index .beneficio small{font-size:11px !important;color:var(--pro-muted) !important}
body.page-index .section-head{margin:10px 0 16px !important}
body.page-index .section-head h2{
  font-size:23px !important;
  letter-spacing:-.025em !important;
  font-weight:800 !important;
}
body.page-index .pill{
  border:1px solid var(--pro-line) !important;
  background:white !important;
  color:#194aa9 !important;
  border-radius:9px !important;
  padding:8px 12px !important;
  box-shadow:none !important;
}
body.page-index .contenido{grid-template-columns:230px minmax(0,1fr) !important;gap:18px !important}
body.page-index .sidebar{
  border-radius:14px !important;
  padding:15px !important;
  border:1px solid var(--pro-line) !important;
  border-top:1px solid var(--pro-line) !important;
  box-shadow:none !important;
  top:145px !important;
  background:#fff !important;
}
body.page-index .sidebar h3{font-size:15px !important;margin-bottom:12px !important}
body.page-index .cat-link{
  padding:10px 11px !important;
  border-radius:8px !important;
  margin-bottom:6px !important;
  border:0 !important;
  background:#fff !important;
  color:#334155 !important;
  font-size:12px !important;
}
body.page-index .cat-link:hover{background:#f1f5fb !important;transform:none !important}
body.page-index .cat-link.active{background:#eaf1ff !important;color:#17418f !important;border:0 !important;box-shadow:inset 3px 0 0 #1d4ed8 !important}
body.page-index .productos-grid{
  grid-template-columns:repeat(auto-fill,minmax(218px,1fr)) !important;
  gap:14px !important;
}
body.page-index .producto-card{
  min-height:0 !important;
  padding:13px !important;
  border-radius:14px !important;
  border:1px solid var(--pro-line) !important;
  box-shadow:none !important;
  background:#fff !important;
  transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease !important;
}
body.page-index .producto-card::before{display:none !important}
body.page-index .producto-card:hover{
  transform:translateY(-3px) !important;
  box-shadow:var(--pro-shadow-hover) !important;
  border-color:#d3dae7 !important;
}
body.page-index .img-wrap{
  height:185px !important;
  border-radius:10px !important;
  border:0 !important;
  background:#f7f9fc !important;
  margin-bottom:12px !important;
  cursor:zoom-in !important;
}
body.page-index .img-wrap img{object-fit:contain !important;padding:10px !important;transition:transform .2s ease !important}
body.page-index .img-wrap:hover img{transform:scale(1.035)}
body.page-index .codigo{font-size:11px !important;color:#94a3b8 !important;margin-bottom:6px !important}
body.page-index .nombre{
  font-size:14px !important;
  line-height:1.35 !important;
  min-height:57px !important;
  margin-bottom:7px !important;
  font-weight:760 !important;
  letter-spacing:-.005em !important;
}
body.page-index .descripcion{font-size:11px !important;min-height:0 !important;max-height:32px !important;overflow:hidden !important;color:#8793a6 !important}
body.page-index .precio{
  color:#087a55 !important;
  font-size:24px !important;
  font-weight:850 !important;
  letter-spacing:-.03em !important;
  margin:5px 0 9px !important;
}
body.page-index .precios-unidades{
  border:1px solid #e2e8f0 !important;
  background:#fafcff !important;
  border-radius:10px !important;
  padding:10px !important;
  margin-top:2px !important;
}
body.page-index .precios-unidades-titulo{
  font-size:11px !important;
  color:#64748b !important;
  font-weight:700 !important;
  margin-bottom:7px !important;
  text-transform:none !important;
}
body.page-index .unidad-item{padding:7px 0 !important}
body.page-index .unidad-medida{
  min-width:32px !important;
  height:28px !important;
  border-radius:8px !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  background:#eaf1ff !important;
  color:#1d4ed8 !important;
  font-size:11px !important;
  font-weight:800 !important;
  padding:0 8px !important;
}
body.page-index .unidad-precio{font-size:15px !important;color:#166534 !important;font-weight:800 !important}
body.page-index .existencia{
  margin:10px 0 !important;
  padding:8px 10px !important;
  border-radius:8px !important;
  background:#ecfdf5 !important;
  border:1px solid #bbf7d0 !important;
  color:#087a55 !important;
  font-size:11px !important;
  font-weight:750 !important;
  text-align:center !important;
}
body.page-index .btn-carrito{
  margin-top:auto !important;
  width:100% !important;
  border:0 !important;
  border-radius:9px !important;
  padding:11px 13px !important;
  background:#173f8f !important;
  color:#fff !important;
  font-size:12px !important;
  font-weight:760 !important;
  box-shadow:none !important;
}
body.page-index .btn-carrito:hover{background:#102f72 !important;transform:translateY(-1px)}
body.page-index .sin-resultados{border-radius:14px !important;border:1px solid var(--pro-line) !important;box-shadow:none !important}

/* Visor de imagen con apariencia más sobria */
body.page-index .image-lightbox,
body.page-index .lightbox-overlay{
  backdrop-filter:blur(8px);
}
body.page-index .lightbox-content,
body.page-index .image-lightbox-content{
  border-radius:16px !important;
  box-shadow:0 30px 80px rgba(2,8,23,.35) !important;
}

@media(max-width:1180px){
  body.page-index .header-main{grid-template-columns:1fr !important;padding:14px 20px !important;gap:12px !important}
  body.page-index .brand-copy h1{font-size:24px !important}
  body.page-index .header-actions{justify-content:flex-start !important}
  body.page-index .hero-layout{grid-template-columns:1fr !important}
  body.page-index .hero-side{grid-template-columns:1fr 1fr !important}
  body.page-index .contenido{grid-template-columns:210px minmax(0,1fr) !important}
}
@media(max-width:760px){
  body.page-index .contenedor{padding:16px 12px 36px !important}
  body.page-index .header-main{padding:12px !important}
  body.page-index .brand-logo-shell{width:72px !important;height:58px !important}
  body.page-index .brand-copy h1{font-size:21px !important}
  body.page-index .brand-copy p{font-size:11px !important}
  body.page-index .search-main{width:100% !important}
  body.page-index .nav-categorias{padding:0 12px 10px !important}
  body.page-index .slider{height:230px !important}
  body.page-index .slide-content{left:20px !important;bottom:20px !important;right:20px !important}
  body.page-index .slide-content h2{font-size:24px !important}
  body.page-index .hero-side{grid-template-columns:1fr !important}
  body.page-index .beneficios{grid-template-columns:1fr 1fr !important}
  body.page-index .contenido{grid-template-columns:1fr !important}
  body.page-index .sidebar{position:static !important;max-height:none !important}
  body.page-index .productos-grid{grid-template-columns:repeat(2,minmax(0,1fr)) !important;gap:10px !important}
  body.page-index .img-wrap{height:145px !important}
  body.page-index .nombre{font-size:12px !important;min-height:49px !important}
  body.page-index .precio{font-size:20px !important}
}
@media(max-width:480px){
  body.page-index .productos-grid{grid-template-columns:1fr !important}
  body.page-index .img-wrap{height:200px !important}
  body.page-index .beneficios{grid-template-columns:1fr !important}
}

/* =========================================================
   EL ÁGUILA — REDISEÑO COMERCIAL PREMIUM 2026-09-16
   Dirección visual: ecommerce limpio, sobrio y profesional.
   ========================================================= */
body.page-index{
  --ea-navy:#0b1f3a;
  --ea-navy-2:#123b72;
  --ea-blue:#1f5ea8;
  --ea-gold:#d8a31a;
  --ea-gold-soft:#f8f1dc;
  --ea-ink:#162033;
  --ea-muted:#6f7d91;
  --ea-line:#e5eaf1;
  --ea-soft:#f7f9fc;
  --ea-white:#fff;
  background:#f7f9fc !important;
  color:var(--ea-ink) !important;
}

/* Barra superior discreta */
body.page-index .top-strip{
  min-height:32px !important;
  padding:7px max(24px,calc((100vw - 1480px)/2)) !important;
  background:#07172c !important;
  color:#cdd7e5 !important;
  border:0 !important;
  font-size:11px !important;
  letter-spacing:.01em !important;
}
body.page-index .top-strip strong{color:#fff !important;font-weight:650 !important}

/* Header blanco de tienda real */
body.page-index .header{
  position:sticky !important;
  top:0 !important;
  z-index:1000 !important;
  background:#fff !important;
  color:var(--ea-ink) !important;
  border:0 !important;
  box-shadow:0 1px 0 var(--ea-line),0 10px 32px rgba(11,31,58,.06) !important;
}
body.page-index .header-main{
  max-width:1480px !important;
  margin:0 auto !important;
  padding:14px 24px !important;
  grid-template-columns:265px minmax(360px,1fr) auto !important;
  gap:28px !important;
  min-height:94px !important;
}
body.page-index .brand{
  gap:13px !important;
  color:var(--ea-ink) !important;
  text-decoration:none !important;
}
body.page-index .brand-logo-shell{
  width:138px !important;
  height:72px !important;
  padding:3px !important;
  border:0 !important;
  border-radius:10px !important;
  background:#fff !important;
  box-shadow:none !important;
}
body.page-index .brand-logo-img{
  width:100% !important;
  height:100% !important;
  object-fit:contain !important;
}
body.page-index .brand-copy{padding-left:1px !important}
body.page-index .brand-copy h1{display:none !important}
body.page-index .brand-copy .brand-kicker{
  display:block !important;
  color:var(--ea-navy) !important;
  font-size:12px !important;
  font-weight:800 !important;
  letter-spacing:.08em !important;
  text-transform:uppercase !important;
  margin-bottom:4px !important;
}
body.page-index .brand-copy p{
  margin:0 !important;
  color:#7b8798 !important;
  font-size:12px !important;
  font-weight:550 !important;
}

/* Buscador sofisticado */
body.page-index .search-main{
  height:52px !important;
  padding:0 !important;
  border:1px solid #d9e1eb !important;
  border-radius:10px !important;
  background:#fff !important;
  box-shadow:0 3px 12px rgba(11,31,58,.04) !important;
  overflow:hidden !important;
}
body.page-index .search-main:focus-within{
  border-color:#9eb9dc !important;
  box-shadow:0 0 0 4px rgba(31,94,168,.08) !important;
}
body.page-index .search-main input{
  font-size:14px !important;
  color:var(--ea-ink) !important;
  padding:0 18px !important;
  background:transparent !important;
}
body.page-index .search-main input::placeholder{color:#9aa6b5 !important}
body.page-index .search-main button{
  min-width:102px !important;
  padding:0 20px !important;
  border-radius:0 !important;
  background:var(--ea-navy) !important;
  font-size:13px !important;
  font-weight:750 !important;
  letter-spacing:.01em !important;
  box-shadow:none !important;
}
body.page-index .search-main button:hover{background:#123764 !important}

/* Acciones más discretas, sin apariencia de panel escolar */
body.page-index .header-actions{
  gap:8px !important;
  max-width:460px !important;
}
body.page-index .user-info{
  width:100% !important;
  margin:0 0 2px !important;
  color:#7c8796 !important;
  font-size:11px !important;
  text-align:right !important;
}
body.page-index .user-info strong{color:var(--ea-navy) !important}
body.page-index .btn-top{
  min-height:39px !important;
  padding:0 13px !important;
  border:1px solid #dce3eb !important;
  border-radius:8px !important;
  background:#fff !important;
  color:#334155 !important;
  font-size:11.5px !important;
  font-weight:700 !important;
  box-shadow:none !important;
  transition:.18s ease !important;
}
body.page-index .btn-top:hover{
  border-color:#b8c7d9 !important;
  background:#f8fafc !important;
  transform:none !important;
}
body.page-index .btn-cart{
  background:var(--ea-navy) !important;
  border-color:var(--ea-navy) !important;
  color:#fff !important;
}
body.page-index .btn-cart:hover{background:#123764 !important}
body.page-index .btn-mayorista{
  background:#f8f1dc !important;
  color:#7a5a0d !important;
  border-color:#e9d79e !important;
}
body.page-index .btn-logout{
  color:#8c3841 !important;
  background:#fff !important;
  border-color:#ecd8db !important;
}

/* Navegación principal tipo retail */
body.page-index .nav-categorias{
  max-width:1480px !important;
  margin:0 auto !important;
  padding:0 24px 12px !important;
  gap:4px !important;
  background:#fff !important;
}
body.page-index .nav-categorias a{
  color:#4b596c !important;
  background:transparent !important;
  border:0 !important;
  padding:9px 12px !important;
  border-radius:7px !important;
  font-size:11px !important;
  font-weight:700 !important;
  letter-spacing:.015em !important;
  text-transform:none !important;
}
body.page-index .nav-categorias a:hover{
  color:var(--ea-navy) !important;
  background:#f1f5f9 !important;
}
body.page-index .nav-categorias a.activa{
  background:var(--ea-navy) !important;
  color:#fff !important;
}

/* Contenido centrado */
body.page-index .contenedor{
  max-width:1480px !important;
  margin:0 auto !important;
  padding:28px 24px 56px !important;
}

/* Hero editorial, sin bordes amarillos ni exceso de altura */
body.page-index .hero-layout{
  grid-template-columns:minmax(0,2.1fr) minmax(250px,.72fr) !important;
  gap:16px !important;
  margin-bottom:18px !important;
}
body.page-index .slider{
  height:300px !important;
  border:0 !important;
  border-radius:14px !important;
  background:#dfe7f1 !important;
  box-shadow:0 8px 26px rgba(11,31,58,.08) !important;
}
body.page-index .slide-overlay{
  background:linear-gradient(90deg,rgba(7,23,44,.74) 0%,rgba(7,23,44,.34) 44%,rgba(7,23,44,0) 74%) !important;
}
body.page-index .slide-content{
  left:32px !important;
  bottom:30px !important;
  max-width:520px !important;
}
body.page-index .slide-content h2{
  margin:0 0 8px !important;
  font-size:31px !important;
  line-height:1.06 !important;
  font-weight:750 !important;
  letter-spacing:-.025em !important;
  text-shadow:none !important;
}
body.page-index .slide-content p{
  max-width:470px !important;
  font-size:13px !important;
  line-height:1.45 !important;
  color:rgba(255,255,255,.87) !important;
  text-shadow:none !important;
}
body.page-index .slide-btn{
  margin-top:15px !important;
  padding:10px 15px !important;
  border-radius:7px !important;
  background:#fff !important;
  color:var(--ea-navy) !important;
  font-size:11.5px !important;
  font-weight:750 !important;
  box-shadow:none !important;
}
body.page-index .dots{right:18px !important;bottom:16px !important}
body.page-index .dot{height:4px !important;width:15px !important;background:rgba(255,255,255,.55) !important}
body.page-index .dot.active{width:26px !important;background:#fff !important}
body.page-index .hero-side{gap:16px !important}
body.page-index .mini-promo{
  min-height:142px !important;
  border:0 !important;
  border-radius:14px !important;
  box-shadow:0 8px 26px rgba(11,31,58,.07) !important;
}
body.page-index .mini-promo::after{background:linear-gradient(90deg,rgba(7,23,44,.60),rgba(7,23,44,.04)) !important}
body.page-index .mini-content{left:18px !important;bottom:16px !important}
body.page-index .mini-content h3{font-size:17px !important;font-weight:720 !important;text-shadow:none !important;margin-bottom:8px !important}
body.page-index .mini-content span{
  padding:7px 10px !important;
  border-radius:6px !important;
  font-size:10.5px !important;
  font-weight:700 !important;
}

/* Trust strip estilo corporativo */
body.page-index .beneficios.trust-strip{
  grid-template-columns:repeat(3,1fr) !important;
  gap:0 !important;
  margin:0 0 34px !important;
  border:1px solid var(--ea-line) !important;
  background:#fff !important;
  border-radius:12px !important;
  overflow:hidden !important;
  box-shadow:none !important;
}
body.page-index .beneficio.trust-item{
  min-height:82px !important;
  padding:18px 22px !important;
  border:0 !important;
  border-right:1px solid var(--ea-line) !important;
  border-radius:0 !important;
  box-shadow:none !important;
  background:#fff !important;
  gap:14px !important;
}
body.page-index .beneficio.trust-item:last-child{border-right:0 !important}
body.page-index .trust-mark{
  flex:0 0 32px !important;
  width:32px !important;
  height:32px !important;
  border-radius:50% !important;
  display:grid !important;
  place-items:center !important;
  background:#eef3f9 !important;
  color:#537092 !important;
  font-size:10px !important;
  font-weight:800 !important;
  letter-spacing:.04em !important;
}
body.page-index .trust-item strong{
  display:block !important;
  margin-bottom:3px !important;
  color:#223047 !important;
  font-size:12.5px !important;
  font-weight:760 !important;
}
body.page-index .trust-item small{
  display:block !important;
  color:#7f8b9b !important;
  font-size:11px !important;
  line-height:1.35 !important;
}

/* Cabecera de catálogo */
body.page-index .catalog-head{
  align-items:flex-end !important;
  margin:0 0 18px !important;
  padding:0 !important;
}
body.page-index .catalog-head .eyebrow{
  display:block !important;
  margin-bottom:5px !important;
  color:#8a98aa !important;
  font-size:9.5px !important;
  font-weight:800 !important;
  letter-spacing:.16em !important;
}
body.page-index .catalog-head h2{
  margin:0 !important;
  color:#172338 !important;
  font-size:24px !important;
  font-weight:760 !important;
  letter-spacing:-.025em !important;
}
body.page-index .catalog-head p{
  margin:5px 0 0 !important;
  color:#7f8a9a !important;
  font-size:12px !important;
}
body.page-index .catalog-head .pill{
  padding:7px 10px !important;
  border:1px solid #dde4ed !important;
  border-radius:7px !important;
  background:#fff !important;
  color:#6b7789 !important;
  font-size:10.5px !important;
  font-weight:700 !important;
}

/* Sidebar y productos más cercanos a un ecommerce serio */
body.page-index .contenido{
  grid-template-columns:205px minmax(0,1fr) !important;
  gap:22px !important;
}
body.page-index .sidebar{
  border:1px solid var(--ea-line) !important;
  border-radius:10px !important;
  background:#fff !important;
  box-shadow:none !important;
  padding:14px !important;
}
body.page-index .sidebar h3{
  font-size:12px !important;
  color:#243149 !important;
  padding-bottom:10px !important;
  margin:0 0 8px !important;
  border-bottom:1px solid #edf0f4 !important;
}
body.page-index .cat-link{
  padding:8px 9px !important;
  margin-bottom:2px !important;
  border-radius:6px !important;
  color:#556277 !important;
  font-size:11px !important;
}
body.page-index .cat-link:hover{background:#f5f7fa !important;color:#1f3554 !important}
body.page-index .cat-link.active{background:#eef3f9 !important;color:#123b72 !important}
body.page-index .cat-link small{color:#a0a9b5 !important;font-size:9.5px !important}

body.page-index .productos-grid{
  grid-template-columns:repeat(4,minmax(0,1fr)) !important;
  gap:14px !important;
}
body.page-index .producto-card{
  border:1px solid #e6ebf1 !important;
  border-radius:10px !important;
  background:#fff !important;
  padding:12px !important;
  box-shadow:none !important;
  transition:border-color .18s ease,box-shadow .18s ease,transform .18s ease !important;
}
body.page-index .producto-card:hover{
  transform:translateY(-2px) !important;
  border-color:#cfd9e5 !important;
  box-shadow:0 10px 26px rgba(11,31,58,.07) !important;
}
body.page-index .img-wrap{
  height:180px !important;
  border-radius:7px !important;
  background:#fff !important;
  border:0 !important;
  margin-bottom:10px !important;
}
body.page-index .img-wrap img{padding:8px !important}
body.page-index .codigo{
  color:#9aa5b4 !important;
  font-size:9.5px !important;
  letter-spacing:.03em !important;
}
body.page-index .nombre{
  min-height:44px !important;
  font-size:12.5px !important;
  line-height:1.35 !important;
  color:#1e293b !important;
  font-weight:700 !important;
}
body.page-index .descripcion{display:none !important}
body.page-index .precio{
  margin:9px 0 7px !important;
  color:#0c7a57 !important;
  font-size:21px !important;
  font-weight:780 !important;
}
body.page-index .precios-unidades{
  padding:8px 9px !important;
  border-radius:7px !important;
  border:1px solid #edf0f4 !important;
  background:#fafbfd !important;
}
body.page-index .precios-unidades-titulo{
  color:#7c8797 !important;
  font-size:9.5px !important;
  margin-bottom:4px !important;
}
body.page-index .unidad-item{padding:4px 0 !important}
body.page-index .unidad-medida{
  min-width:26px !important;
  height:24px !important;
  padding:0 7px !important;
  border-radius:5px !important;
  background:#eef3f9 !important;
  color:#345b8e !important;
  font-size:9.5px !important;
}
body.page-index .unidad-precio{font-size:12.5px !important;color:#215f48 !important}
body.page-index .existencia{
  margin:8px 0 !important;
  padding:6px 8px !important;
  border:0 !important;
  border-radius:6px !important;
  background:#f0faf6 !important;
  color:#217457 !important;
  font-size:9.5px !important;
  text-align:left !important;
}
body.page-index .btn-carrito{
  min-height:36px !important;
  padding:0 10px !important;
  border-radius:7px !important;
  background:var(--ea-navy) !important;
  font-size:10.5px !important;
  font-weight:700 !important;
}
body.page-index .btn-carrito:hover{background:#123764 !important}

@media(max-width:1200px){
  body.page-index .header-main{grid-template-columns:220px 1fr !important;gap:16px !important}
  body.page-index .header-actions{grid-column:1/-1 !important;justify-content:flex-end !important;max-width:none !important}
  body.page-index .user-info{width:auto !important;margin-right:auto !important;text-align:left !important}
  body.page-index .productos-grid{grid-template-columns:repeat(3,minmax(0,1fr)) !important}
}
@media(max-width:860px){
  body.page-index .header-main{grid-template-columns:1fr !important;padding:12px 16px !important}
  body.page-index .brand-logo-shell{width:120px !important;height:62px !important}
  body.page-index .header-actions{grid-column:auto !important;justify-content:flex-start !important}
  body.page-index .user-info{width:100% !important}
  body.page-index .nav-categorias{padding:0 16px 10px !important}
  body.page-index .contenedor{padding:18px 16px 42px !important}
  body.page-index .hero-layout{grid-template-columns:1fr !important}
  body.page-index .hero-side{grid-template-columns:1fr 1fr !important}
  body.page-index .beneficios.trust-strip{grid-template-columns:1fr !important}
  body.page-index .beneficio.trust-item{border-right:0 !important;border-bottom:1px solid var(--ea-line) !important}
  body.page-index .beneficio.trust-item:last-child{border-bottom:0 !important}
  body.page-index .contenido{grid-template-columns:1fr !important}
  body.page-index .sidebar{display:none !important}
}
@media(max-width:620px){
  body.page-index .top-strip span:last-child{display:none !important}
  body.page-index .brand-copy{display:none !important}
  body.page-index .search-main{height:48px !important}
  body.page-index .header-actions{gap:6px !important}
  body.page-index .btn-top{padding:0 9px !important;font-size:10px !important}
  body.page-index .slider{height:240px !important}
  body.page-index .slide-content{left:20px !important;right:20px !important;bottom:20px !important}
  body.page-index .slide-content h2{font-size:24px !important}
  body.page-index .hero-side{grid-template-columns:1fr !important}
  body.page-index .productos-grid{grid-template-columns:repeat(2,minmax(0,1fr)) !important;gap:10px !important}
  body.page-index .img-wrap{height:145px !important}
}
@media(max-width:420px){
  body.page-index .productos-grid{grid-template-columns:1fr !important}
  body.page-index .img-wrap{height:210px !important}
}