/* ===================================================================
   GamingCity x Logitech — Mes del Programador 2026
   v4 — 2026-09-04
   CAMBIOS v4 (pedidos explícitos de David, revisión de estructura):
   - Cobrand: agregado lockup de logos reales (GamingCity + Logitech G) en
     el hero, en reemplazo del texto "GamingCity x Logitech" solo. Principio:
     Cialdini/Autoridad — el logo real de ambas marcas es una señal de
     legitimidad más fuerte que el nombre en texto, sobre todo en una pieza
     que ya está imitando la estética de Logitech (menos margen para que se
     lea como "genérico hecho por GamingCity").
   - Trust bar: reubicada de arriba del todo (entre hero y steps) a justo
     antes del CTA "Registrar mi compra" en Premios. Antes interrumpía el
     relato (oferta -> confianza -> cómo participar) sin resolver ninguna
     objeción en ese punto. LIFT/Anxiety: las señales de confianza rinden
     más pegadas al momento de la decisión/click, no siete scrolls antes.
   - Carruseles: ancho máximo 1400px centrado en desktop (antes ocupaban
     el 100% del viewport, se veían desproporcionados vs. el resto de
     secciones que sí tienen max-width). Se aplica al contenedor interno
     (`.contenedor-proyector`), no al wrapper `.cont_proy`, para que el
     fondo oscuro siga sangrando borde a borde y solo el contenido quede
     centrado — mismo patrón que usa el resto del sitio real de Logitech
     (secciones full-bleed con contenido centrado adentro).
   - `.bck_proy`: Tornado le pone `margin: 45px 0 20px` por default. Se
     neutraliza a 0 (pedido de David) porque generaba espacios en blanco
     entre el final de Steps y el arranque del primer carrusel, y entre
     ambos carruseles, rompiendo la continuidad visual de fondo oscuro
     que es el punto central de esta pieza.
   - Prizes: sumado un párrafo de introducción (antes el bloque arrancaba
     directo en las 3 cards sin decir cuántos premios hay ni qué incluyen)
     y reescrita la descripción de cada card, que terminaba en una oración
     inconclusa ("...suscripción anual a" + logo como si fuera la última
     palabra). MECLABS/Clarity: una oración que no cierra obliga a releer
     para entender qué se gana.
   - Stickybar: agregada al pie, oculta hasta que el hero (que ya tiene el
     mismo CTA) sale de vista, y se autodesactiva cuando termina la promo
     (reusa GC_MXC_END). Mismo patrón que la stickybar de
     [[project_logitechg_dealdays_landing]]. Fogg/Trigger: mantiene el
     camino a "registrar mi compra" a un tap de distancia durante todo el
     scroll, sin duplicar el CTA que ya se ve en el hero.

   v3 — 2026-09-04
   EXCEPCION DE PALETA (deliberada, acotada a esta pieza, pedida por David):
   esta landing NO usa navy/cyan de GamingCity. Usa la identidad real de
   promoslogitech.com/mes-programador (tomada con getComputedStyle sobre
   la página oficial), para que se lea como una pieza hecha por Logitech:
     - fondo base:      #050508 (casi negro)
     - negro puro:       #000000 (cards, pills de número)
     - acento (su "lime"): #00FDCF
     - blanco:           #ffffff
   Tipografía: se mantiene Inter (no se tocó, Logitech usa una fuente
   propia con licencia, no corresponde adoptarla).
   Formas: cards de borde recto (sin redondeo), botones en pastilla
   (border-radius:999px), igual que el sitio real de Logitech.

   AJUSTES v3 (2026-09-04) — re-medición en vivo de promoslogitech.com,
   cada uno grounded en el valor real medido, no en gusto:
   - h2 de sección (Premios/Steps/FAQ): el sitio real usa uppercase +
     letter-spacing:1px en TODOS sus H2 (medido: 39-40px desktop,
     letter-spacing 1px). Antes yo tenía uppercase sin letter-spacing.
     Efecto CRO: closing del gap de "esto no es de Logitech" — LIFT/
     Credibility, el ojo entrenado en la estética real detecta ausencia
     de tracking en mayúsculas como señal de imitación.
   - Títulos de card premio: real mide letter-spacing 1.44px en
     `.premios__card-title`. Sumé letter-spacing proporcional a
     `.gc-mxc-prize-title` y `.gc-mxc-step-title` por consistencia
     tipográfica entre secciones (mismo principio, LIFT/Credibility).
   - CTAs en pastilla: el sitio real tiene un glow lime sutil
     (box-shadow 0 0 ~1.5px rgba(lime,.3)) en sus `<a>` con fondo lime.
     Lo sumé a los CTA primarios y al badge de días restantes. Efecto:
     Fogg/Trigger — aumenta la saliencia del control accionable sin
     agregar otro color o texto.
   - `.gc-mxc-prize-inner`: el padding real de `.premios__card-inner`
     es 10px 8px 12px (más compacto que mi 16px 14px 18px). Lo ajusté
     a 14px 12px 16px: me acerco al real pero sin llegar al valor exacto
     porque mi card carga más texto (título + desc + logo partner) que
     la real (solo imagen); copiar el padding exacto generaría overflow
     de texto contra el borde.
   - `.gc-mxc-highlight` (span destacado del H1): el real mide padding
     asimétrico 4.48px/11.2px/6.4px (compensación óptica de línea de
     base). Ajustado a 3px 10px 5px por el mismo motivo tipográfico,
     no por gusto.
   - `h2.gc-mxc-prizes-title/steps-title/faq-title`: agregado
     `!important` explícito (pedido de David — hay una regla del tema
     de Tornado con más especificidad que está ganando en producción
     y pisando el color blanco).
   - `.reseñas`: pedido de David, fondo #050508. OJO: esta clase no
     tiene el prefijo `gc-mxc-`, por lo que si este CSS se carga a
     nivel sitio (no solo en esta landing) va a oscurecer el módulo de
     reseñas en TODO el sitio, no solo acá. Si el archivo está scopeado
     a esta página en Tornado, no hay problema; si no, avisame.

   PENDIENTE ANTES DE PUBLICAR:
   - Confirmar con Beatriz (Logitech) la composición real de premios
     (ver nota en bloque-2, sección .gc-mxc-prizes).
   =================================================================== */

