/* =====================================================
   Coctelería Montana — CSS
   Extraído de body v1.14.23 SIN cambios de contenido.
   Bloque 1: CSS principal (hero, secciones, responsive).
   Bloque 2: módulo interactivo "Leyendas de Sevilla".
   ===================================================== */
@import url('https://fonts.googleapis.com/css2?family=Bebas+Neue&display=swap');

/* =====================================================
   COCTELERÍA MONTANA — CSS v1.14.23
   Paleta: negro + dorado
   Tipografías: Bebas Neue + Playfair Display + Cormorant + Inter
===================================================== */
:root {
  --cm-black: #0a0a0a;
  --cm-black-warm: #111;
  --cm-black-card: #161412;
  --cm-black-card-hover: #1c1916;
  --cm-gold: #d4af37;
  --cm-gold-light: #e8c659;
  --cm-gold-soft: rgba(212,175,55,.08);
  --cm-gold-border: rgba(212,175,55,.22);
  --cm-gold-border-strong: rgba(212,175,55,.55);
  --cm-gold-line: rgba(212,175,55,.4);
  --cm-red: #b91c1c;
  --cm-red-soft: rgba(185,28,28,.12);
  --cm-w: #fff;
  --cm-w-95: rgba(255,255,255,.95);
  --cm-w-90: rgba(255,255,255,.9);
  --cm-w-80: rgba(255,255,255,.8);
  --cm-w-70: rgba(255,255,255,.7);
  --cm-w-60: rgba(255,255,255,.6);
  --cm-w-50: rgba(255,255,255,.5);
  --cm-w-10: rgba(255,255,255,.1);
  --cm-w-06: rgba(255,255,255,.06);
  --cm-cream: rgba(255,255,255,.92);
  --cm-serif: 'Playfair Display', Georgia, 'Times New Roman', serif;
  --cm-accent: 'Cormorant Garamond', Georgia, serif;
  --cm-sans: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --cm-bg-texture: url('https://cocteleriamontana.com/wp-content/uploads/2023/09/fondo-montana-3.png');
  --cm-radius-sm: 6px;
  --cm-radius-md: 14px;
  --cm-radius-lg: 22px;
  --cm-radius-pill: 50px;
  --cm-z-sticky: 9999;
  --cm-z-skip: 100000;
  --cm-ease: .35s cubic-bezier(.25,.46,.45,.94);
  --cm-max: 1200px;
  --cm-max-text: 720px;
}

/* Reset acotado */
.cm, .cm *, .cm *::before, .cm *::after { box-sizing: border-box; }
.cm { margin: 0; padding: 0; }
.cm * { margin: 0; padding: 0; }

@media (prefers-reduced-motion: no-preference) {
  html { scroll-behavior: smooth; }
}
.cm [id] { scroll-margin-top: 100px; }

.cm {
  background: var(--cm-black) var(--cm-bg-texture) repeat;
  background-size: 800px auto;
  color: var(--cm-w-80);
  font-family: var(--cm-sans);
  font-size: 16px;
  line-height: 1.65;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  overflow-x: hidden;
}

.cm img { max-width: 100%; height: auto; display: block; }

.cm a { text-decoration: none; }
.cm a:not([class]) { color: inherit; }
.cm button { font: inherit; background: none; border: none; cursor: pointer; -webkit-appearance: none; appearance: none; padding: 0; color: inherit; }
.cm ul, .cm ol { list-style: none; }

.cm .cm__btn--primary,
.cm a.cm__btn--primary {
  color: var(--cm-black);
}
.cm .cm__btn--primary:hover,
.cm a.cm__btn--primary:hover {
  color: var(--cm-black);
}
.cm .cm__btn--secondary,
.cm a.cm__btn--secondary {
  color: var(--cm-gold);
}
.cm .cm__btn--ghost,
.cm a.cm__btn--ghost {
  color: var(--cm-w);
}
.cm .cm__hero-link-secondary,
.cm a.cm__hero-link-secondary {
  color: var(--cm-cream);
}
.cm .cm__contact-link,
.cm a.cm__contact-link {
  color: var(--cm-gold);
}
.cm .cm__hero-meta-link,
.cm a.cm__hero-meta-link {
  color: var(--cm-w-90);
}

/* Skip link */
.cm__skip {
  position: absolute;
  left: -9999px;
  top: -9999px;
  width: 1px;
  height: 1px;
  overflow: hidden;
}
.cm__skip:focus {
  left: 16px;
  top: 16px;
  width: auto;
  height: auto;
  padding: 12px 20px;
  background: var(--cm-w);
  color: var(--cm-black);
  z-index: var(--cm-z-skip);
  border: 2px solid var(--cm-gold);
  border-radius: 6px;
  font-weight: 600;
  font-size: .9rem;
  text-decoration: none;
  box-shadow: 0 4px 12px rgba(0,0,0,.4);
}

.cm__sr {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0,0,0,0) !important;
  clip-path: inset(50%) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

.cm:focus { outline: none; }

.cm__container {
  max-width: var(--cm-max);
  margin: 0 auto;
  width: 100%;
  padding: 0 clamp(16px, 3vw, 32px);
}

.cm__section { padding: 96px 0; position: relative; }
.cm__section--tight { padding: 72px 0; }

.cm__eyebrow {
  font-family: var(--cm-sans);
  font-size: 12px;
  line-height: 1.4;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: .25em;
  color: var(--cm-gold);
  display: inline-block;
  margin-bottom: 18px;
}

.cm__title {
  font-family: var(--cm-serif);
  font-weight: 700;
  font-size: clamp(2rem, 4.5vw, 3rem);
  letter-spacing: -.01em;
  line-height: 1.15;
  color: var(--cm-w);
  margin-bottom: 22px;
  text-transform: uppercase;
}

.cm__title-script {
  font-family: var(--cm-accent);
  font-style: italic;
  font-weight: 400;
  text-transform: none;
  color: var(--cm-gold);
  font-size: clamp(1.6rem, 3vw, 2.2rem);
  letter-spacing: 0;
  margin-bottom: 8px;
}

.cm__lead {
  font-family: var(--cm-sans);
  font-size: clamp(1rem, 1.8vw, 1.1rem);
  line-height: 1.8;
  color: var(--cm-w-80);
  max-width: var(--cm-max-text);
}

.cm__lead--center { margin-left: auto; margin-right: auto; text-align: center; }

.cm__rule {
  display: block;
  width: 100%;
  max-width: 480px;
  height: 1px;
  margin: 32px auto;
  background: linear-gradient(90deg, transparent, var(--cm-gold-line), transparent);
}

/* BUTTONS */
.cm__btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 16px 34px;
  border-radius: var(--cm-radius-pill);
  font-family: var(--cm-sans);
  font-size: 13px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: .12em;
  border: 2px solid transparent;
  transition: all var(--cm-ease);
  min-height: 52px;
  text-decoration: none;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}

.cm__btn:focus-visible { outline: 3px solid var(--cm-gold); outline-offset: 4px; }

.cm__btn--primary {
  background: var(--cm-gold);
  color: var(--cm-black);
  border-color: var(--cm-gold);
  box-shadow: 0 8px 28px rgba(212,175,55,.28);
}

.cm__btn--secondary {
  background: transparent;
  color: var(--cm-gold);
  border-color: var(--cm-gold);
}

/* Sobre la foto del hero el botón secundario lleva scrim sutil para asegurar
   contraste AA (la foto puede tener zonas claras). El hover dorado de abajo
   sigue ganando por orden de cascada. */
.cm__hero-ctas .cm__btn--secondary {
  background: rgba(0,0,0,.30);
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
}

.cm__btn--ghost {
  background: transparent;
  color: var(--cm-w);
  border-color: var(--cm-w-50);
}

@media (hover:hover) and (pointer:fine) {
  .cm__btn--primary:hover {
    background: var(--cm-gold-light);
    border-color: var(--cm-gold-light);
    transform: translateY(-2px);
    box-shadow: 0 12px 36px rgba(212,175,55,.42);
  }
  .cm__btn--secondary:hover {
    background: var(--cm-gold);
    color: var(--cm-black);
    transform: translateY(-2px);
  }
  .cm__btn--ghost:hover {
    background: var(--cm-w);
    color: var(--cm-black);
    border-color: var(--cm-w);
  }
}

/* HERO */
.cm__hero {
  position: relative;
  min-height: 92vh;
  min-height: 92svh;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  overflow: hidden;
}

/* Hero a imagen única (v1.21.0): el flamenco show es el primer impacto. El fondo
   ya no se parte en dos columnas. El overlay ::after y el texto
   (.cm__hero-content z-index:2) van por encima de la imagen. */
.cm__hero-bg { position: absolute; inset: 0; z-index: 0; }

.cm__hero-img { width: 100%; height: 100%; object-fit: cover; display: block; }

/* Encuadre de la imagen única (.cm__hero-img--main). Desktop: cara y mantón de
   la bailaora bien visibles, encuadre alto para que el texto no tape lo importante. */
.cm__hero-img--main:not(.cm__hero-img--cante) { object-position: center 28%; }
/* Kill-switch SHOW_DANCE_COPY=false: imagen de cante (flamenco-11), encuadre propio. */
.cm__hero-img--cante { object-position: center 30%; }

@media (max-width: 768px) {
  /* Móvil: acotamos el encuadre de la bailaora (:not(--cante)) para no cortar
     cara ni mantón y compensar el tagline compactado; el cante conserva el suyo. */
  .cm__hero-img--main:not(.cm__hero-img--cante) { object-position: center 20%; }
  .cm__hero-img--cante { object-position: center 26%; }
}

.cm__hero-bg::after {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg,
    rgba(0,0,0,.20) 0%,
    rgba(0,0,0,.28) 55%,
    rgba(10,10,10,.62) 100%);
}

.cm__hero-content { position: relative; z-index: 2; padding: 120px 24px 80px; max-width: 900px; width: 100%; }

.cm__hero-pretitle {
  font-family: var(--cm-sans);
  font-size: 12px;
  font-weight: 500;
  letter-spacing: .35em;
  text-transform: uppercase;
  color: var(--cm-cream);
  display: block;
  width: -moz-fit-content;
  width: fit-content;
  max-width: 100%;
  margin: 0 auto 24px;
  background: rgba(0, 0, 0, 0.55);
  padding: 8px 22px;
  border-radius: 4px;
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
  text-shadow: 0 1px 4px rgba(0,0,0,.6);
  opacity: 0;
  animation: cmFadeIn .9s ease-out .2s forwards;
}

.cm__hero-title {
  font-family: 'Bebas Neue', 'Oswald', 'Impact', sans-serif;
  font-weight: 400;
  font-size: clamp(5rem, 15vw, 11rem);
  line-height: .92;
  letter-spacing: .02em;
  color: var(--cm-w);
  text-transform: uppercase;
  margin-bottom: 18px;
  text-shadow:
    0 4px 24px rgba(0,0,0,.85),
    0 2px 8px rgba(0,0,0,.65);
  opacity: 0;
  animation: cmFadeUp 1.1s ease-out .35s forwards;
}

.cm__hero-subtitle {
  font-family: var(--cm-sans);
  font-size: clamp(1.1rem, 2.4vw, 1.5rem);
  font-weight: 400;
  letter-spacing: .42em;
  color: var(--cm-w);
  text-transform: uppercase;
  display: block;
  width: -moz-fit-content;
  width: fit-content;
  max-width: 100%;
  margin: 0 auto 14px;
  background: rgba(0, 0, 0, 0.55);
  padding: 10px 28px 10px 32px;
  border-radius: 4px;
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
  text-shadow: 0 1px 4px rgba(0,0,0,.6);
  opacity: 0;
  animation: cmFadeUp 1.1s ease-out .55s forwards;
}

.cm__hero-tagline {
  font-family: var(--cm-accent);
  font-style: italic;
  font-weight: 500;
  /* v1.16.0: tagline = keyword principal ("Bar flamenco en Sevilla…"),
     más presencia en desktop; los media queries de 768/480px conservan
     los tamaños de móvil. */
  font-size: clamp(1.35rem, 3vw, 2.1rem);
  color: var(--cm-w);
  display: block;
  width: -moz-fit-content;
  width: fit-content;
  max-width: 700px;
  margin: 16px auto 38px;
  background: rgba(0, 0, 0, 0.55);
  padding: 10px 26px;
  border-radius: 4px;
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
  text-shadow: 0 1px 4px rgba(0,0,0,.6);
  opacity: 0;
  animation: cmFadeUp 1.1s ease-out .75s forwards;
}

