/* CROWDS visual kit — aligned with Wedding CROWDS site tokens, content-agnostic */

:root {
  --ink: #0c0b09;
  --void: #0c0b09;
  --cream: #e3dbe3;
  /* Texto claro sobre fondos oscuros (deck / slides dark) — no usar en logo (bitmap) */
  --text-light: #d7dded;
  --pink: #fe83d3;
  --green: #1ec997;
  --green-bright: #aaff8f;
  --blue: #0c8ce9;
  --lime: #aaff8e;
  --dock-pill-active: #c597d8;
  --purple: #bcacff;
  --yellow: #fff36b;
  --paper: #e3dbe3;
  /* Reserva inferior (clearance del dock; sin scroll vertical en slides) */
  --page-safe-bottom: clamp(20px, 4vh, 40px);
  --deck-dock-height: 0px;
  --nucleo-chrome: clamp(56px, 9vh, 110px);
  /* Legacy: portada / utilidades */
  --deck-clearance: 180px;
  /* Escala de recuadros .exp-sticker (1 = base; slides 03 y 04 lo sobreescriben) */
  --exp-scale: 1;
  --exp-sticker-base: 300px;
  /* Grilla fija (html::before): slides con foto; base en slides sin foto */
  --deck-grid-line-base: rgba(72, 76, 90, 0.52);
  --deck-grid-line-photo: rgba(72, 76, 90, 0.26);
  --deck-grid-line-photo-strong: rgba(72, 76, 90, 0.4);
  --deck-grid-line-photo-subtle: rgba(72, 76, 90, 0.12);
}

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

html {
  -webkit-print-color-adjust: exact;
  print-color-adjust: exact;
}

body {
  margin: 0;
  width: 100%;
  overflow-x: hidden;
  font-family: "Archivo", system-ui, sans-serif;
  font-size: 15px;
  line-height: 1.5;
  color: var(--ink);
  background: var(--cream);
}

/* Type */
.t-display {
  font-family: "Bebas Neue", sans-serif;
  font-weight: 400;
  letter-spacing: -0.035em;
  line-height: 0.95;
  text-transform: uppercase;
}

.t-mono {
  font-family: "DM Mono", ui-monospace, monospace;
  font-size: 11px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

.t-lede {
  font-size: 18px;
  font-weight: 400;
  line-height: 1.45;
  max-width: 46ch;
}

.t-muted {
  color: rgba(12, 11, 9, 0.62);
}

@media (min-width: 900px) {
  .t-lede {
    font-size: clamp(18px, 1.35vw, 22px);
    max-width: min(62ch, 100%);
  }
}

html.deck-app,
html.deck-app body {
  height: 100%;
  --text-light: #ffffff;
}

html.deck-app body {
  overflow: hidden;
  background: var(--void);
  color: var(--text-light);
}

html.deck-app .page {
  --page-muted: #ffffff;
  --tag-stack-val: #ffffff;
  --case-meta: #ffffff;
  color: #ffffff;
}

html.deck-app .page .t-muted {
  color: #ffffff;
}

.skip-link {
  position: absolute;
  left: -9999px;
  top: 0;
  z-index: 200;
  padding: 12px 16px;
  background: var(--void);
  color: var(--text-light);
  font-family: inherit;
  text-decoration: none;
}

.skip-link:focus {
  left: 16px;
  top: 16px;
}

.visually-hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.deck-shell {
  /* svh = viewport visible (evita desborde bajo la barra en macOS / laptops) */
  --deck-chrome-bg: #141315;
  --deck-chrome-border: rgba(227, 219, 227, 0.14);
  --deck-chrome-shadow:
    0 16px 56px rgba(12, 11, 9, 0.5),
    0 0 0 1px rgba(254, 131, 211, 0.06);
  height: 100svh;
  max-height: 100svh;
  min-height: 100svh;
  display: flex;
  flex-direction: column;
  background: var(--void);
  overflow: hidden;
  box-sizing: border-box;
}

/* Huincha logo + 01/… — web: fila del shell; móvil: fixed (solo @media max 680px) */
.deck-shell__brand-bar {
  z-index: 110;
  width: 100%;
  box-sizing: border-box;
  pointer-events: none;
}

.deck-shell__brand-bar-inner {
  display: flex;
  align-items: center;
  width: 100%;
  box-sizing: border-box;
  background: var(--deck-chrome-bg, #141315);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  border-radius: 0;
  padding: 8px clamp(1rem, 4.5vw, 1.25rem);
  pointer-events: auto;
}

.deck-shell__brand-bar-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: clamp(8px, 2vw, 12px);
  width: 100%;
  box-sizing: border-box;
  pointer-events: none;
}

.deck-shell__brand-bar-row > * {
  pointer-events: auto;
}

.deck-shell__lang--inbar {
  flex: 0 0 auto;
  margin: 0;
}

.deck-shell__lang--aside {
  display: none;
  flex: 0 0 auto;
  margin: 0;
}

.deck-shell__lang {
  flex: 0 0 auto;
  margin: 0;
}

.deck-shell__lang-inner {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0;
  min-height: clamp(27px, 6.8vw, 30px);
  padding: 8px clamp(12px, 3.2vw, 14px);
  background: var(--deck-chrome-bg, #141315);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  border-radius: 9999px;
  box-sizing: border-box;
}

.deck-shell__lang-link {
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
  color: rgba(227, 219, 227, 0.42);
  font-family: "DM Mono", ui-monospace, monospace;
  font-size: inherit;
  font-weight: 500;
  letter-spacing: 0.18em;
  line-height: 1.2;
  text-decoration: none;
  text-transform: uppercase;
  transition: color 0.15s ease;
}

.deck-shell__lang-link:hover,
.deck-shell__lang-link:focus-visible {
  color: rgba(227, 219, 227, 0.72);
}

.deck-shell__lang-link.is-active {
  color: var(--dock-pill-active, #c597d8);
}

.deck-shell__lang-link:focus-visible {
  outline: 2px solid var(--pink);
  outline-offset: 3px;
  border-radius: 2px;
}

.deck-shell__lang-sep {
  margin: 0 0.42em;
  color: rgba(227, 219, 227, 0.28);
  font-weight: 500;
  letter-spacing: 0.08em;
  user-select: none;
}

.deck-shell__brand-bar-logo {
  flex: 0 0 auto;
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
  cursor: pointer;
  line-height: 0;
}

.deck-shell__brand-bar-logo:hover,
.deck-shell__brand-bar-logo:focus-visible {
  opacity: 0.88;
}

.deck-shell__brand-bar-logo:focus-visible {
  outline: 2px solid var(--pink);
  outline-offset: 3px;
  border-radius: 2px;
}

.deck-shell__brand-bar-logo-img {
  display: block;
  height: clamp(11px, 2.8vw, 14px);
  width: auto;
  max-width: min(100px, 28vw);
  aspect-ratio: 952 / 141;
  object-fit: contain;
}

.deck-shell__brand-bar-label {
  flex: 1 1 auto;
  min-width: 0;
  margin: 0;
  padding: 0 0 0 10px;
  color: #cdffc8;
  font-weight: 500;
  letter-spacing: 0.18em;
  line-height: 1.2;
  text-align: right;
  white-space: nowrap;
}

/* Etiqueta 01/02/… vive en la huincha; ocultar duplicado en el carril */
.deck__track .page:not(.page--cover) > .page__label {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

@media (min-width: 681px) {
  /*
   * Web: chrome en flujo (no fixed) — el stage empieza debajo de la huincha;
   * mismo padding y hueco título en todas las slides.
   */
  .deck-shell__brand-bar {
    position: relative;
    top: auto;
    left: auto;
    flex: 0 0 auto;
    width: 100%;
    max-width: none;
    padding: clamp(18px, 2.8vw, 32px) clamp(1.25rem, 5vw, 5.5rem) 0;
    box-sizing: border-box;
  }

  .deck-shell__brand-bar-inner {
    display: inline-flex;
    width: auto;
    max-width: 100%;
    border-radius: 18px;
    padding: 6px 14px 6px 12px;
  }

  .deck-shell__lang--inbar {
    display: none;
  }

  .deck-shell__lang--aside {
    display: block;
  }

  .deck-shell__lang-inner {
    min-height: 0;
    padding: 6px 14px;
    border-radius: 18px;
  }

  .deck-shell__lang-link,
  .deck-shell__lang-sep {
    font-size: clamp(9px, 0.95vw, 11px);
  }

  .deck-shell__brand-bar-logo-img {
    height: clamp(12px, 1.15vw, 16px);
    max-width: min(120px, 22vw);
  }

  .deck-shell__brand-bar-label {
    flex: 0 1 auto;
    margin-left: var(--brand-bar-logo-gap, 4.5rem);
    padding: 0;
    text-align: left;
  }

  .page,
  .deck__track .page,
  .deck__track .page:not(.page--cover) {
    padding-top: clamp(12px, 1.6vw, 20px);
    padding-inline: clamp(1.25rem, 5vw, 5.5rem);
  }

  .deck__track .page:not(.page--cover) > .page__title,
  .deck__track .page:not(.page--cover) > .ecosistema__title {
    margin-top: 0;
    margin-bottom: clamp(16px, 2vw, 24px);
  }
}

.deck-shell__stage {
  flex: 1 1 auto;
  min-height: 0;
  display: flex;
  flex-direction: column;
  overflow: hidden;
}

/* Dock en flujo (no fixed): el stage nunca queda debajo de las pestañas */
.deck-shell__dock-spacer {
  flex: 0 0 auto;
  display: flex;
  justify-content: center;
  padding: 0 12px max(18px, calc(env(safe-area-inset-bottom, 0px) + 10px));
  z-index: 120;
}

.deck-shell__dock {
  position: relative;
  left: auto;
  bottom: auto;
  transform: none;
  width: min(calc(100vw - 24px), 1100px);
  flex-shrink: 0;
  display: flex;
  flex-direction: column;
  gap: clamp(4px, 0.85vw, 8px);
  padding: 10px 14px 10px;
  border-radius: 18px;
  background: var(--deck-chrome-bg, #141315);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  border: 1px solid var(--deck-chrome-border);
  box-shadow: var(--deck-chrome-shadow);
}

.deck-shell__nav {
  order: 0;
  width: 100%;
  min-width: 0;
  max-width: 100%;
  display: flex;
  justify-content: center;
}

.deck-shell__dock-logo-row {
  order: 1;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
  align-items: center;
  gap: 6px 10px;
  width: 100%;
  padding: 4px 2px 0;
  border-top: 1px solid rgba(227, 219, 227, 0.1);
}

.deck-shell__dock-logo-row > .deck-shell__ctrl:first-child {
  justify-self: start;
}

.deck-shell__dock-logo-row > .deck-shell__dock-logo {
  justify-self: center;
}

.deck-shell__dock-logo-row > .deck-shell__ctrl:last-child {
  justify-self: end;
}

.deck-shell__dock-logo {
  flex-shrink: 0;
  border: none;
  background: transparent;
  padding: 4px 6px;
  margin: 0;
  border-radius: 10px;
  cursor: pointer;
  align-self: center;
}

.deck-shell__dock-logo:hover,
.deck-shell__dock-logo:focus-visible {
  background: transparent;
}

.deck-shell__dock-logo-stack {
  position: relative;
  display: block;
  height: 10px;
  width: fit-content;
  max-width: 72px;
}

.deck-shell__dock-logo-img {
  display: block;
  height: 10px;
  width: auto;
  max-width: 72px;
  object-fit: contain;
}

/* Rosa fijo en una capa; el hover solo anima opacidad (no se interpola filter → sin destellos) */
.deck-shell__dock-logo-img--base {
  position: relative;
  z-index: 0;
  transition: opacity 0.2s ease;
}

.deck-shell__dock-logo-img--hover {
  position: absolute;
  left: 0;
  top: 0;
  z-index: 1;
  opacity: 0;
  pointer-events: none;
  filter: brightness(0) saturate(100%) invert(73%) sepia(41%) saturate(2466%) hue-rotate(289deg) brightness(103%)
    contrast(101%);
  transition: opacity 0.2s ease;
}

.deck-shell__dock-logo:hover .deck-shell__dock-logo-img--base,
.deck-shell__dock-logo:focus-visible .deck-shell__dock-logo-img--base {
  opacity: 0;
}

.deck-shell__dock-logo:hover .deck-shell__dock-logo-img--hover,
.deck-shell__dock-logo:focus-visible .deck-shell__dock-logo-img--hover {
  opacity: 1;
}

@media (min-width: 900px) {
  .deck-shell__dock-logo-stack {
    height: 11px;
    max-width: 78px;
  }

  .deck-shell__dock-logo-img {
    height: 11px;
    max-width: 78px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .deck-shell__dock-logo-img--base,
  .deck-shell__dock-logo-img--hover {
    transition: none;
  }
}

.deck-shell__nav-inner {
  display: flex;
  flex-wrap: nowrap;
  gap: 10px;
  overflow-x: auto;
  width: max-content;
  max-width: 100%;
  margin-inline: auto;
  justify-content: flex-start;
  padding: 5px 4px 7px;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: thin;
  scrollbar-color: rgba(254, 131, 211, 0.35) transparent;
}

.deck-shell__pill {
  position: relative;
  flex: 0 0 auto;
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-end;
  min-height: 54px;
  padding: 20px 16px 12px;
  border-radius: 14px;
  border: 1px solid rgba(227, 219, 227, 0.18);
  background: rgba(255, 255, 255, 0.05);
  font-family: "DM Mono", ui-monospace, monospace;
  font-size: 10px;
  font-weight: 500;
  letter-spacing: 0.07em;
  text-transform: uppercase;
  color: #ffffff;
  cursor: pointer;
  transition:
    background 0.2s ease,
    border-color 0.2s ease,
    color 0.2s ease,
    transform 0.2s ease;
}

.deck-shell__pill::before {
  content: "";
  position: absolute;
  top: 10px;
  left: 50%;
  width: 0;
  height: 0;
  margin-left: -6px;
  border-left: 6px solid transparent;
  border-right: 6px solid transparent;
  border-top: 8px solid transparent;
  border-bottom: none;
  opacity: 0;
  transform: translateY(-8px);
  transition:
    opacity 0.15s ease,
    transform 0.15s ease;
  z-index: 1;
  pointer-events: none;
}

.deck-shell__pill:hover {
  border-color: rgba(197, 151, 216, 0.55);
  color: var(--text-light);
  transform: translateY(-1px);
}

.deck-shell__pill.is-active {
  background: var(--dock-pill-active);
  color: var(--ink);
  border-color: var(--dock-pill-active);
}

/* Flecha animada solo en la pestaña siguiente (invita a avanzar), no en la actual */
.deck-shell__pill.is-active::before {
  opacity: 0;
  transform: translateY(-8px);
  border-top-color: transparent;
  animation: none;
}

.deck-shell__pill.is-next-hint::before {
  opacity: 1;
  transform: translateY(0);
  border-top-color: var(--dock-pill-active);
  animation: dock-pill-arrow 1.15s ease-in-out infinite;
}

@media (prefers-reduced-motion: reduce) {
  .deck-shell__pill.is-next-hint::before {
    animation: none;
  }
}

@keyframes dock-pill-arrow {
  0%,
  100% {
    transform: translateY(0);
  }

  50% {
    transform: translateY(5px);
  }
}

@keyframes dock-pill-arrow-mobile {
  0%,
  100% {
    transform: translateX(0);
  }

  50% {
    transform: translateX(5px);
  }
}

.deck-shell__pill-text {
  display: block;
  line-height: 1.25;
  max-width: none;
  text-align: center;
}

@media (min-width: 681px) {
  .deck-shell__pill-text {
    white-space: nowrap;
  }
}

/* Móvil: sin carril horizontal — rejilla de pills (misma estética, todo visible) */
@media (max-width: 680px) {
  .deck-shell {
    --deck-chrome-width: min(calc(100vw - 24px), 1100px);
    --deck-chrome-gutter: 12px;
  }

  .deck-shell__dock {
    width: var(--deck-chrome-width);
    gap: 5px;
    padding: 7px 12px 6px;
  }

  .deck-shell__nav {
    width: 100%;
    min-width: 0;
    max-width: none;
  }

  /* 5 pestañas: fila de 3 + fila de 2 centrada */
  .deck-shell__nav-inner {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 8px;
    overflow-x: visible;
    width: 100%;
    max-width: none;
    margin-inline: 0;
    padding: 4px 0 5px;
    justify-content: stretch;
    -webkit-overflow-scrolling: auto;
  }

  .deck-shell__pill:nth-child(1) {
    grid-column: 1 / 3;
  }

  .deck-shell__pill:nth-child(2) {
    grid-column: 3 / 5;
  }

  .deck-shell__pill:nth-child(3) {
    grid-column: 5 / 7;
  }

  .deck-shell__pill:nth-child(4) {
    grid-column: 2 / 4;
  }

  .deck-shell__pill:nth-child(5) {
    grid-column: 4 / 6;
  }

  .deck-shell__dock-logo-row {
    padding: 3px 0 0;
    gap: 5px 7px;
  }

  .deck-shell__pill {
    width: 100%;
    max-width: none;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    gap: 0;
    min-height: 28px;
    padding: 4px 3px;
    font-size: 10px;
    letter-spacing: 0.045em;
    line-height: 1;
  }

  /* Flecha en el flujo flex junto al texto: misma distancia al label en cortos y largos */
  .deck-shell__pill::before {
    display: none;
    position: static;
    top: auto;
    left: auto;
    right: auto;
    margin: 0;
    flex-shrink: 0;
    border-left: 7px solid transparent;
    border-right: none;
    border-top: 5px solid transparent;
    border-bottom: 5px solid transparent;
    border-top-color: transparent;
    transform: translateX(0);
  }

  /* Sin flecha “siguiente” en móvil: pestañas de altura uniforme */
  .deck-shell__pill.is-next-hint::before {
    display: none !important;
    animation: none;
    content: none;
    margin: 0;
    border: none;
  }

  .deck-shell__pill.is-active::before {
    display: none;
    opacity: 0;
    transform: translateX(0);
    border-left-color: transparent;
    animation: none;
  }

  @media (prefers-reduced-motion: reduce) {
    .deck-shell__pill.is-next-hint::before {
      animation: none;
    }
  }

  .deck-shell__pill-text {
    max-width: none;
    line-height: 1;
    white-space: nowrap;
  }

  /* Slides: sin scroll vertical interno; el carril ocupa el stage */
  .deck__viewport {
    min-height: 0;
  }

  .deck__track {
    min-height: 0;
    max-height: 100%;
  }

  /* Sin scroll vertical: el gesto vertical cambia de slide (deck-nav.js) */
  .deck__track .page:not(.page--cover) {
    touch-action: pan-x pinch-zoom;
  }

  .deck-shell__dock-spacer,
  .deck__viewport {
    touch-action: pan-x pinch-zoom;
  }
}


/* Móvil: dock compacto (altura pills definida en bloque nav arriba + override final) */
@media (max-width: 680px) {
  .deck-shell__dock-spacer {
    padding: 0 12px max(4px, env(safe-area-inset-bottom, 0px));
  }

  .deck-shell__dock {
    padding-bottom: 5px;
  }
}

@media (max-width: 380px) {
  .deck-shell__nav-inner {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .deck-shell__pill:nth-child(1),
  .deck-shell__pill:nth-child(2),
  .deck-shell__pill:nth-child(3),
  .deck-shell__pill:nth-child(4),
  .deck-shell__pill:nth-child(5) {
    grid-column: auto;
  }

  .deck-shell__pill:nth-child(5) {
    grid-column: 1 / -1;
  }

  .deck-shell__pill {
    min-height: 26px;
    padding: 4px 2px;
    font-size: 9px;
    letter-spacing: 0.04em;
  }

  .deck-shell__pill-text {
    font-size: 9px;
  }
}

.deck-shell__ctrl {
  border: none;
  background: transparent;
  font-family: "DM Mono", ui-monospace, monospace;
  font-size: 12px;
  font-weight: 500;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: #ffffff;
  cursor: pointer;
  padding: 6px 12px;
  border-radius: 10px;
  transition:
    background 0.2s ease,
    color 0.2s ease;
}

.deck-shell__ctrl:hover:not(:disabled) {
  background: rgba(254, 131, 211, 0.18);
  color: var(--text-light);
}

.deck-shell__ctrl:disabled {
  opacity: 0.32;
  cursor: not-allowed;
}

.deck-shell__ctrl--dockside {
  padding: 6px 10px;
  font-size: 11px;
  min-width: 0;
}

.deck-shell__ctrl--dockside.deck-shell__ctrl--arrow {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: var(--dock-pill-active);
  font-size: 0;
  letter-spacing: 0;
  text-transform: none;
  transition: none;
}

/*
 * Flechas anterior/siguiente: mismo triángulo relleno que .deck-shell__pill.is-next-hint::before
 * (desktop: bordes 6/6/8; móvil: chevrón horizontal como en pills ≤680px). Sin animación.
 */
.deck-shell__ctrl--dockside.deck-shell__ctrl--arrow .deck-shell__ctrl-arrow {
  display: block;
  flex-shrink: 0;
  width: 0;
  height: 0;
  margin: 0;
  border-style: solid;
  border-left: 6px solid transparent;
  border-right: 6px solid transparent;
  border-bottom: none;
  border-top: 8px solid var(--dock-pill-active);
  transform-origin: center center;
}

.deck-shell__ctrl--dockside.deck-shell__ctrl--arrow .deck-shell__ctrl-arrow--prev {
  transform: rotate(90deg);
}

.deck-shell__ctrl--dockside.deck-shell__ctrl--arrow .deck-shell__ctrl-arrow--next {
  transform: rotate(-90deg);
}

.deck-shell__ctrl--dockside:hover:not(:disabled),
.deck-shell__ctrl--dockside:focus-visible:not(:disabled) {
  background: transparent;
  color: var(--dock-pill-active);
}

@media (max-width: 680px) {
  .deck-shell__ctrl--dockside {
    padding: 6px 8px;
    font-size: 10px;
    letter-spacing: 0.1em;
  }

  /* Misma flecha horizontal que .deck-shell__pill.is-next-hint::before en móvil */
  .deck-shell__ctrl--dockside.deck-shell__ctrl--arrow .deck-shell__ctrl-arrow {
    border-top: 5px solid transparent;
    border-bottom: 5px solid transparent;
    border-top-color: transparent;
    border-bottom-color: transparent;
    border-left: none;
    border-right: none;
  }

  .deck-shell__ctrl--dockside.deck-shell__ctrl--arrow .deck-shell__ctrl-arrow--prev {
    transform: none;
    border-right: 7px solid var(--dock-pill-active);
  }

  .deck-shell__ctrl--dockside.deck-shell__ctrl--arrow .deck-shell__ctrl-arrow--next {
    transform: none;
    border-left: 7px solid var(--dock-pill-active);
  }

  /* Móvil: animar flecha "siguiente" hacia la derecha (no en slide 5 porque queda disabled). */
  .deck-shell__ctrl--dockside.deck-shell__ctrl--arrow[data-deck-next]:not(:disabled) .deck-shell__ctrl-arrow--next {
    animation: dock-pill-arrow-mobile 1.15s ease-in-out infinite;
  }

  .deck-shell__ctrl--dockside.deck-shell__ctrl--arrow[data-deck-prev] .deck-shell__ctrl-arrow--prev {
    animation: none;
  }
}

@media (max-width: 680px) and (prefers-reduced-motion: reduce) {
  .deck-shell__ctrl--dockside.deck-shell__ctrl--arrow[data-deck-next] .deck-shell__ctrl-arrow--next {
    animation: none;
  }
}

.deck__viewport {
  flex: 1 1 auto;
  min-height: 0;
  height: 100%;
  overflow: hidden;
  position: relative;
  display: flex;
  flex-direction: column;
}

/*
  Portada: una sola capa de grilla en el viewport (incluye padding-bottom = hueco del dock).
  Fundido superior (~96px) = dissolve hacia negro; más filas hacia arriba (~624px) como pediste.

*/
.deck__viewport:has(.page--cover[aria-hidden="false"])::after {
  --cover-line: rgba(227, 219, 227, 0.14);
  --cover-cell: 48px;
  --cover-fade: calc(var(--cover-cell) * 2);
  --cover-rows: 13;

  content: "";
  position: absolute;
  z-index: 0;
  pointer-events: none;
  left: 0;
  right: 0;
  bottom: 0;
  height: calc(var(--cover-fade) + var(--cover-cell) * var(--cover-rows) + var(--deck-clearance));
  background-image:
    linear-gradient(
      to bottom,
      rgb(12 11 9 / 1) 0%,
      rgb(12 11 9 / 0.72) 42%,
      rgb(12 11 9 / 0) 100%
    ),
    linear-gradient(to right, var(--cover-line) 1px, transparent 1px),
    linear-gradient(to bottom, var(--cover-line) 1px, transparent 1px);
  background-size:
    100% var(--cover-fade),
    var(--cover-cell) var(--cover-cell),
    var(--cover-cell) var(--cover-cell);
  background-position:
    left top,
    left top,
    left top;
  background-repeat:
    no-repeat,
    repeat,
    repeat;
}

.deck__track {
  position: relative;
  z-index: 1;
  display: block;
  flex: 1 1 auto;
  min-height: 0;
  height: 100%;
  width: 100%;
  transform: none;
}

.page {
  position: relative;
  width: 100%;
  padding-inline: clamp(1rem, 4.5vw, 1.25rem);
  padding-top: 10px;
  padding-bottom: 0;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  --page-muted: rgba(215, 221, 237, 0.62);
  --page-border: rgba(227, 219, 227, 0.14);
  --page-label: var(--pink);
  --tag-stack-border: rgba(170, 255, 143, 0.42);
  --tag-stack-key: var(--green-bright);
  --tag-stack-val: rgba(215, 221, 237, 0.74);
  --moment-heading: var(--green-bright);
  --case-meta: rgba(215, 221, 237, 0.52);
  --case-col-h: var(--green-bright);
  background: var(--void);
  color: var(--text-light);
  border-bottom: 1px dashed rgba(227, 219, 227, 0.08);
}

.page .t-muted {
  color: var(--page-muted);
}

.page--surface-light {
  --page-muted: rgba(12, 11, 9, 0.58);
  --page-border: rgba(12, 11, 9, 0.11);
  --page-label: var(--pink);
  --tag-stack-border: rgba(30, 201, 151, 0.42);
  --tag-stack-key: var(--green);
  --tag-stack-val: rgba(12, 11, 9, 0.7);
  --moment-heading: var(--green);
  --case-meta: rgba(12, 11, 9, 0.52);
  --case-col-h: var(--green);
  background: var(--cream);
  color: var(--ink);
  border-bottom-color: rgba(12, 11, 9, 0.08);
}

.deck__track .page {
  --page-label: #cdffc8;
  position: absolute;
  inset: 0;
  flex: none;
  width: 100%;
  max-width: none;
  min-width: 0;
  border-bottom: none;
  box-sizing: border-box;
  overflow: hidden;
  display: none;
}

/* Antes de deck-nav.js: respeta #hash en la URL (cambio de idioma) */
.deck__track .page:target {
  display: flex;
  z-index: 1;
}

.deck__track:not(:has(.page:target)) .page:first-child {
  display: flex;
  z-index: 1;
}

.deck__track .page[aria-hidden="false"] {
  display: flex !important;
  z-index: 1;
}

@media (max-width: 680px) {
  .deck__track .page#deck-contacto[aria-hidden="false"],
  .deck__track .page#deck-contacto:target {
    display: grid !important;
  }
}

.deck__track .page[aria-hidden="true"] {
  display: none !important;
  pointer-events: none;
  user-select: none;
}

/* ── Grilla de fondo (una sola capa fija; no se mueve con el carril) ───────── */
html.deck-app::before {
  content: "";
  position: fixed;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  --deck-grid-cell: 36px;
  --deck-grid-line: var(--deck-grid-line-base, rgba(72, 76, 90, 0.52));
  background-image:
    linear-gradient(to right, var(--deck-grid-line) 1px, transparent 1px),
    linear-gradient(to bottom, var(--deck-grid-line) 1px, transparent 1px);
  background-size: var(--deck-grid-cell) var(--deck-grid-cell);
  background-repeat: repeat;
  background-position: 0 0;
}

/* Sin grilla por slide (evita “arrastre” al pasar slide 02 → 03) */
.deck__track .page::before {
  content: none;
  display: none;
}

/* Grilla fija sobre fotos de fondo (slides 01–05), web y móvil */
html.deck-app:has(#deck-momento[aria-hidden="false"])::before,
html.deck-app:has(#deck-nucleo[aria-hidden="false"])::before {
  --deck-grid-line: var(--deck-grid-line-photo-strong);
  z-index: 1;
}

html.deck-app:has(#deck-experiencia[aria-hidden="false"])::before,
html.deck-app:has(#deck-ecosistema[aria-hidden="false"])::before {
  --deck-grid-line: var(--deck-grid-line-photo);
  z-index: 1;
}

html.deck-app:has(#deck-contacto[aria-hidden="false"])::before {
  --deck-grid-line: var(--deck-grid-line-photo-subtle);
  z-index: 1;
}

.deck__track .page > * {
  position: relative;
  z-index: 1;
}

/* Portada: sin scroll interno; altura = carril (stretch) */
.deck__track .page.page--cover {
  overflow-y: hidden;
}

/* ── Slides: altura del stage; sin scroll vertical (navegación lateral con rueda/swipe) ── */
.deck__track .page:not(.page--cover) {
  min-height: 100%;
  height: 100%;
  justify-content: flex-start;
  overflow-x: hidden;
  overflow-y: hidden;
  overscroll-behavior: none;
}

@media (min-width: 681px) {
  .page {
    padding-bottom: clamp(28px, 5vw, 56px);
  }

  .deck__track .page:not(.page--cover) {
    padding-bottom: var(--page-safe-bottom);
  }
}

.deck__track .page:not(.page--cover) > .page__label,
.deck__track .page:not(.page--cover) > .page__title {
  flex-shrink: 0;
}

.page--cover {
  justify-content: flex-start;
  background: var(--void);
  color: var(--text-light);
  padding-bottom: clamp(20px, 4vh, 40px);
}

.page--cover .t-muted {
  color: rgba(215, 221, 237, 0.65);
}

.cover__hero {
  position: relative;
  z-index: 1;
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: clamp(20px, 4vw, 40px) 0;
  min-height: 0;
}

.page--cover .cover__hero {
  align-items: stretch;
  text-align: left;
}

.page--cover .cover__intro-lede {
  color: var(--text-light);
  text-align: left;
  margin-inline: 0;
  align-self: stretch;
}

.footer-strip--cover-meta {
  position: relative;
  z-index: 1;
  flex-shrink: 0;
  justify-content: center;
  align-items: center;
  text-align: center;
  flex-wrap: wrap;
}

.cover__title {
  font-size: clamp(52px, 12vw, 112px);
  margin: 0 0 20px;
  letter-spacing: -0.035em;
}

.cover__subtitle {
  font-size: clamp(20px, 3.2vw, 28px);
  font-weight: 500;
  max-width: 32ch;
  margin: 0;
}

.page__label {
  color: var(--page-label);
  margin: 0 0 12px;
}

.page__title {
  font-size: clamp(36px, 5vw, 72px);
  margin: 0 0 24px;
}

@media (min-width: 1200px) {
  .page__title {
    font-size: clamp(42px, 4.5vw, 88px);
  }
}

.page__body {
  flex: 1;
}

/* Slide 01: el body no debe estirarse (rompe el cluster centrado en móvil) */
#deck-momento .page__body {
  flex: 0 0 auto;
}

.bullets {
  margin: 0;
  padding: 0 0 0 1.1em;
}

.bullets li {
  margin: 0 0 10px;
  padding-left: 0.25em;
}

.bullets li::marker {
  color: var(--pink);
}

.footer-strip {
  margin-top: auto;
  padding-top: 32px;
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  gap: 16px;
  border-top: none;
}

.page--cover .footer-strip {
  border-top: none;
}

.footer-strip--single {
  justify-content: flex-end;
  align-items: center;
}

.tag {
  display: inline-block;
  padding: 6px 10px;
  border-radius: 999px;
  background: rgba(254, 131, 211, 0.15);
  color: var(--ink);
  font-family: "DM Mono", ui-monospace, monospace;
  font-size: 10px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.page--cover .tag {
  background: rgba(254, 131, 211, 0.25);
  color: var(--text-light);
}

/* Split layout — texto + tags */
.page__split {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(160px, 220px);
  gap: 28px 32px;
  align-items: start;
  flex: 1;
}

@media (min-width: 900px) {
  .page__split {
    grid-template-columns: minmax(0, 1fr) minmax(200px, 280px);
    gap: 36px 52px;
    align-items: center;
  }
}

@media (max-width: 620px) {
  .page__split {
    grid-template-columns: 1fr;
  }
}

.tag-stack {
  margin: 0;
  padding: 0;
  list-style: none;
  border-left: 2px solid var(--tag-stack-border);
  padding-left: 16px;
}

.tag-stack li {
  margin: 0 0 14px;
  font-size: 11px;
  line-height: 1.35;
}

.tag-stack li:last-child {
  margin-bottom: 0;
}

.tag-stack__key {
  display: block;
  font-family: "DM Mono", ui-monospace, monospace;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--tag-stack-key);
  margin-bottom: 2px;
}

.tag-stack__val {
  display: block;
  color: var(--tag-stack-val);
}

/* Título en dos líneas */
.page__title--stack {
  line-height: 0.98;
  margin-bottom: 28px;
}

.page__title-line {
  display: block;
}

.page__title-line + .page__title-line {
  margin-top: 0.06em;
}

/* Salto de línea solo en web (≥680px) */
.br--web {
  display: none;
}

/* Salto de línea solo en móvil (≤680px) */
.br--mob {
  display: block;
}

@media (min-width: 680px) {
  .br--web {
    display: block;
  }

  .br--mob {
    display: none;
  }
}

/* Slide 01 — fondo en capa fija (no se desplaza con .deck__track) */
.deck-shell:has(#deck-momento[aria-hidden="false"]) {
  background: transparent;
}

.deck-shell:has(#deck-momento[aria-hidden="false"])::after {
  content: "";
  position: fixed;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  background-image:
    linear-gradient(
      to bottom,
      rgba(12, 11, 9, 0.18) 0%,
      rgba(12, 11, 9, 0.08) 45%,
      rgba(12, 11, 9, 0.48) 100%
    ),
    url("../assets/concert_hq.jpg");
  background-size: cover;
  background-position: center 30%;
  background-repeat: no-repeat;
}

#deck-momento.page {
  background: transparent;
}

/* Slide 01 — encabezado blanco (web y móvil) */
@media (min-width: 681px) {
  #deck-momento .page__title,
  #deck-momento .page__title--stack,
  #deck-momento .page__title-line {
    color: #ffffff;
    -webkit-text-fill-color: currentColor;
    -webkit-text-stroke: 0 transparent;
    paint-order: normal;
  }
}

@media (max-width: 680px) {
  /* Slide 01 móvil — blanco (igual que web) */
  #deck-momento .page__title,
  #deck-momento .page__title--stack,
  #deck-momento .page__title-line,
  #deck-momento .momento__title-marquee__text {
    color: #ffffff;
    -webkit-text-fill-color: currentColor;
    -webkit-text-stroke: 0 transparent;
    paint-order: normal;
  }
}

#deck-momento .page__title--stack {
  line-height: 0.85;
}

#deck-momento .page__title-line + .page__title-line {
  margin-top: 0.04em;
}

@media (max-width: 680px) {
  .deck__track .page__title.page__title--stack {
    font-size: clamp(36px, 10vw, 72px);
    line-height: 0.9;
    letter-spacing: -0.03em;
  }

  .deck__track .page__title--stack .page__title-line {
    max-width: 100%;
  }

  .deck__track .page#deck-momento > .page__title.page__title--stack,
  #deck-momento .page__title.page__title--stack {
    font-size: clamp(38px, 11.5vw, 56px);
    line-height: 0.88;
    letter-spacing: -0.035em;
  }

  #deck-momento .page__title-line--desk {
    display: none;
  }
}