:root {
  --lg-bg: #050508;
  --lg-black: #000000;
  --lg-lime: #00fdcf;
  --lg-white: #ffffff;
  --lg-white-85: rgba(255, 255, 255, 0.85);
  --lg-white-65: rgba(255, 255, 255, 0.65);
  --lg-border: rgba(0, 253, 207, 0.35);
}

.gc-mxc-hero,
.gc-mxc-offer,
.gc-mxc-trust,
.gc-mxc-steps,
.gc-mxc-prizes,
.gc-mxc-faq,
.gc-mxc-legal {
  font-family: 'Inter', Arial, sans-serif;
  box-sizing: border-box;
  background: var(--lg-bg);
}

.gc-mxc-hero *,
.gc-mxc-offer *,
.gc-mxc-trust *,
.gc-mxc-steps *,
.gc-mxc-prizes *,
.gc-mxc-faq *,
.gc-mxc-legal * {
  box-sizing: border-box;
}

/* ---------- Hero ---------- */
.gc-mxc-hero {
  padding: 40px 20px;
  border-bottom: 1px solid var(--lg-border);
}
.gc-mxc-hero-inner {
  max-width: 900px;
  margin: 0 auto;
  text-align: center;
}
.gc-mxc-cobrand {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 14px;
  margin: 0 0 18px;
}
.gc-mxc-cobrand-logo {
  height: 55px;
  width: auto;
  display: block;
}
.gc-mxc-cobrand-logo-lg {
  height: 50px;
}
.gc-mxc-cobrand-x {
  color: var(--lg-lime);
  font-size: 14px;
  font-weight: 700;
}
.gc-mxc-kicker {
  color: var(--lg-white-65);
  font-size: 12px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  margin: 0 0 14px;
}
.gc-mxc-h1 {
  color: var(--lg-white);
  font-size: 28px;
  line-height: 1.35;
  font-weight: 800;
  margin: 0 0 16px;
}
.gc-mxc-highlight {
  display: inline-block;
  background: var(--lg-lime);
  color: var(--lg-black);
  padding: 3px 10px 5px;
  font-weight: 800;
}
.gc-mxc-sub {
  color: var(--lg-white-85);
  font-size: 16px;
  line-height: 1.5;
  max-width: 680px;
  margin: 0 auto 18px;
}
.gc-mxc-days-left {
  display: inline-block;
  background: transparent;
  color: var(--lg-lime);
  border: 1px solid var(--lg-lime);
  border-radius: 999px;
  padding: 6px 16px;
  font-size: 13px;
  font-weight: 700;
  margin: 0 0 26px;
  box-shadow: 0 0 6px rgba(0, 253, 207, 0.3);
}
.gc-mxc-hero-ctas {
  display: flex;
  flex-direction: column;
  gap: 12px;
  align-items: center;
}
.gc-mxc-cta {
  display: inline-block;
  text-decoration: none;
  font-weight: 700;
  font-size: 14px;
  padding: 14px 26px;
  border-radius: 999px;
  border: 1px solid transparent;
  width: 100%;
  max-width: 380px;
  text-align: center;
}
.gc-mxc-cta-primary {
  background: var(--lg-lime);
  color: var(--lg-black);
  box-shadow: 0 0 6px rgba(0, 253, 207, 0.35);
}
.gc-mxc-cta-secondary {
  background: transparent;
  color: var(--lg-lime);
  border-color: var(--lg-lime);
  text-transform: uppercase;
  letter-spacing: 0.03em;
}
.gc-mxc-hero.gc-mxc-ended .gc-mxc-hero-ctas { display: none; }

