/* =========================================================
   NOVA WEAR — Personalización de marca sobre Bootstrap 5
   Solo lo que Bootstrap no trae de fábrica: tipografía, logo,
   chips de precio/categoría, placeholders de foto, carrito.
   ========================================================= */

@import url('https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@500;600;700&family=Inter:wght@400;500;600;700&family=IBM+Plex+Mono:wght@500;600&display=swap');

:root{
  --bs-primary: #2B39FF;
  --bs-primary-rgb: 43,57,255;
  --bs-link-color: #2B39FF;
  --bs-link-hover-color: #1c27cc;
  --bs-font-sans-serif: 'Inter', system-ui, sans-serif;
  --bs-body-color: #111113;
  --nova-accent-2: #FF3D77;
  --nova-gradient: linear-gradient(135deg, var(--bs-primary) 0%, var(--nova-accent-2) 100%);
}

body{ font-family: var(--bs-font-sans-serif); }
h1,h2,h3,.navbar-brand,.display-4,.display-5{ font-family:'Space Grotesk', sans-serif; font-weight:600; letter-spacing:-.01em; }
.font-mono{ font-family:'IBM Plex Mono', monospace; }
.btn{ border-radius:999px; font-weight:500; }
.btn-lg{ padding:.9rem 1.7rem; }
.rounded-4{ border-radius:1rem !important; }

/* Logo */
.navbar-brand{ display:flex; align-items:center; gap:.5rem; font-size:1.3rem; }
.logo-mark{ width:32px; height:32px; }

/* Placeholder fotográfico (mientras no hay fotos reales) */
.ph{
  width:100%; height:100%; min-height:100px;
  background: repeating-linear-gradient(135deg,#F4F4F6,#F4F4F6 11px,#E6E6E9 11px,#E6E6E9 12px);
  display:flex; align-items:center; justify-content:center;
}
.ph::after{
  content: attr(data-label);
  font-family:'IBM Plex Mono', monospace; font-size:.68rem; letter-spacing:.05em; text-transform:uppercase;
  color:#5B5C63; background:#fff; border:1px solid #111113; border-radius:999px; padding:6px 12px;
}
.frame{ position:relative; overflow:hidden; border-radius:.75rem; aspect-ratio:3/4; }
.frame img{ width:100%; height:100%; object-fit:cover; transition:transform .5s ease; }
.product-card:hover .frame img, .cat-card:hover .frame img{ transform:scale(1.05); }

/* Hero */
.hero-media{ min-height:480px; }
.hero-copy{ background:#111113; color:#fff; }
.hero-copy .eyebrow{ color: var(--bs-primary); }

/* Carrusel hero */
.hero-section .carousel-item{ position:relative; }
.hero-slide-img{ width:100%; height:560px; object-fit:cover; }
.hero-section .ph.hero-slide-img{ display:flex; align-items:center; justify-content:center; }
.hero-slide-copy{
  position:absolute; inset:0; display:flex; flex-direction:column; justify-content:center;
  padding:3rem 4rem; max-width:640px;
  color:#fff;
  background:linear-gradient(90deg, rgba(10,10,12,.78) 0%, rgba(10,10,12,.35) 60%, rgba(10,10,12,0) 100%);
}
.hero-slide-copy .eyebrow{ color:#fff; opacity:.85; }
.hero-section .carousel-indicators{ margin-bottom:1.5rem; }
.hero-section .carousel-indicators [data-bs-target]{
  width:8px; height:8px; border-radius:50%; background-color:#fff; opacity:.5; border:0; margin:0 4px;
}
.hero-section .carousel-indicators .active{ opacity:1; background-color:transparent; background:var(--nova-gradient); }
.hero-section .carousel-control-prev, .hero-section .carousel-control-next{ width:5%; }
@media (max-width:768px){
  .hero-slide-img{ height:420px; }
  .hero-slide-copy{ padding:2rem; max-width:100%; }
}

/* Banner de la página de ofertas */
.offers-banner{ position:relative; }
.offers-banner img, .offers-banner .offers-banner-img{ width:100%; height:280px; object-fit:cover; display:block; }
.offers-banner .offers-banner-img{ display:flex; align-items:center; justify-content:center; }
.offers-banner-copy{
  position:absolute; inset:0; display:flex; flex-direction:column; justify-content:center; align-items:center;
  text-align:center; color:#fff; padding:1.5rem;
  background:linear-gradient(180deg, rgba(10,10,12,.25) 0%, rgba(10,10,12,.7) 100%);
}
.offers-banner-copy .eyebrow{ color:#fff; opacity:.9; }
.offers-banner-copy h2{ color:#fff; max-width:40ch; }
@media (max-width:768px){
  .offers-banner img, .offers-banner .offers-banner-img{ height:200px; }
}

/* Mapa de contacto */
.map-frame iframe{ display:block; }

/* Chips (precio / categoría) — elemento propio de marca */
.chip{
  display:inline-flex; align-items:center; font-family:'IBM Plex Mono',monospace;
  font-size:.76rem; font-weight:600; padding:.4rem .9rem; border-radius:999px;
  background:#111113; color:#fff;
}
.chip-sale{ background:#E23B3B; }
.cat-card .chip{ position:absolute; left:14px; bottom:14px; }
.product-card .chip{ position:absolute; top:12px; left:12px; }

/* Newsletter con degradado de marca */
.newsletter-section{ background: var(--nova-gradient); }
.newsletter-section .form-control{ background:rgba(0,0,0,.15); border-color:rgba(255,255,255,.5); color:#fff; }
.newsletter-section .form-control::placeholder{ color:rgba(255,255,255,.75); }

/* Testimonios */
.stars{ color:var(--bs-primary); letter-spacing:2px; }

/* Filtros / tienda */
.filters-clear{ font-family:'IBM Plex Mono',monospace; font-size:.78rem; }
.empty-state{ padding:60px 20px; }

/* Vista de lista en el catálogo */
.shop-grid.is-list .col-shop{ width:100%; }
.shop-grid.is-list .product-card{ display:flex; flex-direction:row; gap:1rem; align-items:center; }
.shop-grid.is-list .product-card .frame{ width:120px; aspect-ratio:1/1; flex-shrink:0; }
.shop-grid.is-list .product-card .card-body{ flex:1; padding:0; }

/* Offcanvas del carrito: ajustes de marca */
.cart-item + .cart-item{ border-top:1px solid #E6E6E9; }
.cart-item{ padding:.85rem 0; display:flex; justify-content:space-between; align-items:center; gap:.5rem; }

/* Toast */
.toast-container{ z-index:1090; }

@media (max-width:576px){
  .hero-media{ min-height:280px; }
}