@media (min-width: 681px) {
  #deck-momento .page__title-line--mob {
    display: none;
  }
}

.page__prose {
  max-width: min(72ch, 100%);
}

@media (min-width: 1100px) {
  .page__prose {
    max-width: min(78ch, 100%);
  }
}

.page__prose p {
  margin: 0 0 16px;
  font-size: 17px;
  line-height: 1.5;
}

.page__prose p:last-child {
  margin-bottom: 0;
}

/* ── Slide 03 "La experiencia" — recuadros de color (guía v13) ── */
#deck-experiencia.page {
  --exp-flow-safe-bottom: clamp(18px, 2.8vh, 36px);
  --exp-blue: #0c8ce9;
  --exp-blue-text: #0c0b09;
  --exp-pink-card: #ffa7d9;
  --exp-pink-text: #0c0b09;
  --exp-green: #c7f46d;
  --exp-green-text: #0c0b09;
  --exp-ink: #0c0b09;
  --exp-muted: #0c0b09;
  --exp-line: 1px solid #0c0b09;
  background: transparent;
}

/* Slides 03 y 04 — misma escala y tipografía de recuadros */
#deck-experiencia,
#deck-experiencia.page,
#deck-ecosistema,
#deck-ecosistema.page {
  --exp-green: #c7f46d;
  --exp-scale: 1.28;
  --exp-sticker-max: min(calc(var(--exp-sticker-base) * var(--exp-scale)), 100%);
  --exp-tag-size: calc(9px * var(--exp-scale));
  --exp-body-size: clamp(
    calc(10px * var(--exp-scale)),
    calc(1.8vw * var(--exp-scale)),
    calc(11px * var(--exp-scale))
  );
}

/* Feed en vivo + Reels: un poco más anchos que el recuadro azul (mismo ancho entre sí) */
#deck-experiencia,
#deck-experiencia.page {
  --exp-sticker-pair-max: min(
    calc((var(--exp-sticker-base) + 36px) * var(--exp-scale)),
    100%
  );
}

#deck-experiencia .exp-flow__col {
  max-width: var(--exp-sticker-pair-max);
}

#deck-experiencia .exp-sticker--2,
#deck-experiencia .exp-sticker--3 {
  max-width: var(--exp-sticker-pair-max);
}

.deck-shell:has(#deck-experiencia[aria-hidden="false"]) {
  background: transparent;
}

/* Foto de fondo: pantalla completa (cover), detrás del dock */
.deck-shell:has(#deck-experiencia[aria-hidden="false"])::after {
  content: "";
  position: fixed;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  background-image: url("../assets/pexels-harrisonhaines-3536238.jpg");
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
}

#deck-experiencia .page__title {
  color: #ffffff;
}

#deck-experiencia .page__body {
  flex: 1 1 auto;
  min-height: 0;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
}

/* Sin contorno exterior en recuadros de color (solo líneas internas) */
#deck-experiencia .exp-sticker--1,
#deck-experiencia .exp-sticker--2,
#deck-experiencia .exp-sticker--3 {
  border: none;
  outline: none;
  box-shadow: none;
}

#deck-experiencia .exp-sticker__split {
  border: none;
}

.exp-flow {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  align-items: stretch;
  flex-shrink: 0;
  gap: clamp(calc(14px * var(--exp-scale)), calc(2.5vw * var(--exp-scale)), calc(20px * var(--exp-scale)));
  width: 100%;
  margin-top: clamp(calc(10px * var(--exp-scale)), calc(1.8vw * var(--exp-scale)), calc(20px * var(--exp-scale)));
}

/* ── Sticker base (tamaños × --exp-scale en slides 03 y 04) ── */
.exp-sticker {
  position: relative;
  width: 100%;
  max-width: var(--exp-sticker-max);
  border-radius: calc(12px * var(--exp-scale));
  overflow: hidden;
  flex-shrink: 0;
}

.exp-sticker__inner {
  display: flex;
  flex-direction: column;
}

.exp-sticker__tag {
  margin: 0;
  display: flex;
  align-items: center;
  min-height: calc(28px * var(--exp-scale));
  padding: clamp(calc(6px * var(--exp-scale)), calc(1vw * var(--exp-scale)), calc(8px * var(--exp-scale)))
    clamp(calc(14px * var(--exp-scale)), calc(2vw * var(--exp-scale)), calc(20px * var(--exp-scale)));
  font-family: "DM Mono", ui-monospace, monospace;
  font-size: var(--exp-tag-size, calc(9px * var(--exp-scale)));
  font-weight: 500;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  line-height: 1.2;
  border-bottom: var(--exp-line);
  box-sizing: border-box;
}

/* .t-mono en la barrita no debe cambiar tamaño respecto a Feed en vivo */
.exp-sticker__tag.t-mono {
  font-size: var(--exp-tag-size, calc(9px * var(--exp-scale)));
  letter-spacing: 0.18em;
}

.exp-sticker__card {
  padding: 0;
}

/* Grilla interna: título (izq.) | texto (der.) */
.exp-sticker__split {
  display: flex;
  min-height: clamp(
    calc(88px * var(--exp-scale)),
    calc(12vh * var(--exp-scale)),
    calc(108px * var(--exp-scale))
  );
  border: var(--exp-line);
  overflow: hidden;
}

.exp-sticker__title-col {
  flex: 0 0 clamp(
    calc(88px * var(--exp-scale)),
    calc(22vw * var(--exp-scale)),
    calc(112px * var(--exp-scale))
  );
  display: flex;
  min-height: 100%;
  border-right: var(--exp-line);
}