.cm__hero-ctas {
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
  justify-content: center;
  align-items: center;
  opacity: 0;
  animation: cmFadeUp 1.1s ease-out .95s forwards;
}

.cm__hero-link-secondary {
  color: var(--cm-cream);
  font-family: var(--cm-sans);
  font-size: 14px;
  font-weight: 500;
  letter-spacing: .04em;
  padding: 8px 12px;
  border-bottom: 1px solid var(--cm-gold-line);
  transition: color var(--cm-ease), border-color var(--cm-ease);
  text-decoration: none;
  /* Contraste sobre la foto del hero (sin fondo: debe seguir leyéndose como enlace) */
  text-shadow: 0 1px 4px rgba(0,0,0,.6);
}
@media (hover:hover) and (pointer:fine) {
  .cm__hero-link-secondary:hover { color: var(--cm-gold); border-bottom-color: var(--cm-gold); }
}
.cm__hero-link-secondary:focus-visible {
  outline: 2px solid var(--cm-gold);
  outline-offset: 4px;
  border-radius: 4px;
}
/* Área de toque ≥44px de alto sin alterar el aspecto del enlace */
.cm__hero-link-secondary { position: relative; }
.cm__hero-link-secondary::after {
  content: '';
  position: absolute;
  left: 0;
  right: 0;
  top: 50%;
  height: 44px;
  transform: translateY(-50%);
}

.cm__hero-meta {
  font-family: var(--cm-sans);
  font-size: clamp(15px, 1.8vw, 17px);
  color: var(--cm-w);
  letter-spacing: .04em;
  display: block;
  width: -moz-fit-content;
  width: fit-content;
  max-width: 100%;
  margin: 40px auto 0;
  background: rgba(0, 0, 0, 0.55);
  padding: 8px 18px;
  border-radius: 3px;
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
  text-shadow: 0 1px 4px rgba(0,0,0,.6);
  opacity: 0;
  animation: cmFadeUp 1.1s ease-out 1.15s forwards;
}

.cm__hero-meta strong {
  color: var(--cm-gold-light);
  font-weight: 600;
}

/* v1.21.2: precio destacado en la caja meta ("Espectáculo + cóctel · 18€"),
   gancho de venta principal. El "18€" es lo que más resalta: mayor y en dorado
   de marca. La etiqueta se queda en el color base de la meta. */
.cm__hero-meta-price { color: var(--cm-w); letter-spacing: .04em; }
.cm__hero-meta strong.cm__hero-meta-price-amount {
  color: var(--cm-gold);
  font-weight: 700;
  font-size: 1.35em;
  letter-spacing: .01em;
  margin-left: 2px;
}

/* Línea de apoyo del hero-meta ("Reserva tu plaza para el show de las 20:00h") */
.cm__hero-meta-support {
  display: block;
  margin-top: 4px;
  font-size: .88em;
  letter-spacing: .03em;
  color: var(--cm-w-80);
}

.cm__hero-meta-link {
  color: var(--cm-w-90);
  border-bottom: 1px solid var(--cm-gold-line);
  padding-bottom: 1px;
  transition: color var(--cm-ease), border-color var(--cm-ease);
}

@media (hover:hover) and (pointer:fine) {
  .cm__hero-meta-link:hover { color: var(--cm-gold); border-bottom-color: var(--cm-gold); }
}

.cm__hero-meta-link:focus-visible { outline: 2px solid var(--cm-gold); outline-offset: 4px; border-radius: 2px; }

@keyframes cmFadeIn { to { opacity: 1; } }
@keyframes cmFadeUp {
  from { opacity: 0; transform: translateY(20px); }
  to { opacity: 1; transform: translateY(0); }
}

/* PASIÓN POR LA COCTELERÍA */
.cm__about { text-align: center; }

.cm__about-frame { position: relative; display: inline-block; padding: 40px 24px 0; }

.cm__about-frame::before {
  content: '';
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 90vw;
  max-width: 800px;
  height: 1px;
  background: linear-gradient(90deg, transparent, var(--cm-gold-line), transparent);
}

/* Barra reubicada en la sección coctelería (v1.21.0): texto + imagen.
   Desktop: dos columnas (texto izq, barra der). Móvil: apilado, texto primero. */
.cm__about-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  align-items: center;
  gap: 48px;
  margin-top: 8px;
}

.cm__about-grid .cm__about-frame { display: block; padding-top: 0; }
/* Dentro del grid la línea dorada se ciñe a la columna, no a 90vw. */
.cm__about-grid .cm__about-frame::before { width: 100%; max-width: 100%; }

.cm__about-figure {
  margin: 0;
  border-radius: 6px;
  overflow: hidden;
  border: 1px solid rgba(212,175,55,0.16);
  box-shadow: 0 18px 48px rgba(0,0,0,0.28);
}

.cm__about-img {
  display: block;
  width: 100%;
  height: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
}

@media (max-width: 860px) {
  .cm__about-grid {
    grid-template-columns: 1fr;
    gap: 28px;
  }
  .cm__about-img { aspect-ratio: 16 / 10; }
}

/* NUESTRA CARTA */
.cm__menu-intro { text-align: center; padding: 64px 24px 32px; }

.cm__menu-intro-icon {
  width: 36px;
  height: 36px;
  stroke: var(--cm-gold);
  fill: none;
  stroke-width: 1.5;
  margin: 0 auto 18px;
  display: block;
}

/* CÓCTELES */
.cm__cocktails-section { padding: 64px 0; }

.cm__price-note {
  text-align: center;
  font-family: 'Inter', sans-serif;
  font-style: italic;
  font-size: 13px;
  color: var(--cm-w-70, rgba(245,232,212,0.7));
  margin: 32px 0 0;
  letter-spacing: 0.3px;
}

#carta-autor { padding-top: 24px; padding-bottom: 80px; }
@media (max-width: 768px) {
  #carta-autor { padding-top: 16px; padding-bottom: 64px; }
}

.cm__cocktails-head { text-align: center; max-width: 780px; margin: 0 auto 56px; }

.cm__cocktails-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }

.cm__cocktail {
  position: relative;
  border-radius: var(--cm-radius-md);
  overflow: hidden;
  background: var(--cm-black-card);
  border: 1px solid var(--cm-w-06);
  aspect-ratio: 4/5;
  min-height: 430px;
  isolation: isolate;
}

.cm__cocktail-imgs { position: absolute; inset: 0; z-index: 0; }

.cm__cocktail-imgs img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  transition: opacity .55s ease, transform .8s ease;
}

.cm__cocktail::before {
  content: '';
  position: absolute;
  inset: 0;
  z-index: 1;
  background: linear-gradient(180deg, rgba(0,0,0,.15) 0%, rgba(0,0,0,.5) 50%, rgba(0,0,0,.92) 100%);
  pointer-events: none;
  transition: background .35s ease;
}

.cm__cocktail-body {
  position: relative;
  z-index: 2;
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  padding: 28px 24px;
  color: var(--cm-w);
}

.cm__cocktail-name {
  font-family: var(--cm-accent);
  font-style: italic;
  font-size: clamp(1.4rem, 2.3vw, 1.85rem);
  font-weight: 500;
  color: var(--cm-w);
  margin-bottom: 8px;
  text-shadow: 0 2px 10px rgba(0,0,0,.8);
}

.cm__cocktail-price {
  font-family: var(--cm-serif);
  font-size: 1.6rem;
  font-weight: 600;
  color: var(--cm-gold);
  margin-bottom: 12px;
  text-shadow: 0 2px 8px rgba(0,0,0,.6);
}

.cm__cocktail-price::after { content: ''; }

.cm__cocktail-desc {
  font-family: var(--cm-sans);
  font-size: 13px;
  line-height: 1.6;
  color: var(--cm-w-90);
  margin-bottom: 10px;
  text-shadow: 0 1px 6px rgba(0,0,0,.75);
}

.cm__cocktail-ingredients {
  font-family: var(--cm-sans);
  font-size: 13px;
  line-height: 1.45;
  color: var(--cm-gold-light);
  letter-spacing: .04em;
  font-weight: 500;
  text-shadow: 0 1px 6px rgba(0,0,0,.7);
}

.cm__cocktail-flag {
  position: absolute;
  top: 16px;
  right: 16px;
  z-index: 3;
  background: var(--cm-red);
  color: var(--cm-w);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .12em;
  text-transform: uppercase;
  padding: 5px 10px;
  border-radius: 4px;
}

@media (hover: hover) and (pointer: fine) {
  .cm__cocktail:hover .cm__cocktail-imgs img { transform: scale(1.05); }
  .cm__cocktail:hover::before { background: linear-gradient(180deg, rgba(0,0,0,.05) 0%, rgba(0,0,0,.55) 45%, rgba(0,0,0,.96) 100%); }
}

/* LISTAS DE CÓCTELES */
.cm__list-section { padding: 80px 0; position: relative; }

.cm__list-section--decor {
  background: linear-gradient(180deg, var(--cm-black) 0%, var(--cm-black-warm) 100%);
}

.cm__list-section--with-image {
  display: grid;
  grid-template-columns: 1.2fr 1fr;
  gap: 56px;
  align-items: center;
  max-width: var(--cm-max);
  margin: 0 auto;
  padding: 80px 24px;
}

.cm__list-section--with-image-flipped { grid-template-columns: 1fr 1.2fr; }

.cm__list-side-img {
  border-radius: var(--cm-radius-md);
  overflow: hidden;
  aspect-ratio: 4/5;
}

.cm__list-side-img img { width: 100%; height: 100%; object-fit: cover; }

.cm__list-head { text-align: left; margin-bottom: 36px; }

.cm__list-head--center {
  text-align: center;
  margin-left: auto;
  margin-right: auto;
  max-width: 720px;
  margin-bottom: 48px;
}

.cm__list { display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px 48px; }

.cm__list--single { grid-template-columns: 1fr; max-width: 720px; margin: 0 auto; }

.cm__list-item {
  padding: 18px 0;
  border-bottom: 1px solid var(--cm-w-06);
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: baseline;
  gap: 0 16px;
}

.cm__list-name {
  font-family: var(--cm-serif);
  font-weight: 600;
  font-size: 1.15rem;
  color: var(--cm-gold);
  position: relative;
  padding-right: 12px;
}

.cm__list-name::after {
  content: '';
  display: inline-block;
  position: absolute;
  bottom: 6px;
  left: calc(100% + 8px);
  right: -8px;
  height: 0;
  border-bottom: 1px dotted rgba(212,175,55,.35);
}

.cm__list-price {
  font-family: var(--cm-sans);
  font-weight: 500;
  font-size: 1.05rem;
  color: var(--cm-w-70);
  text-align: right;
  font-variant-numeric: tabular-nums;
  letter-spacing: .02em;
}

.cm__list-price::after { content: ''; }

.cm__list-ingredients {
  grid-column: 1 / -1;
  font-family: var(--cm-sans);
  font-size: 13px;
  color: var(--cm-w-70);
  line-height: 1.55;
  margin-top: 4px;
}

.cm__list-tag {
  display: inline-block;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .12em;
  line-height: 1.35;
  text-transform: uppercase;
  color: var(--cm-gold-light);
  border: 1px solid var(--cm-gold-border);
  border-radius: 3px;
  padding: 2px 7px;
  margin-left: 10px;
  vertical-align: middle;
}

/* BOOKING */
.cm__booking {
  background: linear-gradient(180deg, var(--cm-black-warm) 0%, var(--cm-black) 100%);
  border-top: 1px solid var(--cm-gold-border);
  border-bottom: 1px solid var(--cm-gold-border);
  padding: 96px 0;
  position: relative;
}

.cm__booking::before {
  content: '';
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 80%;
  max-width: 600px;
  height: 1px;
  background: linear-gradient(90deg, transparent, var(--cm-gold-line), transparent);
}

.cm__booking-head { text-align: center; max-width: 760px; margin: 0 auto 56px; }

.cm__booking-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 32px; max-width: 1100px; margin: 0 auto; }

.cm__booking-card {
  background: var(--cm-black-card);
  border: 1px solid var(--cm-w-06);
  border-radius: var(--cm-radius-lg);
  padding: 40px 36px;
  display: flex;
  flex-direction: column;
  position: relative;
  overflow: hidden;
}

.cm__booking-card-icon {
  width: 56px;
  height: 56px;
  border-radius: 50%;
  background: var(--cm-gold-soft);
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 20px;
  border: 1px solid var(--cm-gold-border);
}

.cm__booking-card-icon svg { width: 26px; height: 26px; stroke: var(--cm-gold); stroke-width: 1.6; fill: none; }

