:root {
  --bg: #ffffff;
  --text: #111111;
  --muted: #6f6f6f;
  --line: #dfdfdf;
  --soft: #f6f6f6;
  --soft-2: #fafafa;
  --dark: #000000;
  --radius: 0;
  --container: 1280px;
  --shadow: 0 10px 25px rgba(0,0,0,.06);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }

body {
  margin: 0;
  font-family: Arial, Helvetica, sans-serif;
  background: var(--bg);
  color: var(--text);
  line-height: 1.45;
}

a { color: inherit; text-decoration: none; }
img { max-width: 100%; display: block; }
button, input, select, textarea { font: inherit; }

.container {
  width: min(100% - 32px, var(--container));
  margin: 0 auto;
}

/* =========================
   HEADER / NAV
   ========================= */

.topbar {
  background: #000;
  color: #fff;
  font-size: 12px;
  padding: 10px 0;
}

.topbar .inner,
.navbar .inner,
.promo .inner,
.footer-bottom {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 16px;
}

.top-links,
.actions,
.nav-links {
  display: flex;
  gap: 18px;
  align-items: center;
  flex-wrap: wrap;
}

.navbar {
  position: sticky;
  top: 0;
  z-index: 60;
  background: rgba(255,255,255,.96);
  border-bottom: 1px solid var(--line);
  backdrop-filter: blur(10px);
}

.navbar .inner {
  min-height: 74px;
}

.brand-wrap {
  display: flex;
  align-items: center;
  gap: 18px;
}

.logo {
  font-weight: 900;
  font-size: 28px;
  letter-spacing: 1.5px;
}

.logo img {
  height: 60px;
}

.nav-links a {
  font-size: 14px;
  font-weight: 700;
  letter-spacing: .7px;
  text-transform: uppercase;
}

.actions input,
.retail-input,
.filter-form input,
.filter-form select,
.checkout-form select,
.checkout-form textarea,
.checkout-form input {
  width: 100%;
  border: 1px solid #c9c9c9;
  background: #fff;
  padding: 14px 14px;
  outline: none;
  transition: border-color .2s ease, box-shadow .2s ease;
}

.actions input:focus,
.retail-input:focus,
.filter-form input:focus,
.filter-form select:focus,
.checkout-form select:focus,
.checkout-form textarea:focus,
.checkout-form input:focus {
  border-color: #000;
  box-shadow: 0 0 0 1px #000 inset;
}

.search-form-inline { min-width: 240px; }

.cart-link { font-weight: 700; }

.cart-count {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  min-width: 20px;
  height: 20px;
  padding: 0 6px;
  background: #000;
  color: #fff;
  font-size: 11px;
  border-radius: 999px;
}

.promo {
  background: #f2f2f2;
  padding: 12px 0;
  border-bottom: 1px solid var(--line);
  font-size: 14px;
}

/* =========================
   HERO
   ========================= */

.hero { position: relative; overflow: hidden; }
.slides { position: relative; min-height: 72vh; }

.slide {
  position: absolute;
  inset: 0;
  opacity: 0;
  visibility: hidden;
  transition: opacity .45s ease;
}

.slide.active {
  opacity: 1;
  visibility: visible;
  position: relative;
}

.slide::after {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, rgba(0,0,0,.7), rgba(0,0,0,.26) 50%, rgba(0,0,0,.12));
}

.slide img {
  width: 100%;
  height: 72vh;
  object-fit: cover;
}

.hero-content {
  position: absolute;
  left: 6%;
  bottom: 12%;
  z-index: 2;
  color: #fff;
  max-width: 580px;
}

.hero-content h1 {
  margin: 0 0 12px;
  font-size: clamp(38px, 6vw, 68px);
  line-height: .92;
  text-transform: uppercase;
}

.hero-content p {
  margin: 0 0 18px;
  font-size: 18px;
  max-width: 520px;
}

.hero-controls {
  position: absolute;
  right: 28px;
  bottom: 28px;
  z-index: 3;
  display: flex;
  gap: 8px;
}

.hero-controls button,
.menu-toggle {
  border: 1px solid #000;
  width: 42px;
  height: 42px;
  background: #fff;
  cursor: pointer;
  font-size: 18px;
}

.menu-toggle { display: none; }

/* =========================
   SECTIONS / TITLES
   ========================= */

.section { padding: 24px 0; }
.section-tight { padding-top: 10px; }

.section-head {
  display: flex;
  justify-content: space-between;
  align-items: end;
  gap: 16px;
  margin-bottom: 22px;
}

.section-head h2,
.newsletter h2,
.page-title,
.retail-title-xl {
  margin: 0;
  text-transform: uppercase;
  letter-spacing: .4px;
}

.section-head h2,
.newsletter h2 { font-size: clamp(24px, 4vw, 38px); }

.page-title { font-size: clamp(28px, 5vw, 46px); }
.retail-title-xl { font-size: clamp(30px, 5vw, 48px); }

.page-subtitle,
.retail-subtle { color: var(--muted); }

.page-hero,
.retail-breadcrumb-wrap { padding-bottom: 0; }

.page-hero {
  padding-top: 12px;
}

.retail-breadcrumb-wrap {
  padding-top: 8px;
  margin-bottom: -10px;
}

.breadcrumb {
  margin: 0;
  font-size: 13px;
  color: var(--muted);
}

/* =========================
   GRIDS
   ========================= */

.category-grid,
.collection-grid,
.product-grid,
.footer-grid,
.retail-grid-4 {
  display: grid;
  gap: 18px;
}

