/* Sección */
.categorias-section{
  background:#086cad;
  min-height:100vh;
  padding:32px 16px;
}

/* Título */
.titulo{
  color:#fff;
  text-align:center;
  font-size:clamp(1.6rem, 1rem + 2.2vw, 2.2rem);
  margin:0 0 18px;
  letter-spacing:.3px;
}

/* Selector de temporada (opcional) */
.selector-temporada{
  max-width:1100px;
  margin:0 auto 14px;
  display:flex;
  gap:.6rem;
  align-items:center;
  justify-content:center;
  color:#eaf6ff;
}
.selector-temporada select{
  padding:.45rem .7rem;
  border-radius:10px;
  border:1px solid #e6edf5;
  background:#fff;
  color:#123;
  font-weight:700;
}

/* Grid de tarjetas */
.categorias-grid{
  max-width:1100px;
  margin:0 auto;
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(240px,1fr));
  gap:16px;
  justify-content:center;
}

/* Tarjeta */
.categoria-card{
  background:#fff;
  border-radius:18px;
  box-shadow:0 12px 26px rgba(0,0,0,.15);
  overflow:hidden;
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:.5rem;
  padding:18px;
  text-align:center;
  transition:transform .15s ease, box-shadow .15s ease;
}
.categoria-card:hover{
  transform:translateY(-6px);
  box-shadow:0 16px 34px rgba(0,0,0,.22);
}

/* Imagen redonda tipo avatar */
.categoria-img{
  width:96px;
  height:96px;
  border-radius:50%;
  object-fit:cover;
  background:#f2f6fb;
  border:3px solid #e6edf5;
  box-shadow:0 6px 14px rgba(0,0,0,.12);
  display:block;
  margin:0 auto .5rem;
}

/* Info */
.categoria-info{
  padding:0;
  text-align:center;
}
.categoria-info h2{
  font-size:1.05rem;
  margin:0;
  color:#0b2239;
  font-weight:800;
}

/* Botón */
.boton-ir{
  display:inline-block;
  margin-top:.35rem;
  padding:.5rem 1rem;
  background:#EC2227;
  color:#fff;
  border:none;
  border-radius:10px;
  text-decoration:none;
  font-weight:800;
  transition:filter .2s ease;
}
.boton-ir:hover{ filter:brightness(1.05) }

/* Estados vacíos */
.empty{
  color:#e6f2ff;
  text-align:center;
  margin-top:1.5rem;
  opacity:.9;
  grid-column:1 / -1;
}

/* Responsive */
@media (max-width: 720px){
  .categorias-section{
    /* que ya no sea pantalla completa */
    min-height:auto;
    max-width: 480px;
    margin: 16px auto;          /* centrada con margen arriba/abajo */
    border-radius: 32px;        /* esquinas redondeadas tipo tarjeta */
    box-shadow:0 14px 32px rgba(0,0,0,.25);

    padding: 24px 16px;         /* un poco menos de padding */
  }

  .categorias-grid{
    max-width: 100%;
    grid-template-columns: 1fr; /* una tarjeta por fila */
    gap: 14px;
  }

  .categoria-card{
    min-width: 100%;
  }
}

@media (max-width: 480px){
  .categorias-section{
    margin: 8px auto;
    border-radius: 24px;
    padding: 16px 12px;
  }

  .categoria-card{
    padding: 10px 1px;
    border-radius: 16px;
  }

  .categoria-img{
    width: 82px;
    height: 82px;
  }

  .categoria-info h2{
    font-size: 0.95rem;
  }

  .boton-ir{
    padding: 0.45rem 0.9rem;
    font-size: 0.85rem;
  }
}