.cm__booking-card-tag {
  font-family: var(--cm-sans);
  font-size: 11px;
  font-weight: 600;
  letter-spacing: .2em;
  text-transform: uppercase;
  color: var(--cm-gold);
  margin-bottom: 8px;
}

.cm__booking-card-title {
  font-family: var(--cm-serif);
  font-size: clamp(1.5rem, 2.5vw, 1.85rem);
  font-weight: 700;
  color: var(--cm-w);
  line-height: 1.15;
  margin-bottom: 12px;
  text-transform: uppercase;
  letter-spacing: -.01em;
}

.cm__booking-card-when {
  font-family: var(--cm-accent);
  font-style: italic;
  color: var(--cm-w-90);
  font-size: 1.05rem;
  margin-bottom: 18px;
}

.cm__booking-card-when strong { color: var(--cm-gold); font-weight: 600; }

.cm__booking-card-desc {
  font-family: var(--cm-sans);
  font-size: 14px;
  line-height: 1.65;
  color: var(--cm-w-70);
  margin-bottom: 24px;
}

.cm__booking-card-price {
  display: flex;
  align-items: baseline;
  gap: 8px;
  margin-bottom: 28px;
  padding: 14px 0;
  border-top: 1px solid var(--cm-w-06);
  border-bottom: 1px solid var(--cm-w-06);
}

.cm__booking-card-price-amount {
  font-family: var(--cm-serif);
  font-size: 2.4rem;
  font-weight: 700;
  color: var(--cm-gold);
  line-height: 1;
}

.cm__booking-card-price-label {
  font-family: var(--cm-sans);
  font-size: 13px;
  color: var(--cm-w-70);
  text-transform: uppercase;
  letter-spacing: .08em;
}

.cm__booking-card-widget {
  background: var(--cm-w);
  border-radius: var(--cm-radius-md);
  padding: 16px;
  margin-bottom: 20px;
  box-shadow: 0 10px 30px rgba(0,0,0,.4);
}

.cm__booking-card-widget iframe { border: 0; display: block; width: 100%; }

.cm__booking-card-actions { margin-top: auto; display: flex; flex-direction: column; gap: 10px; }

.cm__booking-helper {
  text-align: center;
  margin-top: 32px;
  font-family: var(--cm-sans);
  font-size: 14px;
  color: var(--cm-w-70);
}

.cm__booking-helper a { color: var(--cm-gold); text-decoration: underline; text-underline-offset: 3px; }

/* HISTORIA — carrusel */
.cm__history { padding: 96px 0; }

.cm__history-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 56px; align-items: center; }

.cm__history-text p { margin-bottom: 18px; line-height: 1.85; color: var(--cm-w-80); }
.cm__history-text p:last-child { margin-bottom: 0; }

.cm__carousel {
  position: relative;
  border-radius: var(--cm-radius-md);
  overflow: hidden;
  aspect-ratio: 4/5;
  background: var(--cm-black-card);
}

.cm__carousel:focus-visible { outline: 3px solid var(--cm-gold); outline-offset: 4px; }

.cm__carousel-track { position: absolute; inset: 0; }

.cm__carousel-slide { position: absolute; inset: 0; opacity: 0; transition: opacity .9s ease; }

.cm__carousel-slide.is-active { opacity: 1; }

.cm__carousel-slide img { width: 100%; height: 100%; object-fit: cover; object-position: center; }

.cm__carousel-dots {
  position: absolute;
  bottom: 18px;
  left: 50%;
  transform: translateX(-50%);
  display: flex;
  gap: 8px;
  z-index: 3;
}

.cm__carousel-dot.is-active { background: var(--cm-gold); width: 28px; border-radius: 4px; }

.cm__carousel-dot:focus-visible { outline: 2px solid var(--cm-gold); outline-offset: 4px; }

/* CONTACTO / MAPA */
.cm__contact { padding: 96px 0 64px; text-align: center; }

.cm__contact-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 48px;
  margin-top: 48px;
  max-width: 900px;
  margin-left: auto;
  margin-right: auto;
}

.cm__contact-card {
  background: var(--cm-black-card);
  border: 1px solid var(--cm-w-06);
  border-radius: var(--cm-radius-md);
  padding: 36px 28px;
}

.cm__contact-card h3 { font-family: var(--cm-serif); font-size: 1.4rem; color: var(--cm-w); margin-bottom: 18px; }

.cm__contact-card p { color: var(--cm-w-70); margin-bottom: 18px; line-height: 1.7; }

.cm__contact-links { display: flex; flex-direction: column; gap: 10px; margin-top: 16px; }

.cm__contact-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 12px 20px;
  font-family: var(--cm-sans);
  font-size: 14px;
  font-weight: 500;
  color: var(--cm-gold);
  border: 1px solid var(--cm-gold-border-strong);
  border-radius: var(--cm-radius-pill);
  transition: all var(--cm-ease);
  min-height: 48px;
}

.cm__contact-link svg { width: 18px; height: 18px; stroke: currentColor; stroke-width: 1.7; fill: none; flex-shrink: 0; }

@media (hover:hover) and (pointer:fine) {
  .cm__contact-link:hover { background: var(--cm-gold); color: var(--cm-black); border-color: var(--cm-gold); }
}

.cm__contact-link:focus-visible { outline: 3px solid var(--cm-gold); outline-offset: 3px; }

.cm__map {
  margin-top: 64px;
  border-radius: var(--cm-radius-md);
  overflow: hidden;
  border: 1px solid var(--cm-gold-border);
  max-width: var(--cm-max);
  margin-left: auto;
  margin-right: auto;
}

.cm__map iframe { display: block; width: 100%; height: 380px; border: 0; filter: grayscale(.6) contrast(1.05); }

/* FAQ */
.cm__faq { padding: 96px 0; }

.cm__faq-head { text-align: center; max-width: 760px; margin: 0 auto 56px; }

.cm__faq-list {
  max-width: 860px;
  margin: 0 auto;
  border: 1px solid var(--cm-gold-border);
  border-radius: var(--cm-radius-lg);
  background: rgba(255,255,255,.025);
  padding: 4px 28px;
}

.cm__faq-item { border-bottom: 1px solid var(--cm-w-06); }

.cm__faq-item summary { list-style: none; display: block; }

.cm__faq-item summary::-webkit-details-marker { display: none; }

.cm__faq-summary {
  font-family: var(--cm-sans);
  font-size: 1rem;
  font-weight: 500;
  color: var(--cm-w-90);
  padding: 22px 48px 22px 0;
  position: relative;
  cursor: pointer;
  line-height: 1.45;
  -webkit-tap-highlight-color: transparent;
  transition: color var(--cm-ease);
  min-height: 48px;
}

.cm__faq-summary::after {
  content: '+';
  position: absolute;
  right: 8px;
  top: 50%;
  transform: translateY(-50%);
  font-size: 1.6rem;
  font-weight: 300;
  color: var(--cm-gold);
  transition: transform var(--cm-ease);
  line-height: 1;
}

.cm__faq-item[open] .cm__faq-summary { color: var(--cm-gold); }
.cm__faq-item[open] .cm__faq-summary::after { content: '\2212'; }

.cm__faq-summary:focus { outline: none; }
.cm__faq-summary:focus-visible { outline: 2px solid var(--cm-gold); outline-offset: 2px; border-radius: 4px; }

@media (hover:hover) and (pointer:fine) {
  .cm__faq-summary:hover { color: var(--cm-gold); }
}

.cm__faq-answer {
  padding: 0 0 22px 0;
  font-family: var(--cm-sans);
  font-size: 15px;
  color: var(--cm-w-70);
  line-height: 1.7;
  max-width: 720px;
}

.cm__faq-answer a,
.cm__lead a,
.cm__widget-fallback a,
.cm__booking-microcopy--dark a {
  color: var(--cm-gold);
  text-decoration: underline;
  text-underline-offset: 3px;
  text-decoration-color: rgba(212,175,55,.45);
  transition: color var(--cm-ease), text-decoration-color var(--cm-ease);
}
@media (hover: hover) and (pointer: fine) {
  .cm__faq-answer a:hover,
  .cm__lead a:hover,
  .cm__widget-fallback a:hover,
  .cm__booking-microcopy--dark a:hover {
    color: var(--cm-gold-light);
    text-decoration-color: var(--cm-gold-light);
  }
}
.cm__faq-answer a:focus-visible,
.cm__lead a:focus-visible,
.cm__widget-fallback a:focus-visible,
.cm__booking-microcopy--dark a:focus-visible {
  outline: 2px solid var(--cm-gold);
  outline-offset: 3px;
  border-radius: 2px;
}

/* SCROLL REVEAL */
.cm__reveal { opacity: 1; transform: none; transition: opacity .8s ease, transform .8s ease; }

.cm.cm-has-js .cm__reveal:not(.is-visible) { opacity: 0; transform: translateY(28px); }

.cm.cm-has-js .cm__reveal.is-visible { opacity: 1; transform: translateY(0); }

/* ACCESIBILIDAD */
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .cm *, .cm *::before, .cm *::after {
    animation: none !important;
    transition: none !important;
  }
  .cm__hero-pretitle, .cm__hero-title, .cm__hero-subtitle,
  .cm__hero-tagline, .cm__hero-ctas, .cm__hero-meta {
    opacity: 1 !important;
    transform: none !important;
  }
  .cm__reveal,
  .cm.cm-has-js .cm__reveal,
  .cm.cm-has-js .cm__reveal:not(.is-visible) {
    opacity: 1 !important;
    transform: none !important;
  }
}

@media (forced-colors: active) {
  .cm__btn { border-width: 2px; }
  .cm__cocktail { border: 1px solid ButtonText; }
  .cm__booking-card { border: 1px solid ButtonText; }
}

/* RESPONSIVE */
@media (max-width: 1024px) {
  .cm__cocktails-grid { grid-template-columns: repeat(2, 1fr); }
  .cm__list-section--with-image { grid-template-columns: 1fr; gap: 40px; }
  .cm__list-section--with-image-flipped { grid-template-columns: 1fr; }
  .cm__list-side-img { max-width: 480px; margin: 0 auto; }
  .cm__flamenco-hero-container { grid-template-columns: 1fr; gap: 40px; }
  .cm__flamenco-hero-booking { order: -1; }
  .cm__flamenco-hero-text { order: 1; max-width: 100%; }
  .cm__flamenco-hero-meta strong { font-size: 22px; }
  .cm__flamenco-hero-meta span { font-size: 11px; letter-spacing: 1px; }
  .cm__flamenco-hero-meta li { padding: 18px 12px; }
  .cm__history-grid { grid-template-columns: 1fr; }
  .cm__carousel { max-width: 540px; margin: 0 auto; }
}

@media (max-width: 768px) {
  .cm__section { padding: 64px 0; }
  .cm__history { padding: 64px 0; }
  .cm__contact { padding: 64px 0 48px; }
  .cm__booking { padding: 64px 0; }
  .cm__flamenco-hero { padding: 40px 0 28px; }
  .cm__flamenco-hero-meta { grid-template-columns: repeat(3, 1fr); }
  .cm__flamenco-hero-meta li {
    border-right: 1px solid var(--cm-gold-border);
    border-bottom: 0;
    padding: 14px 6px;
    gap: 4px;
  }
  .cm__flamenco-hero-meta li:last-child { border-right: 0; }
  .cm__flamenco-hero-meta strong { font-size: 18px; }
  .cm__flamenco-hero-meta span { font-size: 10px; letter-spacing: .5px; }
  .cm__flamenco-hero-booking { padding: 28px 20px; }
  .cm__cocktails-grid { grid-template-columns: 1fr; gap: 18px; }
  .cm__cocktail { aspect-ratio: auto; min-height: 420px; }
  .cm__list { grid-template-columns: 1fr; }
  .cm__booking-grid { grid-template-columns: 1fr; }
  .cm__booking-card { padding: 32px 24px; }
  .cm__contact-grid { grid-template-columns: 1fr; gap: 24px; }
  .cm__hero { min-height: 80vh; min-height: 80svh; }
  .cm__hero-content { padding: 100px 18px 60px; }
  .cm__btn { width: 100%; max-width: 320px; }
  .cm__hero-ctas .cm__btn { width: auto; max-width: none; }
  .cm__booking-card-actions .cm__btn { width: 100%; max-width: none; }

  .cm__hero-title {
    text-shadow:
      0 4px 28px rgba(0,0,0,.95),
      0 2px 10px rgba(0,0,0,.85),
      0 0 36px rgba(0,0,0,.5);
    margin-bottom: 12px;
  }
  .cm__hero-pretitle {
    background: rgba(0, 0, 0, 0.38);
    padding: 6px 16px;
    font-size: 11px;
    margin-bottom: 18px;
    -webkit-backdrop-filter: blur(12px);
    backdrop-filter: blur(12px);
  }
  .cm__hero-subtitle {
    background: rgba(0, 0, 0, 0.38);
    padding: 7px 22px 7px 26px;
    margin-bottom: 12px;
    letter-spacing: .38em;
    font-size: 1rem;
    -webkit-backdrop-filter: blur(12px);
    backdrop-filter: blur(12px);
  }
  /* v1.21.1: el tagline compactado móvil vive en el bloque "caja premium" (final
     del archivo), único sitio efectivo por cascada. No se declara aquí para no
     duplicar padding/margin/font-size. */
  .cm__hero-meta {
    background: rgba(0, 0, 0, 0.42);
    padding: 8px 16px;
    margin-top: 24px;
    font-size: 13.5px;
    -webkit-backdrop-filter: blur(12px);
    backdrop-filter: blur(12px);
  }
  /* Que la línea de apoyo no baje de 12px (el .88em sobre 13-13.5px quedaba en ~11.5px) */
  .cm__hero-meta-support { font-size: 12px; }
}

