/* ════════════════════════════════════════════════════════════════════
   Tulum Festival Season · sistema visual de la pagina

   Portado del paquete de diseno aprobado. Dos decisiones estructurales:

   1. Todas las clases llevan prefijo fs- porque el paquete traia nombres
      genericos (.footer, .brand, .section, .hero) que chocaban con los del
      sitio. Con el prefijo, esta hoja no puede pisar nada de base.css.

   2. Las variables del paquete se redefinen aqui a partir de los tokens
      del sitio, no se copian sus valores. Asi la pagina hereda la paleta
      y la tipografia de Prestigia en vez de traer las suyas.
   ════════════════════════════════════════════════════════════════════ */

.fs-page {
  --ink:          var(--pg-bg-dark);
  --ink-soft:     #11100E;
  --ink-elevated: #171512;
  --ivory:        var(--pg-fg-on-dark);
  --ivory-dim:    rgba(242, 237, 227, 0.68);
  --paper:        var(--pg-bg);
  --paper-deep:   var(--pg-bg-deep);
  --gold:         var(--pg-gold);
  --gold-light:   var(--pg-gold-lt);
  --bronze:       var(--pg-bronze);
  --line-dark:    rgba(242, 237, 227, 0.16);
  --line-light:   var(--pg-line-mid);
  --display:      var(--pg-display);
  --serif:        var(--pg-serif);
  --mono:         var(--pg-mono);
  --ease:         var(--pg-ease);
  --section-pad:  clamp(88px, 10vw, 164px);
  --gutter:       var(--pg-pad);
  --max:          var(--pg-max);
  background: var(--paper);
}

/* El paquete usaba italica de sistema; el sitio la resuelve con Cormorant,
   que ya viene cargada en el head. */
.fs-page em { font-family: var(--serif); font-style: italic; font-weight: 500; }

/* :where() no aporta especificidad, asi que este reset se aplica solo
   cuando ninguna otra regla pinta el enlace. Con un selector normal pisaba
   el color de las tarjetas, que ahora son enlaces. */
:where(.fs-page a) { color: inherit; text-decoration: none; }
:where(.fs-page button) { border: 0; font: inherit; color: inherit; cursor: pointer; }
.fs-page [class^="fs-"] a:focus-visible,
.fs-page [class^="fs-"] button:focus-visible {
  outline: 2px solid var(--gold-light); outline-offset: 4px;
}

/* Enlaces dentro de texto corrido: FAQ y calendario. */
.fs-faq-answer a, .fs-table a {
  color: var(--bronze);
  text-decoration: none;
  border-bottom: 1px solid var(--pg-line-gold);
}
.fs-faq-answer a:hover, .fs-table a:hover { color: var(--gold); border-color: var(--gold); }