.category-grid { grid-template-columns: repeat(4, 1fr); }
.collection-grid { grid-template-columns: repeat(3, 1fr); }
.product-grid { grid-template-columns: repeat(4, 1fr); }
.retail-grid-4 { grid-template-columns: repeat(4, 1fr); }

/* =========================
   CARDS
   ========================= */

.category-card,
.collection-card,
.product-card,
.retail-box {
  background: #fff;
  border: 1px solid var(--line);
}

.retail-box { padding: 24px; }

.category-card {
  position: relative;
  min-height: 320px;
  overflow: hidden;
}

.category-card img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.category-card span {
  position: absolute;
  left: 18px;
  bottom: 18px;
  background: rgba(255,255,255,.95);
  padding: 10px 14px;
  font-weight: 800;
  text-transform: uppercase;
}

/* =========================
   PRODUCT CARD
   ========================= */

.product-card { overflow: hidden; }

.product-thumb {
  position: relative;
  background: var(--soft);
  aspect-ratio: 1 / 1;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}

.product-thumb img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  transition: transform .35s ease;
}

.product-card:hover .product-thumb img {
  transform: scale(1.04);
}

.product-info { padding: 18px; }

.product-info h3 {
  margin: 4px 0 10px;
  font-size: 16px;
  min-height: 44px;
}

.meta-small {
  color: #555;
  font-size: 12px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .4px;
}

.meta-line {
  color: #555;
  font-size: 14px;
  margin: 8px 0;
}

.price-row {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 10px;
}

.sale {
  font-weight: 800;
  font-size: 18px;
}

.price-column {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 4px;
}

.price-main {
  font-size: 22px;
  font-weight: 700;
  color: #000;
}

.badge,
.product-floating-tag {
  position: absolute;
  top: 16px;
  left: 16px;
  background: #fff;
  border: 1px solid #000;
  font-size: 11px;
  font-weight: 800;
  padding: 6px 10px;
  z-index: 2;
}

.wishlist-btn {
  position: absolute;
  top: 16px;
  right: 16px;
  border: 1px solid #d8d8d8;
  width: 40px;
  height: 40px;
  background: #fff;
  cursor: pointer;
}

/* =========================
   PILLS / OPTIONS
   ========================= */

.pill-row,
.variant-options,
.payment-choice-grid,
.product-info-strip,
.retail-content-grid {
  display: grid;
  gap: 12px;
}

.pill-row {
  grid-template-columns: repeat(4, 1fr);
  gap: 8px;
}

.pill-row.compact {
  grid-template-columns: repeat(4, 1fr);
}

.size-pill {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  min-height: 34px;
  min-width: 0;
  padding: 6px 8px;
  font-size: 13px;
  background: #fff;
  border: 1px solid #d0d0d0;
  text-align: center;
}

.stock-line strong { color: #000; }
.empty-note { color: var(--muted); font-size: 13px; }

/* =========================
   BUTTONS
   ========================= */

.btn,
.cart-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 52px;
  padding: 14px 24px;
  font-weight: 800;
  font-size: 14px;
  letter-spacing: .8px;
  text-transform: uppercase;
  border: 1px solid #000;
  transition: transform .2s ease, background .2s ease, color .2s ease;
  cursor: pointer;
}

.btn:hover,
.cart-btn:hover {
  transform: translateY(-1px);
}

.btn-dark,
.cart-btn {
  background: #000;
  color: #fff;
}

.btn-outline,
.btn-secondary {
  background: #fff;
  color: #000;
}

.btn-block { width: 100%; }
.disabled { pointer-events: none; opacity: .55; }

.link-btn,
.text-link-arrow,
.size-guide-link {
  background: transparent;
  border: 0;
  color: #000;
  font-weight: 700;
  padding: 0;
  cursor: pointer;
}

.btn-whatsapp {
  background: #25D366;
  color: #fff;
  border: 1px solid #25D366;
  margin-bottom: 12px;
}

.btn-whatsapp:hover {
  background: #1ebe5d;
  border-color: #1ebe5d;
  color: #fff;
}

/* =========================
   NEWSLETTER / FOOTER
   ========================= */

.newsletter {
  border: 1px solid var(--line);
  background: #f7f7f7;
  padding: 34px;
  display: flex;
  justify-content: space-between;
  gap: 20px;
  align-items: center;
}

.newsletter p {
  margin: 10px 0 0;
  color: var(--muted);
}

footer {
  background: #000;
  color: #fff;
  margin-top: 60px;
}

.footer-grid {
  grid-template-columns: repeat(4, 1fr);
  padding: 44px 0;
}

.footer-col h4 {
  margin: 0 0 14px;
  font-size: 15px;
  text-transform: uppercase;
}

.footer-col a {
  display: block;
  margin: 8px 0;
  color: rgba(255,255,255,.72);
  font-size: 14px;
}

.copyright {
  border-top: 1px solid rgba(255,255,255,.14);
  padding: 16px 0 22px;
  color: rgba(255,255,255,.65);
  font-size: 13px;
}

/* =========================
   LAYOUTS
   ========================= */

.shop-layout,
.cart-layout,
.checkout-retail-layout,
.cart-retail-layout,
.product-retail-layout {
  display: grid;
  gap: 24px;
}

