.queseo-promo {
  --q-bg: #0c1530;
  --q-fg: #f7f9ff;
  --q-muted: #c6d1eb;
  --q-stroke: #263c72;
  --q-button: #f1f5ff;
  --q-button-text: #112346;
  --q-serif: Lora, Georgia, serif;
  --q-sans: Manrope, system-ui, -apple-system, "Segoe UI", sans-serif;
  position: relative;
  isolation: isolate;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(92px, 32%);
  align-items: center;
  box-sizing: border-box;
  width: 100%;
  overflow: hidden;
  border: 1px solid var(--q-stroke);
  border-radius: 12px;
  background: var(--q-bg);
  color: var(--q-fg);
  text-decoration: none;
  font: 400 15px/1.45 var(--q-sans);
}

.queseo-promo *,
.queseo-promo *::before,
.queseo-promo *::after {
  box-sizing: border-box;
}

.queseo-promo:is(:visited, :hover, :active) {
  color: var(--q-fg);
  text-decoration: none;
}

.queseo-promo:focus-visible {
  outline: 3px solid #245cf4;
  outline-offset: 3px;
}

.queseo-promo__content {
  position: relative;
  z-index: 1;
  display: grid;
  justify-items: start;
  align-content: center;
  gap: 9px;
  min-width: 0;
  padding: 20px 0 20px 24px;
}

.queseo-promo__brand {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 7px 11px;
}

.queseo-promo img.queseo-promo__logo {
  display: block;
  width: 84px;
  height: auto;
  max-width: 100%;
  margin: 0;
  border: 0;
  border-radius: 0;
}

.queseo-promo__label {
  display: block;
  color: var(--q-muted);
  font: 700 10px/1.4 var(--q-sans);
  letter-spacing: .105em;
  text-transform: uppercase;
}

.queseo-promo__title {
  display: block;
  margin: 0;
  color: var(--q-fg);
  font: 700 clamp(24px, 3.25vw, 35px)/1.1 var(--q-serif);
  letter-spacing: -.035em;
  overflow-wrap: break-word;
  text-wrap: balance;
}

.queseo-promo__description {
  display: block;
  max-width: 46ch;
  margin: 0;
  color: var(--q-muted);
  font: 400 14px/1.45 var(--q-sans);
}

.queseo-promo__cta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 36px;
  margin-top: 3px;
  padding: 7px 11px;
  border-radius: 6px;
  background: var(--q-button);
  color: var(--q-button-text);
  font: 700 13px/1.25 var(--q-sans);
  text-align: left;
}

.queseo-promo:hover .queseo-promo__cta {
  text-decoration: underline;
  text-underline-offset: 2px;
}

.queseo-promo__arrow {
  flex: none;
  display: block;
  width: 16px;
  height: 16px;
}

.queseo-promo__art {
  position: relative;
  display: grid;
  align-self: stretch;
  place-items: center;
  min-width: 0;
  margin: 0;
  overflow: hidden;
}