@media (max-width: 480px) {
  .cm__hero-title { font-size: clamp(3.2rem, 15vw, 4.6rem); }
  .cm__hero-pretitle { padding: 5px 14px; font-size: 10.5px; letter-spacing: .28em; }
  .cm__hero-subtitle { font-size: 0.92rem; letter-spacing: .32em; padding: 6px 18px 6px 22px; }
  .cm__flamenco-hero-script { font-size: clamp(26px, 11vw, 44px); }
  .cm__flamenco-hero-sub { font-size: clamp(13px, 4vw, 16px); letter-spacing: clamp(1px, 0.4vw, 2px); }
  .cm__hero-ctas { flex-direction: column; align-items: center; }
  .cm__hero-ctas .cm__btn { width: 100%; max-width: 280px; }
  .cm__flamenco-hero { padding: 28px 0 18px; }
  .cm__flamenco-hero-booking { padding: 24px 16px; }
}

/* PRINT */
@media print {
  .cm { background: #fff !important; color: #000 !important; }
  .cm__hero, .cm__flamenco-hero, .cm__flamenco-gallery, .cm__booking, .cm__map,
  .cm__carousel, .cm__btn, .cm__contact-link { display: none !important; }
  .cm__cocktail-imgs { display: none; }
  .cm__cocktail::before { display: none; }
  .cm__cocktail { aspect-ratio: auto; height: auto; padding: 16px; border: 1px solid #ccc; }
  .cm__cocktail-name, .cm__cocktail-price { color: #000 !important; text-shadow: none; }
}

/* FLAMENCO HERO */
.cm__flamenco-hero {
  position: relative;
  padding: 64px 0 96px;
  background: linear-gradient(180deg,
    rgba(10,10,10,0.96) 0%,
    rgba(20,15,12,1) 50%,
    rgba(10,10,10,0.96) 100%);
  overflow: hidden;
  isolation: isolate;
  border-block: 1px solid var(--cm-gold-border);
}
.cm__flamenco-hero-bg {
  position: absolute;
  inset: 0;
  background:
    radial-gradient(circle at 18% 30%, rgba(212,175,55,0.10), transparent 50%),
    radial-gradient(circle at 82% 70%, rgba(185,28,28,0.10), transparent 55%);
  pointer-events: none;
  z-index: -1;
}
.cm__flamenco-hero-container {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 64px;
  align-items: start;
}

.cm__flamenco-hero-text { max-width: 580px; }

.cm__flamenco-hero-eyebrow {
  font-family: 'Inter', sans-serif;
  font-size: 13px;
  font-weight: 500;
  letter-spacing: 3px;
  text-transform: uppercase;
  color: var(--cm-gold);
  margin: 0 0 24px;
  display: inline-flex;
  align-items: center;
  gap: 12px;
}
.cm__flamenco-hero-eyebrow::before {
  content: '';
  display: inline-block;
  width: 32px;
  height: 1px;
  background: var(--cm-gold);
}
.cm__flamenco-hero-title { margin: 0 0 28px; line-height: 1; display: flex; flex-direction: column; gap: 8px; }
.cm__flamenco-hero-script {
  font-family: 'Cormorant Garamond', serif;
  font-style: italic;
  font-weight: 400;
  font-size: clamp(48px, 7vw, 88px);
  color: var(--cm-w);
  letter-spacing: -1px;
}
.cm__flamenco-hero-sub {
  font-family: 'Playfair Display', serif;
  font-weight: 400;
  font-size: clamp(20px, 2.4vw, 32px);
  color: var(--cm-gold);
  letter-spacing: 2px;
  text-transform: uppercase;
}
.cm__flamenco-hero-lead {
  font-family: 'Inter', sans-serif;
  font-size: 17px;
  line-height: 1.75;
  color: var(--cm-w-90);
  margin: 0 0 36px;
  font-weight: 300;
}
.cm__flamenco-hero-meta {
  list-style: none;
  padding: 0;
  margin: 0 0 28px;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0;
  border-top: 1px solid var(--cm-gold-border);
  border-bottom: 1px solid var(--cm-gold-border);
}
.cm__flamenco-hero-meta li {
  padding: 24px 16px;
  text-align: center;
  border-right: 1px solid var(--cm-gold-border);
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.cm__flamenco-hero-meta li:last-child { border-right: 0; }
.cm__flamenco-hero-meta strong {
  font-family: 'Playfair Display', serif;
  font-size: 26px;
  font-weight: 500;
  color: var(--cm-gold);
  letter-spacing: 0.5px;
}
.cm__flamenco-hero-meta span {
  font-family: 'Inter', sans-serif;
  font-size: 12px;
  font-weight: 400;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  color: var(--cm-w-70);
}
.cm__flamenco-hero-note {
  font-family: 'Inter', sans-serif;
  font-size: 14px;
  font-style: italic;
  color: var(--cm-w-70);
  line-height: 1.6;
  margin: 0;
}

.cm__flamenco-hero-booking {
  background: rgba(255,255,255,0.03);
  border: 1px solid var(--cm-gold-border);
  border-radius: 4px;
  padding: 40px 32px;
  position: relative;
}
@media (min-width: 1025px) {
  .cm__flamenco-hero-booking {
    max-width: 460px;
    margin-left: auto;
    margin-right: auto;
    width: 100%;
  }
}
.cm__flamenco-hero-booking::before {
  content: '';
  position: absolute;
  top: -1px;
  left: -1px;
  right: -1px;
  height: 4px;
  background: linear-gradient(90deg, var(--cm-gold), var(--cm-red), var(--cm-gold));
  border-radius: 4px 4px 0 0;
}
.cm__flamenco-hero-booking-head {
  text-align: center;
  margin-bottom: 22px;
}
.cm__flamenco-hero-booking-head h3 {
  font-family: 'Playfair Display', serif;
  font-weight: 500;
  font-size: 24px;
  color: var(--cm-w);
  margin: 0 0 8px;
  letter-spacing: 0.5px;
  line-height: 1.2;
}
@media (max-width: 768px) {
  .cm__flamenco-hero-booking-head { margin-bottom: 14px; }
  .cm__flamenco-hero-booking-head h3 { font-size: 22px; }
}
.cm__flamenco-hero-booking-head p {
  font-family: 'Inter', sans-serif;
  font-size: 13px;
  color: var(--cm-w-70);
  margin: 0;
  letter-spacing: 0.5px;
}

.cm__flamenco-hero-booking-info {
  margin-top: 20px;
  padding-top: 20px;
  border-top: 1px solid var(--cm-gold-border);
  text-align: center;
}
.cm__flamenco-hero-booking-info .cm__booking-bullets {
  margin-top: 0;
  margin-left: auto;
  margin-right: auto;
}

/* NOTA: las reglas de .cm__flamenco-hero-widget / .cm__widget-fallback /
   .cm__booking-microcopy* están EN USO desde v1.18.0 (rollback selectivo:
   MONTANA_COCTELERA_SHOW_TURITOP=true, columna de reserva restaurada). */
.cm__flamenco-hero-widget { min-height: 280px; }
.cm__flamenco-hero-alt {
  margin: 24px 0 0;
  padding-top: 20px;
  border-top: 1px solid var(--cm-gold-border);
  font-family: 'Inter', sans-serif;
  font-size: 14px;
  color: var(--cm-w-80);
  text-align: center;
}
.cm__flamenco-hero-alt a {
  color: var(--cm-gold);
  text-decoration: none;
  font-weight: 500;
  white-space: nowrap;
}
.cm__flamenco-hero-alt a:hover,
.cm__flamenco-hero-alt a:focus-visible { color: var(--cm-gold-light); text-decoration: underline; }

/* "Así funciona la noche" (v1.16.0) — SIN USO desde v1.18.0: el rollback
   selectivo retiró del template el bloque cm__como-funciona (lo sustituye la
   columna de reserva TuriTop). NO borrar: se reactiva si se revierte la venta. */
.cm__como-funciona {
  list-style: none;
  counter-reset: cm-paso;
  margin: 0;
  padding: 0;
  font-family: var(--cm-sans);
  font-size: 14px;
  line-height: 1.6;
  color: var(--cm-cream);
  text-align: left;
}
.cm__como-funciona li {
  position: relative;
  counter-increment: cm-paso;
  padding: 8px 0 8px 36px;
}
.cm__como-funciona li + li { border-top: 1px solid rgba(212,175,55,.12); }
.cm__como-funciona li::before {
  content: counter(cm-paso);
  position: absolute;
  left: 0;
  top: 10px;
  width: 22px;
  height: 22px;
  border: 1px solid var(--cm-gold-border);
  border-radius: 50%;
  color: var(--cm-gold);
  font-size: 12px;
  font-weight: 600;
  line-height: 22px;
  text-align: center;
}
.cm__como-funciona strong { color: var(--cm-w); font-weight: 600; }
@media (max-width: 390px) {
  .cm__como-funciona li { padding-left: 32px; }
}

/* Sub-bloque "Mesa cerca del cante" (v1.16.0) — SIN USO desde v1.18.0:
   el rollback selectivo retiró .cm__mesa-* del template. NO borrar. */
.cm__mesa-title {
  font-family: 'Playfair Display', serif;
  font-weight: 500;
  font-size: 18px;
  color: var(--cm-gold-light);
  margin: 0 0 8px;
  letter-spacing: .5px;
}
.cm__mesa-text {
  font-family: var(--cm-sans);
  font-size: 13.5px;
  line-height: 1.6;
  color: var(--cm-w-80);
  margin: 0;
}

.cm__flamenco-hero-cta {
  margin-top: 28px;
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
  align-items: center;
}
@media (max-width: 1024px) {
  .cm__flamenco-hero-cta { display: none; }
}

.cm__booking--single { padding: 80px 0; }
.cm__booking-grid--single { grid-template-columns: 1fr; max-width: 560px; margin: 0 auto; }

/* GALERÍA FLAMENCO */
.cm__flamenco-gallery {
  position: relative;
  padding: clamp(56px, 8vw, 96px) 0;
  background: #050505;
  border-top: 1px solid rgba(212,175,55,0.15);
  border-bottom: 1px solid rgba(212,175,55,0.15);
}
.cm__flamenco-gallery-head {
  text-align: center;
  margin: 0 auto clamp(32px, 5vw, 56px);
  padding: 0 24px;
  max-width: 720px;
}
.cm__flamenco-gallery-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 8px;
  padding: 0 8px;
  max-width: 1600px;
  margin: 0 auto;
}
.cm__flamenco-photo {
  position: relative;
  margin: 0;
  overflow: hidden;
  aspect-ratio: 4 / 5;
  background: var(--cm-black-card);
  border: 1px solid rgba(212,175,55,0.06);
}
.cm__flamenco-photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform 0.9s ease, filter 0.6s ease;
  filter: brightness(0.92);
}
.cm__flamenco-photo::after {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, transparent 50%, rgba(0,0,0,0.45));
  pointer-events: none;
}
@media (hover: hover) and (pointer: fine) {
  .cm__flamenco-photo:hover img { transform: scale(1.05); filter: brightness(1.05); }
}

@media (max-width: 480px) {
  .cm__flamenco-gallery-grid { grid-template-columns: repeat(2, 1fr); gap: 4px; padding: 0 4px; }
}

.cm__flamenco-gallery-cta { text-align: center; margin: clamp(32px, 5vw, 56px) auto 0; padding: 0 24px; }
.cm__flamenco-gallery-cta p {
  font-family: var(--cm-accent);
  font-style: italic;
  font-size: clamp(1.3rem, 2.5vw, 1.8rem);
  color: var(--cm-w-90);
  margin: 0 0 18px;
}

/* PATCH RESPONSIVE + WCAG */
.cm a:focus-visible,
.cm button:focus-visible,
.cm [tabindex]:focus-visible {
  outline: 3px solid var(--cm-gold);
  outline-offset: 2px;
  border-radius: 4px;
  /* WCAG 1.4.11: halo oscuro exterior para que el anillo dorado tenga un borde
     de alto contraste sobre CUALQUIER fondo. Sobre rojo (#b91c1c) el dorado solo
     daba 2.89:1; contra este halo (#1a1512) el dorado contrasta ~6:1. En fondos
     oscuros/crema ya iba sobrado. */
  box-shadow: 0 0 0 6px rgba(26,21,18,.6);
}

.cm__booking-helper a:focus-visible,
.cm__flamenco-hero-alt a:focus-visible {
  outline: 2px solid var(--cm-gold);
  outline-offset: 3px;
  border-radius: 3px;
}

.cm__carousel-dot {
  width: 32px;
  height: 32px;
  min-width: 32px;
  min-height: 32px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: transparent;
  border: 0;
  cursor: pointer;
  border-radius: 50%;
  padding: 0;
}
.cm__carousel-dot::before {
  content: '';
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: rgba(255,255,255,.45);
  transition: width .3s ease, background .3s ease, border-radius .3s ease;
}
.cm__carousel-dot.is-active { background: transparent; }
.cm__carousel-dot.is-active::before {
  width: 24px;
  height: 8px;
  border-radius: 4px;
  background: var(--cm-gold);
}
/* Área de toque ≥44px sin cambiar el tamaño visual del punto (el visual es el
   ::before). En zonas de solape entre dots adyacentes gana el posterior. */
.cm__carousel-dot { position: relative; }
.cm__carousel-dot::after {
  content: '';
  position: absolute;
  left: 50%;
  top: 50%;
  width: 44px;
  height: 44px;
  transform: translate(-50%, -50%);
  border-radius: 50%;
}

.cm a svg { pointer-events: none; }

/* (bloque @media 1024px del flamenco container eliminado: era copia exacta
   de las reglas del bloque RESPONSIVE principal) */

@media (max-width: 768px) {
  .cm__flamenco-hero { padding: 40px 0 28px; }
  .cm__flamenco-hero-meta { grid-template-columns: repeat(3, 1fr); }
  .cm__flamenco-hero-meta li {
    border-right: 1px solid var(--cm-gold-border);
    border-bottom: 0;
    padding: 14px 6px;
    gap: 4px;
  }
  .cm__flamenco-hero-meta li:last-child { border-right: 0; }
  .cm__flamenco-hero-meta strong { font-size: 18px; }
  .cm__flamenco-hero-meta span { font-size: 10px; letter-spacing: .5px; }
  .cm__flamenco-hero-booking { padding: 28px 20px; }
  .cm__flamenco-hero-alt a { white-space: normal; overflow-wrap: anywhere; }
}

@media (max-width: 480px) {
  .cm__flamenco-hero-meta li { padding: 11px 4px; }
  .cm__flamenco-hero-meta strong { font-size: 16px; letter-spacing: 0; }
  .cm__flamenco-hero-meta span { font-size: 9px; letter-spacing: .3px; line-height: 1.3; }
}
@media (max-width: 360px) {
  .cm__flamenco-hero-meta strong { font-size: 14px; }
  .cm__flamenco-hero-meta span { font-size: 8.5px; }
}

@media (max-width: 1024px) {
  .cm__flamenco-hero-text,
  .cm__flamenco-booking-extra {
    max-width: 760px;
    margin-left: auto;
    margin-right: auto;
    padding-left: clamp(16px, 3vw, 32px);
    padding-right: clamp(16px, 3vw, 32px);
  }
  .cm__flamenco-booking-extra {
    padding-bottom: clamp(40px, 7vw, 64px);
  }
}

@media (max-width: 480px) {
  .cm__hero-meta { margin-top: 22px; padding: 7px 14px; font-size: 13px; }
  .cm__hero-meta-sep { display: none; }
  .cm__hero-meta > span:not(.cm__hero-meta-sep) { display: block; margin-top: 3px; }
  .cm__hero-ctas { flex-direction: column; align-items: center; }
  .cm__hero-ctas .cm__btn { width: 100%; max-width: 280px; }
  .cm__flamenco-hero { padding: 28px 0 18px; }
  .cm__flamenco-hero-script { font-size: clamp(26px, 11vw, 44px); }
  .cm__flamenco-hero-sub { font-size: clamp(13px, 4vw, 16px); line-height: 1.35; }
  .cm__flamenco-hero-lead { font-size: 16px; }
  .cm__flamenco-hero-booking { padding: 24px 16px; }
  .cm__booking-card { padding: 28px 18px; }
  .cm__booking-card-widget { padding: 8px; }
  .cm__flamenco-gallery-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 4px; padding: 0 4px; }
}

