/* Carga la fuente Inter (todos los pesos) desde el CDN de Google. Antes dependa del auto-hospedaje local de Elementor, que en este servidor generaba el CSS con la URL de banprelocal.local en vez de banpre.com.ar. */ @import url('https://fonts.googleapis.com/css2?family=Inter:ital,wght@0,100..900;1,100..900&display=swap'); /** * banpre-anim.css — Fade-in al hacer scroll (reveal "desde fuera de pantalla"). * Se aplica a las cards de todo el sitio. El estado oculto SOLO se activa * cuando el JS marca , así sin JS nada queda escondido. * Respeta prefers-reduced-motion. */ .js-anim .banpre-reveal { opacity: 0; transform: translateY(48px); transition: opacity .7s cubic-bezier(.22,.61,.36,1), transform .7s cubic-bezier(.22,.61,.36,1); transition-delay: var(--bp-reveal-delay, 0ms); will-change: opacity, transform; } /* Variante lateral: entra desde fuera del borde de la pantalla. */ .js-anim .banpre-reveal--left { transform: translateX(-64px); } .js-anim .banpre-reveal--right { transform: translateX(64px); } .js-anim .banpre-reveal.is-in { opacity: 1; transform: none; } @media (prefers-reduced-motion: reduce) { .js-anim .banpre-reveal { opacity: 1 !important; transform: none !important; transition: none !important; } } /* -------------------------------------------------------------------------- BOTONES "Añadir al carrito" de los LISTADOS de producto → marrón dorado. Cubre tienda, categorías, relacionados, cross-sells, etc. (todo lo que está dentro de un ul.products). NO afecta el botón de la barra fija inferior del producto, porque ese no está en un ul.products (queda negro, como pediste). -------------------------------------------------------------------------- */ .woocommerce ul.products li.product a.button.add_to_cart_button, .woocommerce ul.products li.product a.add_to_cart_button, .woocommerce ul.products li.product a.button, .elementor-widget-woocommerce-products ul.products li.product a.button { background-color: #B8860B !important; border-color: #B8860B !important; color: #ffffff !important; } .woocommerce ul.products li.product a.add_to_cart_button:hover, .woocommerce ul.products li.product a.button:hover, .elementor-widget-woocommerce-products ul.products li.product a.button:hover { background-color: #a07908 !important; border-color: #a07908 !important; color: #ffffff !important; } /* -------------------------------------------------------------------------- FOOTER — íconos de redes en blanco y negro (antes dorado/marrón). Widget Social Icons de Elementor (id 6dd86ab). Fondo blanco + glifo negro, y al pasar el mouse se invierte (negro con glifo blanco). -------------------------------------------------------------------------- */ .elementor-element-6dd86ab .elementor-social-icon { background-color: #ffffff !important; color: #111111 !important; border: 1px solid rgba(0, 0, 0, 0.12) !important; transition: background-color .2s ease, color .2s ease; } .elementor-element-6dd86ab .elementor-social-icon i, .elementor-element-6dd86ab .elementor-social-icon svg { color: #111111 !important; fill: #111111 !important; } .elementor-element-6dd86ab .elementor-social-icon:hover { background-color: #111111 !important; color: #ffffff !important; } .elementor-element-6dd86ab .elementor-social-icon:hover i, .elementor-element-6dd86ab .elementor-social-icon:hover svg { color: #ffffff !important; fill: #ffffff !important; } /* -------------------------------------------------------------------------- HEADER — barra superior fija que se oculta al bajar y reaparece al subir. El JS (banpre-anim.js) agrega .bp-head y togglea .bp-head--hidden, y reserva el alto del header en el padding-top del body para que el contenido no salte. -------------------------------------------------------------------------- */ .elementor-location-header.bp-head { position: fixed; top: 0; left: 0; right: 0; width: 100%; z-index: 9995; box-shadow: 0 2px 14px rgba(0, 0, 0, 0.06); transition: transform .35s ease; will-change: transform; } .elementor-location-header.bp-head--hidden { transform: translateY(-100%); } /* Si hay sesión iniciada, la barra de administración de WordPress (fija arriba) tapaba el header. Lo bajamos su altura. Los visitantes no ven esta barra. */ .admin-bar .elementor-location-header.bp-head { top: 32px; } @media (max-width: 782px) { /* En móvil la barra de admin de WP es "absolute" (se va al scrollear), así que NO hay que desplazar el header fijo: lo dejamos pegado arriba. Con el offset quedaba flotando fuera de lugar al frenar el scroll. */ .admin-bar .elementor-location-header.bp-head { top: 0; } } @media (prefers-reduced-motion: reduce) { .elementor-location-header.bp-head { transition: none; } } /* Header más compacto: el alto lo daba el logo (image_size "full", sin tope). Lo limitamos para bajar la altura de toda la topbar. */ .elementor-location-header .elementor-widget-image { line-height: 0; } .elementor-location-header .elementor-widget-image img { height: 44px !important; width: auto !important; max-width: 100%; } @media (max-width: 768px) { .elementor-location-header .elementor-widget-image img { height: 38px !important; } } /* -------------------------------------------------------------------------- TIPOGRAFÍA GLOBAL DE TÍTULOS — Inter, peso 200 (Extra Light) en todo el sitio. Incluye los widgets Heading de Elementor (que traían su propio peso por widget) y los encabezados nativos de Astra (blog, entradas, etc.). -------------------------------------------------------------------------- */ h1, h2, h3, h4, h5, h6, .elementor-heading-title { font-family: 'Inter', sans-serif !important; font-weight: 200 !important; }