/* ---------- Offer strip ---------- */
.gc-mxc-offer {
  background: var(--lg-lime);
  padding: 16px 20px;
}
.gc-mxc-offer-inner {
  max-width: 900px;
  margin: 0 auto;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 10px;
  text-align: center;
}
.gc-mxc-offer-tag {
  background: var(--lg-black);
  color: var(--lg-lime);
  font-size: 11px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  padding: 4px 10px;
}
.gc-mxc-offer-text {
  color: var(--lg-black);
  font-size: 15px;
  font-weight: 700;
  margin: 0;
}

/* ---------- Trust bar (reubicada en v4: antes del CTA de Premios) ---------- */
.gc-mxc-trust {
  padding: 8px 0 28px;
  text-align: left;
}
.gc-mxc-trust-inner {
  max-width: 900px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1fr;
  gap: 12px;
}
.gc-mxc-trust-item {
  display: flex;
  flex-direction: column;
  gap: 2px;
  padding: 14px;
  background: var(--lg-black);
  border: 1px solid var(--lg-border);
}
.gc-mxc-trust-label {
  color: var(--lg-white);
  font-weight: 700;
  font-size: 14px;
}
.gc-mxc-trust-desc {
  color: var(--lg-white-65);
  font-size: 13px;
}

/* ---------- Steps ---------- */
.gc-mxc-steps {
  padding: 44px 20px;
}
.gc-mxc-steps-inner {
  max-width: 1100px;
  margin: 0 auto;
}
.gc-mxc-steps-title {
  color: var(--lg-white) !important;
  font-size: 22px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  text-align: center;
  margin: 0 0 28px;
}
.gc-mxc-steps-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 14px;
}
.gc-mxc-step {
  background: var(--lg-black);
  border: 1px solid var(--lg-lime);
  padding: 20px;
}
.gc-mxc-step-num {
  display: inline-block;
  color: var(--lg-black);
  background: var(--lg-lime);
  font-weight: 800;
  font-size: 13px;
  padding: 2px 10px;
  margin-bottom: 12px;
}
.gc-mxc-step-title {
  color: var(--lg-white);
  font-size: 17px;
  font-weight: 700;
  letter-spacing: 0.04em;
  margin: 0 0 6px;
}
.gc-mxc-step-desc {
  color: var(--lg-white-65);
  font-size: 14px;
  line-height: 1.5;
  margin: 0;
}