@media (max-width: 360px) {
  .cm__title { font-size: 1.85rem; }
  .cm__hero-title { font-size: clamp(2.8rem, 14vw, 3.8rem); }
  .cm__flamenco-hero-script { font-size: 38px; }
  .cm__btn { padding-left: 22px; padding-right: 22px; letter-spacing: .08em; }
}

.cm__carousel-dots {
  left: 50%;
  bottom: 14px;
  transform: translateX(-50%);
  width: min(calc(100% - 24px), 480px);
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 4px 6px;
  background: rgba(0, 0, 0, .35);
  -webkit-backdrop-filter: blur(4px);
  backdrop-filter: blur(4px);
  border-radius: 999px;
  padding: 6px 10px;
}

@media (max-width: 480px) {
  .cm__carousel-dots { bottom: 10px; width: calc(100% - 16px); gap: 2px 4px; padding: 4px 8px; }
  .cm__carousel-dot { width: 28px; height: 28px; min-width: 28px; min-height: 28px; }
  .cm__hero-pretitle { font-size: 10.5px; letter-spacing: .28em; line-height: 1.5; }
  .cm__hero-content { padding-top: 88px; }
  .cm__cocktail { min-height: 400px; }
}

.cm__booking-card-widget {
  position: relative;
  min-height: 420px;
  background: linear-gradient(180deg, #f5f5f5 0%, #ebebeb 100%);
}
.cm__booking-card-widget iframe { position: relative; z-index: 1; }

/* En uso desde v1.18.0 (rollback selectivo: SHOW_TURITOP=true) — ver nota arriba */
.cm__flamenco-hero-widget {
  position: relative;
  background: rgba(255,255,255,0.02);
  border-radius: 4px;
  min-height: 280px;
}

.cm__soft-choice {
  margin-top: 22px;
  padding: 14px 16px;
  border: 1px solid var(--cm-gold-border-strong);
  border-radius: var(--cm-radius-md);
  background: rgba(255,255,255,.025);
  text-align: center;
}
.cm__soft-choice p { color: var(--cm-w-70); font-size: 13px; margin: 0 0 6px; line-height: 1.5; }
.cm__soft-choice a {
  color: var(--cm-gold);
  font-weight: 600;
  font-size: 13px;
  text-decoration: underline;
  text-underline-offset: 4px;
  letter-spacing: .04em;
}

@media (max-width: 768px) {
  .cm__faq-list { padding: 4px 18px; }
}

.cm__closing {
  text-align: center;
  margin: 56px auto 32px;
  font-family: var(--cm-accent);
  font-style: italic;
  font-size: clamp(1.4rem, 2.6vw, 1.85rem);
  color: var(--cm-w-90);
  letter-spacing: .01em;
  max-width: 600px;
  padding: 0 16px;
  line-height: 1.4;
}

@media (max-width: 768px) {
  .cm__map iframe { filter: none; height: 320px; }
}

@media (min-width: 769px) {
  .cm__flamenco-gallery-grid {
    grid-template-columns: repeat(4, 1fr);
    gap: 8px;
    max-width: 1400px;
  }
  .cm__flamenco-photo { aspect-ratio: 4 / 5; }
  .cm__flamenco-photo:nth-child(1),
  .cm__flamenco-photo:nth-child(7) {
    grid-column: span 2;
    aspect-ratio: 8 / 5;
  }
}

.cm__flamenco-gallery-grid--four {
  max-width: 900px;
  margin-left: auto;
  margin-right: auto;
}
@media (min-width: 769px) {
  .cm__flamenco-gallery-grid--four {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
  }
  .cm__flamenco-gallery-grid--four .cm__flamenco-photo,
  .cm__flamenco-gallery-grid--four .cm__flamenco-photo:nth-child(1),
  .cm__flamenco-gallery-grid--four .cm__flamenco-photo:nth-child(7) {
    grid-column: auto;
    aspect-ratio: 4 / 5;
  }
}
@media (max-width: 768px) {
  .cm__flamenco-gallery-grid--four { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
}

.cm__mobile-sticky { display: none; }
@media (max-width: 768px) {
  .cm__mobile-sticky {
    position: fixed;
    left: 10px;
    right: 10px;
    bottom: calc(10px + env(safe-area-inset-bottom));
    z-index: var(--cm-z-sticky);
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 6px;
    padding: 7px;
    border: 1px solid var(--cm-gold-border-strong);
    border-radius: 999px;
    background: rgba(10,10,10,.92);
    -webkit-backdrop-filter: blur(12px);
    backdrop-filter: blur(12px);
    box-shadow: 0 12px 36px rgba(0,0,0,.45);
    transition: transform .3s ease, opacity .3s ease;
  }
  .cm__mobile-sticky.is-hidden {
    transform: translateY(150%);
    opacity: 0;
    pointer-events: none;
  }
  .cm__mobile-sticky a {
    min-height: 44px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 999px;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: .02em;
    color: var(--cm-w);
    text-align: center;
    text-decoration: none;
    -webkit-tap-highlight-color: transparent;
  }
  .cm__mobile-sticky a:not(:first-child) {
    background: rgba(255,255,255,.08);
    border: 1px solid rgba(255,255,255,.16);
  }
  .cm__mobile-sticky a:focus-visible { outline: 2px solid var(--cm-gold); outline-offset: 3px; }
  .cm__mobile-sticky a:first-child { background: var(--cm-gold); color: var(--cm-black); }
}

.cm__mobile-sticky-spacer { display: none; }
@media (max-width: 768px) {
  .cm__mobile-sticky-spacer { display: block; height: calc(78px + env(safe-area-inset-bottom)); }
}

@media print {
  .cm__mobile-sticky, .cm__mobile-sticky-spacer { display: none !important; }
}

@media (prefers-reduced-motion: reduce) {
  .cm__mobile-sticky { transition: none !important; }
}

.cm__soft-choice a,
.cm__flamenco-hero-alt a,
.cm__booking-helper a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 32px;
  padding: 2px 6px;
  border-radius: 4px;
}

@media (max-width: 480px) {
  .cm__cocktail-body { padding: 24px 20px; }
}

@media (max-width: 360px) {
  .cm__eyebrow { font-size: 11px; }
}

h3.cm__list-name {
  margin: 0;
  font-family: var(--cm-serif);
  font-weight: 600;
  font-size: 1.15rem;
  color: var(--cm-gold);
}

.cm__mobile-sticky, .cm__mobile-sticky *, .cm__mobile-sticky-spacer { box-sizing: border-box; }
.cm__mobile-sticky { font-family: var(--cm-sans); }

@media (max-width: 640px) and (min-width: 481px) {
  .cm__flamenco-gallery-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px; padding: 0 8px; }
  .cm__flamenco-photo { aspect-ratio: 4 / 5; }
}

.cm__section:not(.cm__flamenco-hero),
.cm__history,
.cm__contact,
.cm__faq,
.cm__booking {
  padding-top: clamp(48px, 8vw, 96px);
  padding-bottom: clamp(48px, 8vw, 96px);
}

.cm__container {
  padding-left: max(clamp(16px, 3vw, 32px), env(safe-area-inset-left, 16px));
  padding-right: max(clamp(16px, 3vw, 32px), env(safe-area-inset-right, 16px));
}

/* En uso desde v1.18.0 (rollback selectivo: SHOW_TURITOP=true) — ver nota arriba */
.cm__flamenco-hero-widget,
.cm__booking-card-widget { max-width: 100%; }
.cm__flamenco-hero-widget iframe,
.cm__booking-card-widget iframe,
.cm__flamenco-hero-widget .load-turitop iframe {
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
}