.fs-hero {
  position: relative;
  min-height: 100svh;
  overflow: hidden;
  background: var(--ink);
  color: var(--ivory);
  isolation: isolate;
}
.fs-hero-media,
.fs-hero-shade,
.fs-hero-orbit {
  position: absolute;
  inset: 0;
}
.fs-hero-media {
  z-index: -4;
  inset: -3%;
  background-image: url("/images/events/zamna-tulum-hero.webp");
  background-size: cover;
  background-position: center;
  transform: translate3d(0, calc(var(--hero-shift, 0) * 1px), 0) scale(1.07);
  filter: saturate(0.86) contrast(1.06) brightness(0.72);
  transition: filter 700ms ease;
}
.fs-hero-shade {
  z-index: -3;
  background:
    linear-gradient(180deg, rgba(4, 4, 4, 0.3) 0%, rgba(4, 4, 4, 0.08) 30%, rgba(4, 4, 4, 0.84) 88%, #080807 100%),
    linear-gradient(90deg, rgba(4, 4, 4, 0.72) 0%, transparent 60%);
}
.fs-hero-orbit {
  z-index: -2;
  width: 72vw;
  height: 72vw;
  max-width: 1120px;
  max-height: 1120px;
  inset: 12% auto auto 49%;
  border: 1px solid rgba(241, 215, 151, 0.14);
  border-radius: 50%;
  transform: translateX(-50%);
}
.fs-hero-orbit--two {
  width: 54vw;
  height: 54vw;
  inset: 23% auto auto 49%;
  border-color: rgba(241, 215, 151, 0.09);
}
.fs-hero-content {
  position: relative;
  z-index: 2;
  width: min(var(--max), 100%);
  min-height: 100svh;
  margin: 0 auto;
  padding: clamp(128px, 16vh, 190px) var(--gutter) 112px;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.fs-hero-kicker {
  display: flex;
  align-items: center;
  gap: 32px;
  margin-bottom: clamp(28px, 4vh, 48px);
  color: var(--gold-light);
  font-family: var(--mono);
  font-size: 10px;
  letter-spacing: 0.2em;
  text-transform: uppercase;
}
.fs-hero-kicker span:first-child {
  display: inline-flex;
  align-items: center;
  gap: 14px;
}
.fs-hero-kicker span:first-child::before {
  content: "";
  width: 34px;
  height: 1px;
  background: currentColor;
}
.fs-hero-title {
  margin: 0;
  max-width: 1150px;
  font-size: clamp(59px, 8.8vw, 142px);
  font-weight: 600;
  line-height: 0.84;
  letter-spacing: -0.075em;
  text-transform: uppercase;
}
.fs-title-line {
  display: block;
}
.fs-hero-title em,
.fs-display-title em,
.fs-final-content h2 em {
  color: var(--gold-light);
  font-family: var(--serif);
  font-weight: 500;
  text-transform: none;
}
.fs-title-line--small {
  margin-top: clamp(20px, 3vh, 34px);
  font-size: clamp(21px, 2.5vw, 38px);
  line-height: 1;
  letter-spacing: -0.045em;
  text-transform: none;
}
.fs-hero-bottom {
  display: grid;
  grid-template-columns: minmax(260px, 500px) auto;
  align-items: end;
  justify-content: space-between;
  gap: 36px;
  margin-top: clamp(42px, 6vh, 76px);
}
.fs-hero-bottom p {
  margin: 0;
  max-width: 460px;
  color: var(--ivory-dim);
  font-size: clamp(14px, 1.15vw, 17px);
  line-height: 1.65;
}
.fs-hero-actions {
  display: flex;
  align-items: center;
  gap: 28px;
}
.fs-button {
  display: inline-flex;
  align-items: center;
  justify-content: space-between;
  gap: 32px;
  min-height: 52px;
  padding: 14px 20px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 600;
  transition: background 220ms ease, color 220ms ease, border-color 220ms ease;
}
.fs-button--gold {
  background: var(--gold);
  color: var(--ink);
}
.fs-button--gold:hover {
  background: var(--gold-light);
}
.fs-button--large {
  min-width: min(300px, 100%);
  min-height: 60px;
  padding-inline: 26px;
}
.fs-button--full {
  width: 100%;
}
.fs-text-link {
  display: inline-flex;
  align-items: center;
  gap: 14px;
  min-height: 44px;
  color: var(--ivory);
  font-size: 12px;
}
.fs-text-link span {
  color: var(--gold-light);
  transition: transform 220ms var(--ease);
}
.fs-text-link:hover span {
  transform: translateY(4px);
}
.fs-hero-index {
  position: absolute;
  z-index: 2;
  right: 18px;
  top: 50%;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 12px;
  transform: translateY(-50%);
  color: rgba(243, 238, 228, 0.46);
  font-family: var(--mono);
  font-size: 8px;
}
.fs-hero-index i {
  width: 1px;
  height: 100px;
  background: linear-gradient(to bottom, var(--gold), rgba(243, 238, 228, 0.12));
}
.fs-ticker {
  position: absolute;
  z-index: 2;
  bottom: 0;
  left: 0;
  width: 100%;
  overflow: hidden;
  border-top: 1px solid var(--line-dark);
  background: rgba(8, 8, 7, 0.34);
  backdrop-filter: blur(8px);
}
.fs-ticker-track {
  display: flex;
  align-items: center;
  width: max-content;
  animation: fs-ticker 30s linear infinite;
}
.fs-ticker-track span,
.fs-ticker-track b {
  padding: 18px 26px;
  white-space: nowrap;
  font-size: 11px;
  font-weight: 500;
  letter-spacing: 0.16em;
  text-transform: uppercase;
}
.fs-ticker-track span {
  color: var(--ivory);
}
.fs-ticker-track b {
  color: var(--gold-light);
  font-family: var(--mono);
}
@keyframes fs-ticker {
  to { transform: translateX(-50%); }
}
.fs-section {
  padding: var(--section-pad) var(--gutter);
}
.fs-section > * {
  max-width: var(--max);
  margin-left: auto;
  margin-right: auto;
}
.fs-section-label {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-bottom: 18px;
  border-bottom: 1px solid var(--line-light);
  color: rgba(8, 8, 7, 0.68);
  font-family: var(--mono);
  font-size: 9px;
  letter-spacing: 0.18em;
  text-transform: uppercase;
}
.fs-section-label--dark {
  border-color: var(--line-dark);
  color: rgba(243, 238, 228, 0.66);
}
.fs-display-title {
  margin: 0;
  font-size: clamp(46px, 6.6vw, 104px);
  font-weight: 600;
  line-height: 0.94;
  letter-spacing: -0.065em;
}
.fs-display-title--light {
  color: var(--ivory);
}
.fs-manifesto {
  position: relative;
  background: var(--paper);
}
.fs-manifesto-grid {
  display: grid;
  grid-template-columns: 1.25fr 0.65fr;
  gap: clamp(64px, 9vw, 140px);
  align-items: end;
  padding-top: clamp(68px, 9vw, 140px);
}
.fs-manifesto-grid .fs-display-title {
  max-width: 930px;
}
.fs-manifesto-copy {
  padding-bottom: 8px;
}
.fs-manifesto-copy p,
.fs-handled-heading > p,
.fs-rhythm-heading > p,
.fs-venues-heading > p {
  margin: 0;
  color: rgba(8, 8, 7, 0.63);
  font-size: clamp(15px, 1.25vw, 18px);
  line-height: 1.7;
}
.fs-manifesto-copy p + p {
  margin-top: 22px;
}
.fs-manifesto-copy strong {
  color: var(--ink);
  font-weight: 600;
}
.fs-season-stats {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  margin-top: clamp(84px, 10vw, 150px);
  border-top: 1px solid var(--line-light);
  border-bottom: 1px solid var(--line-light);
}
.fs-season-stats div {
  display: flex;
  flex-direction: column;
  gap: 14px;
  padding: clamp(32px, 4vw, 58px) clamp(12px, 2.2vw, 34px);
  border-right: 1px solid var(--line-light);
}
.fs-season-stats div:first-child {
  padding-left: 0;
}
.fs-season-stats div:last-child {
  border-right: 0;
}
.fs-season-stats strong {
  font-family: var(--serif);
  font-size: clamp(54px, 6vw, 92px);
  font-weight: 500;
  line-height: 0.8;
  color: var(--bronze);
}
.fs-season-stats span {
  color: rgba(8, 8, 7, 0.58);
  font-family: var(--mono);
  font-size: 9px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}
.fs-nights {
  background: var(--ink);
  color: var(--ivory);
}
.fs-nights-intro {
  margin-bottom: clamp(78px, 9vw, 140px);
}
.fs-nights-intro .fs-display-title {
  max-width: 980px;
  margin-top: clamp(64px, 8vw, 110px);
}
.fs-nights-deck {
  max-width: 640px;
  margin: 34px 0 0 auto;
  color: rgba(243, 238, 228, 0.68);
  font-size: clamp(15px, 1.25vw, 18px);
  line-height: 1.7;
}
.fs-nights-layout {
  display: grid;
  grid-template-columns: 260px minmax(0, 1fr);
  gap: clamp(36px, 6vw, 96px);
  align-items: start;
}
.fs-nights-rail {
  position: sticky;
  top: 112px;
  padding: 0 0 30px;
}
.fs-nights-rail > p {
  margin: 0 0 26px;
  color: rgba(243, 238, 228, 0.7);
  font-family: var(--mono);
  font-size: 9px;
  letter-spacing: 0.18em;
  text-transform: uppercase;
}
.fs-date-list {
  display: flex;
  flex-direction: column;
}
.fs-date-button {
  position: relative;
  display: grid;
  grid-template-columns: 74px 1fr;
  align-items: center;
  min-height: 62px;
  padding: 0 0 0 18px;
  border-left: 1px solid var(--line-dark);
  background: transparent;
  color: rgba(243, 238, 228, 0.68);
  text-align: left;
  transition: color 240ms ease;
}
.fs-date-button::before {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: -1px;
  width: 2px;
  background: var(--gold);
  transform: scaleY(0);
  transition: transform 340ms var(--ease);
}
.fs-date-button span {
  font-family: var(--mono);
  font-size: 9px;
  letter-spacing: 0.12em;
}
.fs-date-button strong {
  font-size: 14px;
  font-weight: 500;
}
.fs-date-button:hover,
.fs-date-button.is-active {
  color: var(--ivory);
}
.fs-date-button.is-active::before {
  transform: scaleY(1);
}
.fs-event-stack {
  display: flex;
  flex-direction: column;
  gap: clamp(32px, 5vw, 74px);
}
.fs-event-card {
  position: relative;
  min-height: min(76vh, 860px);
  overflow: hidden;
  border: 1px solid var(--line-dark);
  border-radius: 2px;
  isolation: isolate;
}
.fs-event-card-media,
.fs-event-card-overlay {
  position: absolute;
  inset: 0;
}
.fs-event-card-media {
  z-index: -2;
  background-image: var(--event-image);
  background-position: center;
  background-size: cover;
  filter: saturate(0.72) brightness(0.74);
  transform: scale(1.04);
  transition: transform 1200ms var(--ease), filter 700ms ease;
}
.fs-event-card-overlay {
  z-index: -1;
  background: linear-gradient(180deg, rgba(8, 8, 7, 0.22), rgba(8, 8, 7, 0.14) 35%, rgba(8, 8, 7, 0.92) 100%);
}
.fs-event-card.is-active .fs-event-card-media,
.fs-event-card:hover .fs-event-card-media {
  transform: scale(1);
  filter: saturate(0.94) brightness(0.8);
}
.fs-event-card-top {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 22px 24px;
  border-bottom: 1px solid var(--line-dark);
  color: rgba(243, 238, 228, 0.68);
  font-family: var(--mono);
  font-size: 8px;
  letter-spacing: 0.16em;
  text-transform: uppercase;
}
.fs-event-card-copy {
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: end;
  gap: 24px;
  padding: clamp(28px, 4vw, 58px);
}
.fs-event-card-copy p {
  grid-column: 1 / -1;
  margin: 0;
  color: var(--gold-light);
  font-family: var(--mono);
  font-size: 10px;
  letter-spacing: 0.18em;
  text-transform: uppercase;
}
.fs-event-card-copy h3 {
  margin: 0;
  font-size: clamp(50px, 7vw, 112px);
  font-weight: 600;
  line-height: 0.82;
  letter-spacing: -0.075em;
  text-transform: uppercase;
}
.fs-event-card-copy h3 em {
  color: var(--gold-light);
  font-family: var(--serif);
  font-weight: 500;
  text-transform: none;
}
.fs-event-card-copy > span {
  max-width: 320px;
  color: rgba(243, 238, 228, 0.72);
  font-size: 13px;
  line-height: 1.65;
}
.fs-announcement-card {
  position: relative;
  min-height: 480px;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  padding: clamp(34px, 5vw, 74px);
  border: 1px solid rgba(207, 170, 93, 0.38);
  background:
    radial-gradient(circle at 74% 24%, rgba(207, 170, 93, 0.2), transparent 24%),
    linear-gradient(135deg, #17130d 0%, #090908 72%);
  isolation: isolate;
}
.fs-announcement-card::before {
  content: "";
  position: absolute;
  z-index: -1;
  width: min(58vw, 760px);
  aspect-ratio: 1;
  top: 50%;
  right: -12%;
  border: 1px solid rgba(241, 215, 151, 0.16);
  border-radius: 50%;
  transform: translateY(-50%);
  box-shadow: 0 0 0 100px rgba(241, 215, 151, 0.025), 0 0 0 200px rgba(241, 215, 151, 0.018);
}
.fs-announcement-card > span {
  color: var(--gold-light);
  font-family: var(--mono);
  font-size: 9px;
  letter-spacing: 0.18em;
  text-transform: uppercase;
}
.fs-announcement-card h3 {
  margin: 24px 0 0;
  max-width: 760px;
  font-size: clamp(48px, 7vw, 102px);
  font-weight: 600;
  line-height: 0.86;
  letter-spacing: -0.07em;
}
.fs-announcement-card h3 em {
  color: var(--gold-light);
  font-family: var(--serif);
  font-weight: 500;
}
.fs-announcement-card p {
  max-width: 600px;
  margin: 28px 0 0;
  color: rgba(243, 238, 228, 0.66);
  font-size: 14px;
  line-height: 1.7;
}
.fs-announcement-lines {
  display: grid;
  grid-template-columns: 1.4fr 0.8fr 1.8fr;
  gap: 10px;
  margin-top: 44px;
}
.fs-announcement-lines i {
  height: 2px;
  background: linear-gradient(90deg, var(--gold), rgba(207, 170, 93, 0.15));
}
.fs-interlude {
  position: relative;
  min-height: 100svh;
  display: grid;
  place-items: center;
  overflow: hidden;
  color: var(--ivory);
  background: var(--ink);
  isolation: isolate;
}
.fs-interlude-media,
.fs-interlude-shade {
  position: absolute;
  inset: 0;
}
.fs-interlude-media {
  z-index: -2;
  background: url("/images/events/anyma-aeden-hero.webp") center/cover;
  filter: saturate(0.5) brightness(0.62);
}
.fs-interlude-shade {
  z-index: -1;
  background: radial-gradient(circle at center, rgba(8, 8, 7, 0.18), rgba(8, 8, 7, 0.82)), linear-gradient(180deg, rgba(8, 8, 7, 0.3), rgba(8, 8, 7, 0.64));
}
.fs-interlude-copy {
  max-width: 1000px;
  padding: 100px var(--gutter);
  text-align: center;
}
.fs-interlude-copy p {
  margin: 0;
  font-size: clamp(48px, 7.2vw, 112px);
  font-weight: 600;
  line-height: 0.94;
  letter-spacing: -0.07em;
}
.fs-interlude-copy p em {
  color: var(--gold-light);
  font-family: var(--serif);
  font-weight: 500;
}
.fs-interlude-copy span {
  display: block;
  margin-top: 30px;
  color: var(--gold-light);
  font-family: var(--mono);
  font-size: 9px;
  letter-spacing: 0.2em;
  text-transform: uppercase;
}
.fs-handled {
  background: var(--paper);
}
.fs-handled-heading,
.fs-rhythm-heading,
.fs-venues-heading {
  display: grid;
  grid-template-columns: 1.2fr 0.58fr;
  gap: clamp(56px, 8vw, 130px);
  align-items: end;
  padding-top: clamp(68px, 9vw, 140px);
}
.fs-handled-heading > p,
.fs-rhythm-heading > p,
.fs-venues-heading > p {
  max-width: 480px;
  padding-bottom: 8px;
}
.fs-service-grid {
  display: grid;
  grid-template-columns: 1.25fr 0.8fr 0.95fr;
  grid-auto-rows: minmax(340px, 38vw);
  gap: 12px;
  margin-top: clamp(76px, 9vw, 130px);
}
.fs-service-card {
  position: relative;
  overflow: hidden;
  min-height: 340px;
  background: var(--ink-soft);
  color: var(--ivory);
  isolation: isolate;
}
.fs-service-card--feature {
  grid-row: span 2;
}
.fs-service-media {
  position: absolute;
  z-index: -2;
  inset: 0;
  background-image: var(--service-image);
  background-size: cover;
  background-position: center;
  filter: saturate(0.68) brightness(0.74);
  transform: scale(1.02);
  transition: transform 900ms var(--ease), filter 400ms ease;
}
.fs-service-card:hover .fs-service-media {
  transform: scale(1.055);
  filter: saturate(0.9) brightness(0.76);
}
.fs-service-card--feature::after,
.fs-service-card--image::after {
  content: "";
  position: absolute;
  z-index: -1;
  inset: 0;
  background: linear-gradient(180deg, rgba(8, 8, 7, 0.1) 20%, rgba(8, 8, 7, 0.9) 100%);
}
.fs-service-content,
.fs-service-card--text {
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  padding: clamp(28px, 3.5vw, 52px);
}
.fs-service-content {
  position: absolute;
  inset: 0;
}
.fs-service-card span {
  margin-bottom: 20px;
  color: var(--gold-light);
  font-family: var(--mono);
  font-size: 8px;
  letter-spacing: 0.18em;
  text-transform: uppercase;
}
.fs-service-card h3 {
  margin: 0;
  max-width: 620px;
  font-size: clamp(30px, 3vw, 52px);
  font-weight: 600;
  line-height: 0.98;
  letter-spacing: -0.055em;
}
.fs-service-card p {
  margin: 18px 0 0;
  max-width: 430px;
  color: rgba(243, 238, 228, 0.64);
  font-size: 13px;
  line-height: 1.6;
}
.fs-service-card--text {
  justify-content: space-between;
  background: #1a1814;
}
.fs-service-card--text h3 {
  margin-bottom: auto;
}
.fs-service-card--text i {
  position: absolute;
  right: 28px;
  bottom: 28px;
  color: var(--gold-light);
  font-style: normal;
  font-size: 20px;
  transition: transform 240ms var(--ease);
}
.fs-service-card--text:hover i {
  transform: translate(4px, -4px);
}
.fs-service-card--gold {
  background: var(--gold);
  color: var(--ink);
}
.fs-service-card--gold span,
.fs-service-card--gold i {
  color: rgba(8, 8, 7, 0.64);
}
.fs-service-card--gold p {
  color: rgba(8, 8, 7, 0.68);
}
.fs-service-card--wide {
  grid-column: 1 / -1;
  min-height: 480px;
  display: grid;
  grid-template-columns: minmax(330px, 0.72fr) minmax(0, 1.28fr);
  background: #12110f;
}
.fs-service-wide-copy {
  position: relative;
  z-index: 2;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  padding: clamp(34px, 4.6vw, 70px);
}
.fs-service-wide-copy h3 {
  font-size: clamp(38px, 4.4vw, 68px);
}
.fs-service-collage {
  display: grid;
  grid-template-columns: 1.25fr 0.75fr;
  grid-template-rows: 1fr 1fr;
  gap: 3px;
  min-height: 100%;
  background: var(--ink);
}
.fs-service-collage > div {
  min-height: 230px;
  background-image: linear-gradient(rgba(8, 8, 7, 0.08), rgba(8, 8, 7, 0.28)), var(--collage-image);
  background-position: center;
  background-size: cover;
  filter: saturate(0.72) brightness(0.82);
  transition: filter 420ms ease, transform 900ms var(--ease);
}
.fs-service-collage > div:first-child {
  grid-row: 1 / -1;
}
.fs-service-card--wide:hover .fs-service-collage > div {
  filter: saturate(0.92) brightness(0.88);
}
.fs-rhythm {
  overflow: hidden;
  background: var(--ink);
  color: var(--ivory);
}
.fs-rhythm-heading > p {
  color: rgba(243, 238, 228, 0.62);
}
.fs-rhythm-track {
  display: grid;
  grid-template-columns: repeat(5, minmax(210px, 1fr));
  gap: 10px;
  margin-top: clamp(76px, 9vw, 130px);
}
.fs-rhythm-track article {
  position: relative;
  min-height: clamp(480px, 46vw, 640px);
  overflow: hidden;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  padding: 34px 26px;
  isolation: isolate;
}
.fs-rhythm-track article::before {
  content: "";
  position: absolute;
  z-index: -2;
  inset: 0;
  background-image: var(--rhythm-image);
  background-position: center;
  background-size: cover;
  filter: saturate(0.64) brightness(0.7);
  transform: scale(1.025);
  transition: transform 900ms var(--ease), filter 420ms ease;
}
.fs-rhythm-track article::after {
  content: "";
  position: absolute;
  z-index: -1;
  inset: 0;
  background: linear-gradient(180deg, rgba(8, 8, 7, 0.14) 10%, rgba(8, 8, 7, 0.2) 42%, rgba(8, 8, 7, 0.95) 100%);
}
.fs-rhythm-track article:hover::before {
  filter: saturate(0.88) brightness(0.76);
  transform: scale(1.07);
}
.fs-rhythm-track span {
  margin-bottom: auto;
  color: var(--gold-light);
  font-family: var(--mono);
  font-size: 9px;
  letter-spacing: 0.15em;
}
.fs-rhythm-track strong {
  position: relative;
  font-family: var(--serif);
  font-size: clamp(38px, 3.5vw, 58px);
  font-weight: 500;
  line-height: 0.92;
}
.fs-rhythm-track p {
  position: relative;
  margin: 14px 0 0;
  color: rgba(243, 238, 228, 0.74);
  font-size: 12px;
  line-height: 1.6;
}
.fs-venues {
  background: var(--paper);
}
.fs-venue-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px;
  margin-top: clamp(74px, 9vw, 130px);
}
.fs-venue-card {
  position: relative;
  min-height: min(60vw, 720px);
  overflow: hidden;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  padding: 24px;
  color: var(--ivory);
  isolation: isolate;
}
.fs-venue-media,
.fs-venue-shade {
  position: absolute;
  inset: 0;
}
.fs-venue-media {
  z-index: -2;
  background-image: var(--venue-image);
  background-size: cover;
  background-position: center;
  filter: saturate(0.62) brightness(0.72);
  transform: scale(1.03);
  transition: transform 1000ms var(--ease), filter 500ms ease;
}
.fs-venue-shade {
  z-index: -1;
  background: linear-gradient(180deg, rgba(8, 8, 7, 0.3), transparent 42%, rgba(8, 8, 7, 0.9));
}
.fs-venue-card:hover .fs-venue-media {
  transform: scale(1.08);
  filter: saturate(0.88) brightness(0.78);
}
.fs-venue-card > span,
.fs-venue-card p,
.fs-venue-card small {
  font-family: var(--mono);
  font-size: 8px;
  letter-spacing: 0.16em;
  text-transform: uppercase;
}
.fs-venue-card > span {
  color: var(--gold-light);
}
.fs-venue-card p {
  margin: 0 0 10px;
  color: rgba(243, 238, 228, 0.62);
}
.fs-venue-card h3 {
  margin: 0;
  font-size: clamp(46px, 4.6vw, 76px);
  font-weight: 600;
  line-height: 0.86;
  letter-spacing: -0.065em;
}
.fs-venue-card small {
  display: block;
  margin-top: 16px;
  color: var(--gold-light);
}
.fs-faq {
  display: grid;
  grid-template-columns: minmax(300px, 0.8fr) 1.2fr;
  gap: clamp(60px, 9vw, 150px);
  align-items: start;
  background: var(--paper-deep);
}
.fs-faq-heading,
.fs-faq-list {
  width: 100%;
  max-width: none;
}
.fs-faq-heading {
  position: sticky;
  top: 112px;
}
.fs-faq-heading .fs-display-title {
  margin-top: clamp(54px, 7vw, 96px);
}
.fs-faq-item {
  border-top: 1px solid var(--line-light);
}
.fs-faq-item:last-child {
  border-bottom: 1px solid var(--line-light);
}
.fs-faq-item > button {
  width: 100%;
  min-height: 100px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  padding: 20px 0;
  background: transparent;
  color: var(--ink);
  text-align: left;
  font-size: clamp(17px, 1.5vw, 22px);
  font-weight: 600;
  letter-spacing: -0.025em;
}
.fs-faq-item i {
  position: relative;
  width: 24px;
  height: 24px;
  flex: 0 0 auto;
  border: 1px solid rgba(8, 8, 7, 0.3);
  border-radius: 50%;
}
.fs-faq-item i::before,
.fs-faq-item i::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 9px;
  height: 1px;
  background: var(--ink);
  transform: translate(-50%, -50%);
  transition: transform 260ms var(--ease);
}
.fs-faq-item i::after {
  transform: translate(-50%, -50%) rotate(90deg);
}
.fs-faq-item.is-open i::after {
  transform: translate(-50%, -50%) rotate(0);
}
.fs-faq-answer {
  display: grid;
  grid-template-rows: 0fr;
  transition: grid-template-rows 430ms var(--ease);
}
.fs-faq-answer p {
  overflow: hidden;
  margin: 0;
  max-width: 660px;
  color: rgba(8, 8, 7, 0.62);
  font-size: 14px;
  line-height: 1.7;
}
.fs-faq-item.is-open .fs-faq-answer {
  grid-template-rows: 1fr;
}
.fs-faq-item.is-open .fs-faq-answer p {
  padding-bottom: 34px;
}
.fs-final-cta {
  position: relative;
  min-height: min(100svh, 920px);
  display: grid;
  place-items: center;
  padding: 100px var(--gutter);
  overflow: hidden;
  background: var(--ink);
  color: var(--ivory);
  isolation: isolate;
}
.fs-final-media,
.fs-final-shade {
  position: absolute;
  inset: 0;
}
.fs-final-media {
  z-index: -2;
  background: url("/images/events/tulum-festival-season-hero.webp") center/cover;
  filter: saturate(0.7) brightness(0.62);
}
.fs-final-shade {
  z-index: -1;
  background: radial-gradient(circle at 50% 45%, rgba(8, 8, 7, 0.24), rgba(8, 8, 7, 0.86));
}
.fs-final-content {
  max-width: 1100px;
  text-align: center;
}
.fs-final-content > span {
  color: var(--gold-light);
  font-family: var(--mono);
  font-size: 9px;
  letter-spacing: 0.2em;
  text-transform: uppercase;
}
.fs-final-content h2 {
  margin: 34px 0 0;
  font-size: clamp(54px, 8.6vw, 132px);
  font-weight: 600;
  line-height: 0.86;
  letter-spacing: -0.075em;
}
.fs-final-content p {
  margin: 34px auto 32px;
  max-width: 480px;
  color: var(--ivory-dim);
  font-size: 15px;
  line-height: 1.6;
}
.fs-brand--footer {
  grid-column: 1;
}
.fs-reveal {
  opacity: 0;
  transition: opacity 800ms var(--ease), transform 800ms var(--ease);
}
.fs-reveal--up {
  transform: translateY(42px);
}
.fs-reveal--title {
  opacity: 0;
  transform: translateY(0.86em);
}
.fs-reveal.is-visible {
  opacity: 1;
  transform: translateY(0);
}
.fs-reveal[data-delay="1"] { transition-delay: 100ms; }
.fs-reveal[data-delay="2"] { transition-delay: 200ms; }
.fs-reveal[data-delay="3"] { transition-delay: 300ms; }
@media (max-width: 1200px) {
  .fs-rhythm-track {
    grid-template-columns: repeat(5, minmax(240px, 1fr));
    overflow-x: auto;
    scroll-snap-type: x proximity;
  }
  .fs-rhythm-track article {
    scroll-snap-align: start;
  }
}
@media (max-width: 1080px) {
  .fs-hero-index {
    display: none;
  }
  .fs-manifesto-grid,
  .fs-handled-heading,
  .fs-rhythm-heading,
  .fs-venues-heading {
    grid-template-columns: 1fr;
    gap: 42px;
  }
  .fs-nights-layout {
    grid-template-columns: 200px 1fr;
    gap: 36px;
  }
  .fs-service-grid {
    grid-template-columns: 1fr 1fr;
    grid-auto-rows: minmax(390px, 62vw);
  }
  .fs-service-card--feature {
    grid-row: span 1;
    grid-column: span 2;
  }
  .fs-service-card--wide {
    grid-column: 1 / -1;
    grid-template-columns: minmax(280px, 0.8fr) minmax(0, 1.2fr);
  }
  .fs-rhythm-track {
    grid-template-columns: repeat(5, minmax(240px, 1fr));
    overflow-x: auto;
    scroll-snap-type: x proximity;
  }
  .fs-rhythm-track article {
    scroll-snap-align: start;
  }
  .fs-faq {
    grid-template-columns: 1fr;
    gap: 74px;
  }
  .fs-faq-heading {
    position: static;
  }
}
@media (max-width: 760px) {
  :root {
    --section-pad: 88px;
    --gutter: 20px;
  }
  .fs-hero {
    min-height: 880px;
  }
  .fs-hero-media {
    background-position: 62% center;
  }
  .fs-hero-content {
    min-height: 880px;
    padding-top: 118px;
    padding-bottom: 112px;
    justify-content: flex-end;
  }
  .fs-hero-kicker {
    align-items: flex-start;
    flex-direction: column;
    gap: 12px;
  }
  .fs-hero-title {
    font-size: clamp(50px, 16vw, 84px);
    line-height: 0.86;
  }
  .fs-title-line--small {
    max-width: 270px;
    font-size: 24px;
    line-height: 1.02;
  }
  .fs-hero-bottom {
    grid-template-columns: 1fr;
    gap: 26px;
    margin-top: 38px;
  }
  .fs-hero-actions {
    align-items: flex-start;
    flex-direction: column;
    gap: 10px;
  }
  .fs-button--gold {
    width: 100%;
  }
  .fs-ticker-track span,
  .fs-ticker-track b {
    padding: 14px 20px;
  }
  .fs-display-title {
    font-size: clamp(44px, 13vw, 76px);
  }
  .fs-season-stats {
    grid-template-columns: 1fr 1fr;
  }
  .fs-season-stats div {
    min-height: 150px;
    border-bottom: 1px solid var(--line-light);
  }
  .fs-season-stats div:nth-child(2) {
    border-right: 0;
  }
  .fs-season-stats div:nth-child(n+3) {
    border-bottom: 0;
  }
  .fs-nights-layout {
    display: block;
  }
  .fs-nights-deck {
    margin-left: 0;
  }
  .fs-nights-rail {
    position: sticky;
    z-index: 8;
    top: 67px;
    margin: 0 calc(var(--gutter) * -1) 30px;
    padding: 0 var(--gutter);
    overflow-x: auto;
    background: rgba(8, 8, 7, 0.9);
    backdrop-filter: blur(14px);
  }
  .fs-nights-rail > p {
    display: none;
  }
  .fs-date-list {
    flex-direction: row;
    width: max-content;
  }
  .fs-date-button {
    width: 138px;
    min-height: 66px;
    grid-template-columns: 1fr;
    gap: 3px;
    padding: 10px 18px;
    border-left: 0;
    border-bottom: 1px solid var(--line-dark);
  }
  .fs-date-button::before {
    top: auto;
    right: 0;
    bottom: -1px;
    left: 0;
    width: auto;
    height: 2px;
    transform: scaleX(0);
  }
  .fs-date-button.is-active::before {
    transform: scaleX(1);
  }
  .fs-event-card {
    min-height: 72svh;
  }
  .fs-event-card-top {
    padding: 18px;
  }
  .fs-event-card-copy {
    display: block;
    padding: 26px 20px;
  }
  .fs-event-card-copy h3 {
    margin-top: 16px;
    font-size: clamp(48px, 16vw, 74px);
  }
  .fs-event-card-copy > span {
    display: block;
    margin-top: 20px;
  }
  .fs-announcement-card {
    min-height: 420px;
    padding: 34px 24px;
  }
  .fs-announcement-lines {
    gap: 6px;
  }
  .fs-interlude {
    min-height: 78svh;
  }
  .fs-interlude-media {
    background-position: 62% center;
  }
  .fs-service-grid {
    grid-template-columns: 1fr;
    grid-auto-rows: auto;
  }
  .fs-service-card:not(.fs-service-card--wide) {
    min-height: 460px;
  }
  .fs-service-card--feature {
    grid-column: span 1;
  }
  .fs-service-card--wide {
    display: block;
    min-height: 0;
  }
  .fs-service-wide-copy {
    min-height: 390px;
    padding: 38px 26px;
  }
  .fs-service-collage {
    min-height: 480px;
    grid-template-columns: 1.15fr 0.85fr;
  }
  .fs-service-card h3 {
    font-size: 38px;
  }
  .fs-venue-grid {
    grid-template-columns: 1fr;
  }
  .fs-venue-card {
    min-height: 124vw;
  }
  .fs-faq-item > button {
    min-height: 88px;
  }
  .fs-final-cta {
    min-height: 860px;
  }
  .fs-final-content h2 {
    font-size: clamp(52px, 15vw, 82px);
  }
}
@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.001ms !important;
    animation-iteration-count: 1 !important;
    scroll-behavior: auto !important;
    transition-duration: 0.001ms !important;
  }
  .fs-hero-media,
  .fs-service-media,
  .fs-venue-media,
  .fs-event-card-media {
    transform: none !important;
  }
  .fs-reveal,
  .fs-reveal--up,
  .fs-reveal--title {
    opacity: 1;
    transform: none;
  }
}