.shop-layout { grid-template-columns: 280px 1fr; }
.cart-layout { grid-template-columns: minmax(0, 1fr) 360px; }
.product-retail-layout { grid-template-columns: minmax(0, 1.15fr) minmax(360px, .85fr); align-items: start; }
.cart-retail-layout,
.checkout-retail-layout { grid-template-columns: minmax(0, 1fr) 380px; align-items: start; }

.shop-sidebar,
.cart-summary,
.product-summary,
.product-gallery,
.cart-items,
.checkout-retail-form,
.checkout-retail-summary,
.cart-retail-items,
.cart-retail-summary,
.product-summary-sticky,
.product-main-media,
.info-tile,
.product-copy-box,
.cart-progress,
.checkout-success-box {
  box-shadow: none;
}

/* =========================
   FORMS
   ========================= */

.filter-form,
.checkout-form,
.product-form,
.product-retail-form {
  display: grid;
  gap: 14px;
}

.filter-form label,
.checkout-form label,
.product-form label,
.product-retail-form label {
  display: block;
  font-size: 12px;
  font-weight: 800;
  text-transform: uppercase;
  margin-bottom: 8px;
}

/* =========================
   PRODUCT DETAIL
   ========================= */

.retail-product-page {
  padding-top: 10px;
}

.product-main-media {
  position: relative;
  padding: 34px;
  background: var(--soft);
}

.product-main-media img {
  width: 100%;
  aspect-ratio: 1 / 1;
  object-fit: contain;
}

.product-info-strip {
  grid-template-columns: repeat(3, 1fr);
  margin-top: 16px;
}

.info-tile {
  display: grid;
  gap: 6px;
  background: #fff;
}

.info-tile strong {
  font-size: 13px;
  text-transform: uppercase;
}

.info-tile span {
  color: var(--muted);
  font-size: 14px;
}

.product-summary-sticky,
.cart-retail-summary,
.checkout-retail-summary {
  position: sticky;
  top: 96px;
}

.eyebrow {
  font-size: 12px;
  font-weight: 800;
  color: #555;
  text-transform: uppercase;
  letter-spacing: .5px;
}

.product-retail-title {
  margin: 10px 0 6px;
  font-size: clamp(28px, 4vw, 40px);
  line-height: 1.02;
  text-transform: uppercase;
}

.product-retail-subtitle,
.product-tax-note,
.summary-note {
  color: var(--muted);
  font-size: 14px;
}

.product-retail-price {
  margin: 18px 0 8px;
  font-size: 28px;
  font-weight: 900;
}

.summary-row-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
}

.size-selector-grid {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 10px;
}

.size-retail-option {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 46px;
  padding: 6px;
  border: 1px solid #d1d1d1;
  background: #fff;
  cursor: pointer;
  text-align: center;
}

.size-retail-option input {
  position: absolute;
  inset: 0;
  opacity: 0;
  cursor: pointer;
}

.size-retail-option:has(input:checked) {
  border-color: #000;
  box-shadow: 0 0 0 1px #000 inset;
}

.size-retail-option.is-disabled {
  opacity: .45;
  background: #f2f2f2;
  cursor: not-allowed;
}

.size-retail-option:hover {
  border-color: #000;
  box-shadow: 0 0 0 1px #000 inset;
}

.size-value {
  font-size: 13px;
  font-weight: 700;
}

.size-retail-option small {
  color: var(--muted);
  font-size: 11px;
}

.product-form-inline {
  display: flex;
  gap: 14px;
}

.qty-box,
.qty-mini-wrap {
  max-width: 140px;
}

.qty-input { text-align: center; }

.product-feature-list {
  border-top: 1px solid var(--line);
  margin-top: 22px;
  padding-top: 18px;
  display: grid;
  gap: 10px;
}

.feature-line { font-size: 14px; }

.retail-content-grid {
  grid-template-columns: repeat(2, 1fr);
}

.product-copy-box h2 {
  margin-top: 0;
  text-transform: uppercase;
  font-size: 20px;
}

.product-copy-box p {
  margin-bottom: 0;
  color: var(--muted);
}