.cm__booking-card-widget iframe { height: clamp(420px, 70vh, 550px); }

.cm__title,
.cm__hero-title,
.cm__hero-subtitle,
.cm__hero-tagline,
.cm__flamenco-hero-script,
.cm__flamenco-hero-sub,
.cm__booking-card-title,
.cm__cocktail-name,
.cm__faq-summary { text-wrap: balance; }

.cm__lead,
.cm__cocktail-desc,
.cm__list-ingredients,
.cm__faq-answer p,
.cm__history-text p,
.cm__flamenco-hero-lead { text-wrap: pretty; }

.cm__booking-card-price-amount { font-size: clamp(1.8rem, 4vw, 2.4rem); }

@media (max-width: 480px) {
  .cm__list-item { grid-template-columns: minmax(0, 1fr) auto; gap: 0 12px; padding: 16px 0; }
  .cm__list-name, h3.cm__list-name { min-width: 0; overflow-wrap: anywhere; padding-right: 0; }
  .cm__list-name::after, h3.cm__list-name::after { display: none; }
  .cm__list-price { white-space: nowrap; }
  .cm__list-tag { margin-left: 6px; white-space: nowrap; }
  .cm__faq-summary { padding-right: 36px; }
  .cm__contact-card { padding: 30px 20px; }
}

@media (max-height: 430px) and (orientation: landscape) {
  .cm__mobile-sticky, .cm__mobile-sticky-spacer { display: none !important; }
  .cm__hero { min-height: auto; }
  .cm__hero-content { padding: 72px 18px 48px; }
  .cm__hero-title { font-size: clamp(3rem, 12vw, 5rem); }
  .cm__hero-tagline { margin-bottom: 24px; }
}

@media (max-width: 340px) {
  .cm__hero-pretitle { letter-spacing: .14em; }
  .cm__mobile-sticky { left: 6px; right: 6px; gap: 4px; padding: 6px; }
  .cm__mobile-sticky a { font-size: 11px; }
}

.cm__menu-jump {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 10px;
  margin: 28px auto 0;
  max-width: 780px;
}
.cm__menu-jump a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 40px;
  padding: 9px 16px;
  border: 1px solid var(--cm-gold-border-strong);
  border-radius: var(--cm-radius-pill);
  color: var(--cm-gold);
  font-family: var(--cm-sans);
  font-size: 12px;
  font-weight: 600;
  letter-spacing: .06em;
  text-transform: uppercase;
  text-decoration: none;
  background: rgba(255,255,255,.025);
  transition: background var(--cm-ease), color var(--cm-ease), border-color var(--cm-ease), transform var(--cm-ease);
}
.cm__menu-jump-cta {
  background: var(--cm-gold) !important;
  color: var(--cm-black) !important;
  border-color: var(--cm-gold) !important;
}
@media (hover: hover) and (pointer: fine) {
  .cm__menu-jump a:hover { background: var(--cm-gold); color: var(--cm-black); border-color: var(--cm-gold); }
  .cm__menu-jump-cta:hover { filter: brightness(1.08); }
}
.cm__menu-jump a:focus-visible { outline: 3px solid var(--cm-gold); outline-offset: 3px; }
@media (max-width: 480px) {
  .cm__menu-jump {
    justify-content: flex-start;
    flex-wrap: nowrap;
    overflow-x: auto;
    padding: 4px 2px 10px;
    margin-left: -2px;
    margin-right: -2px;
    -webkit-overflow-scrolling: touch;
    scroll-snap-type: x proximity;
    scroll-padding-left: 12px;
  }
  .cm__menu-jump a { flex: 0 0 auto; min-height: 42px; scroll-snap-align: start; }
}

/* En uso desde v1.18.0 (rollback selectivo: SHOW_TURITOP=true) — ver nota arriba */
.cm__booking-microcopy {
  margin: 10px auto 0;
  color: var(--cm-gold-light);
  font-family: var(--cm-sans);
  font-size: 12px;
  font-weight: 600;
  line-height: 1.5;
  letter-spacing: .04em;
  text-align: center;
}
.cm__booking-microcopy a {
  color: var(--cm-gold);
  text-decoration: underline;
  text-underline-offset: 2px;
  transition: color var(--cm-ease);
}
@media (hover:hover) and (pointer:fine) {
  .cm__booking-microcopy a:hover { color: var(--cm-cream); }
}
.cm__booking-microcopy a:focus-visible { outline: 2px solid var(--cm-gold); outline-offset: 3px; border-radius: 2px; }

.cm__booking-bullets {
  list-style: none;
  margin: 14px auto 8px;
  padding: 12px 16px;
  max-width: 320px;
  border: 1px solid var(--cm-gold-border);
  border-radius: var(--cm-radius-sm);
  background: rgba(212,175,55,.05);
  font-family: var(--cm-sans);
  font-size: 13px;
  line-height: 1.6;
  color: var(--cm-cream);
  text-align: left;
}
.cm__booking-bullets li { position: relative; padding: 3px 0 3px 18px; }
.cm__booking-bullets li::before {
  content: "·";
  position: absolute;
  left: 6px;
  top: 1px;
  color: var(--cm-gold);
  font-weight: 700;
  font-size: 16px;
}
.cm__booking-microcopy--dark {
  margin: -8px 0 22px;
  padding: 10px 12px;
  border: 1px solid var(--cm-gold-border);
  border-radius: var(--cm-radius-sm);
  background: rgba(212,175,55,.06);
  color: var(--cm-w-80);
  text-align: left;
  letter-spacing: 0;
  font-weight: 500;
}

/* En uso desde v1.18.0 (rollback selectivo: SHOW_TURITOP=true) — ver nota arriba */
.cm__widget-fallback {
  margin: 12px 0 0;
  font-family: var(--cm-sans);
  font-size: 12px;
  line-height: 1.5;
  color: var(--cm-w-70);
  text-align: center;
  letter-spacing: .02em;
}
.cm__widget-fallback--light { color: var(--cm-w-70); margin: 6px 0 18px; }

html.cm-booking-in-view .cm__mobile-sticky {
  transform: translateY(150%);
  opacity: 0;
  pointer-events: none;
}
@media (prefers-reduced-motion: reduce) {
  html.cm-booking-in-view .cm__mobile-sticky { transition: none; }
}

.cm__btn,
.cm__contact-link,
.cm__menu-jump a,
.cm__mobile-sticky a,
.cm__hero-meta-link,
.cm__soft-choice a,
.cm__map-cta,
.cm__faq-summary,
.cm__carousel-dot,
.cm__flamenco-hero-alt a { touch-action: manipulation; }

@media (hover: none) and (pointer: coarse) {
  .cm__btn:active,
  .cm__contact-link:active,
  .cm__menu-jump a:active,
  .cm__mobile-sticky a:active,
  .cm__map-cta:active {
    transform: scale(0.97);
    transition: transform 80ms ease-out;
  }
}
@media (prefers-reduced-motion: reduce) {
  .cm__btn:active,
  .cm__contact-link:active,
  .cm__menu-jump a:active,
  .cm__mobile-sticky a:active,
  .cm__map-cta:active { transform: none; }
}

.cm__map-cta-wrap { margin: 18px 0 0; text-align: center; }
.cm__map-cta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 44px;
  padding: 12px 22px;
  border: 1px solid var(--cm-gold-border-strong);
  border-radius: var(--cm-radius-pill);
  color: var(--cm-gold);
  font-family: var(--cm-sans);
  font-size: 13px;
  font-weight: 600;
  letter-spacing: .06em;
  text-transform: uppercase;
  text-decoration: none;
  background: rgba(255,255,255,.02);
  transition: background var(--cm-ease), color var(--cm-ease), border-color var(--cm-ease);
}
@media (hover: hover) and (pointer: fine) {
  .cm__map-cta:hover { background: var(--cm-gold); color: var(--cm-black); border-color: var(--cm-gold); }
  .cm__map-cta:hover svg { color: var(--cm-black); }
}
.cm__map-cta:focus-visible { outline: 3px solid var(--cm-gold); outline-offset: 3px; }
.cm__map-cta svg { flex-shrink: 0; color: var(--cm-gold); transition: color var(--cm-ease); }

.cm__carousel { touch-action: pan-y; }

@media (prefers-reduced-motion: reduce) {
  .cm__hero-pretitle,
  .cm__hero-title,
  .cm__hero-subtitle,
  .cm__hero-tagline,
  .cm__hero-ctas,
  .cm__hero-meta { animation: none !important; }
}

.cm__trust-row {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 0 0 28px;
  padding: 0;
  list-style: none;
}
.cm__trust-row li {
  font-family: var(--cm-sans);
  font-size: 12px;
  line-height: 1.4;
  font-weight: 500;
  letter-spacing: .04em;
  color: var(--cm-w-80);
  border: 1px solid var(--cm-gold-border);
  border-radius: var(--cm-radius-pill);
  padding: 7px 14px;
  background: rgba(255,255,255,.025);
}
@media (max-width: 480px) {
  .cm__trust-row { gap: 6px; }
  .cm__trust-row li { font-size: 11px; padding: 6px 12px; }
}

.cm ::selection { background: var(--cm-gold); color: var(--cm-black); }

.cm {
  scrollbar-color: var(--cm-gold-border) var(--cm-black);
  scrollbar-width: thin;
}
.cm ::-webkit-scrollbar { width: 10px; height: 10px; }
.cm ::-webkit-scrollbar-track { background: var(--cm-black); }
.cm ::-webkit-scrollbar-thumb {
  background: var(--cm-gold-border);
  border-radius: 10px;
  border: 2px solid var(--cm-black);
}
.cm ::-webkit-scrollbar-thumb:hover { background: var(--cm-gold-border-strong); }

@media (hover: none) and (pointer: coarse) {
  .cm__btn--primary:active {
    transform: scale(0.97) translateY(2px);
    box-shadow: 0 2px 8px rgba(212,175,55,.15);
    transition: transform 80ms ease-out, box-shadow 80ms ease-out;
  }
}

.cm__about-cta {
  display: flex;
  justify-content: center;
  gap: 14px;
  flex-wrap: wrap;
  margin-top: 40px;
}
@media (max-width: 480px) {
  .cm__about-cta { flex-direction: column; align-items: center; }
  .cm__about-cta .cm__btn { width: 100%; max-width: 320px; }
}

@supports (content-visibility: auto) {
  .cm__history,
  .cm__faq {
    content-visibility: auto;
    contain-intrinsic-size: auto 700px;
  }
  .cm__list-section--decor {
    content-visibility: auto;
    contain-intrinsic-size: auto 600px;
  }
}

/* Ocultar mini-cart flotante de WPCafe / Woo */
.wpc_cart_icon,
.wpc-cart-icon,
.wpcafe-cart-icon,
.wpcafe-floating-cart,
.fk-wpc-cart-icon,
.fk-cart-icon,
.fkcart-mini,
.fkcart-floating,
.woocommerce-mini-cart-floating,
.widget_shopping_cart,
#site-cart-icon,
body > .cart-icon-wrapper,
body > [class*="floating-cart"],
body > [class*="cart-float"],
body > [id*="cart-icon"],
body > [id*="mini-cart"] {
  display: none !important;
  visibility: hidden !important;
  pointer-events: none !important;
}

/* ===== MÓDULO LEYENDAS DE SEVILLA ===== */
/* ===== BASE WIDGET ===== */
.cml{
  --bg:#0a0a0a;--bg-card:#141414;
  --gold:#d4af37;--gold-soft:rgba(212,175,55,0.08);--gold-light:#f4e7a1;
  --w:#fff;--w95:rgba(255,255,255,0.95);--w90:rgba(255,255,255,0.9);--w80:rgba(255,255,255,0.8);
  --w70:rgba(255,255,255,0.7);--w60:rgba(255,255,255,0.6);--w50:rgba(255,255,255,0.5);
  --w10:rgba(255,255,255,0.1);--w06:rgba(255,255,255,0.06);
  --azulejo:#1e4d8c;--azulejo-light:#3a7bd5;
  --serif:'Playfair Display',Georgia,serif;
  --sans:'Inter',-apple-system,BlinkMacSystemFont,sans-serif;
  --accent:'Cormorant Garamond',Georgia,serif;
  --ease:0.35s cubic-bezier(0.25,0.46,0.45,0.94);

  display:block;
  width:100%;
  max-width:100%;
  margin:0;
  padding:100px 0 100px !important;
  background:var(--bg);
  font-family:var(--sans);
  color:var(--w70);
  font-size:16px;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
  box-sizing:border-box;
}
.cml,.cml *,.cml *::before,.cml *::after{margin:0;padding:0;box-sizing:border-box;}