.exp-sticker__title {
  margin: 0;
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  width: 100%;
  min-height: 100%;
  padding: clamp(calc(12px * var(--exp-scale)), calc(2vw * var(--exp-scale)), calc(16px * var(--exp-scale)))
    clamp(calc(8px * var(--exp-scale)), calc(1.5vw * var(--exp-scale)), calc(10px * var(--exp-scale)));
  font-size: clamp(calc(22px * var(--exp-scale)), calc(3.6vw * var(--exp-scale)), calc(30px * var(--exp-scale)));
  line-height: 0.95;
  letter-spacing: 0.02em;
  text-transform: uppercase;
  color: var(--exp-muted);
}

.exp-sticker__title-line {
  display: block;
  white-space: nowrap;
}

.exp-sticker__title-line + .exp-sticker__title-line {
  margin-top: 0.08em;
}

.exp-sticker__title--sm {
  font-size: clamp(calc(15px * var(--exp-scale)), calc(2.5vw * var(--exp-scale)), calc(20px * var(--exp-scale)));
}

/* Feed en vivo: columna título un poco más ancha (línea vertical más a la derecha) para EN TIEMPO / REAL */
.exp-sticker--2 .exp-sticker__title-col {
  flex: 0 0 clamp(
    calc(96px * var(--exp-scale)),
    calc(24vw * var(--exp-scale)),
    calc(120px * var(--exp-scale))
  );
}

.exp-sticker__detail-col {
  flex: 1 1 auto;
  min-width: 0;
  display: flex;
  flex-direction: column;
  justify-content: center;
  min-height: 100%;
}

.exp-sticker__meta {
  flex: 0 0 auto;
  padding: clamp(calc(8px * var(--exp-scale)), calc(1.5vw * var(--exp-scale)), calc(10px * var(--exp-scale)))
    clamp(calc(12px * var(--exp-scale)), calc(2vw * var(--exp-scale)), calc(14px * var(--exp-scale)));
  border-bottom: var(--exp-line);
}

.exp-sticker__mono {
  margin: 0 0 calc(4px * var(--exp-scale));
  padding: 0;
  font-size: calc(8px * var(--exp-scale));
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--exp-muted);
  opacity: 0.55;
}

.exp-sticker__big {
  margin: 0;
  padding: 0;
  font-size: clamp(calc(15px * var(--exp-scale)), calc(2.6vw * var(--exp-scale)), calc(19px * var(--exp-scale)));
  line-height: 1;
  letter-spacing: 0.04em;
  color: var(--exp-muted);
}

ul.exp-sticker__desc.exp-sticker__bullets {
  display: flex;
  flex-direction: column;
}

.exp-sticker__desc {
  margin: 0;
  flex: 1 1 auto;
  display: block;
  width: 100%;
  min-width: 0;
  padding: clamp(calc(8px * var(--exp-scale)), calc(1.5vw * var(--exp-scale)), calc(10px * var(--exp-scale)))
    clamp(calc(12px * var(--exp-scale)), calc(2vw * var(--exp-scale)), calc(14px * var(--exp-scale)));
  font-size: var(--exp-body-size, clamp(calc(10px * var(--exp-scale)), calc(1.8vw * var(--exp-scale)), calc(11px * var(--exp-scale))));
  font-weight: 700;
  line-height: 1.55;
  color: #0c0b09;
  opacity: 1;
  text-align: left;
  text-wrap: wrap;
  overflow-wrap: break-word;
  hyphens: none;
}

/* Texto y líneas negras en el interior de recuadros de color (slides 03 y 04) */
.exp-sticker__title,
.exp-sticker__title-line,
.exp-sticker__mono,
.exp-sticker__big,
.exp-sticker__desc,
.exp-sticker__bullets,
.exp-sticker__bullets li,
.exp-sticker__body--plain {
  color: #0c0b09;
  opacity: 1;
}

.exp-sticker__split,
.exp-sticker__title-col,
.exp-sticker__meta,
.exp-sticker__tag {
  border-color: #0c0b09;
}


.exp-sticker__bullets {
  margin: 0;
  padding: 0;
  width: 100%;
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: clamp(calc(4px * var(--exp-scale)), calc(0.8vw * var(--exp-scale)), calc(6px * var(--exp-scale)));
}

.exp-sticker__bullets li {
  margin: 0;
  padding: 0 0 0 1.05em;
  position: relative;
  font-size: inherit;
  font-weight: inherit;
  line-height: inherit;
  color: inherit;
  opacity: 1;
}

.exp-sticker__bullets li::before {
  content: "•";
  position: absolute;
  left: 0;
  line-height: inherit;
}

/* Slide 03 — verde: bullets con mismo inset que el párrafo del recuadro azul */
.exp-sticker--3 .exp-sticker__desc.exp-sticker__bullets {
  padding-inline: clamp(calc(10px * var(--exp-scale)), calc(1.4vw * var(--exp-scale)), calc(12px * var(--exp-scale)));
}

/* Sticker 01 — azul (textos y líneas internas #474742) */
.exp-sticker--1 {
  background: var(--exp-blue);
  color: var(--exp-blue-text);
}

.exp-sticker--1 .exp-sticker__tag {
  background: var(--exp-ink);
  color: var(--exp-blue);
}

.exp-sticker--1 .exp-sticker__title,
.exp-sticker--1 .exp-sticker__mono,
.exp-sticker--1 .exp-sticker__big,
.exp-sticker--1 .exp-sticker__desc {
  color: var(--exp-blue-text);
  opacity: 1;
}

.exp-sticker--1 .exp-sticker__tag {
  border-bottom-color: var(--exp-blue-text);
}

.exp-sticker--1 .exp-sticker__split,
.exp-sticker--1 .exp-sticker__title-col,
.exp-sticker--1 .exp-sticker__meta {
  border-color: var(--exp-blue-text);
}

/* Sticker 02 — rosa (#FFA7D9, textos y líneas #474742) */
.exp-sticker--2 {
  background: var(--exp-pink-card);
  color: var(--exp-pink-text);
}

.exp-sticker--2 .exp-sticker__tag {
  background: var(--exp-ink);
  color: var(--exp-pink-card);
  border-bottom-color: var(--exp-pink-text);
}

.exp-sticker--2 .exp-sticker__title,
.exp-sticker--2 .exp-sticker__mono,
.exp-sticker--2 .exp-sticker__big,
.exp-sticker--2 .exp-sticker__desc,
.exp-sticker--2 .exp-sticker__desc .deck__accent-pink {
  color: var(--exp-pink-text);
  opacity: 1;
}

/* Cuerpo simple (slide 04): solo lista bajo la barrita, sin grilla interna */
.exp-sticker__body--plain {
  flex: none;
  padding: clamp(calc(8px * var(--exp-scale)), calc(1.5vw * var(--exp-scale)), calc(10px * var(--exp-scale)))
    clamp(calc(12px * var(--exp-scale)), calc(2vw * var(--exp-scale)), calc(14px * var(--exp-scale)));
}

.exp-sticker--4a .exp-sticker__card,
.exp-sticker--4b .exp-sticker__card {
  padding: 0;
  display: block;
  min-height: 0;
  height: auto;
}

.exp-sticker--2 .exp-sticker__split,
.exp-sticker--2 .exp-sticker__title-col,
.exp-sticker--2 .exp-sticker__meta {
  border-color: var(--exp-pink-text);
}

/* Sticker 03 — verde (textos y líneas #474742) */
.exp-sticker--3 {
  background: var(--exp-green);
  color: var(--exp-green-text);
}

.exp-sticker--3 .exp-sticker__tag {
  background: var(--exp-ink);
  color: var(--exp-green);
  border-bottom: var(--exp-line);
  border-bottom-color: var(--exp-green-text);
}

.exp-sticker--3 .exp-sticker__title,
.exp-sticker--3 .exp-sticker__mono,
.exp-sticker--3 .exp-sticker__big,
.exp-sticker--3 .exp-sticker__desc {
  color: var(--exp-green-text);
  opacity: 1;
}

.exp-sticker--3 .exp-sticker__split,
.exp-sticker--3 .exp-sticker__title-col,
.exp-sticker--3 .exp-sticker__meta {
  border-color: var(--exp-green-text);
}

/* Slide 04 — pestaña de color + cuerpo negro; bullets blancos, punto de color */
.exp-sticker--4a {
  --ecosistema-accent: #aaff8f;
  background: var(--exp-ink, #0c0b09);
  color: var(--cream, #e3dbe3);
}

.exp-sticker--4a .exp-sticker__tag {
  background: var(--ecosistema-accent);
  color: #0c0b09;
  border-bottom: 1px solid #0c0b09;
}

.exp-sticker--4a .exp-sticker__card {
  background: var(--exp-ink, #0c0b09);
}

.exp-sticker--4b {
  --ecosistema-accent: var(--exp-blue, #0c8ce9);
  background: var(--exp-ink, #0c0b09);
  color: var(--cream, #e3dbe3);
}

.exp-sticker--4b .exp-sticker__tag {
  background: var(--ecosistema-accent);
  color: #0c0b09;
  border-bottom: 1px solid #0c0b09;
}

.exp-sticker--4b .exp-sticker__card {
  background: var(--exp-ink, #0c0b09);
}

.exp-sticker--4a .exp-sticker__body--plain,
.exp-sticker--4b .exp-sticker__body--plain {
  flex: none;
  display: block;
  width: 100%;
  box-sizing: border-box;
  margin: 0;
  padding: clamp(calc(10px * var(--exp-scale)), calc(1.6vw * var(--exp-scale)), calc(12px * var(--exp-scale)))
    clamp(calc(12px * var(--exp-scale)), calc(2vw * var(--exp-scale)), calc(14px * var(--exp-scale)));
  font-size: var(--exp-body-size, clamp(calc(10px * var(--exp-scale)), calc(1.8vw * var(--exp-scale)), calc(11px * var(--exp-scale))));
  font-weight: 700;
  line-height: 1.55;
  background: var(--exp-ink, #0c0b09);
  color: var(--cream, #e3dbe3);
  opacity: 1;
}

/* Slide 03 y 04 — barrita y cuerpo con el mismo tamaño de fuente */
#deck-experiencia .exp-sticker__tag,
#deck-ecosistema .exp-sticker__tag {
  font-size: var(--exp-tag-size);
}

#deck-experiencia .exp-sticker__desc {
  font-family: "Archivo", system-ui, sans-serif;
  font-size: var(--exp-body-size);
  font-weight: 700;
  line-height: 1.2;
}

#deck-ecosistema .exp-sticker--4a .exp-sticker__body--plain,
#deck-ecosistema .exp-sticker--4b .exp-sticker__body--plain {
  font-size: var(--exp-body-size);
  font-weight: 700;
  line-height: 1.55;
}

.exp-sticker--4a .exp-sticker__bullets,
.exp-sticker--4b .exp-sticker__bullets {
  color: var(--cream, #e3dbe3);
}

.exp-sticker--4a .exp-sticker__bullets li,
.exp-sticker--4b .exp-sticker__bullets li {
  color: var(--cream, #e3dbe3);
  opacity: 1;
}

.exp-sticker--4a .exp-sticker__bullets li::before {
  color: var(--ecosistema-accent, #aaff8f);
}

.exp-sticker--4b .exp-sticker__bullets li::before {
  color: var(--ecosistema-accent, #0c8ce9);
}

/* Barritas slide 04 = misma tipografía que Feed en vivo (slide 03) */
.ecosistema__stickers .exp-sticker__tag,
.exp-sticker--4a .exp-sticker__tag,
.exp-sticker--4b .exp-sticker__tag {
  font-family: "DM Mono", ui-monospace, monospace;
  font-size: var(--exp-tag-size, calc(9px * var(--exp-scale)));
  font-weight: 500;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  line-height: 1.2;
  white-space: nowrap;
  text-wrap: nowrap;
}

/* Logo + flecha central */
.exp-arrow {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  align-self: center;
}

.exp-arrow__badge {
  display: inline-flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  gap: clamp(6px, 1vw, 10px);
  box-sizing: border-box;
  padding: 5px clamp(10px, 1.4vw, 14px) 5px 8px;
  border-radius: 8px;
  background: var(--exp-ink, #0c0b09);
}

.exp-arrow__logo {
  display: block;
  flex-shrink: 0;
  width: auto;
  height: auto;
  max-height: var(--exp-arrow-size, 20px);
  max-width: none;
  aspect-ratio: 952 / 141;
  object-fit: contain;
}

/* Grupos de flechas (web: 2 a cada lado del logo) */
.exp-arrow__hints {
  display: none;
  align-items: center;
  gap: 5px;
  flex-shrink: 0;
}

/* Flecha animada (#fe6abe; altura = logo en web) */
.exp-arrow__hint {
  --exp-arrow-color: #fe6abe;
  --exp-arrow-size: 20px;
  display: block;
  flex-shrink: 0;
  width: 0;
  height: 0;
  margin: 0;
  border-top: calc(var(--exp-arrow-size) / 2) solid transparent;
  border-bottom: calc(var(--exp-arrow-size) / 2) solid transparent;
  border-left: 12px solid var(--exp-arrow-color);
  border-right: none;
  animation: exp-arrow-hint-right 1.15s ease-in-out infinite;
}

.exp-arrow__hint--mobile {
  display: none;
}

.exp-arrow__hints--left .exp-arrow__hint {
  border-left: none;
  border-right: 12px solid var(--exp-arrow-color);
  animation: exp-arrow-hint-left 1.15s ease-in-out infinite;
}

@keyframes exp-arrow-hint-right {
  0%,
  100% {
    transform: translateX(0);
  }

  50% {
    transform: translateX(6px);
  }
}

@keyframes exp-arrow-hint-left {
  0%,
  100% {
    transform: translateX(0);
  }

  50% {
    transform: translateX(-6px);
  }
}

@keyframes exp-arrow-hint-down {
  0%,
  100% {
    transform: translateY(0);
  }

  50% {
    transform: translateY(6px);
  }
}

@media (prefers-reduced-motion: reduce) {
  .exp-arrow__hint {
    animation: none;
  }
}

.exp-flow__col {
  display: flex;
  flex-direction: column;
  flex-shrink: 0;
  gap: clamp(calc(14px * var(--exp-scale)), calc(2.5vw * var(--exp-scale)), calc(20px * var(--exp-scale)));
  width: 100%;
  max-width: var(--exp-sticker-max);
  min-width: 0;
}

/* Web: fila horizontal; recuadros de ancho similar (sin estirar a la derecha) */
@media (min-width: 681px) {
  /*
   * Slide 03 web: recuadros de color + textos × --exp-scale; huincha negra fija en --exp-tag-scale (1.28).
   */
  #deck-experiencia,
  #deck-experiencia.page {
    --exp-scale: 1.42;
    --exp-tag-scale: 1.28;
    --exp-sticker-max: min(calc(var(--exp-sticker-base) * var(--exp-scale)), 100%);
    --exp-sticker-pair-max: min(
      calc((var(--exp-sticker-base) + 36px) * var(--exp-scale)),
      100%
    );
    --exp-tag-size: calc(9px * var(--exp-tag-scale));
    --exp-body-size: clamp(
      calc(10px * var(--exp-scale)),
      calc(1.8vw * var(--exp-scale)),
      calc(11px * var(--exp-scale))
    );
    --exp-flow-safe-bottom: clamp(24px, 3.5vh, 52px);
  }

  #deck-experiencia.page {
    display: flex;
    flex-direction: column;
    min-height: 0;
    overflow: hidden;
  }

  #deck-experiencia .page__body {
    flex: 1 1 auto;
    min-height: 0;
    display: flex;
    flex-direction: column;
    justify-content: center;
    overflow-x: hidden;
    overflow-y: hidden;
    padding-bottom: calc(
      var(--deck-dock-height, 0px) + var(--exp-flow-safe-bottom) + env(safe-area-inset-bottom, 0px)
    );
    box-sizing: border-box;
  }

  #deck-experiencia .exp-sticker__tag,
  #deck-experiencia .exp-sticker__tag.t-mono {
    min-height: calc(28px * var(--exp-tag-scale));
    padding: clamp(calc(6px * var(--exp-tag-scale)), calc(1vw * var(--exp-tag-scale)), calc(8px * var(--exp-tag-scale)))
      clamp(calc(14px * var(--exp-scale)), calc(2vw * var(--exp-scale)), calc(20px * var(--exp-scale)));
    font-size: var(--exp-tag-size);
  }

  /*
   * Composición web: col. izq. = 1 recuadro; col. der. = 2 apilados.
   * align-items: center alinea el eje vertical del azul con el bloque rosa+verde.
   */
  #deck-experiencia .exp-flow {
    display: grid;
    grid-template-columns: var(--exp-sticker-max) auto var(--exp-sticker-pair-max);
    justify-content: center;
    align-items: center;
    gap: clamp(calc(14px * var(--exp-scale)), calc(2vw * var(--exp-scale)), calc(24px * var(--exp-scale)));
    margin-top: 0;
    margin-bottom: 0;
    width: 100%;
    max-width: min(calc(980px * var(--exp-scale)), 100%);
    max-height: 100%;
    margin-inline: auto;
    flex-shrink: 1;
    min-height: 0;
  }

  #deck-experiencia .exp-sticker__split {
    min-height: 0;
  }

  /* Viewports bajos: escala proporcional para que quepa sin scroll */
  @media (max-height: 920px) {
    #deck-experiencia,
    #deck-experiencia.page {
      --exp-scale: 1.32;
      --exp-sticker-max: min(calc(var(--exp-sticker-base) * var(--exp-scale)), 100%);
      --exp-sticker-pair-max: min(
        calc((var(--exp-sticker-base) + 36px) * var(--exp-scale)),
        100%
      );
      --exp-body-size: clamp(
        calc(10px * var(--exp-scale)),
        calc(1.8vw * var(--exp-scale)),
        calc(11px * var(--exp-scale))
      );
    }
  }

  /* MacBook 15" y viewports bajos: escala menor en recuadros; huincha negra sin cambio */
  @media (max-height: 860px) {
    #deck-experiencia,
    #deck-experiencia.page {
      --exp-scale: 1.25;
      --exp-tag-scale: 1.28;
      --exp-sticker-max: min(calc(var(--exp-sticker-base) * var(--exp-scale)), 100%);
      --exp-sticker-pair-max: min(
        calc((var(--exp-sticker-base) + 36px) * var(--exp-scale)),
        100%
      );
      --exp-body-size: clamp(
        calc(10px * var(--exp-scale)),
        calc(1.8vw * var(--exp-scale)),
        calc(11px * var(--exp-scale))
      );
    }
  }

  @media (max-height: 760px) {
    #deck-experiencia,
    #deck-experiencia.page {
      --exp-scale: 1.12;
      --exp-sticker-max: min(calc(var(--exp-sticker-base) * var(--exp-scale)), 100%);
      --exp-sticker-pair-max: min(
        calc((var(--exp-sticker-base) + 36px) * var(--exp-scale)),
        100%
      );
      --exp-body-size: clamp(
        calc(10px * var(--exp-scale)),
        calc(1.8vw * var(--exp-scale)),
        calc(11px * var(--exp-scale))
      );
    }

    #deck-experiencia .page__title {
      font-size: clamp(32px, 4.2vw, 56px);
      margin-bottom: clamp(4px, 1vh, 10px);
    }
  }

  @media (max-height: 680px) {
    #deck-experiencia,
    #deck-experiencia.page {
      --exp-scale: 1;
      --exp-sticker-max: min(calc(var(--exp-sticker-base) * var(--exp-scale)), 100%);
      --exp-sticker-pair-max: min(
        calc((var(--exp-sticker-base) + 36px) * var(--exp-scale)),
        100%
      );
      --exp-body-size: clamp(
        calc(10px * var(--exp-scale)),
        calc(1.8vw * var(--exp-scale)),
        calc(11px * var(--exp-scale))
      );
    }
  }

  #deck-experiencia .exp-sticker--1 {
    grid-column: 1;
    width: 100%;
    max-width: var(--exp-sticker-max);
    align-self: center;
  }

  #deck-experiencia .exp-arrow {
    grid-column: 2;
    align-self: center;
  }

  .exp-arrow__badge {
    flex-direction: row;
    padding: 5px clamp(10px, 1.4vw, 14px);
  }

  .exp-arrow__hints {
    display: inline-flex;
  }

  .exp-arrow__hints .exp-arrow__hint {
    animation-delay: 0s;
  }

  .exp-arrow__hint--mobile {
    display: none !important;
  }

  .exp-arrow__hint,
  .exp-arrow__hints--left .exp-arrow__hint,
  .exp-arrow__hints--right .exp-arrow__hint {
    border-left: 12px solid var(--exp-arrow-color, #fe6abe);
    border-right: none;
    animation: exp-arrow-hint-right 1.15s ease-in-out infinite;
  }

  #deck-experiencia .exp-flow__col {
    grid-column: 3;
    width: 100%;
    max-width: var(--exp-sticker-pair-max);
    gap: calc(20px * var(--exp-scale));
    align-self: center;
  }

  #deck-experiencia .exp-sticker--2,
  #deck-experiencia .exp-sticker--3 {
    width: 100%;
    max-width: var(--exp-sticker-pair-max);
  }

  /* Verde — bullets centrados en columna derecha (como el párrafo del recuadro rosa) */
  #deck-experiencia .exp-sticker--3 .exp-sticker__detail-col {
    justify-content: center;
  }

  #deck-experiencia .exp-sticker--3 .exp-sticker__desc.exp-sticker__bullets {
    flex: 0 1 auto;
    align-self: stretch;
    justify-content: center;
  }
}

