/* Bika Home - grid de categorías + hero. Archivo EXTERNO (RUCSS apagado). */

/* Placeholder claro (adiós flash café) */
.bika-cat-section .banner .bg { background-color: #ece9e3 !important; }

/* Dejar SOLO el nombre en cada tarjeta (ocultar la frase descriptiva) */
.bika-cat-section .banner p { display: none !important; }

/* Zoom de imagen al pasar el mouse en TODAS las tarjetas de categoría */
.bika-cat-section .banner .banner-inner, .bika-cat-section .banner .banner-bg { overflow: hidden !important; }
.bika-cat-section .banner .bg { transition: transform .7s cubic-bezier(.15,.75,.5,1) !important; }
.bika-cat-section .banner:hover .bg { transform: scale(1.08) !important; }

/* ===== "Ver más categorías": toggle que resalta e invita a tocar ===== */
.bika-cat-section .accordion-item { text-align: center !important; }
.bika-cat-section .accordion-title.plain {
  display: inline-flex !important; align-items: center; gap: 10px;
  padding: 12px 32px !important; margin: 14px auto !important;
  border: 2px solid #E4B200 !important; border-radius: 40px !important;
  background: #fff !important; color: #3B3934 !important;
  font-weight: 700 !important; text-transform: uppercase; letter-spacing: .6px; font-size: 13px !important;
  box-shadow: 0 4px 16px rgba(0,0,0,.07);
  transition: background .25s ease, transform .25s ease, box-shadow .25s ease, color .25s ease;
}
.bika-cat-section .accordion-title.plain:hover {
  background: #E4B200 !important; color: #2b2a26 !important; transform: translateY(-2px);
  box-shadow: 0 10px 26px rgba(228,178,0,.42);
}
.bika-cat-section .accordion-title.plain .toggle { animation: bikaBounce 1.5s ease-in-out infinite; }
@keyframes bikaBounce { 0%,100%{transform:translateY(0)} 50%{transform:translateY(3px)} }

/* ===== "Ver todo el catálogo": igual al toggle (cápsula blanca borde mostaza sobrio) ===== */
.bika-vertodo { margin: 30px 0 10px !important; }
.bika-vertodo a.button {
  background: #fff !important; color: #3B3934 !important;
  border: 2px solid #E4B200 !important; border-radius: 40px !important;
  padding: 14px 42px !important; font-weight: 700 !important; text-transform: uppercase; letter-spacing: .6px; font-size: 13px !important;
  box-shadow: 0 4px 16px rgba(0,0,0,.07);
  transition: background .25s ease, transform .25s ease, box-shadow .25s ease, color .25s ease;
}
.bika-vertodo a.button:hover {
  background: #E4B200 !important; color: #2b2a26 !important; transform: translateY(-2px);
  box-shadow: 0 10px 26px rgba(228,178,0,.42);
}
@media (prefers-reduced-motion: reduce){ .bika-cat-section .accordion-title.plain .toggle { animation: none !important; } }

/* Títulos de categoría unificados (MAYÚSCULA, retail pro) */
.bika-cat-section .banner h1, .bika-cat-section .banner h2, .bika-cat-section .banner h3, .bika-cat-section .banner h4 {
  text-transform: uppercase !important; letter-spacing: .5px !important; line-height: 1.15 !important;
}

/* DESKTOP: márgenes blancos entre tarjetas al 50% (más panorámico) */
@media (min-width: 850px) {
  .bika-cat-section .col { padding-left: 4px !important; padding-right: 4px !important; padding-bottom: 8px !important; }
  .bika-cat-section .col-inner { padding-left: 0 !important; padding-right: 0 !important; }
  /* altura de tarjetas visibles (+20% => 72%) */
  .bika-cat-section .bika-cat-visible .banner { height: 0 !important; min-height: 0 !important; padding-top: 72% !important; padding-bottom: 0 !important; }
  /* "Ver más" 6 por fila + CUADRADAS (altura vía padding-top) */
  .bika-cat-section .accordion .col { flex: 0 0 16.6667% !important; max-width: 16.6667% !important; }
  .bika-cat-section .accordion .banner { height: 0 !important; min-height: 0 !important; padding-top: 100% !important; padding-bottom: 0 !important; }
}

.bika-mobile-only { display: none !important; }

/* MOVIL: 6 visibles + resto en Ver mas; PANORAMICAS full-width borde a borde, margen fino, texto a escala */
@media (max-width: 849px) {
  .bika-cat-section .bika-cat-visible > .col:nth-child(n+7) { display: none !important; }
  .bika-cat-section .accordion .bika-mobile-only { display: block !important; }
  /* full-width hasta el borde + margen fino (gap ~2px) */
  .bika-cat-section { padding-left: 0 !important; padding-right: 0 !important; }
  .bika-cat-section .row, .bika-cat-section .row-inner { margin: 0 !important; }
  .bika-cat-section .col, .bika-cat-section .col-inner { padding: 1px !important; }
  /* forma panoramica con alto (+20% => 96%) */
  .bika-cat-section .banner { height: 0 !important; min-height: 0 !important; padding-top: 96% !important; padding-bottom: 0 !important; }
  /* texto proporcionado a la tarjeta */
  .bika-cat-section .banner h1, .bika-cat-section .banner h2, .bika-cat-section .banner h3, .bika-cat-section .banner h4 { font-size: 14px !important; margin: 0 0 2px !important; }
  .bika-cat-section .banner p { font-size: 10px !important; line-height: 1.2 !important; margin: 0 0 4px !important; }
  .bika-cat-section .banner .button, .bika-cat-section .banner a.button { font-size: 9px !important; min-height: 24px !important; line-height: 24px !important; padding: 0 12px !important; margin: 2px 0 0 !important; }
  /* hero mas compacto */
  .bika-hero { padding-top: 8px !important; padding-bottom: 8px !important; }
  .bika-hero img { max-height: 40vh !important; width: auto !important; object-fit: contain; }
}