.cml__container{
  width:100%;
  max-width:1400px;
  margin:0 auto;
  padding:0 24px;
}

.cml__pin:focus-visible,.cml__key-btn:focus-visible,.cml__close:focus-visible,
.cml__nav-btn:focus-visible,.cml__filter-btn:focus-visible,.cml__reset-btn:focus-visible{
  outline:3px solid var(--gold-light);outline-offset:3px;
}

.cml__intro-grid{
  display:grid;
  grid-template-columns:minmax(220px,300px) 1fr;
  gap:clamp(28px,4vw,60px);
  align-items:center;
  max-width:1100px;
  margin:0 auto 56px;
  padding:0 16px;
}
.cml__intro-badge img{
  width:100%;
  height:auto;
  display:block;
}
.cml__intro-grid .cml__eyebrow,
.cml__intro-grid .cml__title,
.cml__intro-grid .cml__subtitle{max-width:100%;}
.cml__intro-grid .cml__subtitle{margin-bottom:0;}

.cml__eyebrow{
  font-family:var(--sans);
  font-size:13px;
  font-weight:500;
  letter-spacing:0.32em;
  text-transform:uppercase;
  color:var(--gold);
  text-align:center;
  margin:0 0 14px;
}
.cml__title{
  font-family:var(--serif);
  font-size:clamp(32px,4.4vw,52px);
  font-weight:400;
  color:var(--gold);
  margin-bottom:18px;
  text-align:center;
  line-height:1.15;
  letter-spacing:0.01em;
}
.cml__subtitle{
  font-family:var(--sans);
  font-size:clamp(12px,1.05vw,14px);
  font-weight:400;
  letter-spacing:0.22em;
  text-transform:uppercase;
  color:var(--w70);
  line-height:1.7;
  max-width:680px;
  margin:0 auto 48px;
  text-align:center;
}
.cml__intro{
  font-family:var(--accent);
  font-size:clamp(17px,1.9vw,20px);
  font-weight:300;
  font-style:italic;
  color:var(--w70);
  line-height:1.65;
  max-width:780px;
  margin:0 auto 48px;
  text-align:center;
}

@media (max-width:640px){
  .cml__eyebrow{font-size:11px;letter-spacing:0.24em;margin-bottom:10px;}
  .cml__subtitle{font-size:11px;letter-spacing:0.14em;line-height:1.6;margin-bottom:36px;}
}

@media (max-width:768px){
  .cml__intro-grid{
    grid-template-columns:1fr;
    gap:28px;
    margin-bottom:40px;
  }
  .cml__intro-badge{
    max-width:240px;
    margin:0 auto;
  }
}

.cml__map-wrap{
  position:relative;
  width:100%;
  overflow:hidden;
  border-radius:16px;
  border:2px solid var(--azulejo);
  box-shadow:0 0 60px rgba(30,77,140,0.12);
  background:#000;
}
.cml__map-img{
  width:100%;
  height:auto;
  display:block;
  filter:sepia(0.15) brightness(0.92) contrast(1.05);
}
.cml__pins{position:absolute;inset:0;}

.cml__pin{
  position:absolute;
  transform:translate(-50%,-50%);
  cursor:pointer;
  background:none;border:none;padding:0;z-index:5;
  -webkit-tap-highlight-color:transparent;outline:none;
  width:44px;height:44px;
  display:flex;align-items:center;justify-content:center;
}
.cml__pin::before{
  content:'';
  position:absolute;top:50%;left:50%;
  width:44px;height:44px;
  transform:translate(-50%,-50%);
  border-radius:50%;
}
.cml__pin-glow{
  position:absolute;top:50%;left:50%;
  width:50px;height:50px;
  transform:translate(-50%,-50%);
  border-radius:50%;
  border:2px solid var(--gold);
  opacity:0;
  animation:cml-pulse 2.5s ease-in-out infinite;
  pointer-events:none;
}
.cml__pin:nth-child(odd) .cml__pin-glow{animation-delay:0s;}
.cml__pin:nth-child(even) .cml__pin-glow{animation-delay:1.25s;}
@keyframes cml-pulse{
  0%,100%{opacity:0;transform:translate(-50%,-50%) scale(0.8);}
  50%{opacity:0.6;transform:translate(-50%,-50%) scale(1.4);}
}
.cml__pin-dot{
  display:flex;align-items:center;justify-content:center;
  width:36px;height:36px;border-radius:50%;
  background:var(--azulejo);
  border:2.5px solid var(--w);
  color:var(--w);
  font-family:var(--serif);
  font-size:15px;font-weight:600;
  box-shadow:0 2px 12px rgba(0,0,0,0.5),0 0 0 4px rgba(30,77,140,0.3);
  transition:all 0.3s;
  position:relative;z-index:2;
}
.cml__pin:hover .cml__pin-dot,
.cml__pin[aria-expanded="true"] .cml__pin-dot{
  background:var(--gold);border-color:var(--w);color:#1a1512;
  transform:scale(1.18);
  box-shadow:0 2px 22px rgba(212,175,55,0.55),0 0 0 5px rgba(212,175,55,0.3);
}
.cml__pin.is-found .cml__pin-dot{background:var(--gold);color:#1a1512;}
.cml__pin.is-dimmed{opacity:0.3;pointer-events:none;}
.cml__pin-label{
  position:absolute;top:100%;left:50%;
  transform:translateX(-50%);margin-top:6px;
  font-family:var(--serif);font-size:13px;font-weight:600;color:var(--w);
  white-space:nowrap;
  text-shadow:0 1px 4px rgba(0,0,0,1),0 0 8px rgba(0,0,0,0.9),0 0 16px rgba(0,0,0,0.7);
  pointer-events:none;
}

.cml__panel{
  width:100%;
  max-height:0;
  overflow:hidden;
  background:#0f1218;
  border-radius:16px;
  margin-top:0;
  border:2px solid transparent;
  transition:max-height 0.6s cubic-bezier(0.25,0.46,0.45,0.94),
             margin-top 0.4s ease,
             border-color 0.4s ease;
  position:relative;
}
.cml__panel.is-open{
  max-height:2400px;
  margin-top:20px;
  border-color:var(--azulejo);
  box-shadow:0 20px 60px rgba(0,0,0,0.4);
}

.cml__panel::before{
  content:'';
  display:block;
  height:4px;
  background:linear-gradient(90deg,transparent 0%,var(--azulejo) 20%,var(--azulejo-light) 50%,var(--azulejo) 80%,transparent 100%);
}

.cml__close{
  position:absolute;
  top:20px;right:20px;
  width:44px;height:44px;
  background:rgba(255,255,255,0.08);
  border:1px solid rgba(255,255,255,0.15);
  border-radius:50%;
  color:var(--w80);
  font-size:22px;cursor:pointer;
  display:flex;align-items:center;justify-content:center;
  transition:all 0.3s;
  z-index:10;
}
.cml__close:hover{
  background:rgba(212,175,55,0.2);
  border-color:var(--gold);
  color:var(--gold);
  transform:rotate(90deg);
}

.cml__panel-inner{
  display:grid;
  grid-template-columns:minmax(300px,360px) 1fr;
  gap:48px;
  padding:56px 48px;
  align-items:start;
  transition:opacity 0.25s ease;
}
.cml__panel-inner.is-changing{opacity:0.3;}

.cml__media{
  width:100%;
  max-width:360px;
  margin:0 auto;
  border-radius:14px;
  overflow:hidden;
  background:#000;
  position:relative;
}
.cml__media iframe{
  display:block;
  width:100%;
  aspect-ratio:9/16;
  border:0;
  background:#000;
}
.cml__media-img{
  display:block;
  width:100%;
  height:auto;
  aspect-ratio:4/5;
  object-fit:cover;
}

.cml__info{
  color:var(--w80);
  min-width:0;
}
.cml__info-header{
  display:flex;
  align-items:flex-start;
  gap:24px;
  margin-bottom:28px;
}
.cml__info-thumb{
  flex-shrink:0;
  width:140px;height:180px;
  border-radius:12px;
  overflow:hidden;
  background:#222;
  border:1px solid var(--w10);
  box-shadow:0 8px 24px rgba(0,0,0,0.4);
}
.cml__info-thumb img{
  display:block;width:100%;height:100%;object-fit:cover;
}
.cml__info-title-wrap{flex:1;min-width:0;}
.cml__num{
  display:inline-flex;align-items:center;justify-content:center;
  width:38px;height:38px;border-radius:50%;
  background:var(--azulejo);color:var(--w);
  font-family:var(--serif);font-size:16px;font-weight:600;
  margin-bottom:14px;
}
.cml__name{
  font-family:var(--serif);
  font-size:clamp(32px,3.8vw,46px);
  font-weight:500;
  color:var(--w95);
  line-height:1.12;
  margin-bottom:8px;
}
.cml__sub{
  font-family:var(--accent);
  font-size:clamp(18px,2vw,22px);
  font-style:italic;
  color:var(--w80);
}
.cml__quote{
  font-family:var(--accent);
  font-size:clamp(19px,2.1vw,23px);
  font-weight:400;font-style:italic;
  color:var(--gold-light);
  line-height:1.5;
  margin-bottom:26px;
  padding:0 0 20px;
  border-bottom:1px solid var(--w10);
}
.cml__meta-row{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  align-items:center;
  margin-bottom:20px;
}
.cml__ing{
  display:inline-flex;align-items:center;gap:10px;
  padding:10px 16px;
  background:var(--gold-soft);
  border-radius:12px;
  border:1px solid rgba(212,175,55,0.18);
  font-family:var(--sans);
  font-size:14px;font-weight:500;
  color:var(--w90);
}
.cml__ing svg{flex-shrink:0;color:var(--gold);}
.cml__ing-tbd{font-style:italic;color:var(--w70);font-weight:400;}
.cml__price{
  display:inline-block;
  font-family:var(--sans);
  font-size:15px;font-weight:700;
  color:var(--w);
  background:var(--azulejo);
  padding:6px 14px;
  border-radius:20px;
}
.cml__serving{
  display:inline-block;
  padding:5px 12px;
  font-family:var(--sans);
  font-size:12px;font-weight:500;
  color:var(--gold-light);
  background:rgba(212,175,55,0.1);
  border:1px solid rgba(212,175,55,0.22);
  border-radius:14px;
}
.cml__taste{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:5px 12px;
  font-family:var(--accent);
  font-size:13px;
  font-style:italic;
  color:var(--w90);
  background:rgba(255,255,255,0.04);
  border:1px solid rgba(255,255,255,0.10);
  border-radius:14px;
}
.cml__taste svg{flex-shrink:0;color:var(--gold);opacity:0.75;}
.cml__story-label{
  font-family:var(--sans);
  font-size:13px;font-weight:600;
  text-transform:uppercase;letter-spacing:0.14em;
  color:var(--azulejo-light);
  margin-bottom:12px;
}
.cml__story{
  font-family:var(--accent);
  font-size:clamp(17px,1.8vw,20px);
  color:var(--w85,rgba(255,255,255,0.85));
  line-height:1.75;
  margin-bottom:24px;
}
.cml__loc{
  padding-top:18px;
  border-top:1px solid var(--w10);
  display:flex;align-items:center;gap:10px;
  font-family:var(--sans);
  font-size:15px;color:var(--w80);
}
.cml__loc svg{flex-shrink:0;color:var(--azulejo-light);}

.cml__nav{
  display:flex;
  justify-content:space-between;
  align-items:center;
  margin-top:24px;
  padding-top:20px;
  border-top:1px solid var(--w06);
}
.cml__nav-btn{
  display:flex;align-items:center;gap:8px;
  padding:10px 18px;
  background:var(--w06);
  border:1px solid var(--w10);
  border-radius:8px;
  color:var(--w80);
  font-family:var(--sans);
  font-size:14px;font-weight:500;
  cursor:pointer;
  transition:all 0.25s;
}
.cml__nav-btn:hover{
  background:var(--gold-soft);
  border-color:rgba(212,175,55,0.25);
  color:var(--gold);
}
.cml__nav-count{
  font-family:var(--sans);
  font-size:13px;color:var(--w70);
}

.cml__progress{
  text-align:center;
  margin-top:32px;
  font-family:var(--sans);
  font-size:15px;color:var(--w70);
}
.cml__progress-count{color:var(--gold);font-weight:700;font-size:17px;}
.cml__hint{
  text-align:center;margin-top:12px;
  font-family:var(--accent);
  font-size:16px;font-style:italic;
  color:var(--w70);
}
.cml__completion{
  margin:20px auto 0;
  max-width:520px;
  padding:16px 22px;text-align:center;
  background:linear-gradient(135deg,rgba(212,175,55,0.14),rgba(212,175,55,0.04));
  border:1px solid rgba(212,175,55,0.25);
  border-radius:14px;
  color:var(--gold-light);
}
.cml__completion strong{
  display:block;margin-bottom:6px;
  font-family:var(--serif);font-size:20px;font-weight:500;
}
.cml__completion span{color:var(--w90);font-size:14px;}
.cml__reset-btn{
  display:inline-block;margin-top:14px;
  min-height:44px;
  padding:11px 24px;
  background:transparent;
  border:1px solid rgba(212,175,55,0.35);
  border-radius:22px;
  color:var(--gold-light);
  font-family:var(--sans);
  font-size:14px;font-weight:500;
  cursor:pointer;transition:all 0.25s;
}
.cml__reset-btn:hover{background:var(--gold-soft);border-color:var(--gold);}

.cml__filters{
  display:flex;justify-content:center;
  gap:8px;margin-top:24px;flex-wrap:wrap;
}
.cml__filter-btn{
  min-height:44px;
  padding:10px 22px;border-radius:22px;
  background:var(--w06);
  border:1px solid transparent;
  font-family:var(--sans);
  font-size:14px;font-weight:500;
  color:var(--w70);cursor:pointer;transition:all 0.25s;
}
.cml__filter-btn:hover{background:var(--gold-soft);color:var(--gold);}
.cml__filter-btn.is-active{
  background:var(--gold-soft);
  border-color:rgba(212,175,55,0.3);
  color:var(--gold);
}

.cml__filter-empty{
  margin-top:16px;padding:14px 18px;
  text-align:center;
  font-family:var(--accent);
  font-size:15px;font-style:italic;
  color:var(--w70);
  background:var(--w06);border-radius:10px;
  max-width:520px;margin-left:auto;margin-right:auto;
}

.cml__keys{
  display:flex;flex-wrap:wrap;
  justify-content:center;gap:8px;
  margin-top:28px;
}
.cml__key-btn{
  display:flex;align-items:center;gap:8px;cursor:pointer;
  min-height:40px;
  padding:9px 18px;border-radius:22px;
  background:var(--w06);border:1px solid transparent;
  transition:all var(--ease);
  font-family:var(--sans);
  font-size:14px;color:var(--w80);
}
.cml__key-btn:hover{
  background:var(--gold-soft);
  border-color:rgba(212,175,55,0.18);
  color:var(--gold);
}
.cml__key-btn.is-found{
  color:var(--gold);
  background:var(--gold-soft);
  border-color:rgba(212,175,55,0.22);
}
.cml__key-btn[aria-pressed="true"]{
  color:var(--gold);
  background:var(--gold-soft);
  border-color:rgba(212,175,55,0.32);
}
.cml__key-btn.is-hidden{display:none;}
.cml__key-dot{
  width:10px;height:10px;border-radius:50%;
  background:var(--azulejo);
  flex-shrink:0;transition:background 0.3s;
}
.cml__key-btn.is-found .cml__key-dot{background:var(--gold);}

.cml__key-btn.is-linked{
  background:var(--gold-soft);
  border-color:rgba(212,175,55,0.18);
  color:var(--gold);
}
.cml__pin.is-linked .cml__pin-dot{
  background:var(--gold);color:#1a1512;transform:scale(1.12);
  box-shadow:0 2px 18px rgba(212,175,55,0.45);
}

@keyframes cml-discovered{
  0%{transform:scale(1);}
  30%{transform:scale(1.4);}
  60%{transform:scale(0.9);}
  100%{transform:scale(1);}
}
.cml__pin-dot.is-just-found{animation:cml-discovered 0.5s ease-out;}
@keyframes cml-key-flash{
  0%{box-shadow:0 0 0 0 rgba(212,175,55,0.5);}
  100%{box-shadow:0 0 0 14px rgba(212,175,55,0);}
}
.cml__key-btn.is-just-found{animation:cml-key-flash 0.6s ease-out;}

@media(max-width:960px){
  .cml{padding:70px 0 70px !important;}
  .cml__panel-inner{
    grid-template-columns:1fr;
    gap:32px;
    padding:40px 28px;
  }
  .cml__media{max-width:360px;}
  .cml__media iframe{aspect-ratio:9/16;max-width:360px;margin:0 auto;}
  .cml__media-img{aspect-ratio:4/5;max-width:360px;margin:0 auto;}
}
@media(max-width:640px){
  .cml{padding:50px 0 50px !important;}
  .cml__container{padding:0 16px;}
  .cml__pin-dot{width:32px;height:32px;font-size:13px;border-width:2px;}
  .cml__pin-label{font-size:12px;margin-top:4px;}
  .cml__keys{gap:6px;}
  .cml__key-btn{font-size:13px;padding:9px 14px;}
  .cml__filter-btn{font-size:13px;padding:10px 18px;}
  .cml__info-header{gap:18px;}
  .cml__info-thumb{width:110px;height:140px;}
  .cml__close{top:12px;right:12px;}
  .cml__panel-inner{padding:32px 20px;}
}
@media(max-width:480px){
  .cml__pin-dot{width:30px;height:30px;font-size:12px;}
  .cml__pin-label{font-size:11px;}
  .cml__pin-glow{width:42px;height:42px;}
  .cml__info-header{flex-direction:column;}
  .cml__info-thumb{width:140px;height:180px;}
}

@media(max-width:640px){
  .cml__pin-label{display:none;}
}
@media(prefers-reduced-motion:reduce){
  .cml__pin-glow,.cml__pin-dot.is-just-found,.cml__key-btn.is-just-found{animation:none !important;}
  .cml__panel,.cml__pin-dot,.cml__close,.cml__panel-inner{transition:none !important;}
}
@media(forced-colors:active){
  .cml__pin-dot{border:2px solid ButtonText;}
  .cml__panel,.cml__map-wrap{border:2px solid ButtonText;}
}
@media print{
  .cml__panel,.cml__keys,.cml__hint,.cml__progress,.cml__filters,.cml__completion,.cml__filter-empty{display:none;}
}

/* v1.20.2 — scroll horizontal del calendario TuriTop en movil; ataca .load-turitop con !important */
@media (max-width: 480px) {
  .cm__flamenco-hero-widget,
  .cm__flamenco-hero-widget .load-turitop {
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch;
  }
}

/* v1.20.3 — fix ancho caja reserva en movil: width:100% estaba limitado a >=1025px, asi
   que la caja se encogia y se alineaba a la izquierda en movil. Forzamos ancho completo
   en <=1024px. El scroll v1.20.2 se mantiene como red de seguridad en pantallas <380px. */
@media (max-width: 1024px) {
  .cm__flamenco-hero-booking {
    width: 100%;
    max-width: 100%;
    justify-self: stretch;
    margin-left: 0;
    margin-right: 0;
  }
}

/* =====================================================
   v1.20.4 — Fix causa raiz: el grid del bloque flamenco seguia en 2 columnas en movil
   porque la regla base grid-template-columns:1fr 1fr (mas abajo en el archivo) ganaba por
   orden de cascada a la media query que lo ponia en 1fr. La caja de reserva vivia en una
   columna del 50% (media pantalla); width:100% no servia (100% de 50% = 50%). Forzamos 1
   columna con !important y la tarjeta + widget TuriTop a todo el ancho. Sustituye en la
   practica a los intentos v1.20.1/.2/.3.
   ===================================================== */
@media (max-width: 1024px) {
  .cm__flamenco-hero-container {
    grid-template-columns: minmax(0, 1fr) !important;
    width: 100%;
    max-width: 100%;
  }
  .cm__flamenco-hero-text,
  .cm__flamenco-hero-booking {
    width: 100%;
    max-width: 100%;
    min-width: 0;
    justify-self: stretch;
  }
  .cm__flamenco-hero-booking {
    order: -1;
  }
}
@media (max-width: 480px) {
  .cm__flamenco-hero-booking {
    padding-left: 10px;
    padding-right: 10px;
    box-sizing: border-box;
  }
  .cm__flamenco-hero-widget {
    width: 100%;
    max-width: 100%;
    min-width: 0;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    box-sizing: border-box;
  }
  #cm-turitop-flamenco,
  #cm-turitop-flamenco > div,
  #cm-turitop-flamenco > div > div,
  #cm-turitop-flamenco > div > div > div {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
  }
  #cm-turitop-flamenco iframe {
    width: 100% !important;
    max-width: 100% !important;
  }
}
@media (max-width: 360px) {
  .cm__flamenco-hero-booking {
    padding-left: 6px;
    padding-right: 6px;
  }
  .cm__flamenco-hero-booking-head h3 {
    font-size: 20px;
  }
}