/* Móvil: columna (arriba → abajo) */
@media (max-width: 680px) {
  #deck-experiencia,
  #deck-experiencia.page {
    --exp-scale: 1;
    --exp-tag-size: 10px;
    --exp-body-size: clamp(12px, 3.35vw, 14px);
  }

  #deck-experiencia.page {
    display: flex;
    flex-direction: column;
    height: 100%;
    min-height: 0;
    max-height: 100%;
    box-sizing: border-box;
    overflow-x: hidden;
    overflow-y: hidden;
    overscroll-behavior: none;
    touch-action: pan-x pinch-zoom;
    padding-bottom: 0;
    scroll-padding-bottom: 0;
  }

  #deck-experiencia .page__title {
    flex-shrink: 0;
    margin-bottom: 8px;
  }

  #deck-experiencia .page__body {
    flex: 1 1 0;
    min-height: 0;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: stretch;
    padding-bottom: 0;
  }

  /* 3 recuadros + flecha: bloque centrado entre título y dock (sin scroll) */
  #deck-experiencia .exp-flow {
    flex: 0 0 auto;
    min-height: 0;
    overflow: visible;
    width: 100%;
    max-width: 100%;
    margin-top: 0;
    gap: clamp(8px, 2vw, 10px);
  }

  #deck-experiencia .exp-flow__col {
    flex-shrink: 0;
    min-height: 0;
    overflow: visible;
    width: 100%;
    max-width: 100%;
  }

  .exp-flow {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: clamp(8px, 2vw, 10px);
    margin-top: 0;
    max-width: 100%;
  }

  .exp-flow__col {
    gap: 10px;
  }

  .exp-sticker,
  .exp-flow__col {
    width: 100%;
    max-width: 100%;
  }

  #deck-experiencia .exp-sticker {
    flex-shrink: 0;
    --exp-sticker-r: calc(12px * var(--exp-scale));
    border-radius: var(--exp-sticker-r);
    overflow: hidden;
  }

  #deck-experiencia .exp-sticker__tag {
    min-height: 28px;
    padding-top: 7px;
    padding-bottom: 7px;
    font-size: var(--exp-tag-size);
    border-radius: var(--exp-sticker-r) var(--exp-sticker-r) 0 0;
  }

  #deck-experiencia .exp-sticker__split {
    min-height: 0;
    align-items: stretch;
    overflow: visible;
  }

  #deck-experiencia .exp-sticker__title-col,
  #deck-experiencia .exp-sticker__detail-col {
    min-height: 0;
  }

  #deck-experiencia .exp-sticker--2 .exp-sticker__title-col,
  #deck-experiencia .exp-sticker--3 .exp-sticker__title-col {
    flex: 0 0 clamp(78px, 22vw, 96px);
  }

  #deck-experiencia .exp-sticker__title {
    min-height: 0;
    justify-content: center;
    padding: 12px 9px;
    font-size: clamp(20px, 5.4vw, 25px);
  }

  #deck-experiencia .exp-sticker__title--sm {
    font-size: clamp(15px, 4vw, 18px);
    line-height: 0.96;
  }

  #deck-experiencia .exp-sticker__meta {
    padding: 9px 11px;
  }

  #deck-experiencia .exp-sticker__mono {
    display: none;
  }

  #deck-experiencia .exp-sticker__meta {
    padding-top: 10px;
    padding-bottom: 10px;
  }

  #deck-experiencia .exp-sticker__big {
    font-size: clamp(14px, 4.1vw, 18px);
    letter-spacing: 0.03em;
    line-height: 1.05;
    white-space: nowrap;
  }

  #deck-experiencia .exp-sticker__big .exp-sticker__title-line {
    display: inline;
    margin-top: 0;
    white-space: inherit;
  }

  #deck-experiencia .exp-sticker__big .exp-sticker__title-line + .exp-sticker__title-line::before {
    content: " ";
  }

  #deck-experiencia .exp-sticker__big--pantallas {
    white-space: nowrap;
  }

  #deck-experiencia .exp-sticker__big--pantallas .exp-sticker__title-line {
    display: inline;
  }

  #deck-experiencia .exp-sticker__desc {
    flex: 1 1 auto;
    min-height: 0;
    padding: 10px clamp(12px, 3.4vw, 15px) 10px 11px;
    font-size: var(--exp-body-size);
    line-height: 1.32;
  }

  #deck-experiencia .exp-sticker--3 .exp-sticker__desc.exp-sticker__bullets {
    padding: 10px clamp(10px, 2.8vw, 12px);
  }

  #deck-experiencia .exp-sticker__bullets {
    gap: 6px;
  }

  #deck-experiencia .exp-sticker--2,
  #deck-experiencia .exp-sticker--3 {
    width: 100%;
    max-width: 100%;
  }

  #deck-experiencia .exp-flow__col {
    max-width: 100%;
  }

  .exp-arrow {
    align-self: center;
  }

  /* Móvil: recuadro horizontal — logo + flecha a cada lado (apuntan abajo) */
  .exp-arrow__badge {
    flex-direction: row;
    align-items: center;
    gap: 5px;
    padding: 6px 7px;
    overflow: hidden;
  }

  .exp-arrow__hints {
    display: inline-flex;
    align-items: center;
    flex-shrink: 0;
  }

  /* Móvil: una sola flecha por lado (la 2.ª solo existe para web) */
  .exp-arrow__hints .exp-arrow__hint:nth-child(n + 2) {
    display: none;
  }

  .exp-arrow__hint--mobile {
    display: none !important;
  }

  .exp-arrow__hint,
  .exp-arrow__hints--left .exp-arrow__hint,
  .exp-arrow__hints--right .exp-arrow__hint {
    --exp-arrow-size: 8px;
    border-left: 6px solid transparent;
    border-right: 6px solid transparent;
    border-top: var(--exp-arrow-size) solid var(--exp-arrow-color, #fe6abe);
    border-bottom: none;
    animation: exp-arrow-hint-down-m 1s linear infinite;
    animation-delay: 0s;
  }

  .exp-arrow__logo {
    max-height: var(--exp-arrow-size, 8px);
    height: auto;
    width: auto;
  }

  @media (max-height: 760px) {
    #deck-experiencia,
    #deck-experiencia.page {
      --exp-scale: 0.92;
    }

    #deck-experiencia .exp-flow {
      gap: 8px;
      margin-top: 4px;
    }
  }

  @media (max-height: 680px) {
    #deck-experiencia,
    #deck-experiencia.page {
      --exp-scale: 0.84;
    }

    #deck-nucleo .nucleo__grid {
      max-height: min(16svh, 54vw);
    }
  }
}

@keyframes exp-arrow-hint-down-m {
  0%,
  100% {
    transform: translateY(0);
  }

  50% {
    transform: translateY(3px);
  }
}

/* Slide 02 — video de fondo (móvil); oculto en web y fuera de la slide */
.deck-shell__nucleo-bg-video {
  display: none;
  position: fixed;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center center;
  z-index: 0;
  pointer-events: none;
  background: var(--void);
}

/* Slide 02 — fondo transparente; foto en capa fija a pantalla completa */
.deck-shell:has(#deck-nucleo[aria-hidden="false"]) {
  background: transparent;
}

.deck-shell:has(#deck-nucleo[aria-hidden="false"])::after {
  content: "";
  position: fixed;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  background-image:
    linear-gradient(
      to bottom,
      rgba(12, 11, 9, 0.18) 0%,
      rgba(12, 11, 9, 0.08) 45%,
      rgba(12, 11, 9, 0.48) 100%
    ),
    url("../assets/publico_slide_3.jpg");
  background-size: cover;
  background-position: center 14%;
  background-repeat: no-repeat;
}

/*
 * Slide 02 — zona segura sin achicar la grilla:
 * - La slide no hace scroll; el body encaja en el stage (sin scroll vertical).
 * - 100cqh en el body = espacio real bajo el título, encima del dock en flujo.
 * - padding inferior para que la grilla nunca quede bajo las pestañas.
 */
#deck-nucleo.page {
  --exp-ink: #0c0b09;
  --exp-line: 1px solid #0c0b09;
  background: transparent;
  display: flex;
  flex-direction: column;
  height: 100%;
  min-height: 0;
  overflow: hidden;
}

#deck-nucleo .page__label,
#deck-nucleo .page__title {
  flex-shrink: 0;
}

#deck-nucleo .page__label {
  color: #aaff8f;
}

#deck-nucleo .page__body {
  flex: 1 1 auto;
  min-height: 0;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  overflow-x: hidden;
  overflow-y: hidden;
  overscroll-behavior: none;
  container-type: size;
  container-name: nucleo-body;
  padding-bottom: 0;
}

@media (min-width: 681px) {
  #deck-nucleo .page__body {
    align-items: stretch;
    padding-bottom: max(32px, var(--page-safe-bottom), env(safe-area-inset-bottom, 0px));
  }
}

#deck-ecosistema.page {
  display: flex;
  flex-direction: column;
}

#deck-ecosistema .page__body {
  flex: 1 1 auto;
  min-height: 0;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: stretch;
  gap: clamp(14px, 2.5vw, 24px);
}

/* Recuadros con pestaña — slides 02 y 04 (mismo componente que interior slide 03) */
.deck-col-card {
  --deck-col-bg: #c597d8;
  --deck-col-tag: #c597d8;
  --deck-col-text: #0c0b09;
  --deck-col-ink: #0c0b09;
  --deck-col-line: 1px solid #0c0b09;
  width: 100%;
  max-width: 100%;
  border-radius: 12px;
  overflow: hidden;
  flex-shrink: 0;
}

.deck-col-card__inner {
  display: flex;
  flex-direction: column;
  width: 100%;
}

.deck-col-card__tag {
  margin: 0;
  width: 100%;
  box-sizing: border-box;
  padding: clamp(6px, 1vw, 8px) clamp(14px, 2vw, 20px);
  font-family: "DM Mono", ui-monospace, monospace;
  font-size: 9px;
  font-weight: 500;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  line-height: 1.2;
  background: var(--deck-col-ink);
  color: var(--deck-col-tag);
  border-bottom: var(--deck-col-line);
}

.deck-col-card__tag-line {
  display: block;
}

.deck-col-card__tag-line + .deck-col-card__tag-line {
  margin-top: 0.15em;
}

.deck-col-card__card {
  padding: 10px;
  background: var(--deck-col-bg);
  box-sizing: border-box;
  width: 100%;
}

/* Panel interior con borde fino (como .exp-sticker__split) */
.deck-col-card__panel {
  border: var(--deck-col-line);
  box-sizing: border-box;
  min-height: clamp(72px, 12vh, 96px);
  padding: clamp(8px, 1.5vw, 10px) clamp(12px, 2vw, 14px);
}

.deck-col-card__text,
.deck-col-card__list li {
  margin: 0;
  font-size: clamp(10px, 1.8vw, 11px);
  font-weight: 700;
  line-height: 1.55;
  color: var(--deck-col-text);
  text-align: left;
  text-wrap: wrap;
  overflow-wrap: break-word;
  hyphens: none;
}

.deck-col-card__text + .deck-col-card__text {
  margin-top: clamp(8px, 1.4vw, 10px);
  padding-top: clamp(8px, 1.4vw, 10px);
  border-top: var(--deck-col-line);
}

.deck-col-card__accent {
  color: var(--deck-col-ink);
}

.deck-col-card__list {
  margin: 0;
  padding: 0;
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: clamp(6px, 1.1vw, 8px);
}

.deck-col-card__list li {
  padding: 0 0 0 1.05em;
  position: relative;
}

.deck-col-card__list li::before {
  content: "•";
  position: absolute;
  left: 0;
  line-height: inherit;
  color: var(--deck-col-text);
}

.deck-col-card--purple {
  --deck-col-bg: #c597d8;
  --deck-col-tag: #c597d8;
}

.deck-col-card--mint {
  --deck-col-bg: #4edfb5;
  --deck-col-tag: #4edfb5;
}

/* Slide 02: párrafos un poco más grandes dentro del mismo panel */
.deck-col-card--prose .deck-col-card__text {
  font-size: clamp(11px, 1.9vw, 13px);
  line-height: 1.5;
}

.deck-col-card--prose .deck-col-card__text--lede {
  font-size: clamp(12px, 2vw, 14px);
  line-height: 1.45;
}

/*
 * Slide 02 — recuadro sticker (referencia 1536×342)
 * Tipografía y márgenes en % del alto del sticker (cqh) para que escale junto al recuadro.
 * Barra negra: mismo font-size que .exp-sticker__tag (slide 03); no escala con --nucleo-sticker-scale.
 *
 * IMPORTANTE (evitar colapso del recuadro en web):
 * No combinar en .nucleo__sticker: min-width:0 + width:fit-content + hijos width:max-content
 * cuando el sticker usa container-type:size y fuentes en cqh — el ancho intrínseco queda ~0.
 * En web el ancho lo fija --nucleo-sticker-w; --nucleo-sticker-scale escala alto/ancho y cqh a la vez.
 */
#deck-nucleo {
  --nucleo-sticker-scale: 1.3;
  /* Mismo cálculo que #deck-experiencia --exp-tag-size (CONTENIDO GENERADO POR USUARIOS) */
  --exp-scale: 1.28;
  --nucleo-topbar-font-size: calc(9px * var(--exp-scale));
}

#deck-nucleo .crowds-sticker {
  --crowds-sticker-ink: var(--deck-chrome-bg, #141315);
  --crowds-sticker-lime: #d7dd03;
  --sticker-outer-r: 4cqh;
  --sticker-pad: 1.15cqh;
  /* Huincha negra: píldora completa (sin tope que achique el radio) */
  --sticker-topbar-r: calc(var(--sticker-topbar-h) / 2);
  --sticker-topbar-h: 14.8cqh;
  --sticker-topbar-pad-x: 3.6cqh;
  --sticker-topbar-pad-y: 0.85cqh;
  --sticker-stack-gap: 0.7cqh;
  /* Esquinas inf. del marco = mismo radio que el recuadro verde */
  --sticker-frame-br: var(--sticker-outer-r);
  --sticker-frame-inset-top: 0.9cqh;
  --sticker-frame-inset-bottom: 0.65cqh;
  --sticker-line: 2px;
  --sticker-line-gap: 2.5cqh;
  --sticker-icon-pad-y: 1.1cqh;
  --sticker-icon-pad-left: 0.85cqh;
  --sticker-icon-pad-right: var(--sticker-line-gap);
  --sticker-text-pad-left: 3.65cqh;
  --sticker-text-pad-right: 0.55cqh;
  box-sizing: border-box;
  container-type: size;
  container-name: crowds-sticker;
  position: relative;
  display: flex;
  flex-direction: column;
  gap: var(--sticker-stack-gap);
  width: 100%;
  height: 100%;
  overflow: hidden;
  background: var(--crowds-sticker-lime);
  border: none;
  border-radius: var(--sticker-outer-r);
  padding: var(--sticker-pad);
  color: var(--crowds-sticker-ink);
  isolation: isolate;
}

#deck-nucleo .crowds-sticker__topbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 2cqh;
  flex: 0 0 var(--sticker-topbar-h);
  min-height: var(--sticker-topbar-h);
  width: 100%;
  padding: var(--sticker-topbar-pad-y) var(--sticker-topbar-pad-x);
  border-radius: 9999px;
  background: var(--crowds-sticker-ink);
  color: var(--crowds-sticker-lime);
  box-sizing: border-box;
}

#deck-nucleo .crowds-sticker__brand,
#deck-nucleo .crowds-sticker__tagline {
  margin: 0;
  font-family: "DM Mono", ui-monospace, monospace;
  font-size: var(--nucleo-topbar-font-size);
  font-weight: 500;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  line-height: 1.2;
}

#deck-nucleo .crowds-sticker__brand {
  flex-shrink: 0;
}

#deck-nucleo .crowds-sticker__tagline {
  text-align: right;
  max-width: none;
  margin: 0 0 0 auto;
}

#deck-nucleo .crowds-sticker__brand.t-mono,
#deck-nucleo .crowds-sticker__tagline.t-mono {
  font-size: var(--nucleo-topbar-font-size);
  letter-spacing: 0.18em;
}

/* Marco: grilla 3 col. (icono | vertical | textos); inf. curva = radio interior del verde */
#deck-nucleo .crowds-sticker__content {
  display: grid;
  grid-template-columns: auto var(--sticker-line) minmax(0, 1fr);
  grid-template-rows: auto auto auto;
  align-items: stretch;
  flex: 1 1 auto;
  min-height: 0;
  margin-top: 0;
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
  position: relative;
  border: none;
  box-shadow: none;
  border-radius: 0 0 var(--sticker-frame-br) var(--sticker-frame-br);
  padding: 0;
  overflow: hidden;
}

#deck-nucleo .crowds-sticker__content::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 2;
  border: var(--sticker-line) solid var(--crowds-sticker-ink);
  border-radius: inherit;
  pointer-events: none;
}

#deck-nucleo .crowds-sticker__icon-zone {
  grid-column: 1;
  grid-row: 1 / -1;
  display: flex;
  align-items: center;
  justify-content: center;
  width: auto;
  min-height: 0;
  border-bottom-left-radius: var(--sticker-frame-br);
  overflow: hidden;
  padding: calc(var(--sticker-frame-inset-top) + var(--sticker-icon-pad-y)) var(--sticker-icon-pad-right)
    calc(var(--sticker-frame-inset-bottom) + var(--sticker-icon-pad-y)) var(--sticker-icon-pad-left);
  box-sizing: border-box;
}

#deck-nucleo .crowds-sticker__rule-v {
  grid-column: 2;
  grid-row: 1 / -1;
  width: 100%;
  min-width: var(--sticker-line);
  background: var(--crowds-sticker-ink);
  justify-self: stretch;
  align-self: stretch;
}

#deck-nucleo .crowds-sticker__globe {
  display: block;
  flex-shrink: 0;
  object-fit: contain;
  object-position: center;
}

#deck-nucleo .crowds-sticker__globe--lg {
  width: auto;
  height: 52cqh;
  max-height: 100%;
  max-width: 100%;
}

#deck-nucleo .crowds-sticker__main {
  display: contents;
}

#deck-nucleo .crowds-sticker__headline {
  grid-column: 3;
  grid-row: 1;
  display: block;
  align-self: stretch;
  justify-self: stretch;
  width: 100%;
  max-width: 100%;
  margin: 0;
  padding: var(--sticker-frame-inset-top) var(--sticker-text-pad-right) 0 var(--sticker-text-pad-left);
  box-sizing: border-box;
  font-family: "Bebas Neue", sans-serif;
  font-weight: 400;
  font-size: 16.2cqh;
  line-height: 0.95;
  letter-spacing: 0.01em;
  text-transform: uppercase;
  text-wrap: wrap;
  white-space: normal;
  -webkit-font-smoothing: antialiased;
}

#deck-nucleo .crowds-sticker__headline.t-display {
  letter-spacing: 0.01em;
}

#deck-nucleo .crowds-sticker__headline {
  background: var(--crowds-sticker-lime);
  color: var(--crowds-sticker-ink);
}

#deck-nucleo .crowds-sticker__headline-text {
  display: block;
  width: 100%;
}

#deck-nucleo .crowds-sticker__headline-brand,
#deck-nucleo .crowds-sticker__headline-accent {
  color: var(--crowds-sticker-ink);
}

#deck-nucleo .crowds-sticker__divider {
  grid-column: 2 / -1;
  grid-row: 2;
  align-self: stretch;
  justify-self: stretch;
  height: var(--sticker-line);
  margin: 0;
  width: auto;
  padding: 0;
  background: var(--crowds-sticker-ink);
}

#deck-nucleo .crowds-sticker__body {
  grid-column: 3;
  grid-row: 3;
  display: block;
  align-self: stretch;
  justify-self: stretch;
  width: 100%;
  max-width: 100%;
  margin: 0;
  padding: 0 var(--sticker-text-pad-right) var(--sticker-frame-inset-bottom) var(--sticker-text-pad-left);
  box-sizing: border-box;
  border-bottom-right-radius: var(--sticker-frame-br);
  overflow: hidden;
  font-family: "Archivo", system-ui, sans-serif;
  font-size: 8.8cqh;
  font-weight: 400;
  line-height: 1.22;
  letter-spacing: 0.01em;
}

/* ── Layout slide 02: grilla + recuadro ────────────────────────────────── */
.nucleo__layout {
  display: flex;
  flex-direction: column;
  flex-shrink: 0;
  gap: 12px;
  width: 100%;
  align-items: stretch;
}