.retail-card-info { padding-top: 16px; }
.retail-thumb { background: #f5f5f5; }

.product-retail-gallery { grid-column: 1; }
.product-retail-summary { grid-column: 2; }

.product-info-strip-mobile-below {
  grid-column: 1 / -1;
  width: 100%;
  min-width: 0;
  margin-top: 8px;
}

.product-info-strip-mobile-below .info-tile {
  width: 100%;
}

/* =========================
   CART / CHECKOUT
   ========================= */

.cart-page-head,
.checkout-head {
  display: flex;
  justify-content: space-between;
  align-items: end;
  gap: 16px;
  margin-bottom: 24px;
}

.cart-progress {
  display: inline-flex;
  gap: 10px;
  align-items: center;
  font-size: 13px;
  font-weight: 800;
  text-transform: uppercase;
  padding: 14px 18px;
}

.cart-progress .is-current { color: #000; }

.cart-retail-item {
  display: grid;
  grid-template-columns: 170px minmax(0, 1fr) 160px;
  gap: 18px;
  padding: 0 0 20px;
  margin-bottom: 20px;
  border-bottom: 1px solid var(--line);
}

.cart-retail-item:last-child { margin-bottom: 0; }

.cart-retail-image {
  background: #f5f5f5;
  min-height: 170px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.cart-retail-image img {
  width: 100%;
  height: 170px;
  object-fit: contain;
}

.cart-retail-main h3 {
  margin: 6px 0 12px;
  font-size: 22px;
  text-transform: uppercase;
}

.cart-meta {
  color: var(--muted);
  margin-bottom: 7px;
}

.cart-actions-inline {
  display: flex;
  align-items: end;
  gap: 16px;
  flex-wrap: wrap;
  margin-top: 16px;
}

.cart-retail-price {
  display: flex;
  flex-direction: column;
  align-items: end;
  gap: 8px;
}

.unit-price { color: var(--muted); }

.line-total {
  font-size: 22px;
  font-weight: 900;
}

.cart-bottom-actions {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  flex-wrap: wrap;
  padding-top: 8px;
}

.summary-line,
.checkout-summary-item,
.summary-product {
  display: flex;
  justify-content: space-between;
  align-items: start;
  gap: 12px;
  padding: 12px 0;
  border-bottom: 1px solid var(--line);
}

.summary-line.total {
  font-size: 20px;
  font-weight: 900;
  border-bottom: 0;
}

.checkout-summary-item span {
  display: block;
  margin-top: 4px;
  color: var(--muted);
  font-size: 13px;
}

.retail-empty-cart,
.checkout-success-box {
  text-align: center;
  padding: 54px 24px;
}

.retail-empty-cart h2,
.checkout-success-box h2 {
  margin-top: 0;
  text-transform: uppercase;
}

.retail-empty-cart p,
.checkout-success-box p {
  color: var(--muted);
  max-width: 620px;
  margin: 0 auto 18px;
}

.checkout-block + .checkout-block { margin-top: 28px; }

.checkout-block-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 16px;
  margin-bottom: 16px;
  padding-bottom: 12px;
  border-bottom: 1px solid var(--line);
}

.checkout-block-head h2 {
  margin: 0;
  font-size: 18px;
  text-transform: uppercase;
}

.checkout-block-head span {
  font-size: 12px;
  font-weight: 800;
  color: var(--muted);
  text-transform: uppercase;
}

.retail-form-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 16px;
}

.field-span-2 { grid-column: span 2; }

.payment-choice-grid {
  grid-template-columns: repeat(3, 1fr);
}

.payment-card {
  position: relative;
  border: 1px solid #d0d0d0;
  min-height: 82px;
  padding: 16px;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  cursor: pointer;
  font-weight: 800;
}

.payment-card input {
  position: absolute;
  inset: 0;
  opacity: 0;
  cursor: pointer;
}

.payment-card:has(input:checked) {
  border-color: #000;
  box-shadow: 0 0 0 1px #000 inset;
}

.alert-box {
  background: #fff4df;
  border: 1px solid #f0c36b;
  padding: 12px 14px;
  font-size: 14px;
}

.empty-state { text-align: center; }

/* =========================
   MOBILE MENU
   ========================= */

.mobile-menu {
  display: none;
  padding-bottom: 16px;
}

.mobile-menu a {
  display: block;
  padding: 10px 0;
  border-top: 1px solid var(--line);
  font-weight: 700;
}

.desktop-only { display: block; }

/* =========================
   STOCK BOX
   ========================= */

.stock-display-box {
  display: flex;
  align-items: center;
  min-height: 52px;
  background: #f7f7f7;
  border: 1px solid #c9c9c9;
  font-weight: 700;
}

/* =========================
   SHOP FILTERS + MOBILE GRID
   ========================= */

.shop-sidebar h3 {
  margin-top: 0;
  margin-bottom: 18px;
  text-transform: uppercase;
  font-size: 18px;
}

.filter-drawer {
  width: 100%;
}

.filter-toggle {
  display: none;
  width: 100%;
  min-height: 52px;
  padding: 14px 16px;
  border: 1px solid #000;
  background: #fff;
  color: #000;
  font-weight: 800;
  font-size: 14px;
  letter-spacing: .4px;
  text-transform: uppercase;
  justify-content: space-between;
  align-items: center;
  cursor: pointer;
}

.filter-toggle-icon {
  font-size: 20px;
  line-height: 1;
}

.filter-content {
  display: block;
}

.shop-head-actions {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
}

.mobile-grid-switch {
  display: none;
  align-items: center;
  border: 1px solid var(--line);
  background: #fff;
}

.grid-switch-btn {
  border: 0;
  background: #fff;
  color: #000;
  min-height: 36px;
  padding: 8px 12px;
  font-size: 12px;
  font-weight: 700;
  cursor: pointer;
  text-transform: uppercase;
}

.grid-switch-btn + .grid-switch-btn {
  border-left: 1px solid var(--line);
}

.grid-switch-btn.active {
  background: #000;
  color: #fff;
}

.pill-row-shop {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 6px;
}

.pill-row-shop .size-pill {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  min-width: 0;
  text-align: center;
  padding: 6px 4px;
  font-size: 12px;
}

/* =========================
   RESPONSIVE <= 1100px
   ========================= */

@media (max-width: 1100px) {
  .product-grid,
  .retail-grid-4 { grid-template-columns: repeat(3, 1fr); }

  .category-grid { grid-template-columns: repeat(3, 1fr); }

  .product-retail-layout,
  .cart-retail-layout,
  .checkout-retail-layout,
  .cart-layout { grid-template-columns: 1fr; }

  .product-summary-sticky,
  .cart-retail-summary,
  .checkout-retail-summary { position: static; }
}

/* =========================
   RESPONSIVE <= 860px
   ========================= */

@media (max-width: 860px) {
  .nav-links,
  .desktop-only { display: none; }

  .menu-toggle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
  }

  .mobile-menu.is-open { display: block; }

  .slides,
  .slide img {
    min-height: 58vh;
    height: 58vh;
  }

  .hero-content {
    left: 20px;
    right: 20px;
    max-width: 100%;
  }

  .category-grid,
  .collection-grid,
  .product-grid,
  .retail-grid-4,
  .footer-grid,
  .retail-content-grid,
  .payment-choice-grid,
  .product-info-strip {
    grid-template-columns: 1fr 1fr;
  }

  .shop-layout { grid-template-columns: 1fr; }

  .cart-page-head,
  .checkout-head,
  .section-head,
  .newsletter {
    flex-direction: column;
    align-items: start;
  }

  .cart-retail-item { grid-template-columns: 120px 1fr; }
  .cart-retail-price { grid-column: 2; align-items: start; }

  /* FILTRO DESPLEGABLE EN TIENDA */
  .shop-head-mobile {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 12px;
  }

  .shop-head-actions {
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
  }

  .mobile-grid-switch {
    display: inline-flex;
  }

  .filter-toggle {
    display: flex;
    margin-bottom: 12px;
  }

  .filter-content {
    display: none;
  }

  .filter-drawer.is-open .filter-content {
    display: block;
  }

  .shop-sidebar {
    padding: 0;
    border: 0;
    background: transparent;
  }

  .filter-drawer .filter-content {
    border: 1px solid var(--line);
    background: #fff;
    padding: 16px;
  }

  .filter-drawer .filter-content h3 {
    margin-top: 0;
    margin-bottom: 16px;
  }

  #productGrid.mobile-grid-1 {
    grid-template-columns: 1fr !important;
  }

  #productGrid.mobile-grid-2 {
    grid-template-columns: repeat(2, 1fr) !important;
  }

  #productGrid.mobile-grid-2 .product-info {
    padding: 12px;
  }

  #productGrid.mobile-grid-2 .product-info h3 {
    font-size: 14px;
    min-height: auto;
  }

  #productGrid.mobile-grid-2 .price-main {
    font-size: 18px;
  }

  #productGrid.mobile-grid-2 .meta-line {
    font-size: 12px;
  }

  #productGrid.mobile-grid-2 .cart-btn {
    min-height: 44px;
    padding: 10px 12px;
    font-size: 12px;
  }

  #productGrid.mobile-grid-1 .pill-row-shop {
    grid-template-columns: repeat(4, 1fr) !important;
  }

  #productGrid.mobile-grid-2 .pill-row-shop {
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 4px;
  }

  #productGrid.mobile-grid-2 .pill-row-shop .size-pill {
    font-size: 11px;
    padding: 5px 2px;
    min-height: 30px;
  }
}