.queseo-promo__art::before {
  position: absolute;
  z-index: -1;
  inset: 0;
  background:
    radial-gradient(ellipse at center, var(--q-glow, #254fb262), transparent 68%),
    repeating-linear-gradient(0deg, transparent 0 22px, var(--q-grid, #8ba9ff27) 22px 23px),
    repeating-linear-gradient(90deg, transparent 0 22px, var(--q-grid, #8ba9ff27) 22px 23px);
  mask-image: radial-gradient(ellipse at center, #000 24%, transparent 74%);
  content: "";
}

.queseo-promo img.queseo-promo__illustration {
  display: block;
  width: min(100%, var(--q-art-size, 218px));
  height: auto;
  max-width: 100%;
  margin: 0;
  object-fit: contain;
}

.queseo-promo__sr {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
}

.queseo-promo--home {
  --q-bg: radial-gradient(ellipse at 90% 24%, #202e69 0%, #111c42 42%, #0b132b 74%);
  --q-button: #c83a19;
  --q-button-text: #fff;
  --q-art-size: 296px;
  --q-glow: #4e68df81;
  grid-template-columns: minmax(0, 58%) minmax(0, 42%);
  min-height: 312px;
  border-radius: 14px;
}

.queseo-promo--home .queseo-promo__content {
  gap: 11px;
  padding: 25px 0 25px clamp(22px, 4vw, 52px);
}

.queseo-promo--home img.queseo-promo__logo {
  width: 111px;
}

.queseo-promo--home .queseo-promo__title {
  max-width: 20ch;
  font-size: clamp(34px, 5vw, 53px);
}

.queseo-promo__accent {
  display: block;
  color: #adc3ff;
}

.queseo-promo--home img.queseo-promo__illustration {
  position: relative;
  z-index: 1;
  margin: 36px 15% 0 0;
}

.queseo-promo--home img.queseo-promo__tarot {
  position: absolute;
  top: 3%;
  right: 8%;
  width: min(43%, 187px);
  height: auto;
  margin: 0;
}

.queseo-promo--home .queseo-promo__description {
  font-size: 15px;
}

.queseo-promo--home .queseo-promo__cta {
  min-height: 40px;
  padding-inline: 14px;
}

.queseo-promo--evento {
  --q-bg: linear-gradient(115deg, #f3f6ff 14%, #e5edff 100%);
  --q-fg: #111d39;
  --q-muted: #3e5076;
  --q-stroke: #c8d6f3;
  --q-button: #173caa;
  --q-button-text: #fff;
  --q-glow: #afc9ffcb;
  --q-grid: #6f8fce44;
  --q-art-size: 181px;
  min-height: 170px;
}

.queseo-promo--categoria {
  --q-bg: linear-gradient(112deg, #0c1737 32%, #183583 100%);
  --q-stroke: #25438d;
  --q-button: #bcd7ff;
  --q-button-text: #10274e;
  --q-art-size: 128px;
  min-height: 174px;
}

.queseo-promo:is(.queseo-promo--evento, .queseo-promo--categoria) .queseo-promo__title {
  font-size: clamp(23px, 4.15vw, 31px);
}

.queseo-promo--ubicacion {
  --q-bg: linear-gradient(155deg, #fffaf0, #f3ede0);
  --q-fg: #15213a;
  --q-muted: #45516b;
  --q-stroke: #e2d8c7;
  --q-button: #18284c;
  --q-button-text: #fff;
  --q-art-size: 90px;
  --q-grid: #7899e051;
  --q-glow: #cad7f393;
  display: block;
  min-height: 254px;
  max-width: 360px;
}

.queseo-promo--ubicacion .queseo-promo__content {
  gap: 10px;
  padding: 19px 18px 18px;
}

.queseo-promo--ubicacion .queseo-promo__brand {
  align-content: start;
  flex-direction: column;
  align-items: start;
  gap: 9px;
  min-height: 72px;
}

.queseo-promo--ubicacion .queseo-promo__title {
  font-size: 27px;
  text-wrap: initial;
}

.queseo-promo--ubicacion .queseo-promo__art {
  position: absolute;
  z-index: 0;
  top: 1px;
  right: 3px;
  width: 46%;
  height: 100px;
}

.queseo-promo:is(.queseo-promo--categoria, .queseo-promo--ubicacion) img.queseo-promo__illustration {
  image-rendering: pixelated;
}

.queseo-promo--calendario {
  --q-bg: #f0f4ff;
  --q-fg: #182745;
  --q-muted: #405b8e;
  --q-stroke: #c7d5f4;
  --q-button: #1842b0;
  --q-button-text: #fff;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
  min-height: 62px;
  padding: 9px 10px 9px 13px;
  border-left: 3px solid #2157dc;
  border-radius: 8px;
}

.queseo-promo--calendario .queseo-promo__content {
  gap: 2px;
  padding: 0;
}

.queseo-promo--calendario .queseo-promo__brand {
  gap: 3px 6px;
}

.queseo-promo--calendario img.queseo-promo__logo {
  width: 63px;
}

.queseo-promo--calendario .queseo-promo__label {
  font-size: 9px;
}

.queseo-promo--calendario .queseo-promo__title {
  font: 700 15px/1.2 var(--q-sans);
  letter-spacing: -.018em;
  text-wrap: initial;
}

.queseo-promo--calendario .queseo-promo__cta {
  min-height: 34px;
  margin: 0;
  font-size: 12px;
}

.queseo-promo--movil {
  --q-bg: linear-gradient(125deg, #0c1630 20%, #1a398c 100%);
  --q-stroke: #2d4eaa;
  --q-button: #bfeaff;
  --q-button-text: #09254a;
  --q-art-size: 72px;
  --q-glow: #6184f77a;
  display: block;
  min-height: 183px;
  max-width: 480px;
}

.queseo-promo--movil .queseo-promo__content {
  width: 66%;
  gap: 8px;
  padding: 15px 0 15px 16px;
}

.queseo-promo--movil .queseo-promo__title {
  max-width: 14ch;
  font-size: 29px;
  text-wrap: initial;
}

.queseo-promo--movil .queseo-promo__description {
  font-size: 13px;
}

.queseo-promo--movil .queseo-promo__art {
  position: absolute;
  z-index: 0;
  right: 1px;
  bottom: 0;
  width: 37%;
  height: 100%;
}

.queseo-promo--movil .queseo-promo__cta {
  min-height: 36px;
}

@media (max-width: 640px) {
  .queseo-promo--solo-escritorio {
    display: none;
  }

  .queseo-promo--home {
    --q-art-size: 128px;
    grid-template-columns: minmax(0, 68%) minmax(0, 32%);
    min-height: 0;
  }

  .queseo-promo--home .queseo-promo__content {
    gap: 8px;
    padding: 18px 0 18px 15px;
  }

  .queseo-promo--home img.queseo-promo__logo {
    width: 93px;
  }

  .queseo-promo--home img.queseo-promo__illustration {
    margin: 20px 0 0;
  }

  .queseo-promo--home img.queseo-promo__tarot {
    top: 6%;
    right: 3%;
    width: 70%;
    max-width: 88px;
  }

  .queseo-promo--home .queseo-promo__title {
    font-size: clamp(24px, 6.4vw, 34px);
  }

  .queseo-promo--home .queseo-promo__description {
    font-size: 13px;
  }

  .queseo-promo:is(.queseo-promo--evento, .queseo-promo--categoria) .queseo-promo__content {
    padding: 15px 0 15px 15px;
  }

  .queseo-promo:is(.queseo-promo--evento, .queseo-promo--categoria) .queseo-promo__description {
    font-size: 13px;
  }

  .queseo-promo--movil .queseo-promo__title {
    font-size: clamp(24px, 7.3vw, 29px);
  }
}

@media (min-width: 641px) {
  .queseo-promo--solo-movil {
    display: none;
  }
}

/* El banner es un elemento con role="link" y el destino en base64 (ver Frontend/Banners.php). */
.queseo-promo { cursor: pointer; margin-block: 24px; }
.queseo-promo--calendario { margin-block: 12px 0; }
.qse-lateral .queseo-promo--ubicacion { margin-block: 0 24px; }