/* Móvil — slide 02: contenido encaja en el stage (sin scroll vertical) */
@media (max-width: 680px) {
  :root {
    --deck-marquee-title-fs: clamp(44px, 11.5vw, 58px);
  }

  /* Slide 01 móvil — marquee full-bleed (misma lógica y ritmo que slides 02–04) */
  #deck-momento .momento__title-stack {
    display: none;
  }

  #deck-momento .momento__title-desk {
    display: none;
  }

  #deck-momento .momento__title-marquee {
    display: block;
    width: 100%;
  }

  #deck-momento .momento__cluster > .page__title.page__title--stack {
    font-size: var(--deck-marquee-title-fs);
    line-height: 0.9;
    margin-bottom: 8px;
    width: 100vw;
    max-width: 100vw;
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
    padding-inline: 0;
    overflow: hidden;
    white-space: normal;
    text-wrap: wrap;
    color: #ffffff;
    -webkit-text-fill-color: currentColor;
  }

  #deck-momento .momento__title-marquee__viewport {
    overflow: hidden;
    width: 100vw;
    max-width: 100vw;
  }

  #deck-momento .momento__title-marquee__track {
    display: inline-flex;
    width: max-content;
    will-change: transform;
    animation: nucleo-title-marquee-m var(--marquee-duration, 20s) linear infinite;
    animation-play-state: running;
  }

  /* pausa global vía aria-hidden */

  #deck-momento .momento__title-marquee__chunk {
    display: inline-flex;
    flex-shrink: 0;
    align-items: center;
    gap: clamp(14px, 4vw, 22px);
    padding-right: clamp(10px, 3vw, 16px);
  }

  #deck-momento .momento__title-marquee__text {
    white-space: nowrap;
    font-size: inherit;
    line-height: inherit;
    letter-spacing: inherit;
  }

  #deck-momento .momento__title-marquee__dot {
    flex-shrink: 0;
    width: clamp(6px, 1.6vw, 9px);
    height: clamp(6px, 1.6vw, 9px);
    border-radius: 50%;
    background: var(--dock-pill-active, #c597d8);
    align-self: center;
  }

  #deck-nucleo {
    --exp-scale: 1;
    --nucleo-topbar-font-size: 10px;
    --nucleo-m-headline: clamp(18px, 5.2vw, 25px);
    --nucleo-m-body: clamp(11.5px, 3.35vw, 16px);
    --nucleo-m-icon: clamp(52px, 22vw, 72px);
    --nucleo-m-safe-bottom: clamp(24px, 4.5vh, 40px);
    --nucleo-m-sticker-pad-x: clamp(16px, 4.5vw, 22px);
    --nucleo-m-sticker-pad-y: clamp(11px, 3vw, 15px);
    --nucleo-m-sticker-topbar-x: clamp(14px, 4vw, 18px);
    --nucleo-m-sticker-icon-x: clamp(12px, 3.6vw, 16px);
  }

  #deck-nucleo.page {
    display: flex;
    flex-direction: column;
    height: 100%;
    min-height: 0;
    max-height: 100%;
    box-sizing: border-box;
    overflow-x: hidden;
    overflow-y: hidden;
    overscroll-behavior: none;
    touch-action: pan-x pinch-zoom;
    padding-bottom: 0;
  }

  /* Por encima de .page__title (min 36px): 8vw quedaba ~31px y no se notaba el cambio */
  .deck__track .page#deck-nucleo > .page__title,
  #deck-nucleo .page__title.t-display {
    font-size: var(--deck-marquee-title-fs);
    line-height: 0.9;
    margin-bottom: 8px;
    width: 100vw;
    max-width: 100vw;
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
    padding-inline: 0;
    overflow: hidden;
    white-space: normal;
    text-wrap: wrap;
  }

  #deck-nucleo .nucleo__title-desk {
    display: none;
  }

  #deck-nucleo .nucleo__title-marquee {
    display: block;
    width: 100%;
  }

  #deck-nucleo .nucleo__title-marquee__viewport {
    overflow: hidden;
    width: 100vw;
    max-width: 100vw;
  }

  #deck-nucleo .nucleo__title-marquee__track {
    display: inline-flex;
    width: max-content;
    will-change: transform;
    animation: nucleo-title-marquee-m var(--marquee-duration, 20s) linear infinite;
    animation-play-state: running;
  }

  /* pausa global vía aria-hidden */

  #deck-nucleo .nucleo__title-marquee__chunk {
    display: inline-flex;
    flex-shrink: 0;
    align-items: center;
    gap: clamp(14px, 4vw, 22px);
    padding-right: clamp(10px, 3vw, 16px);
  }

  #deck-nucleo .nucleo__title-marquee__text {
    white-space: nowrap;
    font-size: inherit;
    line-height: inherit;
    letter-spacing: inherit;
  }

  #deck-nucleo .nucleo__title-marquee__dot {
    flex-shrink: 0;
    width: clamp(6px, 1.6vw, 9px);
    height: clamp(6px, 1.6vw, 9px);
    border-radius: 50%;
    background: var(--dock-pill-active, #c597d8);
    align-self: center;
  }

  #deck-experiencia .experiencia__title-desk,
  #deck-ecosistema .ecosistema__title-desk {
    display: none;
  }

  #deck-experiencia .experiencia__title-marquee,
  #deck-ecosistema .ecosistema__title-marquee {
    display: block;
    width: 100%;
  }

  /* Slides 03 y 04 móvil — mismo tamaño que marquee de slide 02 */
  #deck-experiencia .page__title.page__title--marquee,
  .deck__track .page#deck-experiencia > .page__title.page__title--marquee,
  #deck-ecosistema .ecosistema__title.page__title--marquee,
  .deck__track .page#deck-ecosistema > .ecosistema__title.page__title--marquee {
    font-size: var(--deck-marquee-title-fs);
    line-height: 0.9;
    margin-bottom: 8px;
    width: 100vw;
    max-width: 100vw;
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
    padding-inline: 0;
    overflow: hidden;
    white-space: normal;
    text-wrap: wrap;
  }

  #deck-experiencia .experiencia__title-marquee__viewport,
  #deck-ecosistema .ecosistema__title-marquee__viewport {
    overflow: hidden;
    width: 100vw;
    max-width: 100vw;
  }

  #deck-experiencia .experiencia__title-marquee__track,
  #deck-ecosistema .ecosistema__title-marquee__track {
    display: inline-flex;
    width: max-content;
    will-change: transform;
    /* Mismo ritmo que slide 02 */
    animation: nucleo-title-marquee-m var(--marquee-duration, 20s) linear infinite;
    animation-play-state: running;
  }

  /* pausa global vía aria-hidden */

  #deck-experiencia .experiencia__title-marquee__chunk,
  #deck-ecosistema .ecosistema__title-marquee__chunk {
    display: inline-flex;
    flex-shrink: 0;
    align-items: center;
    gap: clamp(14px, 4vw, 22px);
    padding-right: clamp(10px, 3vw, 16px);
  }

  #deck-experiencia .experiencia__title-marquee__text,
  #deck-ecosistema .ecosistema__title-marquee__text {
    white-space: nowrap;
    font-size: inherit;
    line-height: inherit;
    letter-spacing: inherit;
  }

  #deck-experiencia .experiencia__title-marquee__dot,
  #deck-ecosistema .ecosistema__title-marquee__dot {
    flex-shrink: 0;
    width: clamp(6px, 1.6vw, 9px);
    height: clamp(6px, 1.6vw, 9px);
    border-radius: 50%;
    background: var(--dock-pill-active, #c597d8);
    align-self: center;
  }

  @media (prefers-reduced-motion: reduce) {
    #deck-momento .momento__title-marquee {
      display: none;
    }

    #deck-momento .momento__title-stack {
      display: none;
    }

    #deck-momento .momento__title-desk {
      display: block;
      white-space: nowrap;
      text-wrap: nowrap;
    }

    #deck-momento .momento__cluster > .page__title.page__title--stack {
      width: auto;
      max-width: 100%;
      margin-left: 0;
      margin-right: 0;
      padding-inline: 0;
      overflow: visible;
    }

    #deck-nucleo .nucleo__title-marquee {
      display: none;
    }

    #deck-nucleo .nucleo__title-desk {
      display: block;
      white-space: nowrap;
      text-wrap: nowrap;
    }

    #deck-experiencia .experiencia__title-marquee,
    #deck-ecosistema .ecosistema__title-marquee {
      display: none;
    }

    #deck-experiencia .experiencia__title-desk,
    #deck-ecosistema .ecosistema__title-desk {
      display: block;
      white-space: nowrap;
      text-wrap: nowrap;
    }
  }

  #deck-nucleo .page__body {
    flex: 1 1 0;
    min-height: 0;
    overflow: hidden;
    container-type: normal;
    padding-bottom: 0;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: stretch;
  }

  /* Grilla + recuadro verde apilados y centrados en conjunto (entre título y dock) */
  #deck-nucleo .nucleo__layout {
    flex: 0 0 auto;
    min-height: 0;
    display: flex;
    flex-direction: column;
    overflow: visible;
    gap: clamp(6px, 1.6vw, 10px);
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
    padding-bottom: 0;
  }

  @media (max-height: 780px) {
    #deck-nucleo .nucleo__grid {
      --nucleo-m-grid-h: min(13svh, 46vw);
    }
  }

  /*
   * Grilla móvil: 8×2 (16 fotos), formato vertical (celdas altas y angostas).
   * Altura total = la misma banda que la antigua 4×2 cuadrada (--nucleo-m-grid-h).
   */
  #deck-nucleo .nucleo__grid {
    --nucleo-m-grid-h: min(15svh, 52vw);
    flex: 0 0 auto;
    width: 100%;
    max-width: 100%;
    height: var(--nucleo-m-grid-h);
    max-height: var(--nucleo-m-grid-h);
    aspect-ratio: auto;
    margin-inline: auto;
    grid-template-columns: repeat(8, minmax(0, 1fr));
    grid-template-rows: repeat(2, minmax(0, 1fr));
    gap: 2px;
    overflow: hidden;
  }

  #deck-nucleo .nucleo__cell {
    aspect-ratio: auto;
    width: 100%;
    height: 100%;
    min-width: 0;
    min-height: 0;
  }

  #deck-nucleo .nucleo__cell img {
    object-fit: cover;
    object-position: center center;
  }

  #deck-nucleo .nucleo__sticker {
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
    flex: 0 0 auto;
    min-height: 0;
    height: auto;
    margin: 0;
    overflow: visible;
  }

  #deck-nucleo .crowds-sticker {
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
    container-type: normal;
    height: auto;
    min-height: 0;
    overflow: visible;
    --sticker-outer-r: calc(9px * var(--nucleo-sticker-scale));
    --sticker-pad: clamp(6px, 1.6vw, 9px);
    --sticker-topbar-r: calc(var(--sticker-topbar-h) / 2);
    --sticker-topbar-h: calc(28px * var(--nucleo-sticker-scale));
    --sticker-topbar-pad-x: var(--nucleo-m-sticker-topbar-x);
    --sticker-topbar-pad-y: calc(4px * var(--nucleo-sticker-scale));
    --sticker-stack-gap: calc(3px * var(--nucleo-sticker-scale));
    --sticker-frame-br: var(--sticker-outer-r);
    --sticker-frame-inset-top: calc(4px * var(--nucleo-sticker-scale));
    --sticker-frame-inset-bottom: calc(4px * var(--nucleo-sticker-scale));
    --sticker-line-gap: clamp(8px, 2.2vw, 12px);
    --sticker-icon-pad-y: calc(6px * var(--nucleo-sticker-scale));
    --sticker-icon-pad-left: var(--nucleo-m-sticker-icon-x);
    --sticker-icon-pad-right: var(--sticker-line-gap);
    --sticker-text-pad-left: var(--nucleo-m-sticker-pad-x);
    --sticker-text-pad-right: var(--nucleo-m-sticker-pad-x);
    border-radius: var(--sticker-outer-r);
    padding: var(--sticker-pad);
    overflow: visible;
  }

  #deck-nucleo .crowds-sticker__topbar {
    border-radius: var(--sticker-topbar-r);
    flex: 0 0 var(--sticker-topbar-h);
    min-height: var(--sticker-topbar-h);
    justify-content: space-between;
    padding: var(--sticker-topbar-pad-y) var(--sticker-topbar-pad-x);
    gap: calc(8px * var(--nucleo-sticker-scale));
  }

  #deck-nucleo .crowds-sticker__tagline {
    text-align: right;
    margin-left: auto;
    font-size: var(--nucleo-topbar-font-size);
    letter-spacing: 0.18em;
    line-height: 1.2;
  }

  /*
   * Slide 02 móvil — fila superior: icono | regla | headline; abajo: body a ancho completo.
   */
  #deck-nucleo .crowds-sticker__content {
    width: 100%;
    max-width: 100%;
    min-width: 0;
    min-height: auto;
    flex: none;
    align-items: stretch;
    grid-template-columns: auto var(--sticker-line) minmax(0, 1fr);
    grid-template-rows: auto var(--sticker-line) auto;
    grid-template-areas:
      "icon rule headline"
      "divider divider divider"
      "body body body";
    column-gap: 0;
    border-radius: 0 0 var(--sticker-frame-br) var(--sticker-frame-br);
    padding: 0;
    overflow: visible;
  }

  #deck-nucleo .crowds-sticker__main {
    display: contents;
  }

  #deck-nucleo .crowds-sticker__rule-v {
    grid-area: rule;
    display: block;
    align-self: stretch;
    justify-self: stretch;
    width: 100%;
    min-width: var(--sticker-line);
    background: var(--crowds-sticker-ink);
  }

  #deck-nucleo .crowds-sticker__icon-zone {
    grid-area: icon;
    align-self: center;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    width: auto;
    min-height: 0;
    padding: var(--nucleo-m-sticker-pad-y) var(--sticker-line-gap) var(--nucleo-m-sticker-pad-y)
      var(--nucleo-m-sticker-icon-x);
    border-bottom-left-radius: 0;
  }

  #deck-nucleo .crowds-sticker__globe--lg {
    height: var(--nucleo-m-icon);
    width: auto;
    max-height: 100%;
    max-width: 100%;
  }

  #deck-nucleo .crowds-sticker__divider {
    grid-area: divider;
    margin: 0;
    width: auto;
  }

  #deck-nucleo .crowds-sticker__headline {
    grid-area: headline;
    align-self: center;
    justify-self: stretch;
    display: block;
    width: 100%;
    max-width: none;
    min-width: 0;
    min-height: 0;
    height: auto;
    box-sizing: border-box;
    font-size: var(--nucleo-m-headline);
    line-height: 1.06;
    letter-spacing: 0.008em;
    text-align: left;
    text-wrap: wrap;
    white-space: normal;
    hyphens: none;
    overflow-wrap: normal;
    word-break: normal;
    padding-block: var(--nucleo-m-sticker-pad-y);
    padding-right: var(--nucleo-m-sticker-pad-x);
    padding-left: var(--sticker-line-gap);
  }

  #deck-nucleo .crowds-sticker__body {
    grid-area: body;
    align-self: center;
    justify-self: stretch;
    display: block;
    width: 100%;
    max-width: none;
    min-width: 0;
    min-height: 0;
    height: auto;
    box-sizing: border-box;
    overflow: visible;
    font-size: var(--nucleo-m-body);
    line-height: 1.28;
    font-weight: 400;
    text-align: left;
    text-wrap: wrap;
    hyphens: none;
    overflow-wrap: normal;
    word-break: normal;
    padding-block: var(--nucleo-m-sticker-pad-y);
    padding-inline: var(--nucleo-m-sticker-pad-x);
    border-bottom-left-radius: var(--sticker-frame-br);
    border-bottom-right-radius: var(--sticker-frame-br);
  }
}

@media (max-width: 380px) {
  #deck-nucleo .crowds-sticker__tagline {
    letter-spacing: 0.14em;
  }

  #deck-nucleo .crowds-sticker__tagline {
    font-size: 8px;
    letter-spacing: 0.12em;
  }
}

/* Web: grilla tamaño original; recuadro más bajo (proporción arte) con textos grandes */
@media (min-width: 681px) {
  #deck-nucleo {
    --nucleo-grid-gap: 3px;
    --nucleo-grid-cell: min(118px, max(72px, 11vmin));
    --nucleo-sticker-h: calc(clamp(158px, 19vmin, 182px) * var(--nucleo-sticker-scale));
    /* Ancho ~25% menor que el arte 1536×342; escala 1.3× mantiene proporción con el alto */
    --nucleo-sticker-w: calc(var(--nucleo-sticker-h) * 1140 / 342);
    --nucleo-sticker-gap: clamp(18px, 2.2vw, 24px);
    /* Video 702×1250 — ~38% más alto que la grilla; ancho proporcional */
    --nucleo-media-h: min(
      680px,
      calc((4 * var(--nucleo-grid-cell) + 3 * var(--nucleo-grid-gap)) * 1.38)
    );
    --nucleo-media-w: calc(var(--nucleo-media-h) * 702 / 1250);
    --nucleo-sticker-slot: max(
      0px,
      calc(100% - var(--nucleo-media-w) - var(--nucleo-sticker-gap))
    );
  }

  .nucleo__layout {
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: center;
    gap: var(--nucleo-sticker-gap);
    margin-top: clamp(8px, 1vw, 14px);
    width: 100%;
    max-width: 100%;
  }

  #deck-nucleo .nucleo__sticker {
    flex: 0 0 auto;
    width: min(var(--nucleo-sticker-w), var(--nucleo-sticker-slot));
    min-width: min(var(--nucleo-sticker-w), var(--nucleo-sticker-slot));
    height: var(--nucleo-sticker-h);
  }

  #deck-nucleo .crowds-sticker {
    width: 100%;
    min-width: 100%;
    max-width: 100%;
    --sticker-text-pad-right: 0.45cqh;
  }

  /*
   * Slide 02 web — filas 1fr|línea|1fr: headline y body centrados en su mitad (icono full-height).
   */
  #deck-nucleo .crowds-sticker__content {
    grid-template-rows: minmax(0, 1fr) var(--sticker-line) minmax(0, 1fr);
  }

  #deck-nucleo .crowds-sticker__headline {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    align-self: stretch;
    justify-self: stretch;
    height: 100%;
    min-height: 0;
    margin: 0;
    text-align: left;
    box-sizing: border-box;
    padding: var(--sticker-frame-inset-top) var(--sticker-text-pad-right) var(--sticker-frame-inset-bottom)
      var(--sticker-text-pad-left);
  }

  #deck-nucleo .crowds-sticker__body {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    align-self: stretch;
    justify-self: stretch;
    height: 100%;
    min-height: 0;
    margin: 0;
    text-align: left;
    box-sizing: border-box;
    padding: var(--sticker-frame-inset-top) var(--sticker-text-pad-right) var(--sticker-frame-inset-bottom)
      var(--sticker-text-pad-left);
  }

  html.deck-app #deck-nucleo .crowds-sticker__content {
    grid-template-rows: minmax(0, 1fr) var(--sticker-line) minmax(0, 1fr);
  }

  html.deck-app #deck-nucleo .crowds-sticker__headline {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    align-self: stretch;
    height: 100%;
    min-height: 0;
    text-align: left;
    padding: var(--sticker-frame-inset-top) var(--sticker-text-pad-right) var(--sticker-frame-inset-bottom)
      var(--sticker-text-pad-left);
  }

  html.deck-app #deck-nucleo .crowds-sticker__body {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    align-self: stretch;
    height: 100%;
    min-height: 0;
    text-align: left;
    padding: var(--sticker-frame-inset-top) var(--sticker-text-pad-right) var(--sticker-frame-inset-bottom)
      var(--sticker-text-pad-left);
  }

  /* Slide 02 web — body inferior: misma tipografía que tagline UGC (DM Mono, bold) */
  #deck-nucleo .crowds-sticker__body {
    font-family: "DM Mono", ui-monospace, monospace;
    font-size: var(--nucleo-topbar-font-size);
    font-weight: 700;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    line-height: 1.2;
  }

  html.deck-app #deck-nucleo .crowds-sticker__body {
    font-family: "DM Mono", ui-monospace, monospace;
    font-size: var(--nucleo-topbar-font-size);
    font-weight: 700;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    line-height: 1.2;
  }

  /* Slide 02 web — headline: padding simétrico */
  #deck-nucleo .crowds-sticker__headline,
  html.deck-app #deck-nucleo .crowds-sticker__headline {
    padding-top: max(var(--sticker-frame-inset-top), 1.2cqh);
    padding-bottom: max(var(--sticker-frame-inset-bottom), 1.2cqh);
  }

  #deck-nucleo .crowds-sticker__headline-text,
  html.deck-app #deck-nucleo .crowds-sticker__headline-text {
    line-height: 1.05;
  }
}

@supports (container-type: size) {
  @media (min-width: 681px) {
    #deck-nucleo .page__body {
      --nucleo-grid-cell: min(
        118px,
        max(72px, calc((100cqh - 1.5rem) / 4))
      );
      /* Frame completo: priorizar altura; solo reducir si no cabe en el stage vertical */
      --nucleo-media-h: min(
        680px,
        calc((4 * var(--nucleo-grid-cell) + 3 * var(--nucleo-grid-gap)) * 1.38),
        calc(100cqh - 1.25rem)
      );
      --nucleo-media-w: calc(var(--nucleo-media-h) * 702 / 1250);
    }
  }
}