/* =========================
   RESPONSIVE <= 640px
   ========================= */

@media (max-width: 640px) {
  .container { width: min(100% - 20px, var(--container)); }
  .section { padding: 42px 0; }

  .topbar .inner,
  .promo .inner {
    flex-direction: column;
    align-items: start;
  }

  .logo img { height: 48px; }

  .category-grid,
  .collection-grid,
  .retail-grid-4,
  .footer-grid,
  .retail-content-grid,
  .product-info-strip,
  .retail-form-grid,
  .payment-choice-grid {
    grid-template-columns: 1fr;
  }

  .product-grid {
    grid-template-columns: 1fr;
  }

  .size-selector-grid {
    grid-template-columns: repeat(4, 1fr);
    gap: 6px;
  }

  .cart-retail-item { grid-template-columns: 1fr; }

  .cart-retail-image img { height: 220px; }

  .field-span-2 { grid-column: auto; }

  .product-form-inline,
  .cart-bottom-actions {
    flex-direction: column;
  }

  .btn,
  .cart-btn { width: 100%; }

  .product-retail-layout {
    display: flex;
    flex-direction: column;
    grid-template-columns: 1fr;
  }

  .product-retail-gallery,
  .product-retail-summary,
  .product-info-strip-mobile-below {
    grid-column: auto;
  }

  .product-retail-gallery { order: 1; }
  .product-retail-summary { order: 2; }

  .product-info-strip {
    order: 3;
    margin-top: 16px;
  }

  .product-info-strip-mobile-below {
    width: 100%;
    display: grid;
    grid-template-columns: 1fr;
    gap: 12px;
    margin-top: 16px;
  }

  .product-info-strip-mobile-below .info-tile {
    width: 100%;
  }
}
.filter-toggle {
  display: none;
  width: 100%;
  min-height: 52px;
  padding: 14px 16px;
  border: 1px solid #000;
  background: #fff;
  color: #000;
  font-weight: 800;
  font-size: 14px;
  letter-spacing: .4px;
  text-transform: uppercase;
  justify-content: space-between;
  align-items: center;
  cursor: pointer;
}

.filter-toggle-icon {
  font-size: 20px;
  line-height: 1;
}

.filter-content {
  display: block;
}

@media (max-width: 860px) {
  .filter-toggle {
    display: flex;
    margin-bottom: 12px;
  }

  .shop-sidebar {
    padding: 0;
    border: 0;
    background: transparent;
  }

  .filter-content {
    display: none;
    border: 1px solid var(--line);
    background: #fff;
    padding: 16px;
  }

  .filter-content.is-open {
    display: block;
  }

  .filter-content h3 {
    margin-top: 0;
    margin-bottom: 16px;
  }
}

/* =========================
   CATEGORIA.PHP ONLY
   ========================= */

.category-grid-toolbar {
  display: flex;
  justify-content: flex-end;
  margin-bottom: 12px;
}

