/* ====== Reset y tipografía base ====== */
*{margin:0;padding:0;box-sizing:border-box;}
html{scroll-behavior:smooth;overflow-x:hidden;}
body{font-family:'Segoe UI',Tahoma,Geneva,Verdana,sans-serif;background:#f5f5f5;color:#333;padding-left:2rem;padding-right:2rem;overflow-x:hidden;}
a{text-decoration:none;color:inherit;}

/* ====== Modal Contacto / Dirección (compartido) ====== */
.modal-overlay{position:fixed;inset:0;background:rgba(0,0,0,0.5);z-index:300;display:none;align-items:center;justify-content:center;padding:1rem;}
.modal-overlay.open{display:flex;}
.modal-box{background:white;border-radius:16px;padding:2rem;max-width:480px;width:100%;box-shadow:0 20px 60px rgba(0,0,0,0.2);max-height:90vh;overflow-y:auto;}
.modal-box h3{font-size:18px;font-weight:900;color:#262626;margin-bottom:1.25rem;}
.modal-close{float:right;border:none;background:none;font-size:22px;cursor:pointer;color:#999;margin-top:-0.25rem;}
.modal-close:hover{color:var(--lt-primary-text);}


/* Ventana "Contáctanos" (includes/partials/modal_contacto.php) */
.ct-modal{max-width:680px;padding:0;overflow-x:hidden;}
.ct-cabecera{display:flex;align-items:flex-start;justify-content:space-between;gap:1rem;padding:1.5rem 1.75rem 1.25rem;background:#262626;color:#fff;position:relative;overflow:hidden;}
.ct-cabecera::after{content:"";position:absolute;right:-40px;top:-60px;width:180px;height:180px;border-radius:50%;background:radial-gradient(circle,rgba(var(--lt-primary-rgb),0.45),transparent 70%);pointer-events:none;}
.ct-cabecera h3{color:#fff;font-size:22px;margin:0 0 0.3rem;}
.ct-sub{font-size:13.5px;color:#cfcfcf;margin:0;line-height:1.5;}
.ct-cerrar{position:relative;z-index:1;flex-shrink:0;width:34px;height:34px;border-radius:50%;border:none;background:rgba(255,255,255,0.12);color:#fff;font-size:22px;line-height:1;cursor:pointer;transition:background 0.15s;}
.ct-cerrar:hover{background:var(--lt-primary);color:var(--lt-on-primary);}
.ct-datos{display:grid;grid-template-columns:repeat(2,1fr);gap:0.75rem;padding:1.25rem 1.75rem 0;}
.ct-dato:last-child:nth-child(odd){grid-column:1 / -1;}
.ct-dato{display:flex;align-items:center;gap:0.8rem;padding:0.85rem 0.9rem;border:1px solid #ececec;border-radius:10px;background:#fff;color:#262626;text-decoration:none;min-width:0;transition:border-color 0.15s,box-shadow 0.15s,transform 0.15s;}
a.ct-dato:hover{border-color:var(--lt-primary);box-shadow:0 6px 16px rgba(0,0,0,0.07);transform:translateY(-1px);}
.ct-dato > span:last-child{display:flex;flex-direction:column;min-width:0;}
.ct-dato small{font-size:11.5px;color:#888;font-weight:600;text-transform:uppercase;letter-spacing:0.3px;}
.ct-dato strong{font-size:14px;font-weight:700;line-height:1.35;overflow-wrap:anywhere;}
.ct-dato em{font-style:normal;font-size:12px;font-weight:700;color:var(--lt-primary-text);margin-top:0.15rem;}
.ct-icono{flex-shrink:0;width:40px;height:40px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:rgba(var(--lt-primary-rgb),0.2);color:#262626;}
.ct-icono .icono{width:20px;height:20px;}
.ct-dato--wa .ct-icono{background:#25d366;color:#fff;}
.ct-form{padding:1.25rem 1.75rem 1.75rem;margin-top:1.25rem;border-top:1px solid #f0f0f0;}
.ct-form-titulo{font-size:15px;font-weight:800;color:#262626;margin:0 0 0.85rem;}
.ct-fila{display:grid;grid-template-columns:1fr 1fr;gap:0.75rem;}
.ct-form label{display:flex;flex-direction:column;gap:0.3rem;margin-bottom:0.75rem;}
.ct-form label > span{font-size:12.5px;font-weight:700;color:#555;}
.ct-form label b{color:#d32f2f;}
.ct-form input,.ct-form textarea{width:100%;border:1px solid #dcdcdc;border-radius:8px;padding:0.65rem 0.85rem;font-size:14px;font-family:inherit;outline:none;background:#fafafa;transition:border-color 0.15s,background 0.15s,box-shadow 0.15s;}
.ct-form input:focus,.ct-form textarea:focus{border-color:#262626;background:#fff;box-shadow:0 0 0 3px rgba(var(--lt-primary-rgb),0.25);}
.ct-form textarea{resize:vertical;min-height:100px;}
.ct-form .ct-invalido{border-color:#d32f2f;background:#fff6f6;}
.ct-error{font-size:13px;font-weight:700;color:#d32f2f;margin:-0.25rem 0 0.75rem;}
.ct-acciones{display:flex;gap:0.75rem;flex-wrap:wrap;}
.ct-btn{flex:1;min-width:180px;display:flex;align-items:center;justify-content:center;gap:0.5rem;border:none;border-radius:8px;padding:0.85rem 1rem;font-size:14px;font-weight:800;font-family:inherit;cursor:pointer;transition:background 0.15s,transform 0.15s;}
.ct-btn .icono{width:18px;height:18px;}
.ct-btn:hover{transform:translateY(-1px);}
.ct-btn--wa{background:#25d366;color:#fff;}
.ct-btn--wa:hover{background:#1ebe5d;}
.ct-btn--correo{background:#262626;color:#fff;}
.ct-btn--correo:hover{background:#000;}
@media(max-width:560px){
    .ct-cabecera{padding:1.25rem 1.1rem 1rem;}
    .ct-datos{padding:1rem 1.1rem 0;grid-template-columns:1fr;gap:0.5rem;}
    .ct-form{padding:1rem 1.1rem 1.25rem;}
    .ct-fila{grid-template-columns:1fr;gap:0;}
}

/* Ventana "Ubícanos en" (includes/partials/modal_ubicacion.php); reutiliza la cabecera y botones de .ct-modal */
.ub-direccion{font-size:16px;font-weight:700;color:#fff;margin:0;line-height:1.4;position:relative;z-index:1;}
.ub-direccion::before{content:"";display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--lt-primary);margin-right:0.5rem;vertical-align:2px;}
.ub-mapa{background:#eceff1;}
.ub-mapa iframe{display:block;width:100%;height:340px;border:0;}
.ub-pie{display:flex;flex-direction:column;gap:1rem;padding:1.25rem 1.75rem 1.75rem;}
.ub-acciones{display:grid;grid-template-columns:repeat(3,1fr);gap:0.6rem;}
.ub-acciones .ct-btn{min-width:0;text-decoration:none;font-size:13px;padding:0.8rem 0.6rem;}
.ub-btn-maps{background:#262626;color:#fff;}
.ub-btn-maps:hover{background:#000;color:#fff;}
.ub-btn-waze{background:#33ccff;color:#0b2733;}
.ub-btn-waze:hover{background:#1fbff5;color:#0b2733;}
.ub-btn-copiar{background:#fff;color:#262626;border:1px solid #d6d6d6 !important;}
.ub-btn-copiar:hover{border-color:#262626 !important;}
@media(max-width:560px){
    .ub-mapa iframe{height:260px;}
    .ub-pie{padding:1rem 1.1rem 1.25rem;}
    .ub-acciones{grid-template-columns:1fr;}
}

/* ====== Colores de categorías (carrusel): paleta de la marca + neutros técnicos ====== */
.cat-color-0{background:linear-gradient(135deg,#d4ee4a,#bddd16);}
.cat-color-1{background:linear-gradient(135deg,#4a4a4a,#262626);}
.cat-color-2{background:linear-gradient(135deg,#5b7083,#3d4f60);}
.cat-color-3{background:linear-gradient(135deg,#2bb3a3,#15867a);}
.cat-color-4{background:linear-gradient(135deg,#4f86c6,#2f5f9a);}
.cat-color-5{background:linear-gradient(135deg,#a4bf1c,#7c9112);}
.cat-color-6{background:linear-gradient(135deg,#6c63c9,#4b43a3);}
.cat-color-7{background:linear-gradient(135deg,#9aa5b1,#6f7b88);}

/* ====== Selector "Mostrar" (paginación) ====== */
.mostrar-row{display:flex;align-items:center;gap:0.5rem;font-size:13px;color:#555;font-weight:600;}
.mostrar-row select{appearance:none;-webkit-appearance:none;-moz-appearance:none;border:none;border-radius:8px;padding:0.5rem 2rem 0.5rem 1rem;font-size:14px;font-weight:800;font-family:inherit;background:var(--lt-primary,#bddd16) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'%3E%3Cpath fill='%23262626' d='M0 0l5 6 5-6z'/%3E%3C/svg%3E") no-repeat right 0.75rem center;background-size:10px 6px;color:var(--lt-on-primary,#262626);cursor:pointer;}
.mostrar-row select:focus{outline:2px solid var(--lt-primary,#bddd16);outline-offset:2px;}

/* ====== Imagen de categoría (carrusel) ====== */
.category-circle img{width:100%;height:100%;object-fit:cover;border-radius:50%;display:block;}

/* Íconos de línea (función icono()): mismo tamaño que el texto y color de la marca. */
.icono{width:1.15em;height:1.15em;vertical-align:-0.2em;flex-shrink:0;}
.btn-menu .icono{margin-right:0.4em;color:var(--lt-primary-text);}
.btn-menu:hover .icono{color:inherit;}
.titulo-icono{display:flex;align-items:center;gap:0.45rem;}
.titulo-icono .icono{color:var(--lt-primary-text);}
.pie-icono{display:flex;align-items:flex-start;gap:0.4rem;}
.pie-icono .icono{margin-top:0.15em;}
/* Ícono como imagen de producto sin foto y en estados vacíos. */
.producto-imagen-placeholder .icono,.no-results-icon .icono,.cart-empty-icon .icono{width:1em;height:1em;color:#9aa0a6;}
.cart-item-img > .icono{width:1em;height:1em;color:#9aa0a6;}
.btn-header .icono,.btn-menu-hamburger .icono{vertical-align:-0.22em;}

/* ── Cabecera en dos franjas (referencia: intouch.com.pe, parte 1) ──
   Franja superior gris con canales de venta y soporte; franja principal carbón con logo blanco,
   buscador blanco con botón redondo y carrito con contador y total.
   "body #siteHeader" gana a los estilos en línea de cada página, que cargan después. */
body #siteHeader{background:#262626;border-bottom:0;padding:0;box-shadow:0 2px 10px rgba(0,0,0,0.25);}
body #siteHeader.is-scrolled{background:rgba(38,38,38,0.97);}
body #siteHeader .header-container{padding:0.85rem 2rem 0.6rem;}

.barra-superior{background:#4a4e53;color:#fff;font-size:12.5px;font-weight:600;}
.barra-superior-contenido{max-width:1200px;margin:0 auto;padding:0.45rem 2rem;display:flex;align-items:center;justify-content:space-between;gap:1rem;}
.barra-superior-datos{list-style:none;margin:0;padding:0;display:flex;align-items:center;flex-wrap:wrap;justify-content:flex-end;}
.barra-superior-datos li{display:inline-flex;align-items:center;gap:0.35rem;}
.barra-superior-datos li + li::before{content:"|";margin:0 0.85rem;opacity:0.55;}
.barra-superior-datos a{color:#fff;text-decoration:none;display:inline-flex;align-items:center;gap:0.35rem;}
.barra-superior-datos a:hover{color:var(--lt-primary);}
.barra-superior .icono{width:15px;height:15px;}

body #siteHeader .header-top{gap:1.25rem;}
body #siteHeader .logo.logo--img{max-width:150px;}
body #siteHeader .logo.logo--img img{max-height:52px;}

body #siteHeader .search-bar{display:flex;align-items:center;background:#fff;border-radius:999px;padding:0.25rem 0.25rem 0.25rem 0;}
body #siteHeader .search-bar .search-form{display:flex;align-items:center;width:100%;}
body #siteHeader .search-bar input{border:0;background:transparent;box-shadow:none;border-radius:999px;padding:0.55rem 1.25rem;font-size:14px;color:#262626;}
body #siteHeader .search-bar input:focus{box-shadow:none;}
body #siteHeader .search-bar button,
body #siteHeader .search-boton{flex-shrink:0;display:inline-flex;align-items:center;justify-content:center;width:2.6rem;height:2.6rem;margin:0;padding:0;border:0;border-radius:50%;background:#262626;color:#fff;cursor:pointer;transition:background 0.2s,color 0.2s;}
body #siteHeader .search-bar button:hover,
body #siteHeader .search-boton:hover{background:var(--lt-primary);color:var(--lt-on-primary);}
body #siteHeader .search-bar button .icono,
body #siteHeader .search-boton .icono{width:20px;height:20px;}

body #siteHeader .btn-header{background:transparent;border:0;color:#fff;padding:0.45rem 0.6rem;font-size:13px;}
body #siteHeader .btn-header:hover{color:var(--lt-primary);background:rgba(255,255,255,0.06);}
body #siteHeader .btn-header .icono{width:22px;height:22px;}
body #siteHeader .btn-carrito{position:relative;background:transparent;color:#fff;gap:0.55rem;}
body #siteHeader .btn-carrito:hover{background:rgba(255,255,255,0.06);color:#fff;}
body #siteHeader .btn-carrito .cart-badge{position:absolute;left:1.35rem;top:0.25rem;margin:0;width:18px;height:18px;background:var(--lt-primary);color:var(--lt-on-primary);border:2px solid #262626;font-size:10px;}
body #siteHeader .cart-total-header{font-size:15px;font-weight:800;letter-spacing:0.01em;}
body #siteHeader .btn-carrito.con-total .txt-carrito{display:none;}

body #siteHeader .header-menu{padding-top:0.35rem;border-top:1px solid rgba(255,255,255,0.08);}
body #siteHeader .btn-menu{color:#d4d4d4;}
body #siteHeader .btn-menu .icono{color:var(--lt-primary);}
body #siteHeader .btn-menu:hover,
body #siteHeader .btn-menu.active{background:rgba(255,255,255,0.08);color:#fff;border-color:transparent;}
body #siteHeader .btn-menu-hamburger{background:transparent;border:0;color:#fff;}
body #siteHeader .btn-menu-hamburger .icono{width:24px;height:24px;}
body #siteHeader .header-search-mobile input{border:0;border-radius:999px;background:#fff;}

@media (max-width: 768px){
    .barra-superior{display:none;}
    body #siteHeader .header-container{padding:0.7rem 1rem 0.55rem;}
    body #siteHeader .logo.logo--img img{max-height:40px;}
    body #siteHeader .cart-total-header{display:none;}
    body #siteHeader .btn-carrito.con-total .txt-carrito{display:none;}
}
@media (max-width: 768px){
    /* En celular el buscador baja a su propia fila. El inicio ya trae uno aparte para celular. */
    body #siteHeader .header-top{flex-wrap:wrap;row-gap:0.6rem;}
    body #siteHeader .header-top .search-bar{display:flex;order:10;flex-basis:100%;}
    body #siteHeader:has(.header-search-mobile) .header-top .search-bar{display:none;}
    body #siteHeader .header-actions{margin-left:auto;}
    body #siteHeader .btn-menu-hamburger .txt-hamburger{display:none;}
}

/* ── Barra de menú (referencia: impacto.com.pe, parte 2) ──
   Franja más oscura que la cabecera; cada categoría despliega sus subcategorías. */
body #siteHeader .header-container{padding-bottom:0.85rem;}
.menu-principal{background:#1a1a1a;border-top:1px solid rgba(255,255,255,0.06);}
.menu-lista{list-style:none;margin:0 auto;padding:0 2rem;max-width:1200px;display:flex;align-items:stretch;flex-wrap:nowrap;}
.menu-lista > li{position:relative;}
.menu-lista > li.menu-derecha{margin-left:auto;}
.menu-item{display:flex;align-items:center;gap:0.35rem;height:100%;padding:0.8rem 0.95rem;color:#e6e6e6;font-size:13.5px;font-weight:700;text-decoration:none;white-space:nowrap;transition:color 0.15s,background 0.15s;}
.menu-item .icono{width:16px;height:16px;}
.menu-item .icono:first-child{color:var(--lt-primary);}
.menu-item:hover,.menu-lista > li:hover > .menu-item,.menu-lista > li.activo > .menu-item{color:var(--lt-primary);}
.menu-lista > li.activo > .menu-item{box-shadow:inset 0 -3px 0 var(--lt-primary);}
.menu-desplegable > .menu-item .icono:last-child{width:14px;height:14px;opacity:0.75;transition:transform 0.15s;}
.menu-desplegable:hover > .menu-item .icono:last-child{transform:rotate(180deg);}

.submenu{list-style:none;margin:0;padding:0.45rem 0;position:absolute;top:100%;left:0;min-width:230px;background:#fff;border-radius:0 0 10px 10px;border-top:3px solid var(--lt-primary);box-shadow:0 14px 30px rgba(0,0,0,0.18);opacity:0;visibility:hidden;transform:translateY(6px);transition:opacity 0.15s,transform 0.15s,visibility 0.15s;z-index:200;}
.menu-derecha .submenu{left:auto;right:0;}
.menu-desplegable:hover > .submenu,.menu-desplegable:focus-within > .submenu{opacity:1;visibility:visible;transform:none;}
.submenu a{display:flex;align-items:center;gap:0.5rem;padding:0.55rem 1.1rem;color:#262626;font-size:13.5px;font-weight:600;text-decoration:none;}
.submenu a:hover{background:rgba(var(--lt-primary-rgb),0.16);color:#262626;}
.submenu .icono{width:16px;height:16px;color:var(--lt-primary-text);}
.submenu-todo{border-top:1px solid #eee;margin-top:0.3rem;padding-top:0.3rem;}
.submenu-todo a{color:var(--lt-primary-text);font-weight:800;}

@media (max-width: 768px){
    /* En celular el botón de menú despliega la barra como lista y los submenús se abren al tocar. */
    .menu-principal{display:none;max-height:calc(100vh - 140px);overflow-y:auto;}
    .menu-principal.open{display:block;}
    .menu-lista{flex-direction:column;padding:0.4rem 0;}
    .menu-lista > li.menu-derecha{margin-left:0;}
    .menu-item{padding:0.75rem 1.25rem;font-size:14.5px;justify-content:flex-start;}
    .menu-desplegable > .menu-item .icono:last-child{margin-left:auto;}
    .menu-desplegable:hover > .menu-item .icono:last-child{transform:none;}
    .menu-desplegable.abierto > .menu-item .icono:last-child{transform:rotate(180deg);}
    .submenu{position:static;display:none;opacity:1;visibility:visible;transform:none;box-shadow:none;border:0;border-radius:0;background:#232323;padding:0.25rem 0;min-width:0;}
    .menu-desplegable.abierto > .submenu{display:block;}
    .submenu a{color:#d4d4d4;padding:0.6rem 2.25rem;}
    .submenu a:hover{background:rgba(255,255,255,0.05);color:var(--lt-primary);}
    .submenu-todo{border-top-color:rgba(255,255,255,0.08);}
    .submenu-todo a{color:var(--lt-primary);}
}

/* Desplegables que se abren con clic (no con hover): "Categorías" y "Marcas" (.menu-con-clic). */
.menu-con-clic:hover > .submenu,.menu-con-clic:focus-within > .submenu{opacity:0;visibility:hidden;transform:translateY(6px);}
.menu-con-clic.abierto > .submenu{opacity:1;visibility:visible;transform:none;}
.menu-con-clic:hover > .menu-item .icono:last-child{transform:none;}
.menu-con-clic.abierto > .menu-item .icono:last-child{transform:rotate(180deg);}
.menu-lista > li.menu-con-clic.abierto > .menu-item{color:var(--lt-primary);}

/* Botón único "Categorías": despliega todas las categorías; las subcategorías de cada una
   salen a la derecha. Es el único relleno de lima en la barra. */
.menu-categorias > .menu-item{background:var(--lt-primary);color:var(--lt-on-primary);padding-left:1.15rem;padding-right:1.15rem;}
.menu-categorias > .menu-item .icono:first-child{color:var(--lt-on-primary);}
.menu-lista > li.menu-categorias:hover > .menu-item,
.menu-lista > li.menu-categorias.abierto > .menu-item,
.menu-lista > li.menu-categorias.activo > .menu-item{background:var(--lt-primary-dark);color:var(--lt-on-primary);box-shadow:none;}
/* Sin overflow: recortaría el panel de subcategorías que sale hacia la derecha. */
.menu-categorias > .submenu{min-width:260px;}
.con-subcategorias{position:relative;}
.submenu-cat > a{gap:0.7rem;}
.submenu .submenu-cat > a > .icono:first-child{width:18px;height:18px;stroke-width:1.75;color:inherit;flex-shrink:0;}
.con-subcategorias > a > .icono:last-child{width:14px;height:14px;color:#9a9a9a;margin-left:auto;}
.submenu li.activo > a{color:var(--lt-primary-text);font-weight:800;}
.submenu-subcategorias{list-style:none;margin:0;padding:0.45rem 0;position:absolute;left:100%;top:-0.45rem;min-width:220px;background:#fff;border-radius:0 10px 10px 0;border-left:3px solid var(--lt-primary);box-shadow:0 14px 30px rgba(0,0,0,0.18);opacity:0;visibility:hidden;transition:opacity 0.12s,visibility 0.12s;}
.con-subcategorias:hover > .submenu-subcategorias,.con-subcategorias:focus-within > .submenu-subcategorias{opacity:1;visibility:visible;}
.con-subcategorias:hover > a{background:rgba(var(--lt-primary-rgb),0.16);}

/* Lista de marcas: puede ser larga, así que se desplaza dentro del panel. */
.menu-marcas > .submenu{min-width:220px;max-height:min(70vh,460px);overflow-y:auto;}
/* Cada marca lleva su logo en miniatura (o su inicial si no tiene), como los íconos de categorías. */
.submenu-marca > a{gap:0.7rem;}
.submenu-marca-logo{flex-shrink:0;width:38px;height:22px;display:flex;align-items:center;justify-content:center;background:#fff;border-radius:4px;}
.submenu-marca-logo img{max-width:100%;max-height:100%;object-fit:contain;filter:grayscale(1);opacity:0.75;transition:filter 0.15s,opacity 0.15s;}
.submenu-marca > a:hover .submenu-marca-logo img,.submenu-marca.activo .submenu-marca-logo img{filter:none;opacity:1;}
.submenu-marca-inicial{width:20px;height:20px;border-radius:50%;border:1.6px solid currentColor;display:flex;align-items:center;justify-content:center;font-size:10.5px;font-weight:800;line-height:1;}
@media (max-width: 768px){
    .submenu-marca-logo{padding:2px 4px;}
    .submenu-marca-logo:has(.submenu-marca-inicial){background:none;padding:0;}
}

/* Entre tablet y escritorio angosto la barra no envuelve: se compactan los botones. */
@media (min-width: 769px) and (max-width: 1100px){
    .menu-lista{padding:0 1rem;}
    .menu-item{padding:0.8rem 0.6rem;font-size:13px;gap:0.3rem;}
    .menu-categorias > .menu-item{padding-left:0.8rem;padding-right:0.8rem;}
}
@media (min-width: 769px) and (max-width: 900px){
    .menu-item > .icono:first-child{display:none;}
    .menu-categorias > .menu-item > .icono:first-child{display:inline;}
}

@media (max-width: 768px){
    .menu-categorias > .menu-item{margin:0.35rem 1rem;border-radius:10px;}
    .menu-con-clic.abierto > .submenu{display:block;max-height:none;}
    .submenu-subcategorias{position:static;display:none;opacity:1;visibility:visible;box-shadow:none;border:0;border-radius:0;background:#1c1c1c;padding:0;min-width:0;}
    .con-subcategorias.abierto > .submenu-subcategorias{display:block;}
    .con-subcategorias:hover > .submenu-subcategorias{display:none;}
    .con-subcategorias.abierto:hover > .submenu-subcategorias{display:block;}
    .con-subcategorias > a > .icono:last-child{transition:transform 0.15s;}
    .con-subcategorias.abierto > a > .icono:last-child{transform:rotate(90deg);}
    .submenu-subcategorias a{padding-left:3.25rem;}
    .con-subcategorias:hover > a{background:transparent;}
}

/* ── Ofertas: insignia sobre la imagen y precio anterior tachado ── */
.insignia-oferta{position:absolute;top:0.5rem;left:0.5rem;z-index:2;background:#e5322d;color:#fff;font-size:11.5px;font-weight:900;letter-spacing:0.02em;line-height:1;padding:0.35rem 0.55rem;border-radius:6px;box-shadow:0 2px 6px rgba(229,50,45,0.35);}
.precio-anterior{display:block;font-size:11.5px;font-weight:600;color:#9a9a9a;text-decoration:line-through;line-height:1.2;}
body .producto-imagen{position:relative;}
body .galeria-principal{position:relative;}
.galeria-principal .insignia-oferta{top:0.85rem;left:0.85rem;font-size:14px;padding:0.45rem 0.7rem;}
.detalle-precio .precio-anterior{font-size:15px;margin-bottom:0.1rem;}
.detalle-precio-ahorro{display:inline-block;margin-left:0.5rem;vertical-align:middle;font-size:12px;font-weight:800;color:#c0261f;background:#fde8e7;border-radius:20px;padding:0.2rem 0.6rem;}

/* Marca en la ficha y en la grilla de marcas. */
.detalle-marca{display:inline-flex;align-items:center;gap:0.35rem;font-size:12px;font-weight:700;color:#262626;background:#f1f1f1;border-radius:20px;padding:0.3rem 0.85rem;margin-bottom:0.85rem;}
.detalle-marca:hover{background:#e6e6e6;}
.detalle-marca .icono{width:14px;height:14px;color:var(--lt-primary-text);}
.detalle-marca img{height:16px;width:auto;max-width:70px;object-fit:contain;}
.explorar-img.explorar-img--logo{background:#fff;border:1px solid #eee;}
.explorar-img.explorar-img--logo img{object-fit:contain;padding:1rem;}
.explorar-logo-texto{font-size:18px;font-weight:900;color:#262626;text-align:center;padding:0.75rem;word-break:break-word;}

/* Filtros activos del catálogo (marca, ofertas) con su botón para quitarlos. */
.filtros-activos{max-width:1200px;margin:-0.75rem auto 1.25rem;display:flex;flex-wrap:wrap;gap:0.5rem;}
.filtro-chip{display:inline-flex;align-items:center;gap:0.4rem;background:#fff;border:1px solid #e0e0e0;border-radius:20px;padding:0.3rem 0.5rem 0.3rem 0.85rem;font-size:12.5px;font-weight:700;color:#262626;}
.filtro-chip a{display:inline-flex;align-items:center;justify-content:center;width:20px;height:20px;border-radius:50%;background:#f0f0f0;color:#555;font-size:14px;line-height:1;}
.filtro-chip a:hover{background:var(--lt-primary);color:var(--lt-on-primary);}
.filtros-select{width:100%;border:1px solid #e0e0e0;border-radius:8px;padding:0.5rem 0.65rem;font-size:13px;font-family:inherit;background:#fff;color:#333;}
.filtros-check{display:flex;align-items:center;gap:0.5rem;font-size:13px;font-weight:600;color:#333;margin-top:0.75rem;cursor:pointer;}

/* En producto.php y pagina.php la cabecera es sticky (no fixed): queda dentro del relleno lateral
   del body y no llegaba de borde a borde. Se compensa con el mismo relleno en negativo. */
body #siteHeader.cabecera-sticky{margin-left:-2rem;margin-right:-2rem;}
@media (max-width: 768px){ body #siteHeader.cabecera-sticky{margin-left:-1rem;margin-right:-1rem;} }