/* ── Slide 02 — video incrustado (web); grilla reservada oculta ── */
.nucleo__video-wrap {
  display: none;
}

.nucleo__video {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center center;
  vertical-align: top;
}

@media (min-width: 681px) {
  #deck-nucleo .nucleo__grid {
    display: none;
  }

  .nucleo__video-wrap {
    display: block;
    flex: 0 0 auto;
    order: -1;
    align-self: center;
    justify-self: start;
    width: var(--nucleo-media-w);
    height: var(--nucleo-media-h);
    aspect-ratio: 702 / 1250;
    overflow: hidden;
    border-radius: clamp(8px, 0.85vw, 12px);
  }
}

@media (max-width: 680px) {
  .nucleo__video-wrap {
    display: none;
  }
}

/* ── Grilla de fotos (celda recorta; img absoluta = Safari iOS estable) ── */

.nucleo__grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 3px;
  width: 100%;
  order: -1;
}

.nucleo__cell {
  position: relative;
  overflow: hidden;
  min-width: 0;
  min-height: 0;
  aspect-ratio: 1;
}

.nucleo__cell img {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  max-width: none;
  object-fit: cover;
  object-position: center center;
}

.nucleo__cell img.nucleo__grid-img--top {
  object-position: center top;
}

@media (min-width: 681px) {
  .nucleo__grid {
    --nucleo-grid-gap: 3px;
    width: calc(4 * var(--nucleo-grid-cell) + 3 * var(--nucleo-grid-gap));
    grid-template-columns: repeat(4, var(--nucleo-grid-cell));
    grid-template-rows: repeat(4, var(--nucleo-grid-cell));
    gap: var(--nucleo-grid-gap);
    flex-shrink: 0;
    order: -1;
    align-self: start;
    justify-self: start;
    overflow: visible;
  }

  .nucleo__cell {
    aspect-ratio: auto;
    width: 100%;
    height: 100%;
  }
}

#deck-ecosistema .page__prose {
  flex: 0 1 auto;
  width: 100%;
}

.deck__accent-pink {
  color: var(--pink);
}

/* Acentos dentro de recuadros de color = mismo negro que el párrafo */
.exp-sticker .deck__accent-pink,
.deck-col-card .deck-col-card__accent {
  color: #0c0b09;
}

/* Slide 04 — fondo transparente; la foto va en capa fija a pantalla completa (incl. dock) */
#deck-ecosistema.page {
  --exp-ink: #0c0b09;
  --exp-line: 1px solid #0c0b09;
  background: transparent;
}

#deck-ecosistema {
  background: transparent;
}

.deck-shell:has(#deck-ecosistema[aria-hidden="false"]) {
  background: transparent;
}

/* Foto de fondo: pantalla completa (cover), sin overlay — color y contraste originales */
.deck-shell:has(#deck-ecosistema[aria-hidden="false"])::after {
  content: "";
  position: fixed;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  background-image: url("../assets/people_concert.jpg");
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
}

/* ── Slide 05 — Contacto (foto + grilla como slides 03–04) ───────────────── */
#deck-contacto.page {
  display: flex;
  flex-direction: column;
  background: transparent;
}

#deck-contacto {
  background: transparent;
}

.deck-shell:has(#deck-contacto[aria-hidden="false"]) {
  background: transparent;
}

.deck-shell:has(#deck-contacto[aria-hidden="false"])::after {
  content: "";
  position: fixed;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  background-image: url("../assets/pexels-bence-szemerey-337043-15203359.jpg");
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
}

/* Móvil: fondos *_mob.jpg (más livianos que 1920px desktop) */
@media (max-width: 680px) {
  .deck-shell:has(#deck-momento[aria-hidden="false"])::after {
    background-image:
      linear-gradient(
        to bottom,
        rgba(12, 11, 9, 0.18) 0%,
        rgba(12, 11, 9, 0.08) 45%,
        rgba(12, 11, 9, 0.48) 100%
      ),
      url("../assets/concert_hq_mob.jpg");
  }

  .deck-shell:has(#deck-nucleo[aria-hidden="false"]) .deck-shell__nucleo-bg-video {
    display: block;
  }

  .deck-shell:has(#deck-nucleo[aria-hidden="false"])::after {
    background-image: linear-gradient(
      to bottom,
      rgba(12, 11, 9, 0.18) 0%,
      rgba(12, 11, 9, 0.08) 45%,
      rgba(12, 11, 9, 0.48) 100%
    );
  }

  #deck-nucleo .nucleo__grid {
    display: none;
  }

  @media (prefers-reduced-motion: reduce) {
    .deck-shell:has(#deck-nucleo[aria-hidden="false"]) .deck-shell__nucleo-bg-video {
      display: none;
    }

    .deck-shell:has(#deck-nucleo[aria-hidden="false"])::after {
      background-image:
        linear-gradient(
          to bottom,
          rgba(12, 11, 9, 0.18) 0%,
          rgba(12, 11, 9, 0.08) 45%,
          rgba(12, 11, 9, 0.48) 100%
        ),
        url("../assets/publico_slide_3_mob.jpg");
    }
  }

  .deck-shell:has(#deck-experiencia[aria-hidden="false"])::after {
    background-image: url("../assets/pexels-harrisonhaines-3536238_mob.jpg");
  }

  .deck-shell:has(#deck-ecosistema[aria-hidden="false"])::after {
    background-image: url("../assets/people_concert_mob.jpg");
  }

  .deck-shell:has(#deck-contacto[aria-hidden="false"])::after {
    background-image: url("../assets/pexels-bence-szemerey-337043-15203359_mob.jpg");
  }
}

#deck-contacto .page__label {
  flex-shrink: 0;
  color: var(--pink);
}

@media (min-width: 681px) {
  #deck-contacto .page__body {
    flex: 1 1 auto;
    min-height: 0;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    align-items: flex-start;
    width: 100%;
    max-width: 100%;
    text-align: left;
    padding-bottom: max(28px, var(--page-safe-bottom), env(safe-area-inset-bottom, 0px));
    overflow: hidden;
  }

  #deck-contacto .contacto__panel {
    align-self: flex-start;
    max-width: min(100%, 36rem);
    margin-top: auto;
  }
}

#deck-contacto .contacto__headline {
  margin: 0;
  width: 100%;
  max-width: 100%;
  text-align: left;
  font-size: clamp(22px, 4.5vw, 46px);
  line-height: 0.88;
  letter-spacing: -0.02em;
  text-transform: uppercase;
  color: #ffffff;
}

#deck-contacto {
  --contacto-stack-gap: clamp(10px, 2vw, 14px);
}

#deck-contacto .contacto__panel {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--contacto-stack-gap);
  width: 100%;
}

#deck-contacto .contacto__channels {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--contacto-stack-gap);
  width: 100%;
}

#deck-contacto .contacto__chip {
  display: inline-flex;
  align-items: center;
  margin: 0;
  padding: clamp(10px, 2vw, 14px) clamp(14px, 2.8vw, 22px);
  border-radius: clamp(10px, 2.2vw, 14px);
  font-size: clamp(12px, 2.35vw, 15px);
  font-weight: 500;
  letter-spacing: 0.1em;
  text-decoration: none;
  color: #0c0b09;
  line-height: 1.25;
  max-width: 100%;
  box-sizing: border-box;
}

#deck-contacto .contacto__chip--mail {
  background: #c597d8;
}

#deck-contacto .contacto__chip--whatsapp {
  background: #aaff8f;
  gap: 0.5em;
}

#deck-contacto .contacto__chip-icon {
  display: block;
  width: 1.2em;
  height: 1.2em;
  flex-shrink: 0;
}

#deck-contacto .contacto__chip:focus-visible {
  outline: 2px solid #0c0b09;
  outline-offset: 2px;
}

/* Slide 04 — etiqueta rosa, título negro sobre foto */
#deck-ecosistema .page__label {
  color: var(--pink);
}

#deck-ecosistema .ecosistema__title {
  color: #0c0b09;
}


/* Slide 04 — intro en recuadro morado apaisado (sin barra negra) */
#deck-ecosistema .ecosistema__intro-card {
  flex-shrink: 0;
  align-self: flex-start;
  display: inline-block;
  width: max-content;
  max-width: 100%;
  background: #c597d8;
  border-radius: calc(12px * var(--exp-scale));
  --ecosistema-intro-pad-x: clamp(
    calc(16px * var(--exp-scale)),
    calc(2.6vw * var(--exp-scale)),
    calc(26px * var(--exp-scale))
  );
  padding: clamp(calc(12px * var(--exp-scale)), calc(2vw * var(--exp-scale)), calc(16px * var(--exp-scale)))
    var(--ecosistema-intro-pad-x);
  box-sizing: border-box;
}

#deck-ecosistema .closing__text.ecosistema__intro {
  margin: 0;
  text-align: left;
  color: #ffffff;
  max-width: none;
  width: max-content;
  text-wrap: wrap;
  box-sizing: border-box;
  font-size: clamp(22px, 3.6vw, 32px);
  font-weight: 600;
  line-height: 1.0;
  letter-spacing: -0.025em;
}

@media (min-width: 681px) {
  #deck-ecosistema .ecosistema__intro-card {
    border-radius: calc(12px * var(--exp-scale) / 1.5);
    --ecosistema-intro-pad-x: clamp(
      calc(16px * var(--exp-scale) / 1.5),
      calc(2.6vw * var(--exp-scale) / 1.5),
      calc(26px * var(--exp-scale) / 1.5)
    );
    padding: clamp(calc(12px * var(--exp-scale) / 1.5), calc(2vw * var(--exp-scale) / 1.5), calc(16px * var(--exp-scale) / 1.5))
      var(--ecosistema-intro-pad-x);
  }

  #deck-ecosistema .closing__text.ecosistema__intro {
    font-size: clamp(calc(22px / 1.5), calc(3.6vw / 1.5), calc(32px / 1.5));
  }
}

#deck-ecosistema .ecosistema__intro-line {
  display: block;
}

#deck-ecosistema .ecosistema__intro-line.ecosistema__intro-line--mob {
  display: none;
}

@media (min-width: 681px) {
  #deck-ecosistema .ecosistema__intro-line {
    white-space: nowrap;
  }
}

@media (min-width: 681px) {
  #deck-ecosistema .page__body {
    justify-content: center;
    align-items: flex-start;
  }

  #deck-ecosistema .ecosistema__intro-card {
    width: max-content;
    max-width: 100%;
  }

  #deck-ecosistema .closing__text.ecosistema__intro {
    max-width: none;
    width: max-content;
  }

  #deck-ecosistema .page__prose {
    width: 100%;
    max-width: 100%;
    margin-inline: 0;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
  }
}

/* Párrafos secundarios: un poco más de separación entre letras */
.momento__dispersa {
  letter-spacing: 0.04em;
  color: var(--pink);
}

/* Slides 01–04 — título estático por defecto (p. ej. reduced motion / impresión) */
.momento__title-marquee,
.momento__title-desk {
  display: none;
}

.nucleo__title-marquee {
  display: none;
}

.nucleo__title-desk {
  display: block;
}

.experiencia__title-marquee,
.ecosistema__title-marquee {
  display: none;
}

.experiencia__title-desk,
.ecosistema__title-desk {
  display: block;
}

/* Dos mitades idénticas en el track → loop infinito sin huecos */
.momento__title-marquee__set,
.nucleo__title-marquee__set,
.experiencia__title-marquee__set,
.ecosistema__title-marquee__set {
  display: inline-flex;
  flex-shrink: 0;
  align-items: center;
}

.momento__title-marquee__dot,
.nucleo__title-marquee__dot,
.experiencia__title-marquee__dot,
.ecosistema__title-marquee__dot {
  background: var(--dock-pill-active, #c597d8);
}

@keyframes nucleo-title-marquee-m {
  0% {
    transform: translate3d(0, 0, 0);
  }

  100% {
    transform: translate3d(calc(-1 * var(--marquee-shift, 50%)), 0, 0);
  }
}

/* Loop fluido: GPU + pausa (sin reset) fuera de slide activa */
.momento__title-marquee__track,
.nucleo__title-marquee__track,
.experiencia__title-marquee__track,
.ecosistema__title-marquee__track {
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
  perspective: 1000px;
}

.deck__track .page[aria-hidden="true"] .momento__title-marquee__track,
.deck__track .page[aria-hidden="true"] .nucleo__title-marquee__track,
.deck__track .page[aria-hidden="true"] .experiencia__title-marquee__track,
.deck__track .page[aria-hidden="true"] .ecosistema__title-marquee__track {
  animation-play-state: paused;
}

/*
 * Slides 01–04 — franja oscura detrás del marquee (solo web).
 * Móvil: bloque dedicado al final del archivo (Safari ≠ Chrome con text-box-trim).
 */
@media (min-width: 681px) {
  #deck-momento .momento__title-marquee__viewport,
  #deck-nucleo .nucleo__title-marquee__viewport,
  #deck-experiencia .experiencia__title-marquee__viewport,
  #deck-ecosistema .ecosistema__title-marquee__viewport {
    position: relative;
    isolation: isolate;
    display: block;
    padding-block: 0.04em;
    margin: 0;
    line-height: 0;
    background: var(--deck-chrome-bg, #141315);
  }

  @supports (text-box-trim: trim-both) {
    #deck-momento .momento__title-marquee__viewport,
    #deck-nucleo .nucleo__title-marquee__viewport,
    #deck-experiencia .experiencia__title-marquee__viewport,
    #deck-ecosistema .ecosistema__title-marquee__viewport {
      line-height: 1;
      text-box-trim: trim-both;
      text-box-edge: cap alphabetic;
    }
  }

  @supports not (text-box-trim: trim-both) {
    #deck-momento .momento__title-marquee__track,
    #deck-nucleo .nucleo__title-marquee__track,
    #deck-experiencia .experiencia__title-marquee__track,
    #deck-ecosistema .ecosistema__title-marquee__track {
      margin-bottom: -0.04em;
    }
  }
}

#deck-momento .momento__title-marquee__viewport,
#deck-nucleo .nucleo__title-marquee__viewport,
#deck-experiencia .experiencia__title-marquee__viewport,
#deck-ecosistema .ecosistema__title-marquee__viewport {
  background: var(--deck-chrome-bg, #141315);
}

#deck-momento .momento__title-marquee__text,
#deck-nucleo .nucleo__title-marquee__text,
#deck-experiencia .experiencia__title-marquee__text,
#deck-ecosistema .ecosistema__title-marquee__text {
  line-height: 1;
  display: inline-block;
  vertical-align: top;
}

#deck-momento .momento__title-marquee__track,
#deck-nucleo .nucleo__title-marquee__track,
#deck-experiencia .experiencia__title-marquee__track,
#deck-ecosistema .ecosistema__title-marquee__track {
  position: relative;
  z-index: 1;
  line-height: 1;
  vertical-align: top;
  margin-bottom: 0;
}

/* Slide 04 — texto blanco sobre la franja oscura */
#deck-ecosistema .ecosistema__title-marquee__text {
  color: #ffffff;
  -webkit-text-fill-color: currentColor;
}

/*
 * Slides 01–04 — marquee en web (full-bleed, loop, pausa fuera de slide).
 */
@media (min-width: 681px) {
  #deck-momento .momento__title-stack {
    display: none;
  }

  #deck-momento .momento__title-desk {
    display: none;
  }

  #deck-momento .momento__title-marquee {
    display: block;
    width: 100%;
  }

  #deck-momento .momento__cluster > .page__title.page__title--stack {
    width: 100vw;
    max-width: 100vw;
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
    padding-inline: 0;
    overflow: hidden;
    white-space: normal;
    text-wrap: wrap;
    line-height: 1;
  }

  #deck-momento .momento__title-marquee__viewport {
    overflow: hidden;
    width: 100vw;
    max-width: 100vw;
  }

  #deck-momento .momento__title-marquee__chunk {
    display: inline-flex;
    flex-shrink: 0;
    align-items: center;
    gap: clamp(18px, 2vw, 32px);
    padding-right: clamp(12px, 1.2vw, 20px);
  }

  #deck-momento .momento__title-marquee__text {
    white-space: nowrap;
    font-size: inherit;
    line-height: inherit;
    letter-spacing: inherit;
  }

  #deck-momento .momento__title-marquee__dot {
    flex-shrink: 0;
    width: clamp(7px, 0.55vw, 10px);
    height: clamp(7px, 0.55vw, 10px);
    border-radius: 50%;
    background: var(--dock-pill-active, #c597d8);
    align-self: center;
  }

  #deck-nucleo .nucleo__title-desk,
  #deck-experiencia .experiencia__title-desk,
  #deck-ecosistema .ecosistema__title-desk {
    display: none;
  }

  #deck-nucleo .nucleo__title-marquee,
  #deck-experiencia .experiencia__title-marquee,
  #deck-ecosistema .ecosistema__title-marquee {
    display: block;
    width: 100%;
  }

  .deck__track .page#deck-nucleo > .page__title,
  #deck-nucleo .page__title.t-display,
  #deck-experiencia .page__title,
  .deck__track .page#deck-experiencia > .page__title,
  #deck-ecosistema .ecosistema__title,
  .deck__track .page#deck-ecosistema > .ecosistema__title {
    width: 100vw;
    max-width: 100vw;
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
    padding-inline: 0;
    overflow: hidden;
    white-space: normal;
    text-wrap: wrap;
    line-height: 1;
  }

  #deck-momento .momento__title-marquee__viewport,
  #deck-nucleo .nucleo__title-marquee__viewport,
  #deck-experiencia .experiencia__title-marquee__viewport,
  #deck-ecosistema .ecosistema__title-marquee__viewport {
    overflow: hidden;
    width: 100vw;
    max-width: 100vw;
  }

  #deck-momento .momento__title-marquee__track,
  #deck-nucleo .nucleo__title-marquee__track,
  #deck-experiencia .experiencia__title-marquee__track,
  #deck-ecosistema .ecosistema__title-marquee__track {
    display: inline-flex;
    width: max-content;
    will-change: transform;
    animation: nucleo-title-marquee-m var(--marquee-duration, 20s) linear infinite;
    animation-play-state: running;
  }

  #deck-ecosistema .ecosistema__title,
  #deck-ecosistema .ecosistema__title-marquee__text {
    color: #ffffff;
    -webkit-text-fill-color: currentColor;
  }

  #deck-nucleo .nucleo__title-marquee__chunk,
  #deck-experiencia .experiencia__title-marquee__chunk,
  #deck-ecosistema .ecosistema__title-marquee__chunk {
    display: inline-flex;
    flex-shrink: 0;
    align-items: center;
    gap: clamp(18px, 2vw, 32px);
    padding-right: clamp(12px, 1.2vw, 20px);
  }

  #deck-nucleo .nucleo__title-marquee__text,
  #deck-experiencia .experiencia__title-marquee__text,
  #deck-ecosistema .ecosistema__title-marquee__text {
    white-space: nowrap;
    font-size: inherit;
    line-height: inherit;
    letter-spacing: inherit;
  }

  #deck-nucleo .nucleo__title-marquee__dot,
  #deck-experiencia .experiencia__title-marquee__dot,
  #deck-ecosistema .ecosistema__title-marquee__dot {
    flex-shrink: 0;
    width: clamp(7px, 0.55vw, 10px);
    height: clamp(7px, 0.55vw, 10px);
    border-radius: 50%;
    background: var(--dock-pill-active, #c597d8);
    align-self: center;
  }

  @media (prefers-reduced-motion: reduce) {
    #deck-momento .momento__title-marquee {
      display: none;
    }

    #deck-momento .momento__title-stack {
      display: none;
    }

    #deck-momento .momento__title-desk {
      display: block;
      white-space: nowrap;
      text-wrap: nowrap;
    }

    #deck-momento .momento__cluster > .page__title.page__title--stack {
      width: auto;
      max-width: 100%;
      margin-left: 0;
      margin-right: 0;
      padding-inline: 0;
      overflow: visible;
    }

    #deck-nucleo .nucleo__title-marquee,
    #deck-experiencia .experiencia__title-marquee,
    #deck-ecosistema .ecosistema__title-marquee {
      display: none;
    }

    #deck-nucleo .nucleo__title-desk,
    #deck-experiencia .experiencia__title-desk,
    #deck-ecosistema .ecosistema__title-desk {
      display: block;
      white-space: nowrap;
      text-wrap: nowrap;
    }
  }
}

#deck-momento .page__body > .momento__dispersa {
  color: var(--pink);
  font-size: clamp(17px, 4.2vw, 22px);
  font-weight: 500;
  line-height: 1.25;
}

/* Slide 04 — layout de stickers */
.ecosistema__stickers {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: clamp(calc(14px * var(--exp-scale)), calc(2.5vw * var(--exp-scale)), calc(20px * var(--exp-scale)));
  width: 100%;
  max-width: 100%;
  margin-top: clamp(calc(10px * var(--exp-scale)), calc(1.8vw * var(--exp-scale)), calc(20px * var(--exp-scale)));
  margin-inline: 0;
  align-self: flex-start;
}