.category-toolbar-right {
  display: flex;
  align-items: center;
  gap: 10px;
}

.category-sort-form {
  margin: 0;
}

.category-sort-select {
  min-width: 210px;
  height: 36px;
  padding: 6px 10px;
  font-size: 12px;
}

.category-view-switcher {
  display: none;
  align-items: center;
  border: 1px solid var(--line);
  background: #fff;
}

.category-view-btn {
  border: 0;
  background: #fff;
  color: #000;
  min-height: 36px;
  padding: 8px 12px;
  font-size: 12px;
  font-weight: 700;
  cursor: pointer;
  text-transform: uppercase;
}

.category-view-btn + .category-view-btn {
  border-left: 1px solid var(--line);
}

.category-view-btn.active {
  background: #000;
  color: #fff;
}

.category-filter-toggle {
  display: none;
  width: 100%;
  min-height: 52px;
  padding: 14px 16px;
  border: 1px solid #000;
  background: #fff;
  color: #000;
  font-weight: 800;
  font-size: 14px;
  letter-spacing: .4px;
  text-transform: uppercase;
  justify-content: space-between;
  align-items: center;
  cursor: pointer;
  margin-bottom: 12px;
}

.category-filter-toggle-label {
  display: inline-flex;
  align-items: center;
}

.category-filter-toggle-icon {
  font-size: 20px;
  line-height: 1;
  font-weight: 700;
}

.category-filters-grid {
  display: grid;
  grid-template-columns: 2fr 1fr 1fr 1fr 1fr;
  gap: 12px;
  align-items: stretch;
}

.category-filters-actions {
  display: flex;
  gap: 8px;
}

.category-filters-actions .btn {
  flex: 1;
  text-align: center;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

@media (max-width: 860px) {
  .category-view-switcher {
    display: inline-flex;
  }

  .category-grid-toolbar {
    justify-content: space-between;
    gap: 10px;
    flex-wrap: wrap;
  }

  .category-toolbar-right {
    width: 100%;
    justify-content: space-between;
    flex-wrap: wrap;
  }

  .category-sort-form {
    flex: 1;
  }

  .category-sort-select {
    width: 100%;
    min-width: 0;
    min-height: 36px;
  }

  .category-filter-toggle {
    display: flex;
  }

  .category-filters-grid {
    display: none;
    grid-template-columns: 1fr;
    gap: 10px;
    border: 1px solid var(--line);
    background: #fff;
    padding: 16px;
  }

  .category-filters-grid.is-open {
    display: grid;
  }

  .category-filters-actions {
    flex-direction: column;
  }

  .category-filters-actions .btn {
    width: 100%;
  }

  #categoryProductGrid.category-mobile-grid-1 {
    grid-template-columns: 1fr !important;
  }

  #categoryProductGrid.category-mobile-grid-2 {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 12px !important;
  }

  #categoryProductGrid.category-mobile-grid-2 .product-info {
    padding: 12px;
  }

  #categoryProductGrid.category-mobile-grid-2 .product-info h3 {
    font-size: 14px;
    min-height: auto;
    line-height: 1.25;
  }

  #categoryProductGrid.category-mobile-grid-2 .price-main {
    font-size: 18px;
  }

  #categoryProductGrid.category-mobile-grid-2 .meta-line {
    font-size: 12px;
  }

  #categoryProductGrid.category-mobile-grid-2 .cart-btn {
    min-height: 44px;
    padding: 10px 12px;
    font-size: 12px;
  }

  #categoryProductGrid.category-mobile-grid-1 .pill-row-shop {
    grid-template-columns: repeat(4, 1fr) !important;
  }

  #categoryProductGrid.category-mobile-grid-2 .pill-row-shop {
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 4px;
  }

  #categoryProductGrid.category-mobile-grid-2 .pill-row-shop .size-pill {
    font-size: 11px;
    padding: 5px 2px;
    min-height: 30px;
  }
}










.shop-sort-form {
  margin: 0;
}

.shop-sort-select {
  min-width: 210px;
  min-height: 36px;
  padding: 6px 10px;
  font-size: 12px;
}

@media (max-width: 860px) {
  .shop-head-actions {
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
  }

  .shop-sort-form {
    flex: 1 1 100%;
  }

  .shop-sort-select {
    width: 100%;
    min-width: 0;
  }
}






.search-form-header {
    display: flex;
    align-items: center;
}

.search-form-header input {
    height: 36px;
    padding: 0 10px;
    border: 1px solid #ddd;
    border-right: none;
    border-radius: 6px 0 0 6px;
    outline: none;
}

.search-submit-btn {
    height: 36px;
    width: 36px;
    border: 1px solid #ddd;
    border-left: none;
    background: #000;
    color: #fff;
    border-radius: 0 6px 6px 0;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
}







.mobile-search-form {
    display: none;
}



/* wrapper buscador */

.search-wrapper {
    position: relative;
    display: flex;
    align-items: center;
}

/* icono buscador móvil */

.mobile-search-icon {
    display: none;
    font-size: 22px;
    background: transparent;
    border: none;
    cursor: pointer;
}

/* buscador escritorio */

.search-form-header {
    display: flex;
    align-items: center;
}

/* input buscador */

.search-form-header input {
    height: 36px;
    padding: 0 10px;
    border: 1px solid #ddd;
    border-right: none;
    border-radius: 6px 0 0 6px;
}

/* botón buscador */