/* ---------- Prizes ---------- */
.gc-mxc-prizes {
  padding: 44px 20px;
}
.gc-mxc-prizes-inner {
  max-width: 1100px;
  margin: 0 auto;
  text-align: center;
}
.gc-mxc-prizes-title {
  color: var(--lg-white) !important;
  font-size: 22px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  margin: 0 0 12px;
}
.gc-mxc-prizes-intro {
  color: var(--lg-white-85);
  font-size: 15px;
  line-height: 1.5;
  max-width: 560px;
  margin: 0 auto 28px;
}
.gc-mxc-prizes-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 18px;
  margin-bottom: 24px;
}
.gc-mxc-prize-card {
  text-align: left;
}
.gc-mxc-prize-num {
  display: inline-block;
  background: var(--lg-lime);
  color: var(--lg-black);
  font-weight: 800;
  font-size: 13px;
  padding: 2px 10px;
  margin-bottom: -1px;
  position: relative;
  z-index: 1;
}
.gc-mxc-prize-inner {
  background: var(--lg-black);
  border: 1px solid var(--lg-lime);
  padding: 14px 12px 16px;
}
.gc-mxc-prize-img {
  width: 100%;
  height: auto;
  display: block;
  margin: 0 0 14px;
}
.gc-mxc-prize-title {
  color: var(--lg-white);
  font-weight: 800;
  font-size: 16px;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  margin: 0 0 6px;
}
.gc-mxc-prize-desc {
  color: var(--lg-white-65);
  font-size: 13px;
  line-height: 1.5;
  margin: 0 0 14px;
}
.gc-mxc-prize-partner {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 6px 8px;
  padding-top: 12px;
  border-top: 1px solid var(--lg-border);
}
.gc-mxc-prize-partner-label {
  color: var(--lg-white-65);
  font-size: 11px;
  line-height: 1.3;
}
/* El logo de Digital House One es un wordmark muy apaisado (ratio ~16:1).
   Con height fijo + width:auto, un <img> dentro de un flex row respeta un
   min-width automático igual a su ancho intrínseco (~295px a 18px de alto):
   por diseño de flexbox, ese mínimo gana por sobre flex-shrink, así que el
   logo nunca se achicaba y desbordaba la card. Pasaba justo entre 768px y
   ~1146px de ancho de pantalla porque ahí la grilla de premios ya está en
   3 columnas (min-width:768px) pero el contenedor todavía no llegó a su
   tope de 1100px (que se alcanza recién ~1146px de viewport): en ese rango
   cada card mide entre ~200 y ~330px, insuficiente para "etiqueta + logo"
   uno al lado del otro. El logo desbordaba la card hacia la derecha sin
   quedar recortado por ningún overflow:hidden, así que estiraba el ancho
   real de la página y dejaba un área en blanco a la derecha del contenido
   (LIFT: Claridad — un elemento que se sale de su tarjeta rompe la
   credibilidad visual del co-branding, más allá de si el usuario nota el
   scroll horizontal o no).
   Fix: min-width:0 anula ese mínimo automático y deja que flex-shrink
   actúe; flex-wrap permite que el logo baje de línea cuando no entra al
   lado de la etiqueta, y width/height en auto lo redimensiona manteniendo
   su proporción real (nunca se ve estirado ni recortado). */
.gc-mxc-prize-partner-logo {
  height: 18px;
  width: auto;
  max-width: 100%;
  min-width: 0;
  flex-shrink: 1;
  display: block;
}
.gc-mxc-prizes-extra {
  color: var(--lg-white-85);
  font-size: 14px;
  max-width: 620px;
  margin: 0 auto 26px;
}

/* ---------- FAQ (acordeón CSS puro, sin JS) ---------- */
.gc-mxc-faq {
  padding: 44px 20px;
}
.gc-mxc-faq-inner {
  max-width: 800px;
  margin: 0 auto;
}
.gc-mxc-faq-title {
  color: var(--lg-white) !important;
  font-size: 22px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  text-align: center;
  margin: 0 0 26px;
}
.gc-mxc-faq-item {
  border: 1px solid var(--lg-border);
  margin-bottom: 10px;
  overflow: hidden;
}
.gc-mxc-faq-toggle {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}
.gc-mxc-faq-q {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 14px 16px;
  color: var(--lg-white);
  font-weight: 700;
  font-size: 15px;
  cursor: pointer;
}
.gc-mxc-faq-icon {
  flex-shrink: 0;
  color: var(--lg-lime);
  font-weight: 800;
  font-size: 18px;
  transition: transform 0.2s ease;
}
.gc-mxc-faq-a {
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.25s ease;
  padding: 0 16px;
}
.gc-mxc-faq-a p {
  color: var(--lg-white-65);
  font-size: 14px;
  line-height: 1.6;
  margin: 0 0 14px;
}
.gc-mxc-faq-toggle:checked ~ .gc-mxc-faq-a {
  max-height: 300px;
}
.gc-mxc-faq-toggle:checked ~ .gc-mxc-faq-q .gc-mxc-faq-icon {
  transform: rotate(45deg);
}