.ecosistema__stickers .exp-sticker {
  width: 100%;
  max-width: var(--exp-sticker-max);
  margin-inline: 0;
}

/* Slide 04 — cards rebuilt from scratch */
.ecosistema__stickers .eco-card {
  --eco-accent: #aaff8f;
  width: 100%;
  max-width: var(--exp-sticker-max);
  margin-inline: 0;
  border-radius: calc(12px * var(--exp-scale));
  overflow: hidden;
  background: var(--eco-accent);
  color: #0c0b09;
}

.ecosistema__stickers .eco-card--brands {
  --eco-accent: var(--exp-blue, #0c8ce9);
}

.ecosistema__stickers .eco-card__inner {
  display: flex;
  flex-direction: column;
  min-height: 0;
}

.ecosistema__stickers .eco-card__tag {
  margin: 0;
  padding: clamp(calc(6px * var(--exp-scale)), calc(1vw * var(--exp-scale)), calc(8px * var(--exp-scale)))
    clamp(calc(14px * var(--exp-scale)), calc(2vw * var(--exp-scale)), calc(20px * var(--exp-scale)));
  min-height: calc(28px * var(--exp-scale));
  background: #0c0b09;
  color: var(--eco-accent);
  border-bottom: 1px solid #0c0b09;
  font-size: var(--exp-tag-size, calc(9px * var(--exp-scale)));
  font-weight: 500;
  letter-spacing: 0.18em;
  line-height: 1.2;
  text-transform: uppercase;
  white-space: nowrap;
  text-wrap: nowrap;
  display: flex;
  align-items: center;
}

.ecosistema__stickers .eco-card__body {
  margin: 0;
  padding: clamp(calc(10px * var(--exp-scale)), calc(1.6vw * var(--exp-scale)), calc(12px * var(--exp-scale)))
    clamp(calc(12px * var(--exp-scale)), calc(2vw * var(--exp-scale)), calc(14px * var(--exp-scale)));
  background: var(--eco-accent);
  color: #0c0b09;
}

.ecosistema__stickers .eco-card__bullets {
  margin: 0;
  padding: 0 0 0 1.05em;
  list-style: disc;
  width: 100%;
  color: #0c0b09;
  display: flex;
  flex-direction: column;
  gap: clamp(calc(4px * var(--exp-scale)), calc(0.8vw * var(--exp-scale)), calc(6px * var(--exp-scale)));
}

.ecosistema__stickers .eco-card__bullets li {
  margin: 0;
  padding: 0;
  color: inherit;
  font-size: var(--exp-body-size);
  font-weight: 700;
  line-height: 1.42;
}

@media (min-width: 681px) {
  #deck-ecosistema .ecosistema__stickers {
    display: grid;
    grid-template-columns: var(--exp-sticker-max) var(--exp-sticker-max);
    justify-content: start;
    justify-items: stretch;
    gap: clamp(calc(14px * var(--exp-scale)), calc(2vw * var(--exp-scale)), calc(24px * var(--exp-scale)));
    width: fit-content;
    max-width: 100%;
    margin-inline: 0;
  }

  #deck-ecosistema .ecosistema__stickers .exp-sticker {
    width: 100%;
    max-width: var(--exp-sticker-max);
    min-width: 0;
    margin-inline: 0;
  }

  #deck-ecosistema .ecosistema__stickers .eco-card {
    width: 100%;
    max-width: var(--exp-sticker-max);
    min-width: 0;
    margin-inline: 0;
  }
}

/* Slide 04 — móvil: intro + stickers al pie, protegidos del dock */
@media (max-width: 680px) {
  #deck-ecosistema,
  #deck-ecosistema.page {
    --exp-scale: 1;
    --exp-tag-size: 10px;
    --exp-body-size: clamp(12px, 3.35vw, 14px);
  }

  #deck-ecosistema .ecosistema__title {
    flex-shrink: 0;
    margin-bottom: 8px;
    color: #0c0b09;
  }

  /* Slide 04 móvil: sin scroll; contenido encaja en el stage */
  .deck__track .page#deck-ecosistema,
  #deck-ecosistema.page {
    display: flex;
    flex-direction: column;
    height: 100%;
    min-height: 100%;
    max-height: 100%;
    box-sizing: border-box;
    overflow-x: hidden;
    overflow-y: hidden;
    overscroll-behavior: none;
    touch-action: pan-x pinch-zoom;
    padding-bottom: 0;
    scroll-padding-bottom: 0;
  }

  .deck__track .page#deck-ecosistema > .page__label,
  #deck-ecosistema .page__label {
    flex: 0 0 auto;
  }

  .deck__track .page#deck-ecosistema > .ecosistema__title,
  #deck-ecosistema .ecosistema__title {
    flex: 0 0 auto;
    margin-bottom: 8px;
  }

  /* Intro + recuadros: bloque centrado entre encabezado y dock */
  .deck__track .page#deck-ecosistema > .page__body,
  #deck-ecosistema .page__body {
    flex: 1 1 0;
    width: 100%;
    min-height: 0;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: stretch;
    overflow: hidden;
    gap: clamp(8px, 2.2vw, 12px);
    padding-top: clamp(10px, 2.8vh, 20px);
    padding-bottom: 0;
  }

  /* Fondo: el punto que estaba al centro queda al borde izquierdo del encuadre */
  .deck-shell:has(#deck-ecosistema[aria-hidden="false"])::after {
    background-position: 25% center;
  }

  #deck-ecosistema .ecosistema__intro-card {
    flex: 0 0 auto;
    display: block;
    width: 100%;
    max-width: 100%;
    align-self: stretch;
    box-sizing: border-box;
    margin: 0;
    overflow: visible;
    padding: clamp(16px, 4vw, 20px) clamp(14px, 3.5vw, 18px);
    border-radius: calc(12px * var(--exp-scale));
  }

  #deck-ecosistema .closing__text.ecosistema__intro {
    width: 100%;
    max-width: 100%;
    font-size: clamp(14px, 3.75vw, 17px);
    font-weight: 600;
    line-height: 1.35;
    letter-spacing: -0.02em;
    color: #ffffff;
    text-wrap: wrap;
    overflow: visible;
  }

  #deck-ecosistema .ecosistema__intro-line.ecosistema__intro-line--web {
    display: none;
  }

  #deck-ecosistema .ecosistema__intro-line.ecosistema__intro-line--mob {
    display: block;
  }

  #deck-ecosistema .ecosistema__intro-line:not(.ecosistema__intro-line--web) {
    display: block;
    white-space: normal;
    line-height: 1.35;
    margin: 0;
    padding: 0;
  }

  #deck-ecosistema .page__prose {
    width: 100%;
    max-width: 100%;
    flex: 0 0 auto;
    margin: 0;
    padding-top: 0;
  }

  .ecosistema__stickers {
    display: flex;
    flex-direction: column;
    flex-shrink: 0;
    gap: clamp(8px, 2.2vw, 12px);
    width: 100%;
    max-width: 100%;
    margin-top: 0;
  }

  /* Slide 04 móvil — tarjetas nuevas, altura ajustada al contenido */
  #deck-ecosistema .ecosistema__stickers .eco-card {
    width: 100%;
    max-width: 100%;
    flex: 0 0 auto;
  }

  #deck-ecosistema .ecosistema__stickers .eco-card__tag {
    min-height: 28px;
    padding: 7px clamp(12px, 3vw, 14px);
  }

  #deck-ecosistema .ecosistema__stickers .eco-card__body {
    padding: clamp(8px, 2.2vw, 10px) clamp(12px, 3vw, 14px);
  }

  #deck-ecosistema .ecosistema__stickers .eco-card__bullets {
    margin: 0;
    gap: clamp(3px, 1vw, 5px);
  }
}

/*
 * Móvil — sin scroll vertical en slides; gesto vertical = cambio de slide (deck-nav.js).
 */
@media (max-width: 680px) {
  :root {
    --page-safe-bottom: 0;
    --deck-page-pad-top: 10px;
    --deck-page-pad-inline: clamp(1rem, 4.5vw, 1.25rem);
    --deck-scroll-dock-gap: 0;
  }

  .deck-shell__brand-bar {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    width: 100%;
    max-width: none;
    padding-top: env(safe-area-inset-top, 0px);
    padding-inline: 0;
    padding-bottom: 0;
  }

  .deck-shell__brand-bar-row {
    display: block;
    width: 100%;
  }

  .deck-shell__brand-bar-inner {
    display: flex;
    align-items: center;
    flex: none;
    min-width: 0;
    width: 100%;
    max-width: none;
    border-radius: 0;
    border-left: none;
    border-right: none;
    border-top: none;
    border-bottom: 1px solid var(--deck-chrome-border);
    box-shadow: none;
    padding: 8px var(--deck-page-pad-inline);
    gap: clamp(8px, 2.5vw, 10px);
    box-sizing: border-box;
  }

  .deck-shell__brand-bar-label {
    flex: 1 1 auto;
    min-width: 0;
    margin-left: 0;
    padding-left: 10px;
    text-align: left;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  .deck-shell__lang--inbar {
    display: block;
    flex: 0 0 auto;
    margin-left: clamp(12px, 3.5vw, 18px);
  }

  .deck-shell__lang--aside {
    display: none;
  }

  .deck-shell__lang--inbar .deck-shell__lang-inner {
    padding: 0;
    min-height: 0;
    background: transparent;
    border: none;
    box-shadow: none;
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
    border-radius: 0;
  }

  .deck-shell__brand-bar-logo {
    flex: 0 0 auto;
  }

  .deck-shell__lang-link,
  .deck-shell__lang-sep {
    font-size: 10px;
  }

  .deck-shell__stage {
    padding-top: var(--deck-brand-bar-height, 34px);
    box-sizing: border-box;
  }

  .deck__track .page,
  .deck__track .page:not(.page--cover) {
    padding-top: var(--deck-page-pad-top);
    padding-inline: var(--deck-page-pad-inline);
    padding-bottom: 0;
    overflow-x: hidden;
    overflow-y: hidden;
    overscroll-behavior: none;
    touch-action: pan-x pinch-zoom;
    scrollbar-width: none;
  }

  .deck__track .page::-webkit-scrollbar {
    display: none;
    width: 0;
    height: 0;
  }

  .deck__track .page.page--cover {
    padding-top: 12px;
    padding-bottom: 12px;
  }

  .deck__track .page:not(.page--cover):not(#deck-momento) {
    justify-content: flex-start;
  }

  .deck__track .page:not(.page--cover):not(#deck-momento) > .page__body {
    flex: 1 1 0;
    min-height: 0;
    overflow: hidden;
    width: 100%;
    max-width: 100%;
  }

  #deck-experiencia .page__body {
    flex: 1 1 0;
    min-height: 0;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: stretch;
  }

  #deck-experiencia .exp-flow {
    flex: 0 0 auto;
    min-height: 0;
    overflow: visible;
    margin-top: 0;
    gap: clamp(8px, 2vw, 10px);
  }

  /* Viewports bajos: escala contenido para evitar scroll/recortes */
  @media (max-height: 780px) {
    #deck-nucleo {
      --nucleo-m-headline: clamp(16px, 4.8vw, 22px);
      --nucleo-m-body: clamp(10.5px, 3vw, 14px);
      --nucleo-m-icon: clamp(44px, 18vw, 58px);
      --nucleo-m-sticker-pad-y: clamp(8px, 2.2vw, 11px);
    }

    #deck-nucleo .nucleo__grid {
      --nucleo-m-grid-h: min(13svh, 46vw);
    }

    .deck__track .page#deck-nucleo > .page__title,
    #deck-nucleo .page__title.t-display {
      font-size: clamp(37px, 10vw, 50px);
      margin-bottom: 6px;
    }

    #deck-experiencia,
    #deck-experiencia.page {
      --exp-scale: 0.92;
    }

    #deck-ecosistema,
    #deck-ecosistema.page {
      --exp-scale: 0.92;
    }

    #deck-ecosistema .ecosistema__title,
    #deck-experiencia .page__title {
      margin-bottom: 6px;
    }
  }

  @media (max-height: 680px) {
    #deck-nucleo .nucleo__grid {
      --nucleo-m-grid-h: min(11svh, 40vw);
    }

    #deck-experiencia,
    #deck-experiencia.page {
      --exp-scale: 0.86;
    }

    #deck-ecosistema,
    #deck-ecosistema.page {
      --exp-scale: 0.86;
    }
  }

  .deck__track .page:not(.page--cover) > .page__title {
    flex-shrink: 0;
    max-width: 100%;
    margin-bottom: 12px;
    text-wrap: balance;
  }

  .deck__track .page#deck-experiencia > .page__title,
  .deck__track .page#deck-ecosistema > .ecosistema__title {
    text-wrap: nowrap;
    max-width: none;
  }

  /*
   * Slide 01 — encabezado arriba; párrafos abajo (antes del dock).
   */
  .deck__track .page#deck-momento,
  #deck-momento.page {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: stretch;
    height: 100%;
    min-height: 0;
    max-height: 100%;
    box-sizing: border-box;
    overflow-x: hidden;
    overflow-y: hidden;
  }

  #deck-momento .momento__cluster {
    flex: 1 1 0;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
    width: 100%;
    max-width: 100%;
    min-height: 0;
    margin: 0;
  }

  #deck-momento .momento__cluster > .page__title,
  #deck-momento .momento__cluster > .page__title.page__title--stack {
    flex: 0 0 auto;
    width: 100%;
    margin: 0 0 8px;
  }

  #deck-momento .momento__cluster > .page__body {
    flex: 1 1 0;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    align-items: flex-start;
    width: 100%;
    max-width: 100%;
    min-height: 0;
    margin: 0;
    gap: clamp(12px, 3vw, 18px);
    padding: 0 0 var(--deck-grid-cell, 36px);
    overflow: visible;
  }

  #deck-momento .page__body p,
  #deck-momento .closing__text {
    width: 100%;
    max-width: 100%;
    text-align: left;
    text-wrap: wrap;
    box-sizing: border-box;
    font-size: clamp(15px, 4vw, 19px);
    line-height: 1.22;
  }

  #deck-momento .page__body > .closing__text:first-child {
    font-size: clamp(22.5px, 6vw, 28.5px);
    line-height: 1.18;
    letter-spacing: -0.025em;
  }

  #deck-momento .page__body > p + p,
  #deck-momento .page__body > .momento__dispersa {
    font-size: clamp(18px, 5vw, 23px);
    font-weight: 400;
    line-height: 1.06;
    letter-spacing: 0.02em;
    margin-top: 0;
  }

  #deck-momento .page__body > .momento__dispersa {
    color: var(--pink);
    font-size: clamp(17px, 4.4vw, 22px);
    font-weight: 500;
    line-height: 1.24;
    margin-top: clamp(4px, 1.2vw, 8px);
  }

  /* Slide 05 — sin título CONTACTO; chips centrados */
  .deck__track .page#deck-contacto,
  #deck-contacto.page {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    grid-template-rows: minmax(0, 1fr);
    height: 100%;
    min-height: 100%;
    max-height: 100%;
    box-sizing: border-box;
    overflow-x: hidden;
    overflow-y: hidden;
    padding-bottom: 0;
    scroll-padding-bottom: 0;
  }

  .deck__track .page#deck-contacto > .page__body,
  #deck-contacto .page__body {
    grid-row: 1;
    flex: none;
    min-height: 0;
    width: 100%;
    max-width: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    align-self: stretch;
    overflow: hidden;
    margin-top: 0;
    padding-top: 0;
    padding-bottom: 0;
  }

  #deck-contacto .contacto__panel {
    align-self: flex-start;
    margin-top: 0;
    margin-bottom: 0;
    gap: var(--contacto-stack-gap);
  }

  #deck-contacto .contacto__headline {
    font-size: clamp(22px, 6.8vw, 34px);
    color: #0c0b09;
  }

  #deck-contacto .contacto__chip {
    width: auto;
    max-width: 100%;
    font-size: clamp(11px, 2.8vw, 14px);
  }
}

/* Tres momentos */
.moments {
  display: flex;
  flex-direction: column;
  gap: 22px;
  max-width: 58ch;
}

.moment {
  padding-left: 14px;
  border-left: 3px solid var(--pink);
}

@media (min-width: 960px) {
  .moments {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 20px 28px;
    max-width: none;
  }

  .moment {
    padding-left: 0;
    padding-top: 14px;
    border-left: none;
    border-top: 3px solid var(--pink);
  }
}

.moment__name {
  margin: 0 0 8px;
  font-family: "DM Mono", ui-monospace, monospace;
  font-size: 11px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--moment-heading);
}

@media (min-width: 900px) {
  .moment p {
    max-width: none;
  }
}

.moment p {
  margin: 0;
  font-size: 16px;
  line-height: 1.48;
  max-width: 52ch;
}

.moment p + p {
  margin-top: 12px;
}

.moment__keyword {
  font-weight: 600;
  color: var(--pink);
}
.live-feed-card {
  --live-card-bg: #0c0b09;
  --live-card-muted: rgba(215, 221, 237, 0.54);

  margin-top: clamp(28px, 5vw, 44px);
  margin-inline: auto;
  max-width: min(620px, 100%);
  padding: clamp(22px, 4vw, 34px);
  border-radius: 24px;
  border: 1px solid var(--lime);
  background: var(--live-card-bg);
  box-shadow:
    0 0 0 1px rgba(170, 255, 142, 0.16),
    0 20px 48px rgba(12, 11, 9, 0.35);
}

.live-feed-card {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 12px 14px;
  margin-bottom: 16px;
}

.live-feed-card__heading {
  margin: 0;
  font-family: "Bebas Neue", sans-serif;
  font-size: clamp(36px, 7vw, 48px);
  font-weight: 400;
  line-height: 0.95;
  letter-spacing: -0.035em;
  text-transform: uppercase;
  color: var(--text-light);
}

.live-feed-card__live-pill {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 7px 14px 7px 11px;
  border-radius: 999px;
  background: var(--lime);
  font-family: "DM Mono", ui-monospace, monospace;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--ink);
}

.live-feed-card__live-dot {
  flex-shrink: 0;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: #063821;
  box-shadow:
    0 0 0 3px rgba(6, 56, 33, 0.35),
    0 0 14px rgba(170, 255, 142, 0.55);
}

.live-feed-card__body {
  margin: 0 0 18px;
  font-family: "Archivo", system-ui, sans-serif;
  font-size: 15px;
  font-weight: 400;
  line-height: 1.35;
  letter-spacing: -0.01em;
  color: var(--live-card-muted);
}

.live-feed-card__accent {
  font-weight: 600;
  color: var(--text-light);
}

/* Caso */
.case__brand {
  margin: 0 0 6px;
  font-family: "Bebas Neue", sans-serif;
  font-size: clamp(28px, 5vw, 44px);
  letter-spacing: -0.035em;
  line-height: 1;
  text-transform: uppercase;
}

.case__meta {
  margin: 0 0 14px;
  font-family: "DM Mono", ui-monospace, monospace;
  font-size: 10px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--case-meta);
}

.case__scope {
  margin: 0 0 26px;
  max-width: min(64ch, 100%);
  font-size: 15px;
  font-weight: 400;
  line-height: 1.48;
  color: rgba(12, 11, 9, 0.76);
}

.case__scope strong {
  font-weight: 600;
  color: var(--ink);
}

.case__media {
  margin: 0 auto;
  display: flex;
  justify-content: center;
  width: 100%;
  max-width: min(320px, 100%);
}

.case__video {
  display: block;
  width: 100%;
  height: auto;
  max-height: min(58vh, 640px);
  border-radius: 16px;
  background: var(--void);
  box-shadow: 0 12px 40px rgba(12, 11, 9, 0.2);
}

.case__grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 24px 36px;
}

@media (max-width: 560px) {
  .case__grid {
    grid-template-columns: 1fr;
  }
}

.case__col h3 {
  margin: 0 0 12px;
  font-family: "DM Mono", ui-monospace, monospace;
  font-size: 10px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--case-col-h);
}

.case__col .bullets {
  max-width: none;
}

.case__col .bullets li::marker {
  color: var(--pink);
}

/* Cierre */
.page--closing .page__body {
  flex: 1 1 auto;
  min-height: 0;
}

/* Texto protagonista del deck (slides 01, 02, etc.): ancho legible, sin columnas estrechas en ch */
.closing__text {
  margin: 0;
  font-size: clamp(22px, 3.6vw, 32px);
  font-weight: 600;
  line-height: 1.0;
  letter-spacing: -0.025em;
  max-width: min(92%, 100%);
  text-wrap: balance;
  hyphens: none;
  color: #ffffff;
}

@media (min-width: 900px) {
  .closing__text {
    max-width: min(48ch, 92%);
    line-height: 1.0;
  }

  #deck-ecosistema .closing__text.ecosistema__intro {
    max-width: none;
    width: max-content;
  }
}