/* =====================================================
   v1.20.5 — Galeria flamenco 2x2: altura uniforme.
   La galeria --four debe mostrar 4 tarjetas iguales en 2 columnas. Reglas genericas de
   nth-child (span 2 / aspect 8:5) se colaban y dejaban hueco abajo-derecha. Forzamos las 4
   fotos de --four a la MISMA proporcion 4:5 y object-fit:cover. No se toca HTML.
   ===================================================== */
.cm__flamenco-gallery-grid--four {
  align-items: stretch;
}
.cm__flamenco-gallery-grid--four > .cm__flamenco-photo {
  grid-column: auto !important;
  aspect-ratio: 4 / 5 !important;
  width: 100%;
  height: auto !important;
  min-height: 0;
  align-self: stretch;
}
.cm__flamenco-gallery-grid--four > .cm__flamenco-photo img {
  width: 100%;
  height: 100% !important;
  object-fit: cover;
  display: block;
}

/* =====================================================
   v1.21.0 → Hero a imagen única: refinamiento visual
   El hero deja de ser split barra/bailaora. Se eliminan el overlay de
   costura central y los parches de la mitad flamenco (v1.20.7/v1.20.8).
   Overlay único con viñeta suave para legibilidad del texto. Se conservan
   la sombra premium del título y la caja del tagline.
   ===================================================== */

/* Overlay único: viñeta radial suave (centrada algo arriba, sobre la cara)
   + degradado vertical para legibilidad. Sin costura central. */
.cm__hero-bg::after {
  background:
    radial-gradient(120% 90% at 50% 32%,
      rgba(0,0,0,0.00) 38%,
      rgba(0,0,0,0.30) 100%),
    linear-gradient(180deg,
      rgba(0,0,0,.20) 0%,
      rgba(0,0,0,.30) 52%,
      rgba(10,10,10,.70) 100%);
}

/* Imagen única: bajamos un pelín la intensidad para que no compita con el
   título. El encuadre lo aporta .cm__hero-img--main / --cante (regla base). */
.cm__hero-img--main {
  filter: brightness(0.92) saturate(0.95) contrast(0.99);
}

/* Título: sombra premium (se mantiene de v1.20.7). */
.cm__hero-title {
  text-shadow:
    0 8px 26px rgba(0,0,0,.62),
    0 2px 6px rgba(0,0,0,.48);
}

/* Tagline: caja premium (se mantiene de v1.20.7). Desktop conserva su padding.
   La compactación móvil (v1.21.1) se centraliza AQUÍ — único punto efectivo del
   tagline por orden de cascada — con UNA sola declaración de cada propiedad, para
   no dejar duplicados/muertos en los bloques @media de más arriba. */
.cm__hero-tagline {
  max-width: 640px;
  background: rgba(8, 8, 8, 0.62);
  border: 1px solid rgba(212,175,55,0.16);
  box-shadow: 0 12px 36px rgba(0,0,0,0.28);
  padding: 10px 24px;
}

@media (max-width: 768px) {
  .cm__hero-bg::after {
    background:
      radial-gradient(130% 80% at 50% 30%,
        rgba(0,0,0,0.00) 40%,
        rgba(0,0,0,0.32) 100%),
      linear-gradient(180deg,
        rgba(0,0,0,.22) 0%,
        rgba(0,0,0,.32) 46%,
        rgba(10,10,10,.76) 100%);
  }
  /* v1.21.1: tagline compactado (no oculto), texto completo y legible. Pesa menos
     sobre el centro sin tapar cara/mantón. */
  .cm__hero-tagline {
    max-width: calc(100vw - 32px);
    padding: 7px 16px;
    margin: 10px auto 18px;
    font-size: 1.02rem;
    line-height: 1.35;
  }
}

@media (max-width: 480px) {
  .cm__hero-tagline {
    padding: 6px 14px;
    margin: 8px auto 15px;
    font-size: 0.92rem;
    line-height: 1.3;
  }
}