/* ---------- Legal ---------- */
.gc-mxc-legal {
  padding: 20px;
  border-top: 1px solid var(--lg-border);
}
.gc-mxc-legal-inner {
  max-width: 800px;
  margin: 0 auto;
  text-align: center;
}
.gc-mxc-legal-inner p {
  color: var(--lg-white-65);
  font-size: 12px;
  line-height: 1.5;
  margin: 0;
}

/* ---------- Stickybar (pedida por David, mismo patrón que Deal Days) ---------- */
.gc-mxc-stickybar {
  font-family: 'Inter', Arial, sans-serif;
  box-sizing: border-box;
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 999;
  background: var(--lg-black);
  border-top: 1px solid var(--lg-lime);
  transform: translateY(100%);
  transition: transform 0.25s ease;
}
.gc-mxc-stickybar * {
  box-sizing: border-box;
}
.gc-mxc-stickybar.gc-mxc-stickybar-visible {
  transform: translateY(0);
}
.gc-mxc-stickybar.gc-mxc-ended {
  display: none;
}
.gc-mxc-stickybar-inner {
  max-width: 1100px;
  margin: 0 auto;
  padding: 10px 16px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}
.gc-mxc-stickybar-text {
  color: var(--lg-white);
  font-size: 12px;
  line-height: 1.3;
}
.gc-mxc-stickybar-days {
  color: var(--lg-lime);
  font-weight: 800;
}
.gc-mxc-stickybar-sep {
  color: var(--lg-white-65);
  margin: 0 4px;
}
.gc-mxc-stickybar-msg {
  display: none;
}
.gc-mxc-stickybar-cta {
  flex-shrink: 0;
  width: auto;
  max-width: none;
  padding: 9px 16px;
  font-size: 12px;
}

/* ---------- Overrides carrusel nativo (notaId reales, los 2 que armó David) ---------- */
.cont_proy.cat_nota-25-1,
.cont_proy.cat_nota-26-2 {
  background: var(--lg-bg) !important;
  overflow-x: hidden !important;
}
.cont_proy.cat_nota-25-1 .bck_proy,
.cont_proy.cat_nota-26-2 .bck_proy {
  margin: 0 !important;
}
.cont_proy.cat_nota-25-1 .contenedor-proyector,
.cont_proy.cat_nota-26-2 .contenedor-proyector {
  max-width: 1400px;
  margin-left: auto !important;
  margin-right: auto !important;
}
.cont_proy.cat_nota-25-1 .owl-controls,
.cont_proy.cat_nota-26-2 .owl-controls {
  position: absolute !important;
  top: 50%;
  left: -45px;
  width: 105%;
  transform: translateY(-50%);
}
.cont_proy.cat_nota-25-1 .owl-prev i,
.cont_proy.cat_nota-25-1 .owl-next i,
.cont_proy.cat_nota-26-2 .owl-prev i,
.cont_proy.cat_nota-26-2 .owl-next i {
  color: var(--lg-lime) !important;
}
.cont_proy.cat_nota-25-1 .product,
.cont_proy.cat_nota-26-2 .product {
  background: var(--lg-black) !important;
  border: 1px solid var(--lg-lime) !important;
}
.cont_proy.cat_nota-25-1 .btn-compra,
.cont_proy.cat_nota-26-2 .btn-compra {
  background: var(--lg-lime) !important;
  color: var(--lg-black) !important;
  border-radius: 999px !important;
  font-weight: 700 !important;
}
.cont_proy.cat_nota-25-1 h5.title-sol,
.cont_proy.cat_nota-25-1 h5.title-sol span,
.cont_proy.cat_nota-25-1 h2.titulopromocionallogitech,
.cont_proy.cat_nota-26-2 h5.title-sol,
.cont_proy.cat_nota-26-2 h5.title-sol span,
.cont_proy.cat_nota-26-2 h2.titulopromocionallogitech {
  color: var(--lg-white) !important;
}
/* BUG REAL confirmado en vivo (gamingcity.com.ar, 2026-09-04): el título de
   cada carrusel vive en un <h2 class="titulopromocionallogitech"> anidado
   DENTRO del <span> de h5.title-sol, no en el span mismo. La regla anterior
   solo pisaba el span y el propio h2 seguía heredando el navy de marca
   (#051230) del tema de Tornado -> título ilegible sobre fondo casi negro.
   LIFT/Clarity: un texto ilegible no es un detalle estético, es una barrera
   de comprensión completa. */