@media (min-width: 1200px) {
  .closing__text {
    max-width: min(52ch, 90%);
    font-size: clamp(24px, 2.8vw, 38px);
    line-height: 1.0;
  }

  #deck-ecosistema .closing__text.ecosistema__intro {
    max-width: none;
    width: max-content;
    font-size: clamp(calc(24px / 1.5), calc(2.8vw / 1.5), calc(38px / 1.5));
  }
}

/* Apertura fusionada en “El momento” (tras quitar portada aparte) */
.moment__fuse-lede {
  margin: 0 0 clamp(16px, 3vw, 28px);
  max-width: min(54ch, 100%);
  color: inherit;
}

/* Slide 01 — layout base (web); móvil: grid en @media 680px */
@media (min-width: 681px) {
  #deck-momento,
  #deck-momento.page {
    display: flex;
    flex-direction: column;
    min-height: 100%;
    justify-content: flex-start;
  }

  #deck-momento .page__label,
  #deck-momento .page__title {
    flex-shrink: 0;
  }

  #deck-momento .momento__cluster {
    flex: 1 1 auto;
    display: flex;
    flex-direction: column;
    min-height: 0;
    width: 100%;
  }

  #deck-momento .momento__cluster > .page__body {
    flex: 1 1 auto;
    min-height: 0;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    align-items: flex-start;
    gap: clamp(16px, 3vw, 28px);
    width: 100%;
  }
}

#deck-momento .page__body p {
  margin: 0;
}

#deck-momento .page__body > p + p {
  color: #ffffff;
}

@media (min-width: 681px) {
  #deck-momento .page__body > p + p {
    font-size: clamp(14px, 1.6vw, 22px);
    font-weight: 600;
    line-height: 1.2;
  }

  #deck-momento .page__body > .momento__dispersa {
    color: var(--pink);
    font-size: clamp(17px, 1.65vw, 22px);
    font-weight: 500;
    line-height: 1.24;
    max-width: 44ch;
    text-wrap: pretty;
  }
}


#deck-momento .moment__crowds-lede {
  color: var(--dock-pill-active);
}

@media print {
  html.deck-app,
  html.deck-app body {
    height: auto;
    overflow: visible;
  }

  .skip-link,
  .deck-shell__dock {
    display: none !important;
  }

  .deck-shell {
    min-height: 0;
  }

  .deck-shell__stage {
    display: block;
    min-height: 0;
  }

  .deck__viewport {
    overflow: visible;
    height: auto;
    padding-bottom: 0;
  }

  .deck__viewport::after {
    content: none !important;
  }

  html.deck-app::before,
  .deck__track .page::before,
  .deck__track .page.page--surface-light::before {
    display: none !important;
  }

  .deck__track {
    display: block;
    transform: none !important;
    height: auto !important;
    transition: none !important;
  }

  .deck__track .page {
    position: relative !important;
    inset: auto !important;
    display: flex !important;
    width: 100% !important;
    flex-basis: auto !important;
    height: auto !important;
    min-height: 210mm;
    overflow: visible !important;
    page-break-after: always;
    break-after: page;
    border-bottom: none;
  }

  .deck__track .page:last-child {
    page-break-after: auto;
    break-after: auto;
  }

  .page--cover .closing__text.cover__intro-lede {
    max-width: min(48ch, 92%);
    margin-inline: 0;
    text-align: left;
  }

  .page {
    padding: 14mm 18mm;
    border: none;
  }

  .page--cover {
    min-height: 210mm;
    height: 210mm;
  }

  .page:last-child {
    break-after: auto;
    page-break-after: auto;
  }
}

/*
 * Web — grid del shell: chrome | stage | dock (nada fixed; mismo hueco título en todas las slides).
 */
@media (min-width: 681px) {
  html.deck-app {
    --deck-web-headline-gap: clamp(20px, 2.5vw, 32px);
  }

  html.deck-app .deck-shell {
    display: grid;
    grid-template-rows: auto minmax(0, 1fr) auto;
    grid-template-areas:
      "deck-chrome"
      "deck-stage"
      "deck-dock";
    height: 100svh;
    max-height: 100svh;
    min-height: 100svh;
  }

  html.deck-app .deck-shell__brand-bar {
    grid-area: deck-chrome;
    position: static;
    top: auto;
    left: auto;
    width: 100%;
    max-width: none;
    padding: clamp(18px, 2.8vw, 32px) clamp(1.25rem, 5vw, 5.5rem) 0;
  }

  html.deck-app .deck-shell__stage {
    grid-area: deck-stage;
    min-height: 0;
    flex: none;
  }

  html.deck-app .deck-shell__dock-spacer {
    grid-area: deck-dock;
  }

  html.deck-app .deck__track .page,
  html.deck-app .deck__track .page:not(.page--cover) {
    padding-top: var(--deck-web-headline-gap);
    padding-inline: clamp(1.25rem, 5vw, 5.5rem);
  }

  html.deck-app .deck__track .page:not(.page--cover) > .page__title,
  html.deck-app .deck__track .page:not(.page--cover) > .ecosistema__title {
    margin-top: 0;
    margin-bottom: clamp(16px, 2vw, 24px);
  }

  html.deck-app #deck-momento .page__title--stack {
    margin-bottom: clamp(16px, 2vw, 24px);
  }

  html.deck-app #deck-momento .page__title,
  html.deck-app #deck-momento .page__title--stack,
  html.deck-app #deck-momento .page__title-line {
    color: #ffffff;
    -webkit-text-fill-color: currentColor;
    -webkit-text-stroke: 0 transparent;
    paint-order: normal;
  }
}

/*
 * Móvil — overrides finales (van al cierre del archivo para ganar a reglas por slide).
 */
@media (max-width: 680px) {
  html.deck-app .deck-shell__brand-bar {
    padding-inline: 0;
    width: 100%;
    max-width: none;
  }

  html.deck-app .deck-shell__brand-bar-inner {
    width: 100%;
    max-width: none;
    border-radius: 0;
  }

  html.deck-app .deck__track .page,
  html.deck-app .deck__track .page:not(.page--cover) {
    padding-top: 10px;
    padding-inline: clamp(1rem, 4.5vw, 1.25rem);
    padding-bottom: 0;
  }

  html.deck-app .deck-shell__dock-spacer {
    padding: 0 12px max(2px, env(safe-area-inset-bottom, 0px));
  }

  html.deck-app .deck-shell__dock {
    padding: 6px 12px 4px;
  }

  /* Pills: una línea, menos alto; mismo ancho de rejilla */
  html.deck-app .deck-shell__nav-inner {
    gap: 6px;
    padding: 2px 0 4px;
  }

  html.deck-app .deck-shell__pill {
    min-height: 28px;
    height: auto;
    padding: 4px 3px;
    line-height: 1;
    gap: 0;
    letter-spacing: 0.045em;
  }

  html.deck-app .deck-shell__pill-text {
    font-size: 10px;
    line-height: 1;
    white-space: nowrap;
    letter-spacing: inherit;
  }

  html.deck-app #deck-experiencia .page__body {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: stretch;
    padding-bottom: 0;
    overflow: hidden;
  }

  html.deck-app #deck-experiencia .exp-flow {
    flex: 0 0 auto;
    margin-top: 0;
  }

  html.deck-app #deck-ecosistema .page__body {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: stretch;
    flex: 1 1 0;
    min-height: 0;
    overflow: hidden;
    padding-bottom: 0;
  }

  html.deck-app #deck-ecosistema .ecosistema__intro-card,
  html.deck-app #deck-ecosistema .page__prose,
  html.deck-app #deck-ecosistema .ecosistema__stickers {
    flex: 0 0 auto;
  }

  html.deck-app #deck-nucleo .page__body,
  html.deck-app #deck-momento .page__body,
  html.deck-app #deck-contacto .page__body,
  html.deck-app #deck-experiencia .page__body,
  html.deck-app #deck-ecosistema .page__body {
    padding-bottom: 0;
  }

  /*
   * Slide 01 móvil — encabezado arriba; párrafos abajo (antes del dock).
   */
  html.deck-app .deck__track .page#deck-momento,
  html.deck-app #deck-momento.page {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: stretch;
    height: 100%;
    min-height: 0;
    max-height: 100%;
    box-sizing: border-box;
  }

  html.deck-app #deck-momento .momento__cluster {
    flex: 1 1 0;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
    width: 100%;
    max-width: 100%;
    min-height: 0;
    margin: 0;
  }

  html.deck-app #deck-momento .momento__cluster > .page__title,
  html.deck-app #deck-momento .momento__cluster > .page__title.page__title--stack {
    flex: none;
    width: 100%;
    margin: 0 0 8px;
  }

  html.deck-app #deck-momento .momento__cluster > .page__body {
    flex: 1 1 0;
    min-height: 0;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    align-items: flex-start;
    gap: clamp(12px, 3vw, 18px);
    padding: 0 0 var(--deck-grid-cell, 36px);
    margin: 0;
    overflow: visible;
  }

  html.deck-app #deck-momento .page__title-line--desk,
  html.deck-app #deck-momento .page__title-line--mob {
    display: none;
  }

  html.deck-app #deck-momento .momento__title-stack {
    display: none;
  }

  html.deck-app #deck-momento .momento__title-marquee {
    display: block;
  }

  html.deck-app #deck-momento .momento__cluster > .page__title,
  html.deck-app #deck-momento .momento__cluster > .page__title.page__title--stack {
    width: 100vw;
    max-width: 100vw;
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
    margin-bottom: 8px;
    padding-inline: 0;
    overflow: hidden;
    font-size: var(--deck-marquee-title-fs, clamp(44px, 11.5vw, 58px));
  }

  html.deck-app #deck-momento .momento__cluster > .page__title,
  html.deck-app #deck-momento .momento__cluster > .page__title.page__title--stack,
  html.deck-app #deck-momento .momento__title-marquee__text {
    color: #ffffff;
    -webkit-text-fill-color: currentColor;
    -webkit-text-stroke: 0 transparent;
    paint-order: normal;
  }

  /* Slide 02 — sticker móvil: tipografía y respiración estable (sin tocar web) */
  html.deck-app #deck-nucleo .crowds-sticker__body,
  html.deck-app #deck-nucleo .crowds-sticker__headline {
    display: block;
    width: 100%;
    max-width: none;
    align-self: center;
    height: auto;
    min-height: 0;
    text-wrap: wrap;
  }

  html.deck-app #deck-nucleo .crowds-sticker__body {
    font-size: var(--nucleo-m-body);
    line-height: 1.24;
    padding-top: clamp(7px, 2vw, 10px);
    padding-right: var(--nucleo-m-sticker-pad-x);
    padding-bottom: var(--nucleo-m-sticker-pad-y);
    padding-left: var(--nucleo-m-sticker-pad-x);
  }

  html.deck-app #deck-nucleo .crowds-sticker__headline {
    font-size: var(--nucleo-m-headline);
    line-height: 1.04;
    padding-top: var(--nucleo-m-sticker-pad-y);
    padding-right: var(--nucleo-m-sticker-pad-x);
    padding-bottom: clamp(7px, 2vw, 10px);
    padding-left: var(--sticker-line-gap);
  }

  html.deck-app #deck-nucleo .crowds-sticker__headline-text {
    line-height: 1.05;
  }

  /* Slide 04 — recuadros: sin hueco negro bajo la barrita de color */
  html.deck-app #deck-ecosistema .exp-sticker--4a .exp-sticker__inner,
  html.deck-app #deck-ecosistema .exp-sticker--4b .exp-sticker__inner {
    height: auto;
    min-height: 0;
  }

  html.deck-app #deck-ecosistema .exp-sticker--4a .exp-sticker__card,
  html.deck-app #deck-ecosistema .exp-sticker--4b .exp-sticker__card {
    flex: 0 0 auto;
    min-height: 0;
    height: auto;
  }

  html.deck-app #deck-ecosistema .exp-sticker--4a .exp-sticker__body.exp-sticker__body--plain,
  html.deck-app #deck-ecosistema .exp-sticker--4b .exp-sticker__body.exp-sticker__body--plain {
    flex: none;
    min-height: 0;
    height: auto;
    padding: clamp(6px, 1.6vw, 8px) clamp(12px, 3vw, 14px) clamp(10px, 2.6vw, 12px);
  }

  html.deck-app .deck__track .page#deck-contacto,
  html.deck-app #deck-contacto.page {
    grid-template-rows: minmax(0, 1fr);
  }

  html.deck-app .deck__track .page#deck-contacto > .page__body,
  html.deck-app #deck-contacto .page__body {
    grid-row: 1;
  }

  /*
   * Slides 03 y 04 — título grande, ancho pantalla, una sola línea (justify rellena el ancho).
   */
  html.deck-app #deck-experiencia .page__title,
  html.deck-app .deck__track .page#deck-experiencia > .page__title {
    display: block;
    width: 100vw;
    max-width: 100vw;
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
    padding-inline: 0;
    box-sizing: border-box;
    white-space: normal;
    text-wrap: wrap;
    overflow: hidden;
    text-align: left;
    text-align-last: auto;
    line-height: 0.9;
    letter-spacing: 0.01em;
    margin-bottom: 8px;
    font-size: var(--deck-marquee-title-fs, clamp(44px, 11.5vw, 58px));
  }

  html.deck-app #deck-ecosistema .ecosistema__title,
  html.deck-app .deck__track .page#deck-ecosistema > .ecosistema__title {
    display: block;
    width: 100vw;
    max-width: 100vw;
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
    padding-inline: 0;
    box-sizing: border-box;
    white-space: normal;
    text-wrap: wrap;
    overflow: hidden;
    text-align: left;
    text-align-last: auto;
    line-height: 0.9;
    letter-spacing: 0.01em;
    margin-bottom: 8px;
    font-size: var(--deck-marquee-title-fs, clamp(44px, 11.5vw, 58px));
  }

  html.deck-app #deck-ecosistema .ecosistema__title-marquee__text {
    color: #ffffff;
    -webkit-text-fill-color: currentColor;
  }

  html.deck-app .deck__track .page#deck-nucleo > .page__title,
  html.deck-app #deck-nucleo .page__title.t-display {
    font-size: var(--deck-marquee-title-fs, clamp(44px, 11.5vw, 58px));
  }

  /* Marquee móvil (slides 03 y 04): full-bleed sin padding lateral */
  html.deck-app #deck-experiencia .page__title.page__title--marquee,
  html.deck-app .deck__track .page#deck-experiencia > .page__title.page__title--marquee,
  html.deck-app #deck-ecosistema .ecosistema__title.page__title--marquee,
  html.deck-app .deck__track .page#deck-ecosistema > .ecosistema__title.page__title--marquee {
    padding-inline: 0;
    overflow: hidden;
    text-align: left;
    text-align-last: auto;
    white-space: normal;
    text-wrap: wrap;
  }
}

/*
 * Marquee móvil — franja oscura (autocontenido; no depende de text-box-trim).
 * Altura fija + flex: mismo resultado en Chrome local e iOS Safari en producción.
 * Título padre overflow:visible → iOS no recorta la franja.
 */
@media (max-width: 680px) {
  html.deck-app {
    --marquee-bar-fs: var(--deck-marquee-title-fs, clamp(44px, 11.5vw, 58px));
    --marquee-bar-pad: 1px;
    --marquee-bar-h: calc(var(--marquee-bar-fs) + 2 * var(--marquee-bar-pad));
    /* Bebas Neue: caps ocupan la mitad superior del em-box → bajar ~8% para centrar óptico */
    --marquee-bar-optical-shift: 0.08em;
  }

  html.deck-app #deck-momento .momento__cluster > .page__title,
  html.deck-app #deck-momento .momento__cluster > .page__title.page__title--stack,
  html.deck-app .deck__track .page#deck-nucleo > .page__title,
  html.deck-app #deck-nucleo .page__title.t-display,
  html.deck-app #deck-experiencia .page__title,
  html.deck-app .deck__track .page#deck-experiencia > .page__title,
  html.deck-app #deck-experiencia .page__title.page__title--marquee,
  html.deck-app .deck__track .page#deck-experiencia > .page__title.page__title--marquee,
  html.deck-app #deck-ecosistema .ecosistema__title,
  html.deck-app .deck__track .page#deck-ecosistema > .ecosistema__title,
  html.deck-app #deck-ecosistema .ecosistema__title.page__title--marquee,
  html.deck-app .deck__track .page#deck-ecosistema > .ecosistema__title.page__title--marquee {
    line-height: 1;
    overflow: visible;
  }

  html.deck-app #deck-momento .momento__title-marquee__viewport,
  html.deck-app #deck-nucleo .nucleo__title-marquee__viewport,
  html.deck-app #deck-experiencia .experiencia__title-marquee__viewport,
  html.deck-app #deck-ecosistema .ecosistema__title-marquee__viewport {
    position: relative;
    isolation: isolate;
    display: flex;
    align-items: center;
    box-sizing: border-box;
    height: var(--marquee-bar-h);
    min-height: var(--marquee-bar-h);
    max-height: var(--marquee-bar-h);
    padding: 0;
    margin: 0;
    line-height: 1;
    overflow: hidden;
    background: var(--deck-chrome-bg, #141315);
    text-box-trim: unset;
    text-box-edge: unset;
  }

  html.deck-app #deck-momento .momento__title-marquee__track,
  html.deck-app #deck-nucleo .nucleo__title-marquee__track,
  html.deck-app #deck-experiencia .experiencia__title-marquee__track,
  html.deck-app #deck-ecosistema .ecosistema__title-marquee__track {
    display: inline-flex;
    align-items: center;
    width: max-content;
    line-height: 1;
    margin: 0;
  }

  html.deck-app #deck-momento .momento__title-marquee__text,
  html.deck-app #deck-nucleo .nucleo__title-marquee__text,
  html.deck-app #deck-experiencia .experiencia__title-marquee__text,
  html.deck-app #deck-ecosistema .ecosistema__title-marquee__text {
    line-height: 1;
    display: block;
    transform: translateY(var(--marquee-bar-optical-shift));
  }
}

/*
 * Móvil — scroll vertical interno en la slide; en el tope/fondo el gesto cambia de slide (deck-nav.js).
 * Slides 01–02 excluidas: layout fijo sin scroll.
 */
@media (max-width: 680px) {
  html.deck-app .deck-shell__dock-spacer,
  html.deck-app .deck-shell__dock {
    touch-action: pan-x pinch-zoom;
  }

  html.deck-app .deck__track .page:not(.page--cover):not(#deck-momento):not(#deck-nucleo) {
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior-y: contain;
    touch-action: pan-y pan-x pinch-zoom;
    -webkit-overflow-scrolling: touch;
    scroll-padding-bottom: clamp(10px, 2.5vh, 18px);
  }

  html.deck-app .deck__track .page#deck-momento,
  html.deck-app #deck-momento.page,
  html.deck-app .deck__track .page#deck-nucleo,
  html.deck-app #deck-nucleo.page {
    overflow-x: hidden;
    overflow-y: hidden;
    overscroll-behavior: none;
    touch-action: pan-x pinch-zoom;
  }

  html.deck-app .deck__track .page:not(.page--cover):not(#deck-momento):not(#deck-nucleo) > .page__body {
    flex: 0 0 auto;
    min-height: 0;
    overflow: visible;
    justify-content: flex-start;
  }

  html.deck-app #deck-experiencia .page__body,
  html.deck-app #deck-ecosistema .page__body {
    justify-content: flex-start;
    overflow: visible;
  }

  html.deck-app #deck-momento .momento__cluster {
    flex: 1 1 0;
    min-height: 0;
  }

  html.deck-app #deck-momento .momento__cluster > .page__body {
    flex: 1 1 0;
    min-height: 0;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    align-items: flex-start;
    overflow: visible;
  }

  html.deck-app #deck-nucleo .page__body {
    flex: 1 1 0;
    min-height: 0;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: stretch;
    overflow: hidden;
  }

  html.deck-app #deck-nucleo .nucleo__layout {
    flex: 0 0 auto;
    min-height: 0;
  }

  /*
   * Slide 05 — chips al centro vertical (grid + body; anula flex del carril y scroll block).
   */
  html.deck-app .deck__track .page#deck-contacto[aria-hidden="false"],
  html.deck-app .deck__track .page#deck-contacto:target,
  html.deck-app #deck-contacto.page[aria-hidden="false"],
  html.deck-app #deck-contacto.page:target {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr);
    grid-template-rows: minmax(0, 1fr);
    height: 100%;
    min-height: 0;
    max-height: 100%;
    overflow-x: hidden;
    overflow-y: hidden;
    overscroll-behavior: none;
  }

  html.deck-app #deck-contacto .page__label {
    display: none;
  }

  html.deck-app .deck__track .page#deck-contacto > .page__body,
  html.deck-app #deck-contacto .page__body {
    grid-row: 1;
    flex: 1 1 auto;
    min-height: 0;
    height: 100%;
    display: flex !important;
    flex-direction: column;
    justify-content: center !important;
    align-items: flex-start;
    overflow: hidden;
    padding-top: 0;
    padding-bottom: 0;
  }

  html.deck-app #deck-contacto .contacto__panel {
    align-self: flex-start;
    margin: 0;
  }
}

@page {
  size: A4 landscape;
  margin: 0;
}