/* ─── Ajustes del hero ──────────────────────────────────────────────
   La foto es el escenario de Zamna sin ningun texto quemado, asi que el
   titulo no compite con nada. El bloque baja al tercio inferior, donde la
   multitud es oscura y el texto se lee limpio. */
.fs-hero-content { justify-content: flex-end; }
.fs-hero-media { background-position: 50% 42%; }
.fs-hero-shade {
  background:
    linear-gradient(180deg, rgba(4,4,4,0.30) 0%, rgba(4,4,4,0.06) 26%, rgba(4,4,4,0.46) 58%, rgba(4,4,4,0.90) 82%, #080807 100%),
    linear-gradient(90deg, rgba(4,4,4,0.72) 0%, transparent 62%);
}

/* ─── Calendario ─────────────────────────────────────────────────────
   Va dentro de la seccion oscura de las noches, asi que hereda su fondo.
   Es la unica tabla de la pagina: contenido real y enlaces por fecha. */
.fs-calendar {
  width: min(var(--max), 100%);
  margin: clamp(56px, 7vw, 96px) auto 0;
  padding: 0 var(--gutter);
}
.fs-table {
  width: 100%;
  border-collapse: collapse;
  color: var(--ivory-dim);
  font-size: clamp(13.5px, 1.05vw, 15px);
  line-height: 1.55;
}
.fs-table caption {
  margin-bottom: 18px;
  text-align: left;
  color: var(--gold-light);
  font-family: var(--mono);
  font-size: 10px;
  font-weight: 500;
  letter-spacing: 0.24em;
  text-transform: uppercase;
}
.fs-table th {
  padding: 0 0 12px;
  text-align: left;
  border-bottom: 1px solid var(--line-dark);
  color: var(--ivory);
  font-family: var(--mono);
  font-size: 9.5px;
  font-weight: 500;
  letter-spacing: 0.22em;
  text-transform: uppercase;
}
.fs-table td {
  padding: 16px 24px 16px 0;
  border-bottom: 1px solid var(--line-dark);
  vertical-align: top;
}
.fs-table td:first-child {
  width: 30%;
  color: var(--ivory);
  font-family: var(--mono);
  font-size: 11.5px;
  letter-spacing: 0.08em;
  white-space: nowrap;
}
.fs-table tr:last-child td { border-bottom: 0; }
.fs-table a { color: var(--gold-light); border-bottom-color: rgba(241, 215, 151, 0.34); }
.fs-table a:hover { color: #fff; border-bottom-color: currentColor; }

@media (max-width: 640px) {
  .fs-table td:first-child { width: 38%; white-space: normal; }
  .fs-table td { padding-right: 12px; }
}

/* ─── Tarjetas de venue ──────────────────────────────────────────────
   El material de los tres festivales trae tipografia quemada, asi que el
   degradado inferior sube y se oscurece: el nombre de la tarjeta manda y
   el arte queda de fondo. */
.fs-venue-shade {
  background:
    linear-gradient(180deg, rgba(6,6,5,0.34) 0%, rgba(6,6,5,0.06) 26%, rgba(6,6,5,0.52) 58%, rgba(6,6,5,0.90) 84%, rgba(6,6,5,0.96) 100%);
}

/* El cierre usa la foto donde las pantallas del escenario traen texto. El
   velo se cierra sobre el centro para que se lea como resplandor y no
   compita con el titular. */
.fs-final-shade {
  background:
    radial-gradient(circle at 50% 45%, rgba(6,6,5,0.74), rgba(6,6,5,0.93) 62%, rgba(6,6,5,0.97)),
    linear-gradient(180deg, var(--ink) 0%, transparent 22%, transparent 78%, var(--ink) 100%);
}

/* ─── Barra de fechas fija ───────────────────────────────────────────
   base.css pone overflow-x:hidden en el body, y eso convierte al body en
   contenedor de scroll: position:sticky deja de funcionar dentro. Con
   clip se recorta igual de lado pero sin crear contenedor, que es justo
   lo que necesita el riel de fechas para quedarse fijo. */
.fs-page { overflow-x: clip; }

/* El hero sube la altura de la barra para quedar debajo de ella: asi la
   barra transparente deja ver la foto en vez del fondo claro de la pagina.
   js/nav.js publica --pg-nav-h; el valor de respaldo cubre el caso sin JS. */
.fs-hero {
  margin-top: calc(-1 * var(--pg-nav-h, 80px));
  padding-top: var(--pg-nav-h, 80px);
}