/* Deja que el scroll del CTA "Ver productos MX participantes" (bloque-1) se
   frene con margen antes de tapar el título con el header sticky, sin
   depender de un offset en píxeles calculado a mano en JS (ver nota en el
   bloque-1 sobre por qué el cálculo manual fallaba en mobile). */
.cont_proy.cat_nota-25-1 h2.titulopromocionallogitech,
.cont_proy.cat_nota-26-2 h2.titulopromocionallogitech {
  scroll-margin-top: 110px;
}
.cont_proy.cat_nota-25-1 a.r-link,
.cont_proy.cat_nota-26-2 a.r-link {
  background: transparent !important;
  color: var(--lg-lime) !important;
  border: 1px solid var(--lg-lime) !important;
  font-weight: 700 !important;
}
/* El link nativo "Ver Más" (a.r-link) trae por defecto fondo blanco + texto
   navy + borde gris del tema de Tornado (pill nativo, no de esta campaña).
   Se reskinea a la misma pastilla lime-outline que el resto de los CTA
   secundarios de la pieza -> consistencia visual, no gusto nuevo. */
/* título del segundo carrusel ("Los más elegidos de Logitech G") funciona como
   segunda instancia de prueba social (Cialdini/Consenso) después del listado
   completo — separarlo con más aire evita que se lea como el mismo bloque.
   Nota 2026-09-04: el segundo carrusel (cat_nota-26-2) ya no está insertado
   en la página en vivo — David consolidó a un único carrusel con los 10 SKU
   reales de Serie MX. Dejo esta regla sin quitar por si lo vuelve a insertar;
   no hace nada mientras esa clase no exista en el DOM. */
.cont_proy.cat_nota-26-2 {
  margin-top: 32px;
}

/* Pedido de David: alinear a la izquierda el título del carrusel (por default
   heredaba text-align:center del tema en algunos anchos). Sin scopear a
   cat_nota-25-1 porque así me lo pasó -> ojo: h2.titulopromocionallogitech
   es una clase genérica de Tornado para carruseles promocionales de Logitech,
   no exclusiva de esta campaña. Si en algún momento conviven varias piezas
   Logitech con este tipo de carrusel en el sitio, esta regla las alinea a
   todas igual. Avisame si en algún momento no querés eso. */
h2.titulopromocionallogitech {
  text-align: start;
}

/* ---------- Utilitarias sitewide ya validadas en otras landings ---------- */
h2.titulo,
h1.copete,
p.verdoc,
span.stock,
h3.leyendaConStock,
span.favButton.favCaja,
.post-lead-image {
  display: none;
}

/* Pedido de David: fondo del módulo de reseñas en línea con la paleta oscura
   de esta campaña. Ver nota de riesgo de scope al inicio del archivo. */
.reseñas {
  background: var(--lg-bg);
}

/* ===================== Breakpoint: tablet / desktop ≥768px ===================== */
@media (min-width: 768px) {
  .gc-mxc-h1 { font-size: 38px; }
  .gc-mxc-sub { font-size: 17px; }
  .gc-mxc-hero-ctas { flex-direction: row; justify-content: center; }
  .gc-mxc-cta { width: auto; }

  .gc-mxc-trust-inner { grid-template-columns: repeat(4, 1fr); }

  .gc-mxc-steps-grid { grid-template-columns: repeat(3, 1fr); }

  .gc-mxc-prizes-grid { grid-template-columns: repeat(3, 1fr); }

  .cont_proy.cat_nota-25-1,
  .cont_proy.cat_nota-26-2 { overflow-x: visible !important; }

  .gc-mxc-stickybar-msg { display: inline; }
  .gc-mxc-stickybar-text { font-size: 13px; }

  .gc-mxc-cobrand-logo { height: 45px; }
  .gc-mxc-cobrand-logo-lg { height: 40px; }
}

@media (max-width: 767px) {
  .cont_proy.cat_nota-25-1 .owl-controls,
  .cont_proy.cat_nota-26-2 .owl-controls {
    position: relative !important;
    top: auto;
    left: 0;
    width: 100%;
    transform: none;
    margin-top: 12px;
  }
}


h2.titulopromocionallogitech {
    font-size: 25px;
}

a.r-link {
    margin-left: 10px;
}

@media screen and (min-width: 481px) and (max-width: 767px) {
.col-md-12.col-xs-12.cols-grals {
    padding: 0;
}}

.product button.btn.btn-primary.btn-compra {justify-self: center !important;}