.search-submit-btn {
    height: 36px;
    width: 36px;
    border: 1px solid #ddd;
    border-left: none;
    background: black;
    color: white;
    border-radius: 0 6px 6px 0;
    cursor: pointer;
}

/* ========================= */
/* comportamiento móvil */
/* ========================= */

@media (max-width: 991px) {

    .mobile-search-icon {
        display: block;
    }

    .search-form-header {
        display: none;
        position: absolute;
        right: 0;
        top: 40px;
        background: white;
        padding: 8px;
        border-radius: 8px;
        box-shadow: 0 4px 12px rgba(0,0,0,.12);
    }

    .search-form-header.active {
        display: flex;
    }

}




.footer-links {
    display: block;
}

/* SOLO móvil */

@media (max-width: 768px) {

    .footer-grid {
        display: block;
    }

    .footer-toggle {
        display: flex;
        justify-content: space-between;
        align-items: center;
        cursor: pointer;
        border-bottom: 1px solid #eee;
        padding: 12px 0;
        margin: 0;
    }

    .footer-links {
        display: none;
        padding-bottom: 10px;
    }

    .footer-col.active .footer-links {
        display: block;
    }

}

.footer-links {
    display: block;
}

@media (max-width: 768px) {
    .footer-grid {
        display: block;
    }

    .footer-toggle {
        display: flex;
        justify-content: space-between;
        align-items: center;
        cursor: pointer;
        border-bottom: 1px solid #eee;
        padding: 12px 0;
        margin: 0;
    }

    .footer-links {
        display: none;
        padding-bottom: 10px;
    }

    .footer-col.active .footer-links {
        display: block;
    }
}

