/* guia.css — estilos propios de la Guía de Marbella.
   Las tarjetas de local y el resto vienen de clubs.css; aquí solo lo nuevo. */

.guia-zonas {
  display: flex; justify-content: center; flex-wrap: wrap; gap: 10px;
  padding: 0 20px 48px; max-width: 1000px; margin: 0 auto;
}
.guia-zonas a {
  padding: 11px 22px; border-radius: 8px;
  border: 1px solid rgba(255,255,255,0.14);
  color: #bbb; font-size: 13.5px; font-weight: 600; text-decoration: none;
  transition: all .2s;
}
.guia-zonas a:hover { border-color: #E8272A; color: #fff; }

.guia-zona { max-width: 1440px; margin: 0 auto; padding: 0 40px; scroll-margin-top: 90px; }
.guia-zona-cab { display: flex; align-items: baseline; gap: 16px; flex-wrap: wrap; margin-bottom: 8px; }
.guia-zona h2 { font-size: 30px; font-weight: 800; letter-spacing: -0.01em; }
.guia-contador { font-size: 12px; font-weight: 700; letter-spacing: 0.08em; color: #E8272A; text-transform: uppercase; }
.guia-zona-desc { color: #888; font-size: 15px; line-height: 1.6; max-width: 640px; margin-bottom: 22px; }
.guia-zona .guia-grid { padding: 0 0 56px; }
.guia-vacio { color: #888; text-align: center; padding: 60px 20px; }

@media (max-width: 768px) {
  .guia-zonas { padding: 0 16px 32px; }
  .guia-zona { padding: 0 16px; }
  .guia-zona h2 { font-size: 24px; }
  .guia-zona .guia-grid { padding: 0 0 36px; }
}