.promo-banner-channel {
    background: linear-gradient(135deg, #111, #2b2b2b);
    color: #fff;
    border-radius: 16px;
    padding: 32px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    overflow: hidden;
    position: relative;
}

.promo-banner-channel::before {
    content: "";
    position: absolute;
    right: -40px;
    top: 50%;
    transform: translateY(-50%);
    width: 220px;
    height: 220px;
    background: url('../img/banner-zapatillas.png') no-repeat center/contain;
    opacity: 0.18;
    pointer-events: none;
}

.promo-banner-content {
    max-width: 600px;
    position: relative;
    z-index: 1;
}

.promo-banner-channel h2 {
    margin: 0 0 10px;
    font-size: 32px;
    line-height: 1.1;
    color: #fff;
}

.promo-banner-channel p {
    margin: 0;
    font-size: 16px;
    line-height: 1.6;
    color: rgba(255, 255, 255, 0.9);
}

.promo-banner-channel .newsletter-actions {
    position: relative;
    z-index: 1;
}

.promo-banner-channel .btn {
    background: #fff;
    color: #111;
    border: none;
    font-weight: 700;
    padding: 12px 22px;
    border-radius: 8px;
    text-decoration: none;
    display: inline-block;
}

.promo-banner-channel .btn:hover {
    opacity: 0.92;
}

@media (max-width: 768px) {
    .promo-banner-channel {
        flex-direction: column;
        align-items: flex-start;
        padding: 24px;
    }

    .promo-banner-channel::before {
        width: 150px;
        height: 150px;
        right: -30px;
        top: 30px;
        transform: none;
    }

    .promo-banner-channel h2 {
        font-size: 24px;
    }

    .promo-banner-channel p {
        font-size: 14px;
    }
}



.whatsapp-float {
    position: fixed;
    bottom: 24px;
    right: 24px;
    width: 58px;
    height: 58px;
    background: #25D366;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 6px 18px rgba(0,0,0,.25);
    z-index: 9999;
    transition: transform .2s ease, box-shadow .2s ease;
}

.whatsapp-float svg {
    width: 28px;
    height: 28px;
}

.whatsapp-float:hover {
    transform: translateY(-4px);
    box-shadow: 0 10px 22px rgba(0,0,0,.35);
}

@media (min-width: 992px) {

    .page-hero.section {
        padding-top: 10px;
        padding-bottom: 5px;
    }

    .section-tight.section {
        padding-top: 5px;
    }

    .shop-layout {
        margin-top: 0;
    }

    .filter-toggle {
        margin-top: 0;
    }

}

@media (max-width: 768px) {

    .section {
        padding: 14px 0;
    }

    .page-hero.section {
        padding-top: 6px;
        padding-bottom: 4px;
    }

    .section-tight.section {
        padding-top: 4px;
    }

    .breadcrumb {
        margin-bottom: 4px;
        font-size: 13px;
    }

    .shop-head-mobile {
        margin-top: 0;
        margin-bottom: 6px;
    }

    .filter-toggle {
        margin-top: 0;
        padding: 8px 0;
    }

}
/* =========================
   CINTAS AL TOQUE - CORPORATE HOME
   ========================= */
:root{
  --cintas-yellow:#FFC400;
  --cintas-red:#E30613;
  --cintas-blue:#075CFF;
  --cintas-dark:#171717;
}
.cintas-topbar{background:#111;color:#fff}.cintas-navbar{background:#fff}.cintas-promo{background:var(--cintas-yellow);color:#111;text-align:center}.cintas-logo{font-size:34px;line-height:1;font-weight:900;letter-spacing:-1.8px;text-transform:lowercase}.cintas-logo strong{color:#fff;background:var(--cintas-yellow);padding:7px 0 7px 9px}.cintas-logo span{color:var(--cintas-red);background:var(--cintas-yellow);padding:7px 9px 7px 0}.cintas-header-btn{background:var(--cintas-red);color:#fff;padding:12px 18px;border-radius:999px;font-weight:800}.cintas-site{background:#fff}.cintas-hero{background:linear-gradient(135deg,var(--cintas-yellow) 0%,#ffd84d 100%);padding:86px 0 70px;overflow:hidden}.cintas-hero-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:44px;align-items:center}.cintas-kicker{display:inline-flex;background:#fff;color:var(--cintas-red);font-size:13px;font-weight:900;text-transform:uppercase;letter-spacing:.9px;padding:9px 14px;border-radius:999px;margin-bottom:18px}.cintas-hero h1{font-size:clamp(42px,6vw,76px);line-height:.94;margin:0 0 20px;color:#111;letter-spacing:-3px}.cintas-hero p{font-size:20px;max-width:620px;margin:0 0 28px;color:#2b2b2b}.cintas-actions{display:flex;gap:14px;flex-wrap:wrap}.cintas-btn{display:inline-flex;align-items:center;justify-content:center;padding:15px 24px;border-radius:999px;font-weight:900}.cintas-btn.primary{background:var(--cintas-red);color:#fff}.cintas-btn.secondary{background:#fff;color:#111}.cintas-hero-card{background:#fff;border-radius:36px;padding:22px;box-shadow:0 26px 70px rgba(0,0,0,.18);transform:rotate(2deg)}.cintas-hero-card img{border-radius:26px;width:100%;height:auto}.cintas-strip{background:#111;color:#fff;padding:24px 0}.cintas-strip-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}.cintas-strip strong{display:block;color:var(--cintas-yellow);font-size:18px}.cintas-strip span{display:block;color:#ddd;font-size:14px}.cintas-section,.cintas-products,.cintas-industries{padding:72px 0}.cintas-head h2{font-size:clamp(32px,4vw,52px);letter-spacing:-2px;margin:0;color:#111}.cintas-head a{color:var(--cintas-red);font-weight:900}.cintas-category-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}.cintas-category-card{background:#fff;border:1px solid #eee;border-radius:26px;padding:30px;box-shadow:0 12px 34px rgba(0,0,0,.06);min-height:230px}.cintas-category-card h3{font-size:24px;margin:14px 0 10px}.cintas-category-card p{color:#666;margin:0}.cintas-icon{width:58px;height:58px;border-radius:18px;background:var(--cintas-yellow);display:flex;align-items:center;justify-content:center;font-size:30px}.cintas-products{background:#f7f7f7}.cintas-product-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}.cintas-product-card{background:#fff;border-radius:28px;padding:28px;border:1px solid #eee;display:flex;flex-direction:column;gap:12px;min-height:280px}.cintas-product-card span{align-self:flex-start;background:var(--cintas-yellow);padding:7px 12px;border-radius:999px;font-weight:900;font-size:12px}.cintas-product-card h3{font-size:23px;margin:0}.cintas-product-card p{color:#666;margin:0;flex:1}.cintas-product-card a{font-weight:900;color:var(--cintas-red)}.cintas-industries-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:40px;align-items:center}.cintas-industries h2{font-size:clamp(32px,4vw,54px);line-height:1;margin:0 0 16px;letter-spacing:-2px}.cintas-industries p{font-size:18px;color:#666}.cintas-tags{display:flex;gap:14px;flex-wrap:wrap}.cintas-tags span{background:#fff;border:2px solid var(--cintas-yellow);border-radius:999px;padding:14px 18px;font-weight:900}.cintas-cta{background:#111;padding:70px 0}.cintas-cta-box{background:var(--cintas-yellow);border-radius:34px;padding:42px;display:flex;align-items:center;justify-content:space-between;gap:24px}.cintas-cta h2{font-size:40px;margin:0 0 10px}.cintas-cta p{font-size:18px;margin:0}.cintas-footer{background:#111;color:#fff;padding-top:50px}.cintas-footer .footer-links a{color:#ddd}.cintas-footer .copyright{border-top:1px solid rgba(255,255,255,.12);margin-top:34px;padding:20px 0;color:#aaa}.whatsapp-float{position:fixed;right:22px;bottom:22px;width:58px;height:58px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:#25D366;color:#fff;font-weight:900;font-size:24px;box-shadow:0 14px 34px rgba(0,0,0,.25);z-index:99}.mobile-menu.active,.mobile-menu.is-open{display:flex}
@media(max-width:900px){.cintas-hero-grid,.cintas-industries-grid{grid-template-columns:1fr}.cintas-strip-grid,.cintas-category-grid,.cintas-product-grid{grid-template-columns:repeat(2,1fr)}.cintas-hero{padding:54px 0}.cintas-cta-box{flex-direction:column;align-items:flex-start}.cintas-header-btn{display:none}.cintas-logo{font-size:27px}.nav-links{display:none}.mobile-menu{display:none;flex-direction:column;padding:16px 0;gap:14px}.menu-toggle{display:inline-flex}}
@media(max-width:560px){.cintas-strip-grid,.cintas-category-grid,.cintas-product-grid{grid-template-columns:1fr}.cintas-hero h1{letter-spacing:-1.5px}.cintas-hero p{font-size:17px}.cintas-actions{flex-direction:column}.cintas-btn{width:100%}.cintas-cta h2{font-size:30px}.cintas-cta-box{padding:28px}.topbar .inner{flex-direction:column;text-align:center}.cintas-category-card,.cintas-product-card{min-height:auto}.cintas-logo{font-size:24px}}
