/* Christmas 2026 interface: one full screen per view, two alternating screen surfaces (a / b),
   giant Garet headings, Helvetica body, the captain's own holly, twinkling lights under the nav.
   The colour skin lives only in this :root block; swap these tokens to change direction. */
:root {
  /* Skin: "Red letter day" (Christmas red / holly green, cream and gold type). */
  --xm-a-bg: radial-gradient(120% 90% at 30% 40%, #c8102e 0%, #a50d24 60%, #860a1d 100%);
  --xm-a-solid: #a50d24;
  --xm-a-btn-bg: #faf3dc;
  --xm-a-btn-fg: #a50d24;
  --xm-b-bg: radial-gradient(120% 90% at 30% 40%, #13603b 0%, #0d4a2c 60%, #0a3a22 100%);
  --xm-b-solid: #0d4a2c;
  --xm-b-btn-bg: #c8102e;
  --xm-b-btn-fg: #faf3dc;
  --xm-photo-solid: #0c2a20;
  --xm-photo-veil: none;
  --xm-photo-veil-tall: none;
  --xm-caption-veil: none;
  --xm-gold: #f5d04e;
  --xm-red: #c8102e;
  --xm-green: #13603b;
  --xm-cream: #faf3dc;
  --xm-white: #ffffff;
  --xm-ink: #2b2222;
  --xm-veil: rgba(0, 0, 0, .16);
  --xm-line: rgba(250, 243, 220, .28);
  /* Layout and motion. */
  --xm-ease: cubic-bezier(.16, 1, .3, 1);
  --xm-nav-h: 5rem;
  /* Shared frame: every page and the application line up on these. */
  --xm-nav-gutter: clamp(1rem, 2.5vw, 2.5rem);
  --xm-gutter: clamp(2.5rem, 13vw, 15rem);
  --xm-measure: 1240px;
  --xm-screen-top: calc(var(--xm-nav-h) + 6rem);
}
@media (max-width: 560px) { :root { --xm-gutter: 2.5rem; --xm-screen-top: calc(var(--xm-nav-h) + 5.5rem); } }

html { scroll-snap-type: y proximity; scroll-padding-top: 0; }
body.gnm-christmas { background: var(--xm-a-solid); color: var(--xm-cream); }

/* Body copy is Helvetica; headings and button labels keep the display faces. */
body.gnm-public { font-family: helvetica, "Outfit", sans-serif; }
.gnm-public :is(h1, h2, h3, h4) { font-family: "Outfit", "Garet", sans-serif; }

/* Nav: frosted dark-green glass, so the lights and screens show softly through; pill calls to action. */
.gnm-christmas .sticky-nav {
  background: rgba(10, 58, 34, .42);
  -webkit-backdrop-filter: blur(18px) saturate(140%);
  backdrop-filter: blur(18px) saturate(140%);
  border-bottom: 0;
  box-shadow: none;
  color: var(--xm-cream);
}
.gnm-christmas .sticky-nav > .max-w-7xl { padding-inline: var(--xm-nav-gutter); }
.gnm-christmas .sticky-nav a { color: inherit; }
.gnm-christmas .sticky-nav a:hover { color: var(--xm-gold); }
.gnm-christmas .sticky-nav a[href="vendor.html"] { background: var(--xm-gold); color: var(--xm-ink); }
.gnm-christmas .sticky-nav a[href="vendor.html"]:hover { background: var(--xm-cream); color: var(--xm-ink); }
.gnm-christmas .sticky-nav a[href^="https://canva.link"] { border-color: var(--xm-cream); color: var(--xm-cream); }
.gnm-christmas .sticky-nav a[href^="https://canva.link"]:hover { background: var(--xm-cream); color: var(--xm-ink); }
.gnm-christmas .mobile-menu-toggle { color: var(--xm-cream); }
.gnm-christmas .mobile-menu-icon { stroke: currentColor; }
.gnm-christmas #mobile-menu { background: var(--xm-a-solid); color: var(--xm-cream); }

/* The light string switches on just after the page loads: one image, repeated across the bar. */
.xm-lights { position: absolute; left: 0; right: 0; top: calc(100% - .9rem); height: clamp(93px, 8.4vw, 150px); pointer-events: none; opacity: 0; transition: opacity 1.2s var(--xm-ease); }
.xm-lights.is-on { opacity: 1; }
.xm-lights.is-on.is-hidden { opacity: 0; }
/* Two halves, the right one mirrored, so the wire meets in the middle (one image, downloaded once). */
.xm-lights.is-on::before, .xm-lights.is-on::after { content: ""; position: absolute; top: 0; bottom: 0; width: 50%; background: url("../img/lights-string-rg.webp") repeat-x 0 0 / auto 100%; }
.xm-lights.is-on::before { left: 0; }
.xm-lights.is-on::after { right: 0; transform: scaleX(-1); }
@media (prefers-reduced-motion: reduce) { .xm-lights.is-on::before, .xm-lights.is-on::after { background-image: url("../img/lights-string-rg-still.webp"); } .xm-lights { transition: none; } }

/* The screen: one viewport, content block centred. */
.gnm-christmas .screen {
  position: relative;
  min-height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: var(--xm-screen-top) var(--xm-gutter) clamp(4rem, 8vh, 6rem);
  overflow: hidden;
  scroll-snap-align: start;
}
.gnm-christmas .screen-inner {
  position: relative;
  z-index: 3;
  width: min(100%, 1080px);
  margin-inline: auto;
  text-align: center;
}

/* Two surfaces alternate down every page; the skin tokens above colour them. */
.screen--a {
  --btn-a-bg: var(--xm-a-btn-bg);
  --btn-a-fg: var(--xm-a-btn-fg);
  background: var(--xm-a-bg);
  color: var(--xm-cream);
}
.screen--b {
  --btn-a-bg: var(--xm-b-btn-bg);
  --btn-a-fg: var(--xm-b-btn-fg);
  background: var(--xm-b-bg);
  color: var(--xm-cream);
}

/* Hero: centred copy, holly in the corners. */
.gnm-christmas .screen--hero .screen-inner { width: min(100%, var(--xm-measure)); }

/* The captain's holly: animated, swaying, glints twinkling. Never over text. */
.holly { position: absolute; z-index: 2; height: auto; pointer-events: none; border-radius: 0; filter: drop-shadow(0 14px 22px rgba(30, 0, 0, .35)); }
.holly img { display: block; width: 100%; height: auto; border-radius: 0; }
.holly--corner { width: clamp(200px, 27vw, 520px); right: -9%; top: 12%; transform: rotate(18deg); }
.holly--low { width: clamp(140px, 15vw, 300px); right: 4%; bottom: -9%; transform: rotate(-160deg); }
.holly--tl { width: clamp(150px, 17vw, 320px); left: -5%; top: calc(var(--xm-nav-h) + 2.5rem); transform: rotate(-24deg); }
.holly--br { width: clamp(150px, 17vw, 320px); right: -5%; bottom: -6%; transform: rotate(160deg); }
.corner-frill { position: absolute; top: calc(var(--xm-nav-h) + 3rem); right: clamp(1rem, 4vw, 3.5rem); width: clamp(84px, 13vw, 150px); height: auto; z-index: 2; pointer-events: none; border-radius: 0; }
.corner-frill--left { right: auto; left: clamp(1rem, 4vw, 3.5rem); }

/* Type. */
.gnm-christmas .eyebrow {
  display: none;
  font-size: .86rem;
  letter-spacing: .04em;
  text-transform: uppercase;
  font-weight: 700;
  margin: 0 0 1rem;
  color: var(--xm-gold);
}
.gnm-christmas .display-2 {
  font-family: Garet, "Outfit", sans-serif;
  font-weight: 900;
  text-transform: uppercase;
  color: var(--xm-cream);
}
.gnm-christmas .display-2 { line-height: .82; letter-spacing: -.015em; font-size: clamp(2.2rem, 5.6vw, 5.4rem); margin: 0; }
.gnm-christmas .accent { color: var(--xm-gold); }
.gnm-christmas .lede {
  font-size: clamp(1.06rem, 1.45vw, 1.3rem);
  line-height: 1.6;
  max-width: 40rem;
  margin: 0 auto;
  color: var(--xm-cream);
}
.gnm-christmas .lede a { color: inherit; text-decoration: underline; text-underline-offset: 4px; text-decoration-color: currentColor; }
.gnm-christmas .lede a:hover { color: var(--xm-gold); }
.gnm-christmas .meta {
  display: flex;
  flex-wrap: wrap;
  gap: .4rem 2.2rem;
  justify-content: center;
  font-size: 1rem;
  font-weight: 700;
  letter-spacing: .02em;
}
.gnm-christmas .meta span { white-space: nowrap; }
.gnm-christmas .meta--visit { font-size: clamp(1.25rem, 2vw, 2rem); line-height: 1.4; gap: .8rem 2.5rem; }
.gnm-christmas .meta--visit span { white-space: normal; }
.gnm-christmas .hero-date { font: 600 clamp(1.6rem, 3.4vw, 3rem)/1.1 var(--xm-font-display, inherit); letter-spacing: .02em; margin: 0 0 1.2rem; }

/* Hero headline: two messages share one grid cell and swap in place, once, ending on the last.
   TV title-card fades, opacity only: in 600ms, out 500ms, a 250ms beat, in 600ms. The hat rides with its letter. */
.gnm-christmas .swap { display: grid; }
.gnm-christmas .swap__msg { display: block; grid-area: 1 / 1; opacity: 0; animation: 3.95s ease-in-out 1 both; }
.gnm-christmas .swap__a { opacity: 1; animation-name: xm-swap-a; }
.gnm-christmas .swap__b { animation-name: xm-swap-b; }
@keyframes xm-swap-a { 0% { opacity: 0; } 15.19%, 65.82% { opacity: 1; } 78.48%, 100% { opacity: 0; } }
@keyframes xm-swap-b { 0%, 84.81% { opacity: 0; } 100% { opacity: 1; } }
/* On the last message the light walks down one line at a time: only one line is cream, the others gold.
   Good Neighbours is lit as it appears, then Christmas at, then Nuanu, which stays lit. Colour only. */
/* Good Neighbours stays put through the swap: it fades in with the first message, then turns gold as the light walks on. */
.gnm-christmas .hero-static { display: block; animation: xm-hold-in .6s ease-in-out 1 both, xm-to-gold .7s ease-in-out 5.1s 1 forwards; }
@keyframes xm-hold-in { from { opacity: 0; } to { opacity: 1; } }
.gnm-christmas .swap__b .xm-l2 { animation: xm-to-cream .7s ease-in-out 5.1s 1 both, xm-to-gold .7s ease-in-out 6.7s 1 forwards; }
.gnm-christmas .swap__b .xm-l3 { animation: xm-to-cream .7s ease-in-out 6.7s 1 both; }
@keyframes xm-to-cream { from { color: var(--xm-gold); } to { color: var(--xm-cream); } }
@keyframes xm-to-gold { from { color: var(--xm-cream); } to { color: var(--xm-gold); } }
html:not(.js) .swap__a { opacity: 1; animation: none; }
html:not(.js) .swap__b { opacity: 0; animation: none; }

/* A Santa hat rests, tilted, on the first letter of each headline message. It never moves the text. */
.gnm-christmas .screen--hero .screen-inner > .display-2 { margin-top: .6em; }
.gnm-christmas .hat { position: relative; display: inline-block; }
.gnm-christmas .santa-hat {
  position: absolute;
  top: -.52em;
  left: 50%;
  height: .66em;
  width: auto;
  max-width: none;
  border-radius: 0;
  transform-origin: 50% 100%;
  transform: translateX(-50%) rotate(-18deg);
  animation: xm-hat-bob 4.5s ease-in-out infinite;
  pointer-events: none;
  filter: drop-shadow(0 2px 2px rgba(0, 0, 0, .25));
}
@keyframes xm-hat-bob {
  0%, 100% { transform: translateX(-50%) rotate(-18deg); }
  50% { transform: translateX(-50%) rotate(-14deg); }
}

/* Balanced vertical rhythm between stacked text blocks. */
.gnm-christmas .screen-inner > * + * { margin-top: 1.6rem; }
.gnm-christmas .screen-inner > .display-2 + .lede { margin-top: 1.8rem; }
.gnm-christmas .screen-inner > .eyebrow + * { margin-top: 0; }
.gnm-christmas .screen-inner > .actions { margin-top: 3rem; }
.gnm-christmas .screen-inner > .actions + * { margin-top: 2.8rem; }

/* Buttons: square, equal when paired. Cream on red, red on green; outline is cream. */
.actions { display: flex; flex-wrap: wrap; gap: 1rem; justify-content: center; }
/* Buttons fit their label; a pair or trio is sized to its widest label, never stretched to the column. */
.gnm-christmas :is(.actions--pair, .actions--trio) { display: inline-grid; grid-auto-flow: column; grid-auto-columns: 1fr; gap: 1rem; width: max-content; max-width: 100%; }
.gnm-christmas :is(.actions--pair, .actions--trio) .pill { width: 100%; }
.pill {
  display: inline-flex;
  flex-direction: column;
  gap: .4rem;
  align-items: flex-start;
  justify-content: center;
  min-height: 3.5rem;
  padding: .95rem 1.6rem;
  border-radius: 0;
  text-align: left;
  text-decoration: none;
  transition: transform .5s var(--xm-ease), background-color .3s, color .3s;
}
.gnm-public .pill strong { font-family: Garet, "Outfit", sans-serif; font-weight: 900; font-size: 1.1rem; letter-spacing: 0; white-space: nowrap; }
.pill small { display: block; font-size: .95rem; font-weight: 500; line-height: 1.35; color: inherit; }
.pill:hover { transform: none; }
/* Buttons centre their labels on every screen. */
.gnm-christmas .screen .pill,
.gnm-christmas .split__text .pill { align-items: center; text-align: center; }
.pill--gold, .pill--light, .pill--ink { background: var(--btn-a-bg, var(--xm-a-btn-bg)); color: var(--btn-a-fg, var(--xm-a-btn-fg)); }
.pill--outline, .pill--ghost { box-shadow: inset 0 0 0 2px var(--xm-cream); color: var(--xm-cream); background: transparent; }
.pill--outline:hover, .pill--ghost:hover { color: var(--xm-ink); }

/* Chips. */
.chips { display: flex; flex-wrap: wrap; gap: .7rem; justify-content: center; }
.chip {
  background: var(--xm-gold);
  color: var(--xm-ink);
  border-radius: 999px;
  padding: .65rem 1.2rem;
  font-size: .8rem;
  letter-spacing: .04em;
  text-transform: uppercase;
  font-weight: 700;
}

/* Photo screen: full-bleed photography under a holly-green veil. */
.gnm-christmas .screen--photo { padding: 0; color: var(--xm-cream); background: var(--xm-photo-solid); }
.screen--photo > img, .screen--photo > picture > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; border-radius: 0; }
.screen--photo::after { content: ""; position: absolute; inset: 0; background: var(--xm-photo-veil); }
.screen--photo .screen-inner { padding: 2rem; }
.screen--photo > img, .screen--photo > picture > img { object-position: 70% 50%; }
.gnm-christmas .photo-feature__caption { max-width: 46rem; text-align: center; }
.gnm-christmas .photo-feature__caption .display-2 { margin-top: .8rem; }
/* Concept screen: the brand still life fills the screen under a deep veil, the copy centred over it. */
.gnm-christmas .screen--photo.screen--concept { padding: var(--xm-screen-top) var(--xm-gutter) clamp(4rem, 8vh, 6rem); }
/* Portrait screens (About, Pets, Kids): same padding as every other full-height page. */
.gnm-christmas .screen--photo.screen--portrait { padding: var(--xm-screen-top) var(--xm-gutter) clamp(4rem, 8vh, 6rem); }
.gnm-christmas .screen--portrait .screen-inner { padding: 0; }
.gnm-christmas .screen--portrait .display-2 { font-size: clamp(1.9rem, 4.4vw, 4.4rem); }
.gnm-christmas .screen--portrait .meta { font-size: clamp(.9rem, 1.15vw, 1.15rem); flex-wrap: nowrap; gap: .5rem; }
.gnm-christmas .screen--portrait .meta span { white-space: nowrap; }
.gnm-christmas .screen--portrait .meta__sep { font-size: 1.5em; opacity: .5; }
.gnm-christmas .screen--portrait .meta__dates { flex-direction: row; align-items: baseline; gap: .5rem; }
.gnm-christmas .screen--portrait .meta__dates > * { font-size: 1.5em; }
.gnm-christmas .screen--concept > img { object-position: 50% 50%; }
/* Phone: pull the basket figure left into frame. */
@media (max-width: 767px) {
  .gnm-christmas .screen--concept > img { object-position: 72% 50%; }
}
@media (min-width: 768px) { .gnm-christmas .screen--portrait > picture > img { transform: translateY(3.5%) scale(1.08); } }
/* About: tinsel portrait is centred — keep her in frame, leave green for left copy. */
.gnm-christmas .screen--about > picture > img { object-position: 50% 50%; }
@media (max-aspect-ratio: 1/1) { .gnm-christmas .screen--about > picture > img { object-position: 72% 50%; } }
/* About: heavy black bottom wash so white copy reads over the photo. */
.gnm-christmas .screen--about::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  background: linear-gradient(0deg, rgba(0, 0, 0, .78) 0%, rgba(0, 0, 0, .6) 22%, rgba(0, 0, 0, .36) 48%, rgba(0, 0, 0, .12) 68%, transparent 86%);
}
@media (max-aspect-ratio: 1/1) {
  .gnm-christmas .screen--about::before {
    background:
      linear-gradient(0deg, rgba(0, 0, 0, .85) 0%, rgba(0, 0, 0, .72) 28%, rgba(0, 0, 0, .52) 48%, rgba(0, 0, 0, .25) 68%, rgba(0, 0, 0, .08) 82%, transparent 94%),
      linear-gradient(90deg, rgba(0, 0, 0, .3) 0%, rgba(0, 0, 0, .1) 42%, transparent 70%);
  }
}
.gnm-christmas .screen--about .screen-inner { position: relative; z-index: 2; }
/* Kids: bottom wash so copy clears the sweater; phone pulls face left into frame. */
.gnm-christmas .screen--kids > picture > img { object-position: 58% 45%; }
.gnm-christmas .screen--kids::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  background: linear-gradient(0deg, rgba(8, 26, 17, .92) 0%, rgba(8, 26, 17, .72) 28%, rgba(8, 26, 17, .38) 52%, transparent 76%);
}
@media (max-aspect-ratio: 1/1) {
  .gnm-christmas .screen--kids::before {
    background: linear-gradient(0deg, rgba(8, 26, 17, .97) 0%, rgba(8, 26, 17, .9) 32%, rgba(8, 26, 17, .65) 55%, rgba(8, 26, 17, .28) 74%, transparent 92%);
  }
}
.gnm-christmas .screen--kids .screen-inner { position: relative; z-index: 2; }
/* Phone: park kids copy on the foot with room under it; soften upper veil. */
@media (max-width: 767px) {
  .gnm-christmas .screen--kids > picture > img { object-position: 72% 40%; }
  .js .gnm-christmas .screen-track > .screen--kids {
    justify-content: flex-end;
    align-items: stretch;
    padding-top: calc(var(--xm-nav-h) + env(safe-area-inset-top, 0px));
    padding-bottom: calc(2.75rem + env(safe-area-inset-bottom, 0px));
  }
  .js .gnm-christmas .screen-track > .screen--kids > .screen-inner {
    margin-top: auto;
    margin-bottom: 0;
    max-height: none;
  }
  .gnm-christmas .screen--kids::before {
    background: linear-gradient(0deg, rgba(8, 26, 17, .96) 0%, rgba(8, 26, 17, .78) 42%, rgba(8, 26, 17, .35) 68%, transparent 90%);
  }
  .gnm-christmas .screen--kids .meta span { white-space: normal; }
  .gnm-christmas .screen--kids .meta__dates { flex-wrap: wrap; }
}
.gnm-christmas .screen--concept::after { background: none; }
.gnm-christmas .screen--concept .screen-inner { text-shadow: 0 1px 2px rgba(20, 6, 8, .22), 0 1px 8px rgba(20, 6, 8, .18); }
.gnm-christmas .screen--concept::after { box-shadow: none; }
.gnm-christmas .screen--concept .screen-inner { width: 100%; max-width: min(66rem, 64vw); text-align: left; align-items: flex-start; margin: 0 auto 0 clamp(0rem, 3vw, 3rem); align-self: center; position: relative; z-index: 2; }
.gnm-christmas .screen--concept > picture > img { object-position: 30% 50%; }
.gnm-christmas .screen--concept::before { content: ""; position: absolute; inset: 0; z-index: 1; pointer-events: none; background: linear-gradient(90deg, rgba(20, 12, 6, .32) 0%, rgba(20, 12, 6, .12) 45%, transparent 62%); }
.gnm-christmas .screen--concept .meta--visit { flex-direction: column; gap: .35rem; }
@media (max-aspect-ratio: 1/1) { .gnm-christmas .screen--concept .screen-inner { max-width: none; } .gnm-christmas .screen--concept::before { background: linear-gradient(0deg, rgba(20, 12, 6, .6) 0%, transparent 70%); } }
.gnm-christmas .screen--concept .screen-inner > * { margin-inline: 0; text-align: left; }
.gnm-christmas .screen--concept .meta--visit { justify-content: flex-start; align-items: flex-start; }
.gnm-christmas .meta__dates { display: flex; flex-direction: column; }
.gnm-christmas .meta__dates [data-gnm-dates] { font-size: 1.5em; line-height: 1.1; }
.gnm-christmas .meta__dates small { font-size: .7em; color: var(--xm-cream); opacity: 1; }
.gnm-christmas .screen-inner .pill { text-shadow: none; }
.gnm-christmas .screen--venue .photo-feature__caption > .lede { margin: 1.4rem auto 0; max-width: 44rem; }
/* Feature caption sits in the middle of the photo; a soft shade across the middle band keeps the cream type legible. */
.gnm-christmas .screen--photo:has(.photo-feature__caption)::after { background: linear-gradient(180deg, transparent 12%, rgba(8, 26, 17, .55) 35%, rgba(8, 26, 17, .55) 65%, transparent 88%); }
.gnm-christmas .screen--photo .photo-feature__caption { text-shadow: 0 2px 18px rgba(8, 26, 17, .55); }
.gnm-christmas .screen--venue > picture > img { object-position: 50% 50%; }
.gnm-christmas .screen--venue .photo-feature__caption { max-width: 60rem; }

/* Photo screen with the December calendar: copy left, calendar right; stacked on phone. */
.gnm-christmas .screen--photo-split { padding: calc(var(--xm-nav-h) + 6rem) clamp(1.5rem, 6vw, 6rem) clamp(4rem, 8vh, 6rem); }
.gnm-christmas .photo-split { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr); gap: clamp(2rem, 6vw, 6rem); align-items: center; width: min(100%, 1240px); padding: 0; text-align: center; }
.gnm-christmas .photo-split__copy > * + * { margin-top: 1.8rem; }
.gnm-christmas .photo-split__copy > .actions { margin-top: 3rem; }
.gnm-christmas .photo-split__cal .xm-cal { margin: 0 auto; width: 100%; max-width: 460px; }
.gnm-christmas .photo-split__cal .eyebrow { margin-bottom: 1rem; }
/* A black gradient rises from the foot of the tree photo, under the copy and calendar. */
.gnm-christmas .screen--photo-split::after { background: linear-gradient(0deg, rgba(0, 0, 0, .88) 0%, rgba(0, 0, 0, .45) 28%, transparent 55%); }

/* Image grids. */
.triptych { position: relative; z-index: 3; display: grid; grid-template-columns: repeat(3, 1fr); gap: clamp(.8rem, 2vw, 1.5rem); width: min(100%, 1160px); margin-inline: auto; }
.tile { position: relative; overflow: hidden; aspect-ratio: 4 / 5; margin: 0; }
.tile img { width: 100%; height: 100%; object-fit: cover; border-radius: 0; transition: transform 1.1s var(--xm-ease); }
.tile:hover img { transform: scale(1.05); }
.tile figcaption {
  position: absolute;
  inset: auto 0 0 0;
  padding: 1.6rem 1.4rem;
  text-align: left;
  font-size: 1.05rem;
  color: var(--xm-cream);
  background: var(--xm-caption-veil);
}

/* Find categories. */
.find-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: clamp(1.6rem, 4vw, 3rem); }
.find-item h3 {
  font-family: Garet, "Outfit", sans-serif;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: .04em;
  font-size: 1.05rem;
  margin: 0 0 .7rem;
  color: var(--xm-gold);
}
.find-item p { margin: 0; line-height: 1.5; font-size: clamp(1.15rem, 1.6vw, 1.4rem); color: var(--xm-cream); }

/* Location. */
.map-frame {
  width: min(100%, 900px);
  margin-inline: auto;
  height: clamp(18rem, 44vh, 30rem);
  overflow: hidden;
}
.map-frame iframe { width: 100%; height: 100%; border: 0; display: block; }
.text-link {
  display: inline-flex;
  align-items: center;
  gap: .6rem;
  text-transform: uppercase;
  letter-spacing: .04em;
  font-size: .86rem;
  font-weight: 700;
  text-decoration: none;
  color: var(--xm-gold);
}
.text-link::after { content: "\2192"; font-size: 1rem; letter-spacing: 0; transition: transform .4s var(--xm-ease); }
.text-link:hover::after { transform: translateX(6px); }

/* Interior blocks on red and green. Flat tints, no borders. */
.gnm-christmas .info-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(2rem, 6vw, 5rem); text-align: left; }
.gnm-christmas .info-block { min-width: 0; }
.gnm-christmas .info-block h3 { font-family: Garet, "Outfit", sans-serif; text-transform: uppercase; letter-spacing: .05em; font-size: 1.1rem; margin: 0 0 1rem; color: var(--xm-gold); }
.gnm-christmas .info-block p { line-height: 1.7; }
.gnm-christmas .info-block ul { list-style: none; margin: 0; padding: 0; display: grid; gap: .9rem; }
.gnm-christmas .info-block li { position: relative; padding-left: 1.4rem; line-height: 1.6; }
.gnm-christmas .info-block li::before { content: "/"; position: absolute; left: 0; color: var(--xm-gold); font-weight: 700; }
.gnm-christmas .cards { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; text-align: center; }
.gnm-christmas .card { background: var(--xm-veil); padding: clamp(1.4rem, 3vw, 2.2rem); color: var(--xm-cream); }
.gnm-christmas .card .k { display: block; font-size: .82rem; letter-spacing: .04em; text-transform: uppercase; font-weight: 700; color: var(--xm-gold); margin-bottom: .9rem; }
.gnm-christmas .card .v { font-size: clamp(1.2rem, 2.4vw, 1.6rem); font-weight: 700; line-height: 1.2; }
.gnm-christmas .card p { margin: .5rem 0 0; line-height: 1.6; font-size: 1.02rem; }
.gnm-christmas .stack { display: grid; gap: 1.4rem; }
.gnm-christmas .k { display: block; font-size: .82rem; letter-spacing: .04em; text-transform: uppercase; font-weight: 700; color: var(--xm-gold); margin: 0 0 .6rem; }
.gnm-christmas .contact-link { font-size: clamp(1.4rem, 4vw, 2.4rem); font-weight: 700; text-decoration: none; color: var(--xm-cream); border-bottom: 2px solid var(--xm-gold); }
.gnm-christmas .contact-link:hover { color: var(--xm-gold); }
.gnm-christmas .prose { max-width: 62ch; margin-inline: auto; text-align: left; }
.gnm-christmas .prose h2 { font-family: Garet, "Outfit", sans-serif; text-transform: uppercase; letter-spacing: -.01em; font-size: clamp(1.2rem, 2.2vw, 1.6rem); margin: 2.2rem 0 .8rem; color: var(--xm-gold); }
.gnm-christmas .prose p { line-height: 1.7; }
.gnm-christmas .prose a { color: inherit; text-decoration-color: var(--xm-gold); }
.gnm-christmas .facts { list-style: none; margin-inline: auto; padding: 0; display: grid; gap: .7rem; max-width: 36ch; text-align: left; }
.gnm-christmas .facts li { position: relative; padding-left: 1.4rem; line-height: 1.6; }
.gnm-christmas .facts li::before { content: "/"; position: absolute; left: 0; color: var(--xm-gold); font-weight: 700; }

/* Launch package rates. */
.gnm-christmas .package-table-wrap { overflow-x: auto; margin-inline: auto; max-width: 820px; }
.gnm-christmas .package-table { width: 100%; border-collapse: collapse; font-size: 1rem; color: var(--xm-cream); }
.gnm-christmas .package-table caption { text-align: left; font-weight: 700; margin-bottom: .9rem; font-size: .86rem; letter-spacing: .04em; text-transform: uppercase; color: var(--xm-gold); }
.gnm-christmas .package-table thead { background: var(--xm-gold); color: var(--xm-ink); }
.gnm-christmas .package-table th,
.gnm-christmas .package-table td { text-align: left; padding: 1rem .9rem; border-bottom: 0; white-space: nowrap; }
.gnm-christmas .package-table tbody tr:nth-child(odd) { background: var(--xm-veil); }
.gnm-christmas .package-table :is(th, td):first-child { padding-left: .9rem; }
.gnm-christmas .package-table th small { display: block; margin-top: .2rem; font-size: .8em; font-weight: 500; opacity: .75; }
.gnm-christmas .package-table td small { font-size: .8em; opacity: .75; margin-right: .2em; }
.gnm-christmas .package-table__note { margin: 1rem 0 0; text-align: left; font-size: .95rem; line-height: 1.5; color: var(--xm-cream); opacity: .9; white-space: normal; }

/* December calendar, driven by js/site.js from the single date source. */
.gnm-christmas .xm-cal { width: min(100%, 520px); margin-inline: auto; background: var(--xm-veil); padding: clamp(1.1rem, 3vw, 1.8rem); }
.gnm-christmas .xm-cal__grid { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: .4rem; }
.gnm-christmas .xm-cal__dow { font-size: .74rem; letter-spacing: .04em; text-transform: uppercase; color: var(--xm-cream); text-align: center; font-weight: 700; padding-bottom: .2rem; }
.gnm-christmas .xm-cal__day, .gnm-christmas .xm-cal__blank { aspect-ratio: 1; }
.gnm-christmas .xm-cal__day { display: flex; align-items: center; justify-content: center; font-size: 1rem; font-weight: 700; color: rgba(250, 243, 220, .62); background: rgba(250, 243, 220, .07); }
.gnm-christmas .xm-cal__day.is-open { background: var(--xm-gold); color: var(--xm-ink); }
.gnm-christmas .xm-cal__day.is-off { background: transparent; color: rgba(250, 243, 220, .7); text-decoration: line-through; box-shadow: inset 0 0 0 1px var(--xm-line); }
.gnm-christmas .xm-cal__legend { display: flex; gap: 1.4rem; justify-content: center; margin: 1rem 0 0; font-size: .8rem; letter-spacing: .04em; text-transform: uppercase; font-weight: 700; color: var(--xm-cream); }
.gnm-christmas .xm-cal__legend span { display: inline-flex; align-items: center; }
.gnm-christmas .xm-cal__legend :is(.k-open, .k-off, .k-picked)::before { content: ""; width: .8em; height: .8em; margin-right: .5em; display: inline-block; }
.gnm-christmas .xm-cal__legend .k-open::before { background: var(--xm-gold); }
.gnm-christmas .xm-cal__legend .k-off::before { box-shadow: inset 0 0 0 1px var(--xm-cream); }

/* Split screen (vendor callout). */
.gnm-christmas .screen--split { padding: 0; }
.split { display: grid; grid-template-columns: 1fr 1fr; min-height: 100vh; width: 100%; }
.split__text { position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; padding: calc(var(--xm-nav-h) + 4rem) clamp(2.5rem, 7vw, 6rem) 4rem; }
.split__text > * + * { margin-top: 1.6rem; }
.split__text > .actions { margin-top: 3rem; }
.split__media { position: relative; min-height: 100%; }
.split__media img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; border-radius: 0; }

/* Vendor callout: copy left, a lantern-lit image right, holly in the corner. */
.gnm-christmas .callout { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, .9fr); gap: clamp(2rem, 6vw, 6rem); align-items: center; }
.gnm-christmas .screen--callout .screen-inner { width: min(100%, var(--xm-measure)); }
.gnm-christmas .callout__copy { text-align: center; }
.gnm-christmas .callout__copy > * + * { margin-top: 1.8rem; }
.gnm-christmas .callout__copy > .eyebrow + * { margin-top: 0; }
.gnm-christmas .callout__copy > .actions { margin-top: 3rem; }
.gnm-christmas .callout__media { margin: 0; aspect-ratio: 4 / 5; max-height: 68vh; overflow: hidden; justify-self: end; width: 100%; }
.gnm-christmas .callout__media img { width: 100%; height: 100%; object-fit: cover; border-radius: 0; }

/* Footer sits on holly green. */
/* Venue map: large, zoomable and pannable, with a legend in the site's type. */
.gnm-christmas .venue { width: min(100%, 1180px); }
.venue__map { position: relative; margin-inline: auto; aspect-ratio: 1562 / 1007; max-height: calc(100vh - 25rem); min-height: 16rem; overflow: hidden; background: var(--xm-veil); cursor: grab; touch-action: pan-y; user-select: none; }
.venue__map.is-zoomed { touch-action: none; }
.venue__map.is-dragging { cursor: grabbing; }
.venue__map:focus-visible { outline: 3px solid var(--xm-gold); outline-offset: 4px; }
.venue__canvas { display: grid; place-items: center; width: 100%; height: 100%; container-type: size; transform-origin: 50% 50%; transition: transform .35s var(--xm-ease); }
/* The scene is the image's own box, so pins and the tag stay on their spots at any size or zoom. */
.venue__scene { position: relative; width: min(100cqw, 100cqh * 1562 / 1007); aspect-ratio: 1562 / 1007; container-type: inline-size; }
.venue__map.is-dragging .venue__canvas { transition: none; }
.venue__canvas img { display: block; width: 100%; height: auto; border-radius: 0; pointer-events: none; }
.venue__tag { position: absolute; left: 1.4%; top: 2.2%; margin: 0; padding: .55em .85em .6em; background: var(--xm-cream); border: .14em solid var(--xm-ink); font: 900 clamp(7px, 1.15cqi, 15px)/1.1 Garet, "Outfit", sans-serif; letter-spacing: .04em; text-align: center; text-transform: uppercase; pointer-events: none; }
.venue__tag b { display: block; color: var(--xm-red); }
.venue__tag span { display: block; margin-top: .3em; font-size: .8em; color: var(--xm-green); }
/* On small maps the tag drops below Block42 so it never sits on pin 1. */
@container (max-width: 600px) { .venue__tag { top: 29%; } }
/* Pins: a red teardrop whose tip sits exactly on --x / --y. */
.venue__pin { position: absolute; left: var(--x); top: var(--y); width: 1.9em; height: calc(1.9em * 1.2071); translate: -50% -100%; font: 900 clamp(13px, 2cqi, 26px)/1 Garet, "Outfit", sans-serif; color: var(--xm-cream); filter: drop-shadow(0 .14em .16em rgba(0, 0, 0, .5)); pointer-events: none; }
.venue__pin::before { content: ""; position: absolute; inset: 0 0 auto; height: 1.9em; box-sizing: border-box; border: .13em solid var(--xm-ink); border-radius: 50% 50% 50% 0; background: var(--xm-red); box-shadow: 0 0 0 .09em var(--xm-cream); transform: rotate(-45deg); }
.venue__pin b { position: relative; display: grid; place-items: center; height: 1.9em; padding-top: .04em; }
.venue__pin--market::after { content: ""; position: absolute; inset: 0 0 auto; height: 1.9em; border: .12em solid var(--xm-gold); border-radius: 50%; animation: venue-pulse 2.4s var(--xm-ease) infinite; }
@keyframes venue-pulse { 0% { transform: scale(.9); opacity: .9; } 100% { transform: scale(1.9); opacity: 0; } }
.venue__controls { position: absolute; right: 1rem; bottom: 1rem; display: flex; gap: .4rem; }
.venue__controls button { min-width: 2.8rem; height: 2.8rem; padding: 0 .9rem; border: 0; border-radius: 0; background: var(--xm-cream); color: var(--xm-ink); font: 900 1.1rem/1 Garet, "Outfit", sans-serif; cursor: pointer; }
.venue__controls button:hover { background: var(--xm-gold); }
.venue__legend { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; justify-content: center; gap: .8rem 2rem; font-size: 1.05rem; font-weight: 700; }
.venue__legend li { display: inline-flex; align-items: center; gap: .6rem; }
.venue__legend b { display: inline-grid; place-items: center; width: 2.1rem; height: 2.1rem; box-sizing: border-box; border: .16rem solid var(--xm-ink); border-radius: 50%; background: var(--xm-red); box-shadow: 0 0 0 .12rem var(--xm-cream); color: var(--xm-cream); font-size: 1rem; }
@media (prefers-reduced-motion: reduce) { .venue__canvas { transition: none; } .venue__pin--market::after { animation: none; opacity: 0; } }

/* Statement screen: one dominant line, the rest small and quiet, a button's height of space above the button. */
.gnm-christmas .statement .statement__link { font-size: clamp(1.25rem, 3.4vw, 3.4rem); text-transform: none; letter-spacing: -.01em; overflow-wrap: anywhere; }
.gnm-christmas .statement__link a { color: inherit; text-decoration: none; }
.gnm-christmas .statement__link a:hover { color: var(--xm-gold); }
.gnm-christmas .quiet-row { list-style: none; margin-inline: auto; padding: 0; display: flex; flex-wrap: wrap; justify-content: center; gap: .6rem 2.2rem; font-size: .98rem; line-height: 1.5; }
.gnm-left .quiet-row { justify-content: flex-start; }
.gnm-christmas .quiet-row li::before { content: "/ "; color: var(--xm-gold); font-weight: 700; }
.gnm-christmas .quiet-row a { color: inherit; text-decoration: underline; text-decoration-color: var(--xm-gold); text-underline-offset: 4px; }
.gnm-christmas .statement > .quiet-row { margin-top: 2.4rem; }

/* Closing-date line under a call to action: small, gold, quick to read. */
.gnm-christmas .screen-inner > .close-note { margin: 1.6rem 0 0; font-size: .86rem; letter-spacing: .04em; text-transform: uppercase; font-weight: 700; color: var(--xm-gold); }

/* Editorial split: centred copy left, the screen's content right. */
.gnm-christmas .split2 { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: clamp(2rem, 6vw, 6rem); align-items: center; width: min(100%, 1240px); text-align: center; }
.gnm-christmas .split2 > * { margin: 0; }
.gnm-christmas .split2__copy > * + * { margin-top: 1.6rem; }
.gnm-christmas .split2__copy > .eyebrow + * { margin-top: 0; }
.gnm-christmas .split2__copy > .actions { margin-top: 3rem; }
.gnm-christmas .split2__note { font-size: .95rem; line-height: 1.55; opacity: .9; max-width: 40rem; margin-inline: auto; }
.gnm-christmas .split2 .map-frame { width: 100%; height: clamp(18rem, 52vh, 34rem); }
.gnm-christmas .split2 .package-table-wrap { max-width: none; }
.gnm-christmas .cards--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
/* Compact cards: a label and one short line each, sitting close enough to scan at a glance. */
.gnm-christmas .screen-inner > .cards--compact { width: min(100%, 900px); margin-inline: auto; margin-top: 2.4rem; gap: .75rem; }
.gnm-christmas .cards--compact .card { padding: 1.1rem 1rem; }
.gnm-christmas .cards--compact .card .k { margin-bottom: .45rem; letter-spacing: .04em; }
.gnm-christmas .cards--compact .card p { margin: 0; font-size: .98rem; line-height: 1.4; }
@media (max-width: 820px) { .gnm-christmas .cards.cards--compact { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 560px) { .gnm-christmas .cards--compact .card { padding: .85rem .6rem; } .gnm-christmas .cards--compact .card .k { font-size: .7rem; letter-spacing: .04em; } .gnm-christmas .cards--compact .card p { font-size: .86rem; } }


/* Bookable calendar: pick a length, pick your days, go straight into the application. */
.gnm-christmas .xm-cal--book { width: min(100%, 560px); padding: clamp(1rem, 2.4vw, 1.4rem); }
.gnm-christmas .xm-cal--book .xm-cal__day, .gnm-christmas .xm-cal--book .xm-cal__blank { aspect-ratio: 1.45; }
.gnm-christmas .xm-cal--book .xm-cal__legend span { white-space: nowrap; }
.gnm-christmas .screen-inner > [data-gnm-calendar="book"] { margin-top: 1.4rem; }
.gnm-christmas .xm-cal__lengths { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .5rem; margin-bottom: 1.2rem; }
.gnm-christmas .xm-cal__length { min-height: 3rem; border: 0; border-radius: 0; background: rgba(250, 243, 220, .1); color: var(--xm-cream); font: 900 .95rem/1 Garet, "Outfit", sans-serif; text-transform: uppercase; letter-spacing: .02em; cursor: pointer; transition: background-color .25s, color .25s; }
.gnm-christmas .xm-cal__length:hover { background: rgba(250, 243, 220, .2); }
.gnm-christmas .xm-cal__length[aria-pressed="true"] { background: var(--xm-gold); color: var(--xm-ink); }
/* Open days are empty gold-edged slots; a picked day fills solid yellow with dark text. */
.gnm-christmas .xm-cal--book button.xm-cal__day.is-open { border: 0; border-radius: 0; font: inherit; font-size: 1rem; font-weight: 700; cursor: pointer; background: transparent; color: var(--xm-cream); box-shadow: inset 0 0 0 2px var(--xm-gold); transition: background-color .15s, color .15s, box-shadow .15s; -webkit-tap-highlight-color: transparent; }
@media (hover: hover) { .gnm-christmas .xm-cal--book button.xm-cal__day.is-open:not(.is-picked):hover { box-shadow: inset 0 0 0 4px var(--xm-gold); } }
.gnm-christmas .xm-cal--book button.xm-cal__day.is-open.is-picked { background: var(--xm-gold); color: var(--xm-ink); box-shadow: inset 0 0 0 2px var(--xm-gold); }
.gnm-christmas .xm-cal--book .xm-cal__day.is-off { color: rgba(250, 243, 220, .45); background: repeating-linear-gradient(-45deg, transparent 0 6px, rgba(250, 243, 220, .1) 6px 7px); cursor: not-allowed; }
.gnm-christmas .xm-cal--book .xm-cal__legend .k-open::before { background: transparent; box-shadow: inset 0 0 0 2px var(--xm-gold); }
.gnm-christmas button.xm-cal__day:focus-visible, .gnm-christmas .xm-cal__length:focus-visible { outline: 3px solid var(--xm-cream); outline-offset: 2px; }
.gnm-christmas .xm-cal__legend .k-picked::before { background: var(--xm-gold); }
.gnm-christmas .xm-cal__status { margin: 1.2rem 0 0; font-size: 1rem; font-weight: 700; text-align: center; color: var(--xm-cream); }
.gnm-christmas .xm-cal__status.is-nudge { color: var(--xm-gold); }
.gnm-christmas .xm-cal__actions { display: grid; margin: 1.6rem auto 0; }
.gnm-christmas .xm-cal__actions .pill[aria-disabled="true"] { opacity: .45; cursor: not-allowed; }
.gnm-christmas .xm-cal__actions .pill[aria-disabled="true"]:hover { transform: none; }
.gnm-christmas .xm-cal--book .xm-cal__legend { flex-wrap: wrap; row-gap: .5rem; }

/* Footer: full white on the dark ground, larger type, generous spacing. */
.gnm-christmas footer { background: var(--xm-b-solid); color: var(--xm-white); padding: clamp(3rem, 6vw, 4.5rem) clamp(1.25rem, 6vw, 6rem); }
.gnm-christmas footer .max-w-7xl { max-width: none; }
.gnm-christmas footer, .gnm-christmas footer :is(p, a) { color: var(--xm-white); }
.gnm-christmas footer p { font-size: clamp(.86rem, 1.2vw, .95rem); letter-spacing: .04em; line-height: 1.6; }
.gnm-christmas footer div:last-child { font-size: clamp(.9rem, 1.2vw, 1rem); column-gap: clamp(1.25rem, 2.4vw, 2.2rem); row-gap: .9rem; }
.gnm-christmas footer img { height: 3.25rem; filter: brightness(0) invert(1); border-radius: 0; }
.gnm-christmas footer a:hover { color: var(--xm-gold); }
/* The line's last screen: calls to action, centred, the footer line small beneath. */
.gnm-christmas footer:has(.footer-cta) { padding-top: var(--xm-screen-top); padding-bottom: clamp(3rem, 8vh, 6rem); }
.gnm-christmas footer .footer-cta { text-align: center; margin-bottom: clamp(3rem, 9vh, 6rem); }
.gnm-christmas footer .footer-cta .display-2 { color: var(--xm-cream); }
.gnm-christmas footer .footer-cta .footer-cta__actions { margin-top: 2.6rem; font-size: inherit; gap: 1rem; }
.gnm-christmas footer .footer-cta .pill { align-items: center; text-align: center; }
.gnm-christmas footer .footer-cta .pill--gold { color: var(--xm-b-btn-fg); background: var(--xm-b-btn-bg); }
.gnm-christmas footer .footer-cta .pill--outline { color: var(--xm-cream); }
.gnm-christmas footer .footer-cta .pill--outline:hover { color: var(--xm-ink); }
.gnm-christmas footer.footer--a { background: var(--xm-a-bg); }
.gnm-christmas footer.footer--a .footer-cta .pill--gold { color: var(--xm-a-btn-fg); background: var(--xm-a-btn-bg); }
.gnm-christmas footer .footer-cta + div { flex-direction: column; justify-content: center; gap: 1rem; text-align: center; }
.gnm-christmas footer .footer-cta + div > div:first-child { flex-direction: column; text-align: center; }
.gnm-christmas footer .footer-cta + div :is(p, a) { font-size: .74rem; }
.gnm-christmas footer .footer-cta + div > div:last-child { justify-content: center; column-gap: 1.4rem; row-gap: .5rem; }
.gnm-christmas footer .footer-cta + div img { height: 2.4rem; }
@media (max-width: 560px) { .gnm-christmas footer .footer-cta .footer-cta__actions { display: grid; grid-template-columns: 1fr; width: min(100%, 18rem); margin-inline: auto; } }

.screen--corners .corners { text-align: left; }
.corner-choices { display: flex; flex-wrap: wrap; gap: .6rem 1.8rem; border: 0; padding: .8rem 1.2rem; margin: 2rem 0 3rem; min-width: 0; background: transparent; backdrop-filter: blur(18px); -webkit-backdrop-filter: blur(18px); }
.corner-choice { position: relative; margin: 0; cursor: pointer; color: var(--xm-cream); opacity: 1; font: 500 .95rem/1.5 helvetica, sans-serif; }
.corner-choice input { position: absolute; width: 1px; height: 1px; opacity: 0; }
.corner-choice span { display: block; padding: .6rem 0; }
.corner-choice:has(input:checked) { opacity: 1; color: var(--xm-gold); }
.corner-choice:has(input:focus-visible) { outline: 2px solid var(--xm-cream); outline-offset: 5px; }
.corner-stage { min-height: clamp(230px, 30vh, 360px); }
.corner-panel { display: none; animation: corner-fade .65s ease-in-out both; }
.corner-panel .display-2 { max-width: 12ch; }
.corner-panel .lede { max-width: 36ch; margin-top: 1.6rem; }
.corners:has(input[value="showroom"]:checked) [data-corner="showroom"],
.corners:has(input[value="huts"]:checked) [data-corner="huts"],
.corners:has(input[value="pantry"]:checked) [data-corner="pantry"],
.corners:has(input[value="table"]:checked) [data-corner="table"],
.corners:has(input[value="workshop"]:checked) [data-corner="workshop"],
.corners:has(input[value="tree"]:checked) [data-corner="tree"] { display: block; }
@keyframes corner-fade { from { opacity: 0; } to { opacity: 1; } }
@media (max-width: 560px) { .corner-choices { gap: .3rem 1.2rem; margin: 1.5rem 0 2rem; } .corner-choice { font-size: .85rem; } }
@media (prefers-reduced-motion: reduce) { .corner-panel { animation: none; } }
.gnm-christmas { overflow-x: clip; }
/* Homepage side-scroll: the screens sit in one row and move sideways, a whole screen at a time
   (js/screen-track.js turns the wheel, keys and a vertical swipe into sideways moves). Without JS
   the page stays an ordinary vertical scroll. A screen whose copy is taller than the viewport
   scrolls that copy before the row moves on. */
html.js:has(.has-screen-track) { height: 100%; overflow: hidden; scroll-snap-type: none; }
.js .gnm-christmas.has-screen-track { height: 100dvh; overflow: hidden; }
.js .screen-track { display: flex; width: 100%; height: 100dvh; overflow-x: auto; overflow-y: hidden; scroll-snap-type: x mandatory; scrollbar-width: none; overscroll-behavior: contain; }
.js .screen-track::-webkit-scrollbar { display: none; }
.js .gnm-christmas .screen-track > .screen,
.js .gnm-christmas .screen-track > footer { flex: 0 0 100%; width: 100%; height: 100%; min-height: 0; scroll-snap-align: start; scroll-snap-stop: always; }
.js .gnm-christmas .screen-track > .screen > .screen-inner { max-height: 100%; margin-block: auto; overflow-y: auto; overscroll-behavior-y: contain; scrollbar-width: none; }
.js .gnm-christmas .screen-track > .screen > .screen-inner::-webkit-scrollbar { display: none; }
.gnm-christmas .screen--top { justify-content: flex-start; }
.js .gnm-christmas .screen-track > .screen--top > .screen-inner { margin-block: 0; }
/* The map takes the wheel only once it is clicked, so scrolling past it keeps moving the screens. */
.js .gnm-christmas .screen-track .map-frame:not(.is-live) iframe { pointer-events: none; }
.js .gnm-christmas .screen-track .map-frame:not(.is-live) { cursor: pointer; }
.js .gnm-christmas .screen-track > footer { display: flex; flex-direction: column; justify-content: center; }
.js .gnm-christmas .screen-track > footer[hidden] { display: none; }
@media (max-width: 820px) {
  .js .gnm-christmas .screen-track > .screen { padding-top: calc(var(--xm-nav-h) + 2rem); padding-bottom: 2rem; }
  .js .gnm-christmas .screen-track .split2 .map-frame { height: min(24dvh, 12rem); }
  .js .gnm-christmas .screen-track :is(.photo-split, .callout) { gap: 1rem; }
  .js .gnm-christmas .screen-track .callout__media { height: 20dvh; max-height: 20dvh; aspect-ratio: auto; }
}
.js .gnm-christmas .screen-track > .screen.reveal-on-scroll.active { animation: none; }
.gnm-christmas .screen.reveal-on-scroll { opacity: 1; transform: none; }
.js .gnm-christmas .screen.reveal-on-scroll.active { animation: screen-enter .85s var(--xm-ease) both; }
@keyframes screen-enter { from { transform: translateX(-100vw); } to { transform: none; } }
.js .gnm-christmas header.screen.reveal-on-scroll.active,
.js .gnm-christmas .screen.reveal-on-scroll.active.is-arrived,
html:active-view-transition .gnm-christmas .screen.reveal-on-scroll.active { animation: none; }
/* Page changes (and application steps) travel along one long horizontal line: going on, the
   page you are on slides out to the left as the next one slides in from the right; going back,
   the other way. js/screen-track.js (and the step script) set html[data-slide] to the direction. */
::view-transition-old(root),
::view-transition-new(root) { animation: .35s cubic-bezier(.65, 0, .35, 1) both; mix-blend-mode: normal; }
::view-transition-old(root) { animation-name: line-out; }
::view-transition-new(root) { animation-name: line-in; }
html[data-slide="back"]::view-transition-old(root) { animation-name: line-out-back; }
html[data-slide="back"]::view-transition-new(root) { animation-name: line-in-back; }
@keyframes line-in { from { transform: translateX(100%); } to { transform: none; } }
@keyframes line-out { from { transform: none; } to { transform: translateX(-100%); } }
@keyframes line-in-back { from { transform: translateX(-100%); } to { transform: none; } }
@keyframes line-out-back { from { transform: none; } to { transform: translateX(100%); } }
.reveal-on-scroll .rise { opacity: 0; transform: none; transition: opacity 1.1s ease-in-out; }
.reveal-on-scroll.active .rise { opacity: 1; transform: none; }
.reveal-on-scroll.active .rise:nth-child(2) { transition-delay: .08s; }
.reveal-on-scroll.active .rise:nth-child(3) { transition-delay: .16s; }
.reveal-on-scroll.active .rise:nth-child(4) { transition-delay: .24s; }
.reveal-on-scroll.active .rise:nth-child(5) { transition-delay: .32s; }
.reveal-on-scroll.active .rise:nth-child(6) { transition-delay: .4s; }
html:not(.js) .rise { opacity: 1; transform: none; }

@media (max-width: 900px) {
  .holly--corner { width: 40vw; right: -10%; top: 9%; }
  .holly--low { display: none; }
  .holly--tl, .holly--br { width: 30vw; }
}
@media (max-width: 820px) {
  .gnm-christmas .photo-split, .gnm-christmas .callout, .gnm-christmas .split2 { grid-template-columns: 1fr; }
  .gnm-christmas .actions--trio { grid-auto-flow: row; width: 100%; }
  .gnm-christmas .split2 .map-frame { height: 40vh; }
  .venue__map { max-height: none; }
  .gnm-christmas .callout__media { aspect-ratio: 3 / 2; max-height: 34vh; justify-self: stretch; }
  .screen--photo-split::after { background: var(--xm-photo-veil-tall); }
  .triptych, .find-grid { grid-template-columns: 1fr; }
  .tile { aspect-ratio: 3 / 2; }
  .split { grid-template-columns: 1fr; }
  .split__media { min-height: 45svh; order: -1; }
  .split__text { padding-top: 4rem; }
  .find-grid { gap: 1.6rem; }
  .gnm-christmas .info-grid, .gnm-christmas .cards { grid-template-columns: 1fr; }
}
@media (max-width: 560px) {
  .gnm-christmas .screen { padding-bottom: 3.5rem; }
  .gnm-christmas .eyebrow { font-size: .78rem; letter-spacing: .04em; }
  .gnm-christmas .display-2 { font-size: clamp(1.9rem, 8.6vw, 2.8rem); }
  .gnm-christmas .lede { font-size: 1.02rem; line-height: 1.55; }
  .gnm-christmas .actions--pair { grid-auto-flow: row; gap: .75rem; }
  .gnm-christmas .screen-inner > .actions { margin-top: 2.2rem; }
  .pill { min-height: 3.3rem; padding: .85rem 1.3rem; }
  .gnm-public .pill strong { font-size: 1.05rem; }
  .pill small { font-size: .9rem; }
  .holly--corner { width: 34vw; top: calc(var(--xm-nav-h) + .5rem); right: -10%; }
  .holly--tl, .holly--br { width: 34vw; }
  .holly--tl { top: calc(var(--xm-nav-h) + 1.5rem); }
  .corner-frill { width: clamp(64px, 20vw, 96px); }
}

@media (prefers-reduced-motion: reduce) {
  .gnm-christmas .screen.reveal-on-scroll.active { animation: none !important; }
  ::view-transition-old(root), ::view-transition-new(root) { animation: none !important; }
  .reveal-on-scroll .rise { opacity: 1 !important; transform: none !important; }
  .swap__msg, .santa-hat { animation: none !important; }
  .swap__a { opacity: 1 !important; }
  .swap__b { opacity: 0 !important; }
  .swap__b .xm-line, .hero-static { animation: none !important; }
}
.gnm-christmas .screen--callout .holly--tl { top: calc(var(--xm-nav-h) + .25rem); width: clamp(110px, 11vw, 200px); left: -3%; }
@media (max-width: 820px) { .gnm-christmas .photo-split__cal .xm-cal { max-width: 340px; padding: .9rem; } .gnm-christmas .photo-split__cal .xm-cal__day { font-size: .85rem; } }
@media (max-width: 560px) { .venue__map { min-height: 0; } .venue__controls { right: .6rem; bottom: .6rem; } .venue__controls button { min-width: 2.3rem; height: 2.3rem; padding: 0 .6rem; font-size: .95rem; } }
@media (max-width: 560px) { .gnm-christmas .package-table { font-size: .82rem; } .gnm-christmas .package-table :is(th, td) { padding: .7rem .4rem; white-space: normal; } .gnm-christmas .package-table :is(th, td):first-child { padding-left: .6rem; } }
/* Map screen: full bleed. The map fills the screen; the headline and legend overlay it. */
.gnm-christmas .screen--map { padding: 0; }
.gnm-christmas .screen--map .venue__map { position: absolute; inset: 0; z-index: 1; aspect-ratio: auto; max-height: none; min-height: 0; margin: 0; background: #c9dbb0; }
.gnm-christmas .screen--map .venue__map:focus-visible { outline-offset: -4px; }
.gnm-christmas .screen--map .venue__canvas { position: absolute; inset: 0; display: block; }
/* The scene always covers the screen below the nav (no letterboxing, bus stop pin clear of the nav); on a portrait screen it fits the width instead so every pin stays in view. */
.gnm-christmas .screen--map .venue__scene { position: absolute; left: 0; right: 0; top: var(--xm-nav-h); margin-inline: auto; width: min(100cqw, (100cqh - var(--xm-nav-h)) * 1562 / 1007); }
@media (max-aspect-ratio: 1/1) { .gnm-christmas .screen--map .venue__scene { top: 0; bottom: 0; margin-block: auto; width: 100cqw; } }
.gnm-christmas .screen--map .screen-inner { position: absolute; inset: 0; z-index: 2; width: auto; margin: 0; display: flex; flex-direction: column; justify-content: space-between; align-items: center; padding: calc(var(--xm-nav-h) + clamp(93px, 8.4vw, 150px) * .8 + .5rem) clamp(1rem, 4vw, 3rem) clamp(1rem, 3vh, 2rem); pointer-events: none; overflow: visible; }
.gnm-christmas .screen--map .screen-inner::before { content: ""; position: absolute; inset: 0 0 auto; height: min(55%, 22rem); background: linear-gradient(180deg, rgba(8, 26, 17, .6), transparent); z-index: -1; }
.gnm-christmas .screen--map .eyebrow, .gnm-christmas .screen--map .display-2 { text-shadow: 0 2px 14px rgba(8, 26, 17, .6); }
.gnm-christmas .screen--map .display-2 { margin: 0; font-size: clamp(1.8rem, 3.2vw, 3rem); line-height: 1.08; }
.gnm-christmas .screen--map .venue__legend { align-self: flex-start; justify-content: flex-start; gap: .5rem 1.4rem; margin-top: auto; padding: .7rem 1rem; background: rgba(8, 26, 17, .72); font-size: .95rem; }
.gnm-christmas .screen--map .venue__controls { z-index: 3; right: clamp(.75rem, 2vw, 1.5rem); bottom: clamp(.75rem, 2vw, 1.5rem); }
@media (min-aspect-ratio: 1/1) { .gnm-christmas .screen--map .screen-inner { align-items: flex-end; text-align: right; } .gnm-christmas .screen--map .venue__legend { text-align: left; } }
@media (max-width: 820px) { .gnm-christmas .screen--map .venue__legend { display: grid; grid-template-columns: 1fr 1fr; gap: .5rem 1rem; font-size: .85rem; margin-bottom: 3.4rem; } }

/* Ticket calendar (Home, Visit): each market day is a button that opens the ticket popup. */
.gnm-christmas button.xm-cal__day.is-open:not(.xm-cal--book *) { padding: 0; border: 0; border-radius: 0; font-family: inherit; line-height: inherit; cursor: pointer; transition: background-color .15s, color .15s; -webkit-tap-highlight-color: transparent; }
@media (hover: hover) { .gnm-christmas button.xm-cal__day.is-open:not(.xm-cal--book *):hover { background: var(--xm-cream); } }

/* Ticket popup (js/tickets.js): a green panel over a dimmed page; it fades in place. */
.xm-tickets-open { overflow: hidden; }
.xm-tickets { width: min(100% - 2rem, 30rem); max-width: none; max-height: calc(100svh - 2rem); padding: 0; border: 0; background: transparent; color: var(--xm-cream); overflow: visible; }
.xm-tickets::backdrop { background: rgba(20, 8, 10, .62); }
.xm-tickets[open], .xm-tickets[open]::backdrop { animation: xm-tickets-fade .25s ease-out; }
@keyframes xm-tickets-fade { from { opacity: 0; } }
@media (prefers-reduced-motion: reduce) { .xm-tickets[open], .xm-tickets[open]::backdrop { animation: none; } }
.xm-tickets__panel { --btn-a-bg: var(--xm-b-btn-bg); --btn-a-fg: var(--xm-b-btn-fg); position: relative; background: var(--xm-b-bg); padding: clamp(2rem, 6vw, 3rem) clamp(1.25rem, 6vw, 3rem); text-align: center; max-height: calc(100svh - 2rem); overflow-y: auto; font-family: helvetica, "Outfit", sans-serif; }
.xm-tickets__close { position: absolute; top: .5rem; right: .5rem; width: 2.75rem; height: 2.75rem; display: grid; place-items: center; border: 0; background: transparent; color: var(--xm-cream); cursor: pointer; }
.xm-tickets__close:hover { color: var(--xm-gold); }
.xm-tickets__title { margin: 0; font-family: Garet, "Outfit", sans-serif; font-weight: 900; text-transform: uppercase; line-height: .98; letter-spacing: -.015em; font-size: clamp(2rem, 7vw, 2.8rem); color: var(--xm-cream); }
.xm-tickets__date { margin: 1rem 0 0; font-size: 1.05rem; font-weight: 700; color: var(--xm-gold); }
.xm-tickets__label { display: block; margin: 2rem 0 .8rem; font-size: .8rem; letter-spacing: .04em; text-transform: uppercase; font-weight: 700; }
.xm-tickets__type { margin-top: 1.6rem; }
.xm-tickets__type + .xm-tickets__type { margin-top: 1.8rem; padding-top: 1.6rem; border-top: 1px solid rgba(250, 243, 220, .18); }
.xm-tickets__type .xm-tickets__price { margin: 0; }
.xm-tickets__type .xm-tickets__label { margin-top: 1rem; }
.xm-tickets__type-note { margin: .35rem 0 0; font-size: clamp(.95rem, 1.8vw, 1.1rem); line-height: 1.35; color: var(--xm-cream); opacity: .9; }
.xm-tickets__stepper { display: grid; grid-template-columns: 3.5rem minmax(0, 7rem) 3.5rem; justify-content: center; gap: .4rem; }
.xm-tickets .xm-tickets__step, .xm-tickets .xm-tickets__stepper input { height: 3.5rem; margin: 0; padding: 0; border: 0; border-radius: 0; font-family: helvetica, "Outfit", sans-serif; font-size: 1.6rem; font-weight: 700; line-height: 1; text-align: center; }
.xm-tickets__step { background: rgba(250, 243, 220, .12); color: var(--xm-cream); cursor: pointer; transition: background-color .15s; }
.xm-tickets__step:hover { background: rgba(250, 243, 220, .24); }
.xm-tickets__stepper input { width: 100%; min-width: 0; background: var(--xm-cream); color: var(--xm-ink); -moz-appearance: textfield; appearance: textfield; }
.xm-tickets__stepper input::-webkit-inner-spin-button, .xm-tickets__stepper input::-webkit-outer-spin-button { -webkit-appearance: none; margin: 0; }
.xm-tickets .xm-tickets__send { margin-top: 2rem; min-width: 12rem; align-items: center; }
.xm-tickets .xm-tickets__send:hover { transform: none; background: var(--xm-cream); color: var(--xm-ink); }
.xm-tickets :is(button, input):focus-visible { outline: 3px solid var(--xm-gold); outline-offset: 2px; }

/* Vendor page: presents still life behind the opening screen; screens after it solid red or green. */
html:has(body.page--photo-bg) { background: var(--xm-a-solid); }
body.gnm-christmas.page--photo-bg { background: transparent; }
.page--photo-bg::before {
  content: "";
  position: fixed;
  inset: 0;
  z-index: -1;
  background: url("../img/presents.png") center / cover no-repeat;
}
.page--photo-bg .screen--a { background: var(--xm-a-solid); }
.page--photo-bg .screen--b { background: var(--xm-b-solid); }
/* Vendor opener: red wash sits on the copy, fades out so the presents photo reads at the top. */
.page--photo-bg .screen-track > .screen:first-child {
  background: linear-gradient(0deg, rgba(134, 10, 29, .72) 0%, rgba(134, 10, 29, .42) 38%, rgba(134, 10, 29, .12) 62%, transparent 78%);
}

/* Slide menu (js/screen-track.js): the current page's screens follow its link in the top bar, the one in view in yellow.
   When the bar runs out of room they move into the menu panel, as yellow-when-selected chips. */
.sticky-nav .nav-page.is-here { color: var(--xm-gold); }
.sticky-nav .nav-slides { display: inline-flex; align-items: center; gap: .85rem; margin-left: -.35rem; }
.sticky-nav .nav-slides::before { content: "/"; color: var(--xm-gold); font-weight: 700; }
.sticky-nav .nav-slides button { padding: .4rem 0; border: 0; background: none; color: inherit; font: inherit; font-size: 10px; letter-spacing: inherit; text-transform: inherit; opacity: .72; cursor: pointer; transition: opacity .2s, color .2s; }
.sticky-nav .nav-slides button:hover { opacity: 1; }
.sticky-nav .nav-slides button.is-current { color: var(--xm-gold); opacity: 1; }
.sticky-nav .nav-slides button:focus-visible { outline: 2px solid var(--xm-gold); outline-offset: 3px; }
.sticky-nav .nav--compact :is(.nav-slides, .nav-page) { display: none; }
.gnm-christmas .sticky-nav .nav--compact > button.md\:hidden { display: inline-flex; }
#mobile-menu { overflow-y: auto; }
#mobile-menu > div:has(> a ~ a ~ a ~ a) { justify-content: safe center; padding-block: 1rem; }
#mobile-menu .menu-slides { display: flex; flex-wrap: wrap; justify-content: center; gap: .45rem; max-width: 22rem; margin-top: 1.1rem; padding: 0 1rem; }
#mobile-menu .menu-slides button { padding: .55rem .85rem; border: 0; background: rgba(250, 243, 220, .1); color: var(--xm-cream); font: 700 .78rem/1 helvetica, sans-serif; letter-spacing: .04em; text-transform: uppercase; cursor: pointer; }
#mobile-menu .menu-slides button.is-current { background: var(--xm-gold); color: var(--xm-ink); }
#mobile-menu a.is-here { color: var(--xm-gold); opacity: 1; }
.gnm-christmas .lede--hero { font-size: clamp(1.15rem, 1.6vw, 1.6rem); line-height: 1.35; max-width: none; text-wrap: balance; }
.gnm-christmas .meta--hero { font-size: clamp(1.1rem, 1.5vw, 1.5rem); gap: .4rem 2rem; letter-spacing: .01em; }
.gnm-christmas .meta--hero a { color: inherit; text-decoration: none; }
@media (max-width: 600px) { .gnm-christmas .lede--hero br { display: none; } }
/* Hero: left-aligned copy, as before the centring pass. */
.gnm-christmas .screen--hero .screen-inner { text-align: left; align-items: flex-start; }
.gnm-christmas .screen--hero .display-2 { margin-inline: 0; text-align: left; }
.gnm-christmas .screen--hero .lede { margin-left: 0; margin-right: auto; text-align: left; }
.gnm-christmas .screen--hero .meta,
.gnm-christmas .screen--hero .actions { justify-content: flex-start; }
.gnm-christmas .lede--big { font-size: clamp(1.35rem, 2.2vw, 2.2rem); line-height: 1.3; max-width: 40ch; text-wrap: balance; }
.gnm-christmas .display-2--long { font-size: clamp(1.9rem, 4vw, 4.4rem); line-height: .95; max-width: 22ch; margin-inline: auto; text-wrap: balance; }
.gnm-christmas .sticky-nav > div > a:first-child { margin-right: clamp(1rem, 2vw, 2rem); flex-shrink: 0; }
.gnm-christmas .screen--concept .display-2 { font-size: clamp(2.2rem, 4.6vw, 5.4rem); }
@media (max-aspect-ratio: 1/1) { .gnm-christmas .screen--concept > picture > img { object-position: 52% 50%; } }
.gnm-christmas .screen--concept .meta--visit { gap: .6rem; margin-top: 1.4rem; }
.gnm-christmas .screen--concept .meta__dates [data-gnm-dates] { font-size: 1.35em; }
.gnm-christmas .meta__details { display: flex; flex-wrap: wrap; align-items: center; gap: .3rem 0; font-size: .8em; font-weight: 600; }
.gnm-christmas .meta__details > span + span::before { content: ""; display: inline-block; width: 1px; height: .9em; margin: 0 .9rem; vertical-align: -.1em; background: currentColor; opacity: .6; }
@media (min-aspect-ratio: 1/1) {
  .gnm-christmas .screen--concept .screen-inner { position: absolute; top: calc(var(--xm-nav-h) + clamp(1.5rem, 7vh, 4.5rem)); left: clamp(4rem, 11vw, 10rem); margin: 0; }
  .gnm-christmas .screen--concept > picture > img { width: 128%; max-width: none; left: 0; right: auto; object-position: 0% 75%; }
}
/* Good gifts and the Block42 caption: left-aligned copy. */
.gnm-christmas .photo-split__copy { text-align: left; }
.gnm-christmas .photo-split__copy .actions { justify-content: flex-start; }
.gnm-christmas .photo-split__copy .lede { margin-left: 0; }
.gnm-christmas .photo-feature__caption { text-align: left; align-items: flex-start; margin-left: 0; margin-right: auto; }
.gnm-christmas .photo-feature__caption .display-2--long { margin-inline: 0; }

/* Left alignment everywhere: every headline and content block starts on the left edge of its column.
   Buttons keep their own centred labels; calendar cells and the ticket popup stay centred. */
.gnm-christmas .screen-inner,
.gnm-christmas .photo-split, .gnm-christmas .split2, .gnm-christmas .cards, .gnm-christmas .callout__copy,
.gnm-christmas .photo-feature__caption, .gnm-christmas .split__text, .gnm-christmas footer .footer-cta,
.gnm-christmas footer .footer-cta + div, .gnm-christmas footer .footer-cta + div > div:first-child { text-align: left; }
.gnm-christmas .screen-inner > *, .gnm-christmas .photo-split__copy > *, .gnm-christmas .split2 > * > *,
.gnm-christmas .photo-feature__caption > *, .gnm-christmas .callout__copy > * { margin-left: 0; margin-right: auto; }
.gnm-christmas .split__text { align-items: flex-start; }
.gnm-christmas .meta, .gnm-christmas .actions, .gnm-christmas .chips, .gnm-christmas .quiet-row,
.gnm-christmas .xm-cal__legend, .gnm-christmas footer .footer-cta + div, .gnm-christmas footer .footer-cta + div > div:last-child { justify-content: flex-start; }
.gnm-christmas .display-2--long { margin-inline: 0; }

/* Design pass 2026-10-11.
   One left edge: every screen's copy starts at the page gutter, so headlines line up as you slide. */
.gnm-christmas .screen-inner { margin-left: 0; margin-right: auto; }
/* Calendar screens are the exception: headline, calendar and button centred as one block. */
.gnm-christmas .screen--centred .screen-inner { margin-inline: auto; text-align: center; }
.gnm-christmas .screen--centred .screen-inner > * { margin-left: auto; margin-right: auto; }
.gnm-christmas .screen--centred .actions, .gnm-christmas .screen--centred .xm-cal__legend { justify-content: center; }
/* Body copy reads comfortably at every size. */
.gnm-christmas .lede { font-size: clamp(1.15rem, 1.55vw, 1.5rem); line-height: 1.5; max-width: 44rem; }
.gnm-christmas .meta { font-size: clamp(1rem, 1.2vw, 1.2rem); }
.gnm-christmas .screen--photo .photo-feature__caption { padding-left: var(--xm-gutter); padding-right: var(--xm-gutter); }
.gnm-christmas .screen-inner .lede, .gnm-christmas .screen-inner > .cards--compact { margin-left: 0; margin-right: auto; }
.gnm-christmas .screen--centred .screen-inner .lede { margin-left: auto; }
@media (min-aspect-ratio: 1/1) { .gnm-christmas .screen--concept .screen-inner { left: var(--xm-gutter); } }
.gnm-christmas .screen--concept .screen-inner { padding-left: 0; padding-right: 0; }
@media (max-width: 560px) { .gnm-christmas footer .footer-cta .footer-cta__actions { margin-left: 0; margin-right: auto; } }
.xm-tickets__price { margin: .4rem 0 0; font-size: 1.15rem; color: var(--xm-cream); }
.xm-tickets__price b { font-family: Garet, "Outfit", sans-serif; font-weight: 900; font-size: 2.4rem; line-height: 1; color: var(--xm-gold); margin-right: .3rem; }
.xm-tickets__compare { margin: .35rem 0 1.4rem; font-size: 1rem; color: var(--xm-cream); opacity: .9; }
.xm-tickets__total { margin: 1rem 0 0; font-size: 1.1rem; font-weight: 700; color: var(--xm-cream); }

/* Visit, Hours: the Madhatters knitted pattern behind, a green card for the copy, Mr Christmas dancing on the right. */
.gnm-christmas .screen--knit { background: #faf3dc; }
.gnm-christmas .screen--knit .knit { position: absolute; inset: 0; z-index: 0; }
.gnm-christmas .screen--knit .knit canvas { display: block; width: 100% !important; height: 100% !important; }
.gnm-christmas .screen--knit .knit-card { background: var(--xm-b-solid); padding: clamp(1.75rem, 4vw, 3.5rem); width: min(100%, 40rem); box-shadow: 0 0 0 clamp(6px, .8vw, 12px) #faf3dc; }
.gnm-christmas .screen--knit .mr-christmas { position: absolute; z-index: 2; right: max(2vw, calc(var(--xm-gutter) - 4rem)); bottom: 0; width: min(46vw, 640px); height: min(88vh, 860px); opacity: 0; transition: opacity .6s ease-in-out; pointer-events: none; }
.gnm-christmas .screen--knit .mr-christmas.is-ready { opacity: 1; }
.gnm-christmas .screen--knit .mr-christmas canvas { display: block; width: 100%; height: 100%; }
.gnm-christmas .screen--knit .lights, .gnm-christmas .screen--knit .holly { display: none; }
@media (max-aspect-ratio: 1/1) {
  .gnm-christmas .screen--knit { align-items: flex-start; }
  .gnm-christmas .screen--knit .mr-christmas { right: 50%; transform: translateX(50%); width: 90vw; height: 46vh; }
}
@media (max-aspect-ratio: 1/1) {
  .gnm-christmas .screen--knit { padding-top: calc(var(--xm-nav-h) + 1.25rem); }
  .gnm-christmas .screen--knit .mr-christmas { height: 40vh; z-index: 4; }
}
@media (max-aspect-ratio: 1/1) { .gnm-christmas .screen--knit .knit-card { margin-top: 0; padding: 1.5rem; } .gnm-christmas .screen--knit .mr-christmas { height: 44vh; } }
@media (max-aspect-ratio: 1/1) { .js .gnm-christmas .screen-track > .screen--knit > .screen-inner { margin-top: 0; } }
/* Block42: the headline runs on into the venue line, set in large body type so it reads as one sentence. */
.gnm-christmas .block42-head { max-width: none; }
.gnm-christmas .block42-head__rest { display: block; max-width: 38ch; margin-top: 1.4rem; font: 500 clamp(1.4rem, 2.3vw, 2.4rem)/1.3 helvetica, "Outfit", sans-serif; text-transform: none; letter-spacing: 0; }
/* Wide left margin, ordinary right margin: content keeps its room on the right. */
.gnm-christmas .screen { padding-right: clamp(1.5rem, 6vw, 6rem); }
.gnm-christmas .photo-split, .gnm-christmas .split2 { width: min(100%, 1240px); }
.gnm-christmas .photo-feature__caption { max-width: 64rem; }
.gnm-christmas .screen--photo .photo-feature__caption { padding-right: clamp(1.5rem, 6vw, 6rem); }
/* Two-column screens: headline sized to its column so it never runs into the picture or table. */
.gnm-christmas .photo-split { grid-template-columns: minmax(0, 1fr) minmax(0, .85fr); }
.gnm-christmas .photo-split__copy .display-2, .gnm-christmas .split2 .display-2 { font-size: clamp(2rem, 3.6vw, 4.4rem); }
/* Hours: a narrower card so Mr Christmas has the right half to himself. */
.gnm-christmas .screen--knit .knit-card { width: min(100%, 30rem); }
.gnm-christmas .screen--knit .knit-card .display-2 { font-size: clamp(2rem, 3.4vw, 4rem); }
@media (min-aspect-ratio: 1/1) { .gnm-christmas .screen--knit .mr-christmas { right: 2vw; width: min(40vw, 620px); } }
.gnm-christmas .screen .photo-split .photo-split__copy .display-2 { font-size: clamp(2rem, 3.1vw, 3.8rem); }
.gnm-christmas .photo-split__copy { min-width: 0; }
.gnm-christmas .screen--photo-split { padding-left: var(--xm-gutter); }
.gnm-christmas .split2 .display-2 { font-size: clamp(2rem, 3.1vw, 3.8rem); }
.gnm-christmas .callout { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, .8fr); gap: clamp(2rem, 4vw, 4rem); align-items: center; }
.gnm-christmas .callout__copy { min-width: 0; }
.gnm-christmas .callout__copy .display-2 { font-size: clamp(2rem, 3.4vw, 4.2rem); }
.js .gnm-christmas .screen-track > footer { padding-left: var(--xm-gutter); }
/* Screens stack as they slide in (js/screen-track.js holds the outgoing one in place). */
.js .gnm-christmas .screen-track > .screen, .js .gnm-christmas .screen-track > footer { position: relative; will-change: transform; box-shadow: -18px 0 40px rgba(0, 0, 0, .25); }
/* Buttons: Helvetica labels; rollover is a colour tween only, nothing moves. */
.gnm-public .pill strong, .pill strong { font-family: helvetica, "Outfit", sans-serif; font-weight: 700; letter-spacing: .01em; }
.pill { background-image: none; filter: none; transition: background-color .3s ease-out, color .3s ease-out, box-shadow .3s ease-out; }
@media (hover: hover) {
  .pill:hover, .pill:focus-visible { background-color: var(--xm-gold); color: var(--xm-ink); }
  .pill--outline:hover, .pill--ghost:hover, .gnm-christmas footer .footer-cta .pill--outline:hover { background-color: var(--xm-cream); color: var(--xm-ink); }
}
@media (prefers-reduced-motion: reduce) { .pill { transition: none; } }
/* Mr Christmas, a little smaller. */
@media (min-aspect-ratio: 1/1) { .gnm-christmas .screen--knit .mr-christmas { width: min(30vw, 460px); height: min(64vh, 620px); right: 6vw; bottom: 4vh; } }
@media (max-aspect-ratio: 1/1) { .gnm-christmas .screen--knit .mr-christmas { height: 34vh; } }
.gnm-christmas .screen--knit .mr-christmas { pointer-events: auto; cursor: pointer; }
.gnm-christmas .mr-christmas__caption { position: absolute; left: 50%; bottom: -.4rem; transform: translateX(-50%); margin: 0; padding: .35rem .8rem; background: var(--xm-b-solid); color: var(--xm-cream); font-size: .85rem; font-weight: 700; white-space: nowrap; }
/* Mr Christmas sits level with the green card; his dance deck is a small game-style HUD beside him. */
@media (min-aspect-ratio: 1/1) {
  .gnm-christmas .screen--knit .mr-christmas { top: 50%; bottom: auto; transform: translateY(-46%); right: calc(6vw + 18rem); width: min(26vw, 400px); height: min(62vh, 580px); }
  .gnm-christmas .dance-deck { position: absolute; z-index: 5; right: 4vw; top: 50%; transform: translateY(-50%); width: 14rem; }
}
.gnm-christmas .dance-deck { background: rgba(10, 30, 20, .88); color: var(--xm-cream); border: 2px solid var(--xm-cream); box-shadow: 4px 4px 0 var(--xm-red); padding: .8rem; font: 700 .78rem/1.2 ui-monospace, "SF Mono", Menlo, monospace; letter-spacing: .04em; text-transform: uppercase; }
.gnm-christmas .dance-deck[hidden] { display: none; }
.gnm-christmas .dance-deck__head { display: flex; justify-content: space-between; margin: 0 0 .6rem; padding-bottom: .5rem; border-bottom: 1px dashed rgba(250, 243, 220, .4); color: var(--xm-gold); }
.gnm-christmas .dance-deck__list { display: grid; gap: .15rem; }
.gnm-christmas .dance-deck__row { display: flex; gap: .7rem; align-items: center; width: 100%; padding: .45rem .5rem; border: 0; background: transparent; color: inherit; font: inherit; letter-spacing: inherit; text-transform: inherit; text-align: left; cursor: pointer; transition: background-color .25s ease-out, color .25s ease-out; }
.gnm-christmas .dance-deck__row:hover { background: rgba(250, 243, 220, .12); }
.gnm-christmas .dance-deck__row.is-on { background: var(--xm-gold); color: var(--xm-ink); }
.gnm-christmas .dance-deck__row.is-on .dance-deck__name::before { content: "\25B6  "; }
.gnm-christmas .dance-deck__no { opacity: .6; }
.gnm-christmas .dance-deck__timer { height: 4px; margin-top: .7rem; background: rgba(250, 243, 220, .2); overflow: hidden; }
.gnm-christmas .dance-deck__timer i { display: block; height: 100%; background: var(--xm-red); transform-origin: left; transform: scaleX(0); }
.gnm-christmas .dance-deck__hint { margin: .5rem 0 0; opacity: .7; font-size: .68rem; }
@media (max-aspect-ratio: 1/1) {
  .gnm-christmas .dance-deck { position: absolute; z-index: 5; right: 1rem; bottom: 1rem; width: 11.5rem; padding: .6rem; font-size: .68rem; }
  .gnm-christmas .screen--knit .mr-christmas { right: auto; left: 0; transform: none; width: 55vw; }
}
@media (min-aspect-ratio: 1/1) { .gnm-christmas .screen--knit .mr-christmas { right: calc(4vw + 16rem); width: min(22vw, 340px); } }
/* Dance deck, pared back: just the dance names, the current one in gold. */
.gnm-christmas .dance-deck { box-shadow: none; border: 0; padding: .4rem; width: 12rem; }
.gnm-christmas .dance-deck__no { display: none; }
.gnm-christmas .dance-deck__row.is-on .dance-deck__name::before { content: none; }
/* A roomier canvas so his dances never touch its edges (the figure itself stays the same size). */
@media (min-aspect-ratio: 1/1) { .gnm-christmas .screen--knit .mr-christmas { width: min(30vw, 470px); height: min(78vh, 720px); right: calc(2vw + 14rem); } }
/* Dance picker: five hearts, the current dance filled gold. */
.gnm-christmas .dance-deck { background: none; border: 0; box-shadow: none; padding: 0; width: auto; }
.gnm-christmas .dance-deck__list { display: flex; flex-direction: column; gap: .5rem; }
.gnm-christmas .dance-deck__row { width: auto; padding: .2rem; background: none; }
.gnm-christmas .dance-deck__row:hover { background: none; }
.gnm-christmas .dance-deck__row svg { display: block; width: 1.9rem; height: auto; fill: var(--xm-cream); stroke: var(--xm-red); stroke-width: 1.6; transition: fill .3s ease-out; }
.gnm-christmas .dance-deck__row:hover svg { fill: #f6dfa0; }
.gnm-christmas .dance-deck__row.is-on, .gnm-christmas .dance-deck__row.is-on:hover { background: none; }
.gnm-christmas .dance-deck__row.is-on svg { fill: var(--xm-gold); }
@media (min-aspect-ratio: 1/1) { .gnm-christmas .dance-deck { right: calc(2vw + 9rem); } }
@media (max-aspect-ratio: 1/1) { .gnm-christmas .dance-deck { width: auto; padding: 0; } .gnm-christmas .dance-deck__list { flex-direction: row; } }
.gnm-christmas .dance-deck__row svg { width: 2.2rem; fill: var(--xm-b-solid); stroke: var(--xm-cream); stroke-width: 1.4; filter: drop-shadow(0 2px 3px rgba(0, 0, 0, .25)); }
.gnm-christmas .dance-deck__row:hover svg { fill: var(--xm-green); }
.gnm-christmas .dance-deck__row.is-on svg { fill: var(--xm-gold); }
.gnm-christmas .screen--knit .knit canvas { image-rendering: pixelated; image-rendering: crisp-edges; }
/* Pixel hearts, right beside him. */
.gnm-christmas .dance-deck__row svg { width: 2rem; stroke: none; filter: drop-shadow(2px 2px 0 var(--xm-cream)); }
.gnm-christmas .dance-deck__list { gap: .35rem; }
@media (min-aspect-ratio: 1/1) { .gnm-christmas .dance-deck { right: calc(2vw + 14rem - 2.5rem); } }
@media (min-aspect-ratio: 1/1) { .gnm-christmas .dance-deck { right: calc(2vw + 14rem + 5rem); } }
.gnm-christmas .dance-deck__row svg { width: 2.6rem; }
.gnm-christmas .dance-deck { background: rgba(0, 0, 0, .1); padding: .7rem .6rem; }
.gnm-christmas .dance-deck__row svg { filter: none; }
.gnm-christmas .dance-deck__row.is-on svg { fill: var(--xm-gold); }
.gnm-christmas .screen--knit .knit-snow { position: absolute; inset: 0; z-index: 1; pointer-events: none; }
.gnm-christmas .screen--knit .knit-snow canvas { display: block; width: 100%; height: 100%; }
/* Hearts: red and white only. */
.gnm-christmas .dance-deck__row svg, .gnm-christmas .dance-deck__row:hover svg { fill: #fff; }
.gnm-christmas .dance-deck__row.is-on svg, .gnm-christmas .dance-deck__row.is-on:hover svg { fill: var(--xm-red); }
@media (max-width: 760px) { .gnm-christmas #remind .actions { display: grid; grid-template-columns: 1fr 1fr; gap: .5rem; width: 100%; } .gnm-christmas #remind .actions .pill { width: 100%; padding-inline: .5rem; font-size: .85rem; } }
/* Hearts: white platform under Mr Christmas's feet. */
.gnm-christmas .dance-deck { background: #fff; padding: .45rem .7rem; box-shadow: 0 6px 0 rgba(0, 0, 0, .12); }
.gnm-christmas .dance-deck__list { flex-direction: row; gap: .35rem; }
.gnm-christmas .dance-deck__row svg, .gnm-christmas .dance-deck__row:hover svg { fill: rgba(200, 16, 46, .22); }
.gnm-christmas .dance-deck__row.is-on svg, .gnm-christmas .dance-deck__row.is-on:hover svg { fill: var(--xm-red); }
@media (min-aspect-ratio: 1/1) {
  .gnm-christmas .dance-deck { top: calc(50% + min(78vh, 720px) * .335); right: calc(2vw + 14rem + min(30vw, 470px) / 2); transform: translateX(50%); }
}
@media (max-aspect-ratio: 1/1) {
  .gnm-christmas .dance-deck { top: auto; bottom: 1.25rem; right: 50%; left: auto; transform: translateX(50%); }
  .gnm-christmas .screen--knit .mr-christmas { bottom: 3.3rem; }
  .gnm-christmas .dance-deck__row svg { width: 2rem; }
}
.gnm-christmas .dance-deck { z-index: 1; }
@media (max-aspect-ratio: 1/1) { .gnm-christmas .dance-deck { right: auto; left: 27.5vw; transform: translateX(-50%); } }
.gnm-christmas .closed-pill { display: inline-block; background: var(--xm-red); color: var(--xm-cream); border-radius: 999px; padding: .1em .65em .15em; margin-top: .3em; white-space: nowrap; }
@media (min-aspect-ratio: 1/1) { .gnm-christmas .screen--concept .screen-inner { top: 50%; transform: translateY(-50%); } }
.gnm-christmas .meta__details .closed-pill { margin-top: 0; text-shadow: none; }
.gnm-christmas .meta__details .closed-pill::before, .gnm-christmas .meta__details .closed-pill::after { display: none; }
/* Home ticket screen: bigger date picker. */
@media (min-width: 821px) {
  .gnm-christmas .photo-split__cal .xm-cal { max-width: 640px; padding: 1.4rem; }
  .gnm-christmas .photo-split__cal .xm-cal__day { font-size: 1.25rem; }
}
.gnm-christmas .photo-split__cal .xm-cal { width: 100%; }
@media (min-width: 821px) { .gnm-christmas .photo-split { grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); } }
@media (max-width: 820px) {
  .gnm-christmas .photo-split { grid-template-columns: 1fr; }
  .gnm-christmas .photo-split__cal .xm-cal { max-width: none; }
  .gnm-christmas .photo-split__cal .xm-cal__day { font-size: 1rem; }
}
.gnm-christmas .photo-split .photo-split__cal { width: 100%; max-width: none; justify-self: stretch; }
@media (max-width: 820px) { .gnm-christmas .photo-split__cal .xm-cal { padding: .5rem; } .gnm-christmas .photo-split__cal .xm-cal__grid { gap: .25rem; } .gnm-christmas .photo-split { gap: .75rem; } }
@media (max-width: 820px) { .js .gnm-christmas .screen-track > .screen--photo-split > .photo-split { padding-top: 3rem; } }
/* Centred screens: equal side padding so headings and calendars sit dead centre. */
.gnm-christmas .screen.screen--centred { padding-left: clamp(1.5rem, 6vw, 6rem); padding-right: clamp(1.5rem, 6vw, 6rem); }
.gnm-christmas .screen--centred .screen-inner { margin-left: auto; margin-right: auto; text-align: center; align-items: center; }
.gnm-christmas .screen--centred .screen-inner > * { margin-left: auto; margin-right: auto; text-align: center; justify-content: center; }
/* Maps sit in a white frame, equal on every side. */
.gnm-christmas .map-frame { background: #fff; padding: clamp(8px, 1vw, 14px); box-sizing: border-box; }
/* Hours: the closed days as a small tag, not a second headline. */
.gnm-christmas .lede .closed-pill { font-size: .6em; font-weight: 700; letter-spacing: .04em; padding: .35em .9em; vertical-align: middle; margin-top: .5em; }
.gnm-christmas .screen--map::after { content: ""; position: absolute; inset: 0; z-index: 6; pointer-events: none; box-shadow: inset 0 0 0 clamp(8px, 1.1vw, 16px) #fff; }
.gnm-christmas .screen--knit .mr-christmas { pointer-events: auto; cursor: grab; touch-action: none; }
.gnm-christmas .screen--knit .mr-christmas.is-dragging { cursor: grabbing; }
.gnm-christmas .ticket-includes { margin-top: .9rem; font-size: 1rem; opacity: .9; }
/* Brands headline: the longer line still reads as a headline, two lines at most on phones. */
@media (max-width: 600px) { .gnm-christmas .screen--concept .display-2.brands-head { font-size: clamp(1.05rem, 5.6vw, 1.6rem); } }
/* Closed tag: taller, squarer. */
.gnm-christmas .closed-pill, .gnm-christmas .lede .closed-pill { border-radius: 4px; padding-top: .55em; padding-bottom: .55em; line-height: 1; }
/* Brands: venue and welcome line read at the same size as the dates. */
.gnm-christmas .screen--concept .meta__details > span:not(.closed-pill) { font-size: 1.6875em; font-weight: 700; }
/* Ticket screen: calmer photo under a green veil, calendar a touch smaller. */
.gnm-christmas .screen--photo-split::after, .screen--photo-split::after { background: rgba(10, 52, 31, .72); }
.gnm-christmas .screen--photo-split > img { filter: blur(2px) saturate(.75); }
@media (min-width: 821px) { .gnm-christmas .photo-split__cal .xm-cal { max-width: 520px; padding: 1.1rem; } .gnm-christmas .photo-split__cal .xm-cal__day { font-size: 1.1rem; } }
/* Ticket screen: copy and calendar as one centred pair, equal margins either side. */
@media (min-width: 821px) {
  .gnm-christmas .screen--photo-split { padding-left: var(--xm-gutter); padding-right: clamp(1.5rem, 6vw, 6rem); }
  .gnm-christmas .screen--photo-split .photo-split { width: auto; margin-inline: auto; grid-template-columns: minmax(0, 30rem) minmax(0, 32rem); justify-content: center; gap: clamp(3rem, 6vw, 6rem); }
  .gnm-christmas .screen--photo-split .photo-split__cal .xm-cal { max-width: none; }
}
/* Ticket popup: bigger. */
.xm-tickets { width: min(100% - 2rem, 44rem); }
.xm-tickets__panel { padding: clamp(2.5rem, 7vw, 4.5rem) clamp(1.5rem, 7vw, 4.5rem); }
.xm-tickets__title { font-size: clamp(2.6rem, 8vw, 4rem); }
.xm-tickets__date { font-size: clamp(1.15rem, 2.4vw, 1.4rem); }
.xm-tickets__price { font-size: clamp(1.2rem, 2.4vw, 1.45rem); margin-top: .8rem; }
.xm-tickets__price b { font-size: clamp(2.8rem, 7vw, 3.6rem); }
.xm-tickets__compare { font-size: clamp(1.05rem, 2vw, 1.25rem); }
.xm-tickets__label { font-size: .95rem; margin-top: 2.4rem; }
.xm-tickets__stepper { grid-template-columns: 4.5rem minmax(0, 9rem) 4.5rem; gap: .5rem; }
.xm-tickets .xm-tickets__step, .xm-tickets .xm-tickets__stepper input { height: 4.5rem; font-size: 2rem; }
.xm-tickets__total { font-size: clamp(1.15rem, 2.4vw, 1.4rem); margin-top: 1.3rem; }
.xm-tickets .xm-tickets__send { min-width: 16rem; margin-top: 2.4rem; font-size: 1.15rem; padding-block: 1.1rem; }
/* Block42: the whole sentence is the headline. */
.gnm-christmas .block42-head__rest { display: inline; margin: 0; font: inherit; text-transform: inherit; letter-spacing: inherit; max-width: none; }
.gnm-christmas .screen .block42-head { font-size: clamp(1.7rem, 3.3vw, 3.6rem); max-width: 24ch; }
@media (min-width: 821px) { .gnm-christmas .screen .block42-head { max-width: 30ch; } }
@media (min-width: 821px) { .gnm-christmas .screen .block42-head { max-width: 100%; } }
/* Join us carries the dates now that the Dates screen is folded into it. */
.gnm-christmas .closing-dates { display: flex; flex-wrap: wrap; align-items: baseline; gap: .4rem 1.4rem; margin: 1.2rem 0 0; font: 700 clamp(1.3rem, 2.2vw, 2rem)/1.2 helvetica, "Outfit", sans-serif; }
.gnm-christmas .closing-dates span + span { font-weight: 500; opacity: .9; }
.gnm-christmas .screen .block42-head { text-wrap: pretty; width: 100%; }
/* Nav: lighter touch - a neutral dark veil with only a little blur. */
.gnm-christmas .sticky-nav { background: rgba(0, 0, 0, .28); -webkit-backdrop-filter: blur(5px); backdrop-filter: blur(5px); }
/* Block42 headline uses the full width of its screen. */
.gnm-christmas .screen--venue .photo-feature__caption:has(.block42-head) { max-width: min(100%, 84rem); }
/* Hours: Mr Christmas in the snow - plain white, the knit kept only as his jumper. */
.gnm-christmas .screen--knit { background: linear-gradient(180deg, #eef1f3 0%, #f9fafa 55%, #ffffff 100%); }
.gnm-christmas .screen--knit .knit { visibility: hidden; }
.gnm-christmas .screen--knit .knit-card { box-shadow: none; }
.gnm-christmas .dance-deck { background: transparent; box-shadow: none; }
/* Block42: wider headline, with a sprig of mistletoe hanging over it. */
.gnm-christmas .screen--venue .photo-feature__caption:has(.block42-head) { max-width: min(100%, 76rem); position: relative; }
.gnm-christmas .screen .block42-head { font-size: clamp(1.7rem, 3.6vw, 4rem); }
.gnm-christmas .block42-sprig { position: absolute; top: calc(-1 * clamp(80px, 9vw, 140px)); right: clamp(0rem, 6vw, 8rem); width: clamp(80px, 9vw, 140px); height: auto; pointer-events: none; border-radius: 0; filter: drop-shadow(0 6px 14px rgba(0, 0, 0, .45)); }
.gnm-christmas .screen--venue .photo-feature__caption:has(.block42-head) { max-width: none; padding-right: 0; }
.gnm-christmas .screen .block42-head { position: relative; max-width: 58rem; }
.gnm-christmas .block42-head .block42-sprig { top: auto; bottom: calc(100% - .2em); right: auto; left: -.35em; transform: rotate(-12deg); }
.gnm-christmas .block42-head .block42-sprig { width: clamp(90px, 11vw, 170px); bottom: calc(100% + .15em); left: -.2em; }
.gnm-christmas .screen--venue .photo-feature__caption:has(.block42-head) { overflow: visible; }
.js .gnm-christmas .screen-track > .screen > .screen-inner:has(.block42-head) { overflow: visible; }
/* Vendor: application deadline reads clearly, in orange. */
.gnm-christmas .screen-inner > .close-note { margin-top: 2.6rem; font-size: clamp(1rem, 1.3vw, 1.2rem); color: #ff8a2b; }
/* Vendor "Brands that make Good Neighbours better": gold screen, ink text. */
.gnm-christmas .screen--gold { background: var(--xm-gold); color: var(--xm-ink); }
.gnm-christmas .screen--gold :is(.display-2, .eyebrow, .card, .card .k, .card p) { color: var(--xm-ink); text-shadow: none; }
.gnm-christmas .screen--gold .card { background: rgba(43, 34, 34, .07); border-color: rgba(43, 34, 34, .18); }
.gnm-christmas .screen--gold .pill--gold { background: var(--xm-red); color: var(--xm-cream); }
.gnm-christmas .screen--gold .pill--gold:hover { background: var(--xm-ink); color: var(--xm-cream); }
/* Vendor category picker: the cards are toggles. Colour change only, no movement. */
.gnm-christmas .cards--pick .card { font: inherit; text-align: left; cursor: pointer; border: 2px solid rgba(43, 34, 34, .18); transition: background-color .25s, color .25s, border-color .25s; }
.gnm-christmas .screen--gold .cards--pick .card:hover { border-color: var(--xm-ink); }
.gnm-christmas .screen--gold .cards--pick .card[aria-pressed="true"] { background: var(--xm-ink); border-color: var(--xm-ink); }
.gnm-christmas .screen--gold .cards--pick .card[aria-pressed="true"] :is(.k, p) { color: var(--xm-gold); }
.gnm-christmas .screen--gold .lede { color: var(--xm-ink); text-shadow: none; }
/* Hours: Mr Christmas; hearts stay under his feet. */
@media (min-aspect-ratio: 1/1) {
  .gnm-christmas .screen--knit .mr-christmas { right: calc(14vw + 2rem); }
  .gnm-christmas .dance-deck { right: calc(14vw + 2rem + min(30vw, 470px) / 2); }
}
/* Snow in front of Mr Christmas too; the info card stays above all of it. */
.gnm-christmas .screen--knit .knit-snow--front { z-index: 3; }
.gnm-christmas .screen--knit .knit-card { position: relative; z-index: 4; }
/* Block42: the twinkling holly over the headline. */
.gnm-christmas .block42-head .block42-sprig { width: clamp(110px, 13vw, 210px); transform: rotate(-8deg); filter: drop-shadow(0 6px 14px rgba(0, 0, 0, .45)); }
.gnm-christmas .block42-sprig img { display: block; width: 100%; height: auto; border-radius: 0; }
/* The slider owns sideways swipes: no browser swipe-back, no rubber-banding at the ends. */
.js .screen-track { overscroll-behavior-x: contain; }
/* Hours: the hearts hang from a pixel chain. */
.gnm-christmas .dance-deck { padding: 0; }
.gnm-christmas .dance-deck__list { position: relative; flex-direction: row; gap: .5rem; padding: 1.6rem .9rem 0; }
.gnm-christmas .dance-deck__list::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 6px; image-rendering: pixelated;
  background:
    linear-gradient(90deg, var(--xm-ink) 0 2px, transparent 2px 10px, var(--xm-ink) 10px 12px, transparent 12px) 0 0 / 12px 6px repeat-x,
    linear-gradient(var(--xm-ink) 0 2px, transparent 2px 4px, var(--xm-ink) 4px 6px) 0 0 / 12px 6px repeat-x;
  -webkit-mask: linear-gradient(90deg, #000 0 10px, transparent 10px 12px) 0 0 / 12px 6px repeat-x;
          mask: linear-gradient(90deg, #000 0 10px, transparent 10px 12px) 0 0 / 12px 6px repeat-x; }
.gnm-christmas .dance-deck__list::after { content: ""; position: absolute; left: 0; right: 0; top: 2px; height: 2px; background: linear-gradient(90deg, transparent 0 8px, var(--xm-ink) 8px 14px, transparent 14px) 0 0 / 12px 2px repeat-x; }
.gnm-christmas .dance-deck__row { position: relative; padding: 0; }
.gnm-christmas .dance-deck__row::before { content: ""; position: absolute; left: 50%; bottom: 100%; width: 2px; height: calc(1.6rem - 6px); transform: translateX(-50%);
  background: repeating-linear-gradient(var(--xm-ink) 0 4px, transparent 4px 6px); }
/* Light screens (Hours, yellow Brands): white menubar with ink text. */
.nav-light .gnm-christmas .sticky-nav, .nav-light.gnm-christmas .sticky-nav, .gnm-christmas.nav-light .sticky-nav { background: #fff; -webkit-backdrop-filter: none; backdrop-filter: none; box-shadow: 0 1px 0 rgba(0, 0, 0, .08); transition: background-color .4s ease-in-out; }
.nav-light .sticky-nav a:not(.pill), .nav-light .sticky-nav button:not(.pill) { color: var(--xm-ink); }
.nav-light .sticky-nav .is-here, .nav-light .sticky-nav .is-current { color: var(--xm-red); }
.nav-light .sticky-nav .pill:not(.pill--gold) { color: var(--xm-ink); border-color: var(--xm-ink); }
.gnm-christmas .sticky-nav { transition: background-color .4s ease-in-out; }
.nav-light .gnm-christmas .sticky-nav .pill:not(.pill--gold) { color: var(--xm-ink); border-color: var(--xm-ink); }
.nav-light .gnm-christmas .sticky-nav :is(.is-here, .is-current) { color: var(--xm-red); }
/* Hours: the heart chain hangs above Mr Christmas like a decoration, strings longer towards the middle. */
@media (min-aspect-ratio: 1/1) { .gnm-christmas .dance-deck { top: calc(50% - min(78vh, 720px) * .36); } }
@media (max-aspect-ratio: 1/1) { .gnm-christmas .dance-deck { top: auto; bottom: calc(34vh + 2rem); } }
.gnm-christmas .dance-deck__list { align-items: flex-start; padding-top: 0; margin-top: 6px; }
.gnm-christmas .dance-deck__row { --hang: 1.1rem; margin-top: var(--hang); }
.gnm-christmas .dance-deck__row:nth-child(2), .gnm-christmas .dance-deck__row:nth-child(4) { --hang: 1.9rem; }
.gnm-christmas .dance-deck__row:nth-child(3) { --hang: 2.6rem; }
.gnm-christmas .dance-deck__row::before { height: calc(var(--hang) + 2px); }
/* Ticket popup: the chosen date sits beside the price, at the same weight. */
.xm-tickets__when { display: flex; flex-wrap: wrap; justify-content: center; align-items: baseline; gap: .4rem 1.4rem; margin-top: 1.2rem; }
.xm-tickets__when .xm-tickets__date { margin: 0; font-family: Garet, "Outfit", sans-serif; font-weight: 900; text-transform: uppercase; line-height: 1; font-size: clamp(1.9rem, 5vw, 2.8rem); color: var(--xm-cream); }
.xm-tickets__when .xm-tickets__date:empty { display: none; }
.xm-tickets__when .xm-tickets__price { margin: 0; }
.xm-tickets__venue { margin: .6rem 0 0; font-size: clamp(1rem, 2vw, 1.15rem); font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: var(--xm-gold); }
.xm-tickets__venue + .xm-tickets__compare { margin-top: .3rem; }
/* Hours: the heart chain is a loose garland from the green card to the right edge (drawn in js/mr-christmas.js). */
.gnm-christmas .dance-deck.dance-deck--garland { --chain: #3a3a3a; position: absolute; right: auto; bottom: auto; transform: none; padding: 0; margin: 0; background: none; box-shadow: none; z-index: 3; pointer-events: none; }
.gnm-christmas .dance-deck--garland .dance-deck__chain { position: absolute; inset: 0; image-rendering: pixelated; }
.gnm-christmas .dance-deck--garland .dance-deck__list { position: static; display: block; padding: 0; margin: 0; }
.gnm-christmas .dance-deck--garland .dance-deck__list::before, .gnm-christmas .dance-deck--garland .dance-deck__list::after { content: none; }
.gnm-christmas .dance-deck--garland .dance-deck__row { position: absolute; margin: 0; padding: 0; transform: translateX(-50%); pointer-events: auto; }
.gnm-christmas .dance-deck--garland .dance-deck__row::before { height: var(--hang); bottom: 100%; }
.gnm-christmas .actions--remind { display: flex; flex-wrap: wrap; gap: .75rem; }
@media (max-width: 640px) { .gnm-christmas .actions--remind { display: grid; grid-template-columns: 1fr 1fr; } }
.gnm-christmas .dance-deck.dance-deck--garland { z-index: 5; }
/* Hours: chain and hearts in front of Mr Christmas, unpicked hearts black, his feet level with the card's bottom edge. */
.gnm-christmas .screen--knit .dance-deck.dance-deck--garland { z-index: 6; }
.gnm-christmas .dance-deck__row svg, .gnm-christmas .dance-deck__row:hover svg { fill: #111; }
.gnm-christmas .dance-deck__row.is-on svg, .gnm-christmas .dance-deck__row.is-on:hover svg { fill: var(--xm-red); }
@media (min-aspect-ratio: 1/1) { .gnm-christmas .screen--knit .mr-christmas { margin-top: 6.5vh; } }
.gnm-christmas .screen--knit { overflow: hidden; }
/* Site map: an even white border on all four sides, starting below the menubar. */
.gnm-christmas .screen--map .venue__map, .gnm-christmas .screen--map::after { top: var(--xm-nav-h); }
/* The page's own first screen is already its link in the bar: no repeat (Home / Welcome, Visit / Visit). */
.nav-slides--here > button:first-child, .menu-slides--here > button:first-child { display: none; }
.gnm-christmas .block42-lede { max-width: 46rem; margin-top: 1.4rem; font-size: clamp(1.15rem, 1.6vw, 1.45rem); line-height: 1.45; }
.gnm-christmas .photo-feature__caption .block42-lede { margin-left: 0; padding-left: 0; text-indent: 0; }
.gnm-christmas .screen .screen-inner.photo-feature__caption p.block42-lede { margin-left: 0; margin-right: 0; }
/* Ticket screen: bigger headline and price line. */
.gnm-christmas .ticket-head { font-size: clamp(2.8rem, 6.2vw, 6.4rem); }
.gnm-christmas .ticket-includes { font-size: clamp(1.25rem, 2vw, 1.7rem); line-height: 1.35; }
.gnm-christmas .ticket-includes strong { color: var(--xm-gold); }
.gnm-christmas .screen .photo-split__copy h2.display-2.ticket-head { font-size: clamp(2.8rem, 6.2vw, 6.4rem); line-height: .95; }
.gnm-christmas .screen .photo-split__copy p.ticket-includes { font-size: clamp(1.25rem, 2vw, 1.7rem); }
.gnm-christmas .screen .photo-split__copy h2.display-2.ticket-head { font-size: clamp(2.3rem, 4.4vw, 4.6rem); }
/* Site map: white all round the map image, no green. */
.gnm-christmas .screen--map, .gnm-christmas .screen--map .venue__map, .gnm-christmas .screen--map .venue__canvas { background: #fff; }
.gnm-christmas .screen--map .screen-inner::before { content: none; }
.gnm-christmas .screen--map .screen-inner :is(h1, h2, .eyebrow, .lede) { color: var(--xm-ink); text-shadow: none; }
/* Remind me popup: one job, one primary — date leads, choices follow (Rams / Vignelli). */
.xm-remind .xm-tickets__panel {
  padding: clamp(1.6rem, 5vw, 2.4rem) clamp(1.25rem, 5vw, 2.2rem) clamp(1.4rem, 4vw, 2rem);
  max-width: 22rem;
  margin-inline: auto;
}
.xm-remind .xm-tickets__title {
  font-size: clamp(1.85rem, 5.5vw, 2.35rem);
  letter-spacing: -.02em;
  line-height: 1;
}
.xm-remind__eyebrow {
  margin: 0 0 .55rem;
  font-size: .78rem;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: rgba(250, 243, 220, .72);
}
.xm-remind__when {
  margin: .85rem 0 0;
  font-family: Garet, "Outfit", sans-serif;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: -.01em;
  line-height: 1.05;
  font-size: clamp(1.15rem, 3.4vw, 1.45rem);
  color: var(--xm-gold);
}
.xm-remind__meta,
.xm-remind__hours {
  margin: .55rem 0 0;
  font-size: .95rem;
  font-weight: 600;
  line-height: 1.35;
  color: rgba(250, 243, 220, .88);
}
.xm-remind .xm-tickets__venue { display: none; }
.xm-remind__choices {
  display: grid;
  gap: .55rem;
  margin-top: 1.5rem;
}
.xm-remind__choices .pill {
  justify-content: center;
  width: 100%;
  min-width: 0;
  font-size: 1rem;
  padding-block: .9rem;
  box-sizing: border-box;
}
.xm-remind__choices .pill:focus-visible {
  outline: 2px solid var(--xm-cream);
  outline-offset: 3px;
}
.gnm-christmas .screen .photo-feature__caption h2.display-2.block42-head { font-size: clamp(2.6rem, 6vw, 6rem); line-height: .95; max-width: 60rem; }
/* Site map: the map image sits in the space below the menubar with an equal white margin on every side. */
.gnm-christmas .screen--map { --map-pad: clamp(16px, 3vw, 48px); }
.gnm-christmas .screen--map .venue__scene { --map-w: min(100cqw - 2 * var(--map-pad), (100cqh - var(--xm-nav-h) - 2 * var(--map-pad)) * 1562 / 1007); width: var(--map-w); height: calc(var(--map-w) * 1007 / 1562); left: 0; right: 0; top: calc(var(--xm-nav-h) + (100cqh - var(--xm-nav-h) - var(--map-w) * 1007 / 1562) / 2); bottom: auto; margin: 0 auto; }
@media (max-aspect-ratio: 1/1) { .gnm-christmas .screen--map .venue__scene { top: calc(var(--xm-nav-h) + (100cqh - var(--xm-nav-h) - var(--map-w) * 1007 / 1562) / 2); bottom: auto; margin: 0 auto; width: var(--map-w); } }
.gnm-christmas .screen--map .venue__scene { --map-w: min(100cqw - 2 * var(--map-pad), (100cqh - 2 * var(--map-pad)) * 1562 / 1007); top: calc((100cqh - var(--map-w) * 1007 / 1562) / 2); }
@media (max-aspect-ratio: 1/1) { .gnm-christmas .screen--map .venue__scene { top: calc((100cqh - var(--map-w) * 1007 / 1562) / 2); } }
.gnm-christmas .screen .photo-feature__caption:has(.block42-head) { padding-top: calc(var(--xm-nav-h) + 2.5rem); padding-bottom: 2rem; box-sizing: border-box; }
/* Find us: full address as the headline, map, then Get directions, all in one screen. */
.gnm-christmas .screen-inner:has(> .map-frame) > .display-2 { font-size: clamp(1.9rem, 3.6vw, 3.6rem); }
.gnm-christmas .screen-inner:has(> .map-frame) > .map-frame { height: min(46vh, 26rem); }
.gnm-christmas .screen-inner:has(> .map-frame) > .map-frame iframe { height: 100%; }
.gnm-christmas .screen-inner:has(> .map-frame) > .map-frame + .actions { margin-top: 1.4rem; }
.gnm-christmas .split2__copy .display-2.address-head { font-size: clamp(1.9rem, 3.4vw, 3.4rem); }
.gnm-christmas .screen .screen-inner.photo-feature__caption:has(.block42-head) { max-width: min(78rem, 100%); width: 100%; }
.gnm-christmas .screen .photo-feature__caption h2.display-2.block42-head { max-width: 72rem; }
/* Site map: one badge in the bottom-right corner (brand + title), above the zoom buttons. */
.gnm-christmas .screen--map .venue__badge { position: absolute; z-index: 3; right: calc(var(--map-pad) + 1rem); bottom: calc(var(--map-pad) + 4.2rem); margin: 0; padding: 1.1rem 1.4rem 1.2rem; background: var(--xm-cream); border: 3px solid var(--xm-ink); box-shadow: 6px 6px 0 var(--xm-red); text-align: left; max-width: 22rem; }
.gnm-christmas .screen--map .venue__badge-sprig { position: absolute; left: -1.6rem; top: -2.2rem; width: 4.4rem; transform: rotate(-14deg); pointer-events: none; }
.gnm-christmas .screen--map .venue__badge-sprig img { display: block; width: 100%; height: auto; }
.gnm-christmas .screen--map .venue__badge-brand { margin: 0; font-family: Garet, "Outfit", sans-serif; font-weight: 900; text-transform: uppercase; line-height: 1; }
.gnm-christmas .screen--map .venue__badge-brand b { display: block; color: var(--xm-red); font-size: 1.35rem; letter-spacing: .02em; }
.gnm-christmas .screen--map .venue__badge-brand span { display: block; margin-top: .35rem; color: var(--xm-green); font-size: .9rem; letter-spacing: .04em; }
.gnm-christmas .screen--map .screen-inner .venue__badge-title { margin: .8rem 0 0; padding-top: .7rem; border-top: 2px dashed rgba(10, 30, 20, .3); font-family: Garet, "Outfit", sans-serif; font-weight: 900; text-transform: uppercase; font-size: 2rem; line-height: 1; color: var(--xm-ink); text-shadow: none; }
.gnm-christmas .screen--map .venue__badge-title span { display: block; margin-top: .4rem; font-family: helvetica, "Outfit", sans-serif; font-weight: 700; font-size: .78rem; letter-spacing: .04em; color: rgba(10, 30, 20, .65); }
@media (max-aspect-ratio: 1/1) { .gnm-christmas .screen--map .venue__badge { right: 1rem; left: auto; bottom: auto; top: calc(var(--xm-nav-h) + 1.2rem); padding: .8rem 1rem; max-width: 15rem; } .gnm-christmas .screen--map .venue__badge-brand b { font-size: 1rem; } .gnm-christmas .screen--map .venue__badge-brand span { font-size: .72rem; } .gnm-christmas .screen--map .screen-inner .venue__badge-title { font-size: 1.4rem; } .gnm-christmas .screen--map .venue__badge-sprig { width: 3.2rem; left: -1.1rem; top: -1.6rem; } }
/* Site map badge holds the markers list. */
.gnm-christmas .screen--map .venue__badge .venue__badge-legend { display: grid; grid-template-columns: 1fr; gap: .55rem; margin: .9rem 0 0; padding: .8rem 0 0; border-top: 2px dashed rgba(10, 30, 20, .3); background: none; color: var(--xm-ink); font-size: 1rem; font-weight: 700; text-align: left; }
.gnm-christmas .screen--map .venue__badge .venue__badge-legend b { width: 1.9rem; height: 1.9rem; font-size: .9rem; }
.gnm-christmas .screen--map .venue__badge { bottom: calc(var(--map-pad) + 4.2rem); }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
@media (max-aspect-ratio: 1/1) { .gnm-christmas .screen--map .venue__badge { top: auto; bottom: 4.4rem; left: 1rem; right: 1rem; max-width: none; } .gnm-christmas .screen--map .venue__badge .venue__badge-legend { grid-template-columns: 1fr 1fr; font-size: .85rem; margin-bottom: 0; } }
.gnm-christmas .contact-email { margin: 1.2rem 0 0; font-family: Garet, "Outfit", sans-serif; font-weight: 900; font-size: clamp(1.3rem, 2.8vw, 2.4rem); line-height: 1.1; }
.gnm-christmas .contact-email a { color: var(--xm-gold); text-decoration: none; transition: color .3s ease-in-out; }
.gnm-christmas .contact-email a:hover { color: var(--xm-cream); }
/* The page link (Home, Visit) is gold only on its first screen; on later screens the screen's own name is the highlight. */
html:not(.on-first-screen) .sticky-nav .nav-page.is-here, html:not(.on-first-screen) #mobile-menu a.is-here { color: inherit; }
html:not(.on-first-screen).nav-light .sticky-nav .nav-page.is-here { color: var(--xm-ink); }
/* Flat menu: every screen is a menu item; the bar wraps instead of hiding them. */
.sticky-nav > div.nav--flat > .md\:flex { flex-wrap: wrap; white-space: normal; justify-content: flex-end; row-gap: .35rem; column-gap: 1rem; max-width: 72vw; }
.sticky-nav .nav-flat { font-size: 10.5px; letter-spacing: .04em; opacity: .85; transition: color .3s ease-in-out, opacity .3s ease-in-out; }
.sticky-nav .nav-flat:hover { opacity: 1; color: var(--xm-gold); }
.sticky-nav .nav-flat.is-current, #mobile-menu .menu-flat.is-current { color: var(--xm-gold); opacity: 1; }
.nav-light .sticky-nav .nav-flat.is-current { color: var(--xm-red); }
/* Vendor brands picker: bigger selector buttons. */
.gnm-christmas .screen--gold .cards--pick { gap: 1rem; max-width: 64rem; }
.gnm-christmas .screen--gold .cards--pick .card { padding: 1.5rem 1.6rem 1.6rem; min-height: 7.5rem; }
.gnm-christmas .screen--gold .cards--pick .card .k { font-size: clamp(1rem, 1.3vw, 1.2rem); letter-spacing: .04em; }
.gnm-christmas .screen--gold .cards--pick .card p { font-size: clamp(1.1rem, 1.5vw, 1.35rem); margin-top: .6rem; }
.gnm-christmas .screen--gold .screen-inner:has(.cards--pick) { max-width: min(76rem, 100%); }
.gnm-christmas .screen--gold .cards--pick { width: 100%; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.gnm-christmas .screen--gold .cards--pick .card { align-content: start; text-align: left; }
@media (max-width: 700px) {
  .gnm-christmas .screen--gold .cards--pick { grid-template-columns: 1fr 1fr; gap: .6rem; }
  .gnm-christmas .screen--gold .cards--pick .card { padding: .9rem 1rem; min-height: 0; }
  .gnm-christmas .screen--gold .cards--pick .card .k { font-size: .85rem; }
  .gnm-christmas .screen--gold .cards--pick .card p { font-size: .95rem; margin-top: .35rem; }
}
/* When (Hours): the green card a little wider and further left. */
@media (min-aspect-ratio: 1/1) { .gnm-christmas .screen--knit .knit-card { width: min(36rem, 42vw); max-width: none; margin-left: calc(var(--xm-gutter, 8vw) * -0.45); } }
/* Brands: a stacked screen; scroll down from the photo to "what we look for", then on sideways. */
.gnm-christmas .screen--stack.screen--concept { padding: 0; }
.gnm-christmas .screen--stack .screen-inner.brands-stack { position: absolute; inset: 0; z-index: 2; width: auto; max-width: none; margin: 0; padding: 0; display: block; overflow-y: auto; overscroll-behavior-y: contain; scroll-snap-type: y mandatory; scrollbar-width: none; text-align: left; }
.gnm-christmas .screen--stack .brands-stack::-webkit-scrollbar { display: none; }
.gnm-christmas .screen--stack .stack-page { position: relative; min-height: 100%; box-sizing: border-box; scroll-snap-align: start; display: flex; flex-direction: column; justify-content: center; align-items: flex-start; padding: var(--xm-screen-top) var(--xm-gutter) clamp(4rem, 8vh, 6rem); }
/* Kill .screen-inner > * + * gap — sibling margin was flashing the red photo strip between stack pages. */
.gnm-christmas .screen--stack .brands-stack > .stack-page + .stack-page { margin-top: 0; }
.gnm-christmas .screen--stack .stack-page--photo > * { max-width: min(66rem, 64vw); }
.gnm-christmas .screen--stack .stack-page.screen--gold { text-shadow: none; }
.gnm-christmas .screen--stack .stack-page.screen--gold .cards--pick { width: min(76rem, 100%); }
@media (max-aspect-ratio: 1/1) {
  .gnm-christmas .screen--stack .stack-page--photo > * { max-width: none; }
  .gnm-christmas .screen--stack .stack-page:not(.screen--map) {
    justify-content: center;
    padding: calc(var(--xm-nav-h) + .5rem) 1.25rem 1.5rem;
  }
}
.gnm-christmas .screen--stack .stack-page { min-height: 100vh; min-height: 100svh; }
.gnm-christmas .screen--stack { overflow: hidden; }
.gnm-christmas .screen--stack .screen-inner.brands-stack { top: 0; left: 0; right: 0; bottom: 0; transform: none; translate: none; align-self: auto; height: 100%; }
.gnm-christmas .screen--stack .stack-page :is(.lede, .meta) { margin-top: 1rem; }
.gnm-christmas .screen--stack .stack-page :is(.cards, .actions) { margin-top: 1.8rem; }
.gnm-christmas .screen--stack .stack-page .display-2 { margin-top: .4rem; }
.gnm-christmas .screen--stack .stack-page--photo .actions { margin-top: 2.8rem; }
/* Venue: Block42 first, scroll down to Nuanu (its own photo) before carrying on sideways. */
.gnm-christmas .screen--venue-stack .stack-page--photo > .venue-cap { max-width: min(78rem, 100%); width: 100%; text-align: left; position: relative; padding: 0; }
.gnm-christmas .screen--venue-stack .stack-page--nuanu { color: var(--xm-cream); text-shadow: 0 2px 18px rgba(8, 26, 17, .55); }
.gnm-christmas .screen--venue-stack .stack-page__bg { position: absolute; inset: 0; z-index: -1; }
.gnm-christmas .screen--venue-stack .stack-page--nuanu { isolation: isolate; }
.gnm-christmas .screen--venue-stack .stack-page__bg img { width: 100%; height: 100%; object-fit: cover; border-radius: 0; }
.gnm-christmas .screen--venue-stack .stack-page__bg::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, transparent 12%, rgba(8, 26, 17, .55) 35%, rgba(8, 26, 17, .55) 65%, transparent 88%); }
.gnm-christmas .screen--venue-stack .stack-page--nuanu > .venue-cap { max-width: 60rem; padding: 0; }
.gnm-christmas .screen--venue-stack .venue-cap > * + * { margin-top: 1.4rem; }
.gnm-christmas .screen--venue-stack .venue-cap > .actions { margin-top: 2.4rem; }
.js .gnm-christmas .screen-track > .screen.screen--venue-stack > .screen-inner.brands-stack { overflow-y: auto; }
/* Venue copy runs long — proximity snap, not mandatory, so down-scroll matches freer pages. */
.gnm-christmas .screen--venue-stack .screen-inner.brands-stack { scroll-snap-type: y proximity; }
.gnm-christmas .screen.screen--venue-stack { padding: 0; }
.gnm-christmas .screen--venue-stack .venue-cap > .lede, .gnm-christmas .screen--venue-stack .venue-cap p.block42-lede { margin-left: 0; margin-right: 0; }
.gnm-christmas .screen--venue-stack .venue-cap > .actions { margin-top: 3.4rem; }
/* Directions: getting there first, scroll down to the site map. */
.gnm-christmas .screen--dir-stack .dir-page { justify-content: center; }
.gnm-christmas .screen--dir-stack .dir-page .split2 { text-align: left; width: min(100%, 1240px); }
.gnm-christmas .screen--dir-stack .dir-page .split2__copy > * + * { margin-top: 1.4rem; }
.gnm-christmas .screen--dir-stack .dir-page .actions { margin-top: 2.6rem; }
.gnm-christmas .screen--dir-stack .stack-page.screen--map { padding: 0; display: block; overflow: hidden; }
@media (min-width: 821px) { .gnm-christmas .screen--dir-stack .dir-page .split2 { grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr); } }
.gnm-christmas .screen--dir-stack .dir-page .address-head { font-size: clamp(2rem, 3.6vw, 3.8rem); line-height: 1; }
@media (min-width: 821px) { .gnm-christmas .screen--dir-stack .dir-page .address-head { font-size: clamp(1.8rem, 2.9vw, 3.1rem); } .gnm-christmas .screen--dir-stack .dir-page .split2 { width: min(100%, 1320px); } }
/* Date: the knitted market-hours screen, scroll down to Join us. */
.gnm-christmas .screen--date-stack { padding: 0; }
.js .gnm-christmas .screen-track > .screen.screen--date-stack > .screen-inner.brands-stack { overflow-y: auto; }
.gnm-christmas .screen--date-stack .knit-page { overflow: hidden; }
.gnm-christmas .screen--date-stack .knit-page > .knit-card { position: relative; z-index: 3; }
.gnm-christmas .screen--date-stack .stack-page.screen--closing { background: var(--xm-b-solid); color: var(--xm-cream); overflow: hidden; }
.gnm-christmas .screen--date-stack .screen--closing > * + * { margin-top: 1.6rem; }
.gnm-christmas .screen--date-stack .screen--closing .holly { display: block; }
.gnm-christmas .screen-inner > .close-note { color: #fff; }
/* Vendor page: yellow and green lights only. */
.xm-lights--yg.is-on::before, .xm-lights--yg.is-on::after { background-image: url("../img/lights-string-rg.webp"); }
@media (prefers-reduced-motion: reduce) { .xm-lights--yg.is-on::before, .xm-lights--yg.is-on::after { background-image: url("../img/lights-string-rg-still.webp"); } }
/* Front page: the dates sit in the headline. */
.gnm-christmas .screen--hero h1 .hero-date { display: block; margin-top: .25em; font-size: .5em; line-height: 1.05; color: var(--xm-cream); }
/* Tickets: the vendor-style day picker, with the price on it. */
.gnm-christmas .xm-cal--tickets { background: var(--xm-b-solid); }
.gnm-christmas .xm-cal__price { display: flex; align-items: baseline; gap: .8rem; flex-wrap: wrap; margin: 0 0 1.1rem; color: var(--xm-cream); }
.gnm-christmas .xm-cal__price b { font: 900 clamp(1.8rem, 2.6vw, 2.4rem)/1 Garet, "Outfit", sans-serif; color: var(--xm-gold); }
.gnm-christmas .xm-cal__price span { font-size: 1rem; font-weight: 700; }
.gnm-christmas .xm-cal--tickets .xm-cal__status { text-align: left; font-size: 1.4rem; letter-spacing: 0; line-height: 1.3; }
.gnm-christmas .photo-split__cal .xm-cal--tickets { padding: clamp(1.6rem, 3.2vw, 2.4rem); }
.gnm-christmas .xm-cal--tickets .xm-cal__actions { margin-top: 1.2rem; grid-template-columns: minmax(0, 1fr); }
.gnm-christmas .xm-cal--tickets .xm-cal__actions .pill { width: 100%; justify-self: stretch; }
/* Candy cane hooked on the ticket headline. */
.gnm-christmas .ticket-head { position: relative; }
.gnm-christmas .ticket-head .candy-cane { position: absolute; left: -.2em; bottom: calc(100% + .15em); width: auto; height: clamp(70px, 8vw, 120px); transform: rotate(-14deg); border-radius: 0; filter: drop-shadow(0 6px 12px rgba(0, 0, 0, .35)); pointer-events: none; }
/* Vendors: rates sit below the first screen. */
.gnm-christmas .screen--vendor-stack { padding: 0; }
.js .gnm-christmas .screen-track > .screen.screen--vendor-stack > .screen-inner.brands-stack { overflow-y: auto; }
.gnm-christmas .screen--vendor-stack .stack-page--rates { background: var(--xm-b-solid); justify-content: center; }
.gnm-christmas .screen--vendor-stack .stack-page--rates .split2 { text-align: left; }
.gnm-christmas .screen--vendor-stack .stack-page--photo > * + * { margin-top: 1.4rem; }
.gnm-christmas .screen--vendor-stack .stack-page--photo > .actions { margin-top: 2.6rem; }
/* Date: a wider green card. */
@media (min-aspect-ratio: 1/1) { .gnm-christmas .screen--knit .knit-card { width: min(100%, 44rem); } }
/* Motion: a small press on buttons; the ticket and remind confirmations fade in. */
.pill, .xm-cal__length, button.xm-cal__day { transition-property: background-color, color, box-shadow, transform; }
.pill:active, .xm-cal__length:active, button.xm-cal__day:active { transform: scale(.97); transition: transform .16s ease-out; }
.xm-tickets__done:not([hidden]), .remind-form__msg:not(:empty) { animation: xm-fade-in .3s ease-in-out; }
@keyframes xm-fade-in { from { opacity: 0; } }
@media (prefers-reduced-motion: reduce) { .pill:active, .xm-cal__length:active, button.xm-cal__day:active { transform: none; } }
/* Candy cane sits above the headline in the flow, so nothing clips it. */
.gnm-christmas .ticket-head .candy-cane { position: static; display: block; margin: 0 0 .9rem .2rem; height: clamp(80px, 9vw, 130px); transform: rotate(-12deg); transform-origin: 50% 100%; }
/* Outline button on the gold page reads in ink. */
.gnm-christmas .stack-page.screen--gold .pill--outline { color: var(--xm-ink); box-shadow: inset 0 0 0 2px var(--xm-ink); border-color: var(--xm-ink); }
.gnm-christmas .ticket-head .candy-cane { margin-left: 1.4rem; transform: rotate(8deg); }
/* Date: no chain or hearts. */
.gnm-christmas .screen--knit .dance-deck { display: none !important; }
/* Join us: the same pixel snow, in white, falling behind the words. */
.gnm-christmas .screen--closing .knit-snow--join { position: absolute; inset: 0; z-index: 0; pointer-events: none; }
.gnm-christmas .screen--closing .knit-snow--join canvas { display: block; width: 100%; height: 100%; }
.gnm-christmas .screen--date-stack .screen--closing > :not(.knit-snow) { position: relative; z-index: 1; }
/* Date: green all over, white snowflakes; the knit pattern is off. */
.gnm-christmas .screen--knit, .gnm-christmas .screen--date-stack .knit-page { background: var(--xm-b-solid); }
.gnm-christmas .screen--date-stack .knit-page .knit { display: none; }
.gnm-christmas .screen--date-stack .knit-card {
  background: #0d3b23;
  box-shadow: 0 18px 40px rgba(20, 8, 10, .28), 0 4px 12px rgba(20, 8, 10, .18);
}
/* Remind hours kept for older markup; meta is the live line. */
/* Tickets: plain dark green. */
.gnm-christmas .screen--tickets { background: #0d3b23; }
.gnm-christmas .screen--tickets::before,
.gnm-christmas .screen--tickets::after { content: none; }
.gnm-christmas .screen--tickets > .screen-inner { position: relative; z-index: 2; }
/* Tickets: copy + calendar as one centred pair, columns middle-aligned. */
@media (min-width: 821px) {
  .gnm-christmas .screen.screen--tickets.screen--photo-split {
    padding-left: var(--xm-gutter);
    padding-right: var(--xm-gutter);
    justify-content: center;
  }
  .gnm-christmas .screen--tickets .photo-split {
    width: min(100%, 78rem);
    margin-inline: auto;
    grid-template-columns: minmax(0, 1.15fr) minmax(28rem, 34rem);
    gap: clamp(2rem, 4vw, 3.5rem);
    align-items: center;
    justify-content: center;
  }
  .gnm-christmas .screen--tickets .photo-split__cal { margin-left: 0; justify-self: stretch; align-self: center; width: 100%; }
  .gnm-christmas .screen--tickets .photo-split__cal .xm-cal { max-width: none; width: 100%; }
  .gnm-christmas .screen--tickets .photo-split__copy { align-self: center; }
}
.gnm-christmas .screen--stack .stack-page.screen--gold > .actions { margin-top: 3.2rem; }
.gnm-christmas .screen--gold .cards--pick { gap: .75rem; }
/* Home: white snow falling and settling on the headline and buttons. */
.gnm-christmas .screen--hero .snow-settle { position: absolute; inset: 0; z-index: 3; pointer-events: none; }
.gnm-christmas .screen--hero .snow-settle canvas { display: block; width: 100%; height: 100%; }
.gnm-christmas .screen--hero > .screen-inner { position: relative; z-index: 2; }
/* Lights: drawn, minimal. A fine dark wire, small red and green bulbs with a soft glow and a slow twinkle. */
.xm-lights.is-on::before, .xm-lights.is-on::after { content: none; }
.xm-lights__svg { position: absolute; left: 0; top: 0; overflow: visible; }
.xm-wire { fill: none; stroke: rgba(8, 20, 12, .85); stroke-width: 1; }
.xm-bulb rect { fill: #1a1a1a; }
.xm-bulb--r ellipse { fill: #d1203a; filter: drop-shadow(0 0 3px rgba(225, 40, 60, .75)); }
.xm-bulb--g ellipse { fill: #2fae5f; filter: drop-shadow(0 0 3px rgba(60, 200, 110, .7)); }
.xm-bulb ellipse { animation: xm-twinkle 3.6s ease-in-out var(--d, 0s) infinite alternate; }
@keyframes xm-twinkle { from { opacity: 1; } to { opacity: .55; } }
@media (prefers-reduced-motion: reduce) { .xm-bulb ellipse { animation: none; } }
/* Settling snow on any screen: above the content, never in the way of clicks. */
.gnm-christmas .snow-settle { position: absolute; inset: 0; z-index: 3; pointer-events: none; }
.gnm-christmas .snow-settle canvas { display: block; width: 100%; height: 100%; }
/* Footer call to action: centred, buttons all the same size. */
.gnm-christmas .footer-cta { text-align: center; }
.gnm-christmas .footer-cta .display-2 { margin-inline: auto; }
.gnm-christmas .footer-cta__actions { display: grid; grid-template-columns: repeat(4, minmax(0, 15rem)); justify-content: center; gap: .9rem; margin-inline: auto; }
.gnm-christmas .footer-cta__actions .pill { width: 100%; justify-content: center; text-align: center; }
@media (max-width: 820px) { .gnm-christmas .footer-cta__actions { grid-template-columns: repeat(2, minmax(0, 1fr)); width: 100%; } }

/* Mobile navigation: compact links over a full-bleed page, without a glass bar. */
@media (max-width: 767px) {
  .gnm-christmas:not(.apply-ui) {
    margin: 0;
    --xm-nav-h: 3.5rem;
    --xm-screen-top: calc(var(--xm-nav-h) + 1rem);
  }
  html .gnm-christmas .sticky-nav,
  html.nav-light .gnm-christmas .sticky-nav {
    background: transparent;
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
    box-shadow: none;
    border: 0;
    padding-block: 0;
  }
  .gnm-christmas .sticky-nav > .max-w-7xl {
    height: calc(var(--xm-nav-h) + env(safe-area-inset-top, 0px));
    padding-top: env(safe-area-inset-top, 0px);
  }
  .gnm-christmas .sticky-nav button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 44px;
    min-height: 44px;
  }
  .gnm-christmas #mobile-menu {
    padding-top: env(safe-area-inset-top, 0px);
    padding-bottom: env(safe-area-inset-bottom, 0px);
  }
  .gnm-christmas #mobile-menu > div:first-child { padding: .75rem 1.25rem; }
  .gnm-christmas #mobile-menu > div:has(> a ~ a ~ a ~ a) {
    flex: 1 0 auto;
    justify-content: safe center;
    gap: 0;
    padding: .5rem 1.25rem;
    font-size: 1.125rem;
    line-height: 1.1;
    letter-spacing: .04em;
  }
  .gnm-christmas #mobile-menu > div:has(> a ~ a ~ a ~ a) > a {
    margin: 0;
    min-height: 2.35rem;
    display: flex;
    align-items: center;
    justify-content: center;
  }
  .gnm-christmas #mobile-menu > div:has(> a ~ a ~ a ~ a) > * + * { margin-top: 0; }
  .gnm-christmas #mobile-menu > div:last-child {
    padding: .5rem 1.25rem calc(2.75rem + env(safe-area-inset-bottom, 0px));
  }
  .gnm-christmas #mobile-menu > div:last-child p { margin-bottom: .35rem; }
  /* Balanced pad so copy sits mid-phone (nav clearance only — not a huge top shelf). */
  .js .gnm-christmas .screen-track > .screen {
    padding-top: calc(var(--xm-nav-h) + env(safe-area-inset-top, 0px));
    padding-bottom: calc(1.25rem + env(safe-area-inset-bottom, 0px));
    justify-content: center;
  }
  .js .gnm-christmas .screen-track > .screen--stack { padding: 0; }
  .gnm-christmas .screen--stack .stack-page:not(.screen--map) {
    justify-content: center;
    padding-top: calc(var(--xm-nav-h) + env(safe-area-inset-top, 0px) + .5rem);
    padding-bottom: calc(1.5rem + env(safe-area-inset-bottom, 0px));
  }
  .js .gnm-christmas .screen-track > .screen--hero {
    padding-bottom: calc(var(--xm-nav-h) + 1rem);
  }
  .js .gnm-christmas .screen-track > .screen--kids {
    justify-content: flex-end;
    padding-bottom: calc(2.75rem + env(safe-area-inset-bottom, 0px));
  }
  .js .gnm-christmas .screen-track > .screen--kids > .screen-inner {
    margin-top: auto;
    margin-bottom: 0;
  }
  .js .gnm-christmas .screen-track > .screen--tickets {
    justify-content: flex-start;
  }
}

/* One mobile text gutter, including stacked screens and photo captions. */
@media (max-width: 767px) {
  .gnm-christmas:not(.apply-ui) { --xm-gutter: 2.5rem; }
  .gnm-christmas:not(.apply-ui) .screen,
  .gnm-christmas:not(.apply-ui) .screen--stack .stack-page:not(.screen--map),
  .js .gnm-christmas:not(.apply-ui) .screen-track > footer {
    padding-inline: var(--xm-gutter);
  }
  .js .gnm-christmas:not(.apply-ui) .screen-track > .screen--stack { padding-inline: 0; }
  .gnm-christmas .screen--stack .stack-page > .photo-feature__caption { padding-inline: 0; }
  .gnm-christmas .screen--concept .display-2.brands-head {
    font-size: clamp(1.9rem, 8.6vw, 2.8rem);
    max-width: 100%;
  }
}

/* Mobile site map fills its screen; the original image and pins scale together. */
@media (max-width: 767px) {
  .gnm-christmas .screen--dir-stack .stack-page.screen--map {
    height: 100%;
    min-height: 100%;
    padding: 0;
  }
  .gnm-christmas .screen--map .venue__map {
    inset: 0;
    width: 100%;
    height: 100%;
    touch-action: none;
  }
  .gnm-christmas .screen--map .venue__scene {
    --map-w: max(100cqw, 100cqh * 1562 / 1007);
    width: var(--map-w);
    height: calc(var(--map-w) * 1007 / 1562);
    left: calc((100cqw - var(--map-w)) * .22);
    right: auto;
    top: calc((100cqh - var(--map-w) * 1007 / 1562) / 2);
    bottom: auto;
    margin: 0;
  }
  .gnm-christmas .screen--map::after { inset: 0; box-shadow: none; }
  .gnm-christmas .screen--map .venue__controls {
    bottom: calc(.75rem + env(safe-area-inset-bottom, 0px));
  }
  .gnm-christmas .screen--map .venue__controls button { min-width: 44px; min-height: 44px; }
  .gnm-christmas .screen--map .venue__badge {
    bottom: calc(4.5rem + env(safe-area-inset-bottom, 0px));
  }
}

/* Dates on phones: bunny on the right, reminder button on the left. */
@media (max-width: 767px) {
  .gnm-christmas .screen--date-stack .knit-page > .mr-christmas {
    left: auto;
    right: 0;
    top: auto;
    bottom: calc(1rem + env(safe-area-inset-bottom, 0px));
    transform: none;
    margin-top: 0;
    width: 45vw;
    height: min(34svh, 20rem);
  }
  .gnm-christmas .screen--date-stack .knit-card .actions {
    position: relative;
    z-index: 5;
    justify-content: flex-start;
  }
}

/* Mobile Block42 screen: three compact actions in one row; pack so the block can sit mid-screen. */
@media (max-width: 767px) {
  .gnm-christmas .screen--venue-stack .stack-page--photo {
    justify-content: center;
  }
  .gnm-christmas .screen--venue-stack .stack-page--photo > .venue-cap > .actions {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    grid-auto-flow: row;
    width: 100%;
    gap: .4rem;
    margin-top: 1.1rem;
  }
  .gnm-christmas .screen--venue-stack .stack-page--photo > .venue-cap > .actions .pill {
    width: 100%;
    min-width: 0;
    min-height: 44px;
    padding: .6rem .35rem;
    justify-content: center;
    text-align: center;
    white-space: normal;
    box-sizing: border-box;
  }
  .gnm-christmas .screen--venue-stack .stack-page--photo > .venue-cap > .actions .pill strong {
    font-size: .78rem;
    line-height: 1.2;
  }
  .gnm-christmas .screen--venue-stack .venue-cap p.block42-lede {
    font-size: .95rem;
    line-height: 1.35;
    margin-top: .85rem;
  }
  .gnm-christmas .screen--venue-stack .venue-cap h2.display-2.block42-head {
    font-size: clamp(1.85rem, 8vw, 2.55rem);
  }
  .gnm-christmas .screen--venue-stack .venue-cap > .block42-logo {
    margin-top: 1.4rem;
    width: min(7.5rem, 32vw);
  }
  .gnm-christmas .block42-head .block42-sprig {
    width: clamp(64px, 16vw, 96px);
    bottom: calc(100% + .05em);
  }
}

/* Ticket price and its per-ticket label share one typographic treatment. */
.gnm-christmas .xm-cal__price :is(b, span) {
  font: 700 1rem/1.4 helvetica, "Outfit", sans-serif;
}

/* Contact: the same solid dark green as the ticket screen. */
.gnm-christmas .screen--contact { background: #0d3b23 url("../img/child_cocooned_christmas_3048px.png") center / cover no-repeat; }
/* Phone: pull the cocooned figure left into frame. */
@media (max-width: 767px) {
  .gnm-christmas .screen--contact { background-position: 72% center; }
}
.gnm-christmas .screen--contact::before { content: ""; position: absolute; inset: 0; background: linear-gradient(0deg, rgba(10,58,34,.42) 0%, rgba(10,58,34,.26) 48%, rgba(10,58,34,.12) 100%); pointer-events: none; }

/* Mobile application introduction: both actions share one row. */
@media (max-width: 767px) {
  .gnm-christmas .screen--vendor-stack .stack-page--photo > .actions--pair {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-auto-flow: row;
    gap: .6rem;
    width: 100%;
  }
  .gnm-christmas .screen--vendor-stack .stack-page--photo > .actions--pair .pill {
    width: 100%;
    min-width: 0;
    min-height: 44px;
    padding: .75rem .5rem;
    justify-content: center;
    text-align: center;
    box-sizing: border-box;
  }
  .gnm-christmas .screen--vendor-stack .stack-page--photo > .actions--pair .pill strong {
    font-size: .9rem;
    line-height: 1.2;
  }
}

/* Phones end at the page content, without an extra footer screen. */
@media (max-width: 767px) {
  .gnm-christmas footer,
  .js .gnm-christmas .screen-track > footer { display: none; }
}

/* Mobile text has one reveal owner: hidden first frame, then a single fade. */
@media (max-width: 767px) {
  .js .gnm-christmas .screen.reveal-on-scroll.active { animation: none; }
  .js .gnm-christmas .reveal-on-scroll .rise {
    opacity: 0;
    transition: none;
    animation: none;
  }
  .js .gnm-christmas .reveal-on-scroll .rise.is-text-visible {
    opacity: 1;
    animation: mobile-copy-in .65s ease-in-out both;
  }
}
@keyframes mobile-copy-in { from { opacity: 0; } to { opacity: 1; } }
@media (max-width: 767px) and (prefers-reduced-motion: reduce) {
  .js .gnm-christmas .reveal-on-scroll .rise,
  .js .gnm-christmas .reveal-on-scroll .rise.is-text-visible {
    opacity: 1;
    animation: none;
    transition: none;
  }
}

/* Phones: stacked screens snap loosely, so a page taller than the screen scrolls to its end and the next swipe moves on. */
@media (max-width: 767px) { .gnm-christmas .screen--stack .screen-inner.brands-stack { scroll-snap-type: y proximity; } }
/* Mobile menu: thick headline links, packed tight; Follow Us sits off the floor. */
.gnm-christmas #mobile-menu > div:has(> a ~ a ~ a ~ a) { gap: 0; line-height: 1; letter-spacing: 0; }
.gnm-christmas #mobile-menu > div:has(> a ~ a ~ a ~ a) > * + * { margin-top: 0; }
.gnm-christmas #mobile-menu > div:has(> a ~ a ~ a ~ a) > a:not(.pill) {
  font-family: Garet, "Outfit", sans-serif;
  font-weight: 900;
  font-size: clamp(1.85rem, 7vw, 2.35rem);
  line-height: 1;
  letter-spacing: -.02em;
  text-transform: uppercase;
  min-height: 2.35rem;
  padding-block: .1rem;
}
.gnm-christmas #mobile-menu > div:has(> a ~ a ~ a ~ a) > a.pill {
  margin-top: 1rem;
  min-width: min(100%, 16rem);
  justify-content: center;
}
.gnm-christmas #mobile-menu > div:has(> a ~ a ~ a ~ a) > a.menu-apply {
  color: var(--xm-gold);
  margin-top: .55rem;
}
.gnm-christmas #mobile-menu > div:has(> a ~ a ~ a ~ a) > a.menu-apply:hover,
.gnm-christmas #mobile-menu > div:has(> a ~ a ~ a ~ a) > a.menu-apply:focus-visible {
  color: var(--xm-cream);
}
.gnm-christmas #mobile-menu > div:last-child {
  padding-bottom: calc(2.75rem + env(safe-area-inset-bottom, 0px));
}
#mobile-menu > div:last-child > p { font-size: .85rem; text-transform: none; letter-spacing: 0; opacity: .7; margin-bottom: .35rem; }
#mobile-menu > div:last-child > a { display: inline-flex; align-items: center; gap: .5rem; padding: .4rem 0; background: none; color: var(--xm-cream); font: 700 1.1rem/1.2 helvetica, sans-serif; letter-spacing: 0; text-transform: none; text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: .25em; }
#mobile-menu > div:last-child > a::before { content: ""; width: 1.25rem; height: 1.25rem; background: currentColor; -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2'%3E%3Crect x='3' y='3' width='18' height='18' rx='5'/%3E%3Ccircle cx='12' cy='12' r='4'/%3E%3Ccircle cx='17.5' cy='6.5' r='1' fill='black'/%3E%3C/svg%3E") center / contain no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2'%3E%3Crect x='3' y='3' width='18' height='18' rx='5'/%3E%3Ccircle cx='12' cy='12' r='4'/%3E%3Ccircle cx='17.5' cy='6.5' r='1' fill='black'/%3E%3C/svg%3E") center / contain no-repeat; }
#mobile-menu > div:last-child > a:hover { color: var(--xm-gold); }
/* Rates: the regular price struck through above the early-bird price. */
.gnm-christmas .package-table s.was { display: block; font-size: 1em; color: #ff5a4f; text-decoration-color: #ff5a4f; text-decoration-thickness: 2px; }
.gnm-christmas .package-table b.deal { display: block; margin-top: .2rem; color: var(--xm-gold); font-size: 1.4em; line-height: 1.2; font-weight: 800; letter-spacing: -.025em; }
.gnm-christmas .package-table caption strong { display: block; font-size: clamp(1.6rem, 2.3vw, 2.4rem); line-height: 1.1; letter-spacing: -.02em; }
.gnm-christmas .package-table caption > span { display: block; margin-top: .45rem; font-size: 1rem; }
.gnm-christmas .package-table caption > small { display: block; margin-top: .35rem; color: var(--xm-cream); font-size: .85rem; font-weight: 500; letter-spacing: 0; text-transform: none; }
.gnm-christmas .package-table .sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* Phones: paired buttons sit side by side, equal width, filling the column. */
@media (max-width: 767px) {
  .gnm-christmas :is(.actions--pair, .actions:has(> .pill + .pill)):not(:has(> .pill + .pill + .pill)) { display: grid; grid-auto-flow: column; grid-auto-columns: 1fr; width: 100%; max-width: 100%; gap: .6rem; }
  .gnm-christmas :is(.actions--pair, .actions:has(> .pill + .pill)):not(:has(> .pill + .pill + .pill)) > .pill { width: 100%; min-width: 0; padding-inline: .6rem; justify-content: center; text-align: center; }
}
/* Phones: three buttons become one full-width call with the other two side by side beneath it. */
@media (max-width: 767px) {
  .gnm-christmas .actions:has(> .pill + .pill + .pill) { display: grid; grid-template-columns: 1fr 1fr; grid-auto-flow: row; width: 100%; max-width: 100%; gap: .6rem; }
  .gnm-christmas .actions:has(> .pill + .pill + .pill) > .pill { width: 100%; min-width: 0; padding-inline: .6rem; justify-content: center; text-align: center; }
  .gnm-christmas .actions:has(> .pill + .pill + .pill) > .pill:first-child { grid-column: 1 / -1; }
}
/* Phones: headlines run on as one line of text, with no forced break. Keep tickets break. */
@media (max-width: 767px) {
  .gnm-christmas :is(h1, h2):not(.screen--hero h1, .apply-screen--photo h1, .ticket-head) br { display: none; }
}

/* Phones: tickets — top-align so flex-center doesn't clip headline; pack cal + Book now into one screen. */
@media (max-width: 767px) {
  .js .gnm-christmas .screen-track > .screen.screen--tickets {
    justify-content: flex-start;
    align-items: stretch;
    padding-top: calc(var(--xm-nav-h) + env(safe-area-inset-top, 0px) + 1.1rem);
    padding-bottom: .75rem;
  }
  .js .gnm-christmas .screen-track > .screen--tickets > .photo-split {
    padding-top: 0;
    gap: .55rem;
    align-content: start;
    width: 100%;
  }
  .gnm-christmas .screen--tickets .photo-split__copy h2.display-2.ticket-head {
    font-size: clamp(1.55rem, 7vw, 2.05rem);
    line-height: 1.05;
  }
  .gnm-christmas .screen--tickets .ticket-includes,
  .gnm-christmas .screen--tickets .photo-split__copy p.ticket-includes {
    font-size: .82rem;
    line-height: 1.25;
    margin-top: .4rem;
  }
  .gnm-christmas .photo-split__cal .xm-cal--tickets { padding: .5rem .6rem .65rem; }
  .gnm-christmas .xm-cal--tickets .xm-cal__grid { gap: .2rem; }
  .gnm-christmas .xm-cal--tickets .xm-cal__day,
  .gnm-christmas .xm-cal--tickets .xm-cal__blank { aspect-ratio: 1; }
  .gnm-christmas .xm-cal--tickets .xm-cal__day { font-size: .78rem; }
  .gnm-christmas .xm-cal--tickets .xm-cal__dow { font-size: .62rem; padding-bottom: 0; }
  .gnm-christmas .xm-cal--tickets .xm-cal__legend {
    margin-top: .4rem;
    gap: .7rem;
    font-size: .65rem;
  }
  .gnm-christmas .xm-cal--tickets .xm-cal__status {
    margin-top: .45rem;
    font-size: .92rem;
    letter-spacing: 0;
    line-height: 1.22;
  }
  .gnm-christmas .xm-cal--tickets .xm-cal__actions { margin-top: .55rem; }
  .gnm-christmas .xm-cal--tickets .xm-cal__actions .pill { min-height: 2.7rem; }
}

/* Phones: big headlines at 11vw. */
@media (max-width: 560px) { .gnm-christmas .display-2 { font-size: 11vw; } }
/* Brands: the dates, closed days, place and welcome stack as clean lines on phones, without divider bars. */
@media (max-width: 767px) {
  .gnm-christmas .screen--concept .meta__details { flex-direction: column; align-items: flex-start; gap: .45rem; }
  .gnm-christmas .screen--concept .meta__details > span + span::before { content: none; }
  .gnm-christmas .screen--concept .meta__details > span:not(.closed-pill) { font-size: 1.15em; }
}
/* What we look for: category tiles without outlines. */
.gnm-christmas .cards--pick .card { border-color: transparent; background-color: rgba(43, 34, 34, .07); }
.gnm-christmas .screen--gold .cards--pick .card:hover { border-color: transparent; background-color: rgba(43, 34, 34, .13); }
/* Location: the same dark green as Tickets. */
.gnm-christmas .screen--dir-stack, .gnm-christmas .screen--dir-stack .dir-page { background: #0d3b23; }
.gnm-christmas .screen--dir-stack::after { content: none; }
/* Phones, Date: a bigger headline, and the bunny standing beside the Remind me button. */
@media (max-width: 767px) {
  .gnm-christmas .screen--knit .knit-page { display: grid; align-content: center; justify-items: stretch; }
  .gnm-christmas .screen--knit .knit-page > .knit-card, .gnm-christmas .screen--knit .knit-page > .mr-christmas { grid-area: 1 / 1; }
  .gnm-christmas .screen--knit .knit-page > .knit-card { width: 100%; padding-bottom: 2rem; }
  .gnm-christmas .screen--knit .knit-card .display-2 { font-size: 11vw; line-height: .95; }
  .gnm-christmas .screen--knit .knit-page > .mr-christmas { position: relative; inset: auto; transform: none; justify-self: end; align-self: end; width: 50vw; height: 30vh; margin: 0 -.25rem calc(2rem - 5.1vh) 0; z-index: 4; }
  .gnm-christmas .screen--knit .knit-card .quiet-row { max-width: 52%; margin-inline: 0; justify-content: flex-start; }
}
/* A line break kept for desktop only. */
@media (max-width: 767px) { .gnm-christmas br.br-desk { display: none; } }
/* Tickets headline a touch larger on desktop. */
@media (min-width: 768px) { .gnm-christmas .screen.screen--tickets h2.display-2.ticket-head, .gnm-christmas .screen.screen--tickets .photo-split__copy h2.display-2.ticket-head { font-size: 5.6vw; } }
/* Desktop, Location: a much bigger map beside the copy. */
@media (min-width: 821px) {
  .gnm-christmas .screen--dir-stack .dir-page .split2 { width: min(100%, 1480px); grid-template-columns: minmax(0, .85fr) minmax(0, 1.25fr); gap: clamp(2rem, 4vw, 4.5rem); }
  .js .gnm-christmas .screen-track .screen--dir-stack .dir-page .split2 .map-frame { height: min(74vh, 52rem); }
  .js .gnm-christmas .screen-track .screen--dir-stack #getting-here.dir-page { padding-inline: clamp(1.5rem, 7vw, 8rem); }
}
/* Desktop, Date card: sized to its content, one even vertical rhythm, the closed tag centred on the line. */
@media (min-width: 768px) {
  .gnm-christmas .screen--knit .knit-card { width: fit-content; max-width: min(100%, 46rem); padding: clamp(2rem, 3.4vw, 3.25rem); }
  .gnm-christmas .screen--knit .knit-card .display-2 { white-space: nowrap; }
  .gnm-christmas .screen--knit .knit-card .lede { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem .9rem; margin-top: 1.1rem; }
  .gnm-christmas .screen--knit .knit-card .lede .closed-pill { margin: 0; }
  .gnm-christmas .statement.knit-card > .quiet-row { margin-top: 1.1rem; }
  .gnm-christmas .screen--knit .knit-card .actions { margin-top: 1.9rem; }
}

/* Date: Mr Christmas and his snowy floor sit a little higher on wide screens. */
@media (min-aspect-ratio: 1/1) and (min-width: 768px) { .gnm-christmas .screen--knit .mr-christmas { bottom: 19vh; } }

/* Date: Remind me is the yellow call to action; cream on rollover. */
.gnm-christmas #date .pill[data-remind] { background: var(--xm-gold); border-color: var(--xm-gold); color: var(--xm-ink); }
.gnm-christmas #date .pill[data-remind] strong { color: inherit; }
@media (hover: hover) {
  .gnm-christmas #date .pill[data-remind]:hover,
  .gnm-christmas #date .pill[data-remind]:focus-visible {
    background: var(--xm-cream);
    border-color: var(--xm-cream);
    color: var(--xm-ink);
  }
}

/* Closed days: a softer dark green tag instead of red. */
.gnm-christmas .closed-pill { background: var(--xm-green); color: var(--xm-cream); }

/* Brands picker: clear gaps between the category buttons, text starting at the same height in each. */
.gnm-christmas .cards--pick { gap: .75rem; }
.gnm-christmas .cards--pick .card { justify-content: flex-start; align-content: start; }

/* Brands headlines at 5.6vw on wider screens (phones keep their own sizes). */
@media (min-width: 768px) { .gnm-christmas .screen--concept .display-2, .gnm-christmas .screen--concept .display-2.brands-head { font-size: 4.7vw; } }


/* Candy cane leans against the end of "Get your tickets." */
.gnm-christmas .ticket-head .nowrap { white-space: nowrap; }
.gnm-christmas .ticket-head .candy-cane { position: static; display: inline-block; height: 1.45em; width: auto; margin: 0 0 -.12em .12em; vertical-align: baseline; transform: rotate(12deg); transform-origin: 50% 100%; border-radius: 0; filter: drop-shadow(0 6px 12px rgba(0, 0, 0, .35)); pointer-events: none; }
.gnm-christmas .ticket-head .nowrap { position: relative; }
.gnm-christmas .ticket-head .nowrap .candy-cane { position: absolute; left: 100%; bottom: .02em; height: 1.3em; margin: 0 0 0 .1em; }
@media (max-width: 767px) { .gnm-christmas .ticket-head { position: relative; } .gnm-christmas .ticket-head .nowrap { position: static; } .gnm-christmas .ticket-head .nowrap .candy-cane { left: auto; right: 1.4em; bottom: auto; top: -.15em; height: 1.25em; margin: 0; } }

/* Date: lift Mr Christmas and his floor on wide screens. */
@media (min-aspect-ratio: 1/1) and (min-width: 768px) { .gnm-christmas .screen--knit .mr-christmas { margin-top: -6vh; } }

/* Date card: generous 5.25rem padding on wide screens; the card widens so the one-line headline keeps it on the right too. */
@media (min-width: 1024px) and (min-aspect-ratio: 1/1) { .gnm-christmas .screen--knit .knit-card { padding: 5.25rem; max-width: none; } }
@media (min-width: 1024px) and (min-aspect-ratio: 1/1) { .gnm-christmas .screen--knit .mr-christmas { right: calc(14vw + 2rem); } }

/* Date card: hours as a gold second headline line; no slash before the welcome line. */
.gnm-christmas .knit-card .display-2 .accent { display: block; color: var(--xm-gold); }
.gnm-christmas .knit-card .quiet-row li::before { content: none; }

/* Every snow layer fills its whole screen, whatever the page layout does to its other children. */
.gnm-christmas .snow-settle { position: absolute !important; inset: 0 !important; width: auto !important; height: auto !important; margin: 0 !important; max-width: none !important; transform: none !important; }

/* Baubles hang over the Brands "who we look for" page. */
.gnm-christmas #looking-for { position: relative; }
@media (min-width: 768px) { .gnm-christmas #looking-for .display-2 { font-size: 4.4vw; } }
.gnm-christmas .baubles-hang { position: absolute; top: calc(var(--xm-nav-h) - .5rem); right: 4vw; width: clamp(150px, 21vw, 340px); height: auto; pointer-events: none; z-index: 1; filter: drop-shadow(0 10px 18px rgba(0, 0, 0, .25)); }
.gnm-christmas .screen--contact { position: relative; }
@media (max-width: 767px) {
  .gnm-christmas .baubles-hang { width: 36vw; right: 4vw; top: calc(var(--xm-nav-h) - .25rem); }
  .gnm-christmas .screen--stack #looking-for { padding-top: calc(var(--xm-nav-h) + 7rem); }
}
.gnm-christmas .label-hang { position:absolute; top:calc(var(--xm-nav-h) - .25rem); right:4vw; width:clamp(160px,18vw,300px); height:auto; pointer-events:none; z-index:2; transform:rotate(-6deg); filter:drop-shadow(0 12px 20px rgba(0,0,0,.3)); }
.gnm-christmas .screen--date-stack .screen--closing > .baubles-hang--closing { position:absolute; margin:0; top:calc(var(--xm-nav-h) - .5rem); right:4vw; z-index:1; }
@media (max-width:767px){ .gnm-christmas .label-hang{width:38vw;right:3vw;top:calc(var(--xm-nav-h) + .5rem);} .gnm-christmas .screen--date-stack .screen--closing > .baubles-hang--closing{width:36vw;} }
/* Footer call to action: headline, buttons, credit and links share the page's left edge. */
.gnm-christmas footer .footer-cta, .gnm-christmas footer .footer-cta + div, .gnm-christmas footer .footer-cta + div > div { text-align:left; align-items:flex-start; justify-content:flex-start; }
.gnm-christmas footer .footer-cta .footer-cta__actions { justify-content:flex-start; margin-left:0; }
.gnm-christmas footer .footer-cta + div > div:last-child { width:100%; }
/* Vendor page: stall types, one card per space with a small illustration. */
.gnm-christmas .stack-page--stalls { background: var(--xm-b-solid); color: var(--xm-cream); text-align: left; align-items: flex-start; }
/* Stalls: full viewport; cards up top, See rates pinned to the foot — no dead band mid-page. */
.gnm-christmas .screen--vendor-stack .screen-inner.brands-stack { scroll-snap-type: y proximity; }
.gnm-christmas .screen--vendor-stack .stack-page--stalls {
  justify-content: flex-start;
  min-height: 100%;
  min-height: 100svh;
  padding-bottom: clamp(2rem, 4vh, 3rem);
  box-sizing: border-box;
}
.gnm-christmas .screen--vendor-stack .stack-page--stalls > .actions {
  margin-top: auto;
  padding-top: 1.5rem;
}
.gnm-christmas .stack-page--stalls > .display-2 {
  font-size: clamp(1.7rem, 3.2vw, 3.4rem);
  margin-bottom: .35rem;
}
.gnm-christmas .stack-page--stalls .stalls__grid { display:grid; grid-template-columns:minmax(0,1fr); gap:1rem; margin-top:2.75rem; width:100%; }
@media (min-width:640px){ .gnm-christmas .stack-page--stalls .stalls__grid{grid-template-columns:repeat(2,minmax(0,1fr));} }
@media (min-width:1200px){ .gnm-christmas .stack-page--stalls .stalls__grid{grid-template-columns:repeat(5,minmax(0,1fr));} }
.gnm-christmas .stack-page--stalls .stall { background:rgba(0,0,0,.12); padding:0 0 1.2rem; display:flex; flex-direction:column; text-align:left; }
.gnm-christmas .stack-page--stalls .stall__art { background:#0a3a22; padding:.7rem; aspect-ratio:240/170; }
.gnm-christmas .stack-page--stalls .stall > :not(.stall__art) { padding:0 1.1rem; }
.gnm-christmas .stack-page--stalls .stall__art svg { width:100%; height:100%; display:block; }
.gnm-christmas .stack-page--stalls .stall__name { font-family:Garet,"Outfit",sans-serif; text-transform:uppercase; font-size:1.3rem; line-height:1; margin:1.1rem 0 .5rem; color:var(--xm-gold); }
.gnm-christmas .stack-page--stalls .stall__copy { font-size:1.05rem; line-height:1.45; margin:0; flex:1; max-width:none; }
.gnm-christmas .stack-page--stalls .stall__price { display:flex; flex-direction:column; gap:.25rem; margin:1rem 0 0; font-size:1rem; }
.gnm-christmas .stack-page--stalls .stall__price b { font-weight:700; }
.gnm-christmas .stack-page--stalls .actions { margin-top:2rem; }
/* Phone: pack all five stalls into one screen — 2-col, smaller art, tight type. */
@media (max-width: 639px) {
  .gnm-christmas .screen--vendor-stack .stack-page--stalls {
    padding: calc(var(--xm-nav-h) + .45rem) 1rem .75rem;
  }
  .gnm-christmas .stack-page--stalls > .eyebrow { display: none; }
  .gnm-christmas .stack-page--stalls > .display-2 {
    font-size: clamp(1.2rem, 5.2vw, 1.45rem);
    margin: 0;
  }
  .gnm-christmas .stack-page--stalls .stalls__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .4rem;
    margin-top: 1.15rem;
  }
  .gnm-christmas .stack-page--stalls .stall { padding-bottom: .45rem; }
  .gnm-christmas .stack-page--stalls .stall__art {
    padding: .2rem;
    aspect-ratio: 240/78;
    display: flex;
    align-items: center;
    justify-content: center;
  }
  .gnm-christmas .stack-page--stalls .stall__art svg { width: 82%; height: 82%; }
  .gnm-christmas .stack-page--stalls .stall > :not(.stall__art) { padding: 0 .5rem; }
  .gnm-christmas .stack-page--stalls .stall__name { font-size: .88rem; margin: .35rem 0 .12rem; }
  .gnm-christmas .stack-page--stalls .stall__copy { font-size: .68rem; line-height: 1.22; }
  .gnm-christmas .stack-page--stalls .stall__price { margin-top: .22rem; font-size: .68rem; gap: 0; }
  .gnm-christmas .screen--vendor-stack .stack-page--stalls > .actions {
    margin-top: auto;
    padding-top: .45rem;
    width: 100%;
    align-self: stretch;
  }
  .gnm-christmas .stack-page--stalls .actions .pill {
    min-width: 0;
    width: 100%;
    max-width: none;
    min-height: 2.75rem;
  }
}
/* Vendor rates: the Apply now button sits further below the note and is yellow. */
.gnm-christmas .stack-page--rates .split2__copy .actions { margin-top: 2.8rem; }
.gnm-christmas .stack-page--rates .split2__copy .pill--gold, .gnm-christmas .stack-page--rates .split2__copy .pill--gold strong { background: var(--xm-gold); color: var(--xm-ink); }
.gnm-christmas .stack-page--rates .split2__copy .pill--gold strong { background: none; color: inherit; }
/* Buttons in a page's action row are wider, with the label centred. */
.gnm-christmas .actions .pill { min-width: clamp(11rem, 15vw, 15rem); justify-content: center; text-align: center; }
/* Stall types: See rates is yellow. */
.gnm-christmas .stack-page--stalls .actions .pill--gold, .gnm-christmas .stack-page--stalls .actions .pill--gold strong { background: var(--xm-gold); color: var(--xm-ink); }
.gnm-christmas .stack-page--stalls .actions .pill--gold strong { background: none; color: inherit; }
.gnm-christmas .screen--concept::before { background: linear-gradient(0deg, rgba(0, 0, 0, .48) 0%, rgba(0, 0, 0, .28) 30%, rgba(0, 0, 0, .1) 55%, transparent 72%), linear-gradient(90deg, rgba(20, 12, 6, .3) 0%, rgba(20, 12, 6, .12) 45%, transparent 62%); }
.gnm-christmas .screen--contact .screen-inner > h1.display-2 + * { margin-top: 2.75rem; }
.gnm-christmas .screen--contact .screen-inner > .lede { max-width: none; min-width: min(100%, 62rem); }
.gnm-christmas .screen--contact .screen-inner > .legal-foot { margin-top: 2rem; font-size: .78rem; letter-spacing: .08em; text-transform: uppercase; font-weight: 700; }
.gnm-christmas .screen--contact .screen-inner > .legal-foot a { color: rgba(255,255,255,.72); text-decoration: none; }
.gnm-christmas .screen--contact .screen-inner > .legal-foot a:hover { color: var(--xm-gold); }
/* Visit hero: a glass bauble hangs just over the top right corner of the headline. */
.js .gnm-christmas .screen-track > .screen > .screen-inner:has(.label-wrap) { overflow: visible; }
.gnm-christmas .label-wrap { position: relative; display: inline-block; max-width: 100%; }
.gnm-christmas .label-wrap .label-hang { position: absolute; top: auto; bottom: calc(100% - 2.2rem); right: -3.5rem; left: auto; width: clamp(110px, 10vw, 170px); max-width: none; z-index: 2; transform: rotate(8deg); filter: drop-shadow(0 10px 16px rgba(0,0,0,.25)); }
@media (max-width: 767px) { .gnm-christmas .label-wrap .label-hang { right: -.25rem; bottom: calc(100% - 1rem); width: 24vw; } }
.gnm-christmas .map-frame { background: transparent; padding: 0; border: 0; box-shadow: none; }
/* Visit hero: hanging stockings replace the glass bauble; a touch wider, less tilt. */
.gnm-christmas .label-wrap .label-hang { width: clamp(130px, 12vw, 200px); right: -4rem; bottom: calc(100% - 2.6rem); transform: rotate(4deg); }
@media (max-width: 767px) { .gnm-christmas .label-wrap .label-hang { right: -.25rem; bottom: calc(100% - 1rem); width: 28vw; } }
/* Location: Google map fills the whole page; the copy sits on top in a green box. */
.gnm-christmas #directions .dir-page { min-height: 100%; box-sizing: border-box; }
.gnm-christmas #directions .dir-page .map-frame { position: absolute; inset: 0; width: auto; height: auto; max-width: none; margin: 0; padding: 0; z-index: 0; }
.gnm-christmas #directions .dir-page .map-frame iframe { width: 100%; height: 100%; border: 0; display: block; }
.gnm-christmas #directions .dir-page .split2 { position: static; display: flex; flex: 1 1 auto; flex-direction: column; justify-content: center; align-items: flex-end; min-height: 100%; }
.gnm-christmas #directions .dir-page .split2__copy { position: relative; z-index: 1; background: var(--xm-green, #173d2a); padding: clamp(1.5rem, 3vw, 2.75rem); max-width: 44rem; margin-right: auto; box-sizing: border-box; box-shadow: 0 18px 40px rgba(0,0,0,.3); }
/* Directions: Google's own "Open in Maps" chip sits top-left inside the embed and cannot be styled,
   so the map crops its top edge away; directions links live in the location card. */
.gnm-christmas #directions .map-frame { position: relative; overflow: hidden; }
.gnm-christmas #directions .dir-page .map-frame iframe { margin-top: -200px; height: calc(100% + 200px); width: calc(100% + clamp(6rem, 16vw, 18rem)); }
.gnm-christmas #directions .dir-page .split2__copy > :last-child { margin-bottom: 0; }
.gnm-christmas #directions .lbl-short { display: none; }
@media (max-width: 767px) {
  .gnm-christmas #directions .dir-page .split2 { display: flex; flex-direction: column; justify-content: flex-end; align-items: stretch; min-height: 100%; padding-bottom: var(--xm-gutter); }
  .gnm-christmas #directions .dir-page .split2__copy { max-width: none; width: 100%; padding: 1.25rem; }
  .gnm-christmas #directions .dir-page .split2__copy .lede { margin-top: .8rem; }
  .gnm-christmas #directions .dir-page .split2__copy .actions { margin-top: 1.1rem; gap: .5rem; }
  /* Phone: short labels so both pills fit the green card. */
  .gnm-christmas #directions .lbl-full { display: none; }
  .gnm-christmas #directions .lbl-short { display: inline; }
  .gnm-christmas #directions .actions .pill { min-width: 0; padding-inline: .7rem; }
}
.js .gnm-christmas .screen-track #directions .dir-page .split2 .map-frame { position: absolute; inset: 0; width: auto; height: auto; margin: 0; order: 0; }
/* Maps: dragging never selects the map, so no tinted selection overlay. */
.gnm-christmas .map-frame { user-select: none; -webkit-user-select: none; -webkit-user-drag: none; -webkit-tap-highlight-color: transparent; }
.gnm-christmas .map-frame::selection, .gnm-christmas .map-frame *::selection { background: transparent; }
/* Short laptop screens: the hero headline shrinks with screen height so the buttons are never clipped. */
@media (min-width: 768px) and (max-height: 820px) { .gnm-christmas .screen--hero h1.display-2 { font-size: min(5.6vw, 8.4vh); } }
@media (min-width: 768px) and (max-height: 680px) { .gnm-christmas .screen--hero h1.display-2 { font-size: min(5.6vw, 6.4vh); } .gnm-christmas .screen--hero .lede--hero { margin-top: .8rem; } }
/* Brand picker: a chosen card keeps its dark fill and outline on hover, so its text stays readable. */
.gnm-christmas .screen--gold .cards--pick .card[aria-pressed="true"], .gnm-christmas .screen--gold .cards--pick .card[aria-pressed="true"]:hover { background-color: var(--xm-ink); border-color: var(--xm-ink); }
.gnm-christmas .screen--gold .cards--pick .card[aria-pressed="true"]:hover { background-color: #3a2e2e; }
/* Block42 logo: white mark on the venue photo and on the green directions card. */
.gnm-christmas .block42-logo { display: block; width: clamp(88px, 9vw, 150px); height: auto; border-radius: 0; }
.gnm-christmas .screen--venue-stack .venue-cap > .block42-logo { margin-top: 2.4rem; }
@media (min-width: 1200px) { .gnm-christmas .screen--venue-stack .venue-cap > .block42-logo { position: absolute; right: 0; bottom: 0; margin: 0; } }
.gnm-christmas #directions .split2__copy > .block42-logo--card { width: clamp(76px, 6vw, 92px); }
.gnm-christmas #directions .split2__copy > .block42-logo--card + * { margin-top: 2rem; }

/* Directions card: smaller Block42 mark, roomier green box, venue pin nudged right of the card. */
.gnm-christmas #directions .split2__copy > .block42-logo--card { width: clamp(56px, 4.2vw, 68px); }
.gnm-christmas #directions .dir-page .split2__copy { padding: clamp(2.25rem, 4.5vw, 4rem); }
@media (min-width: 768px) {
  .gnm-christmas #directions .dir-page .map-frame { overflow: hidden; }
  .gnm-christmas #directions .dir-page .map-frame iframe { width: 124%; max-width: none; }
}

/* Vendor applications: the closing date is the headline detail, so it carries more weight on its own line. */
.gnm-christmas .screen-inner > .close-note--lg { font-size: clamp(1.15rem, 1.7vw, 1.5rem); letter-spacing: .03em; }
/* Venue dates: the date and opening hours wrap to two lines on smaller screens, so they need room to breathe. */
.gnm-christmas .dates-head { line-height: 1.05; }
/* Venue: the Nuanu "Find out more" call to action is yellow. */
.gnm-christmas .screen--venue-stack .stack-page--nuanu .pill--gold { background: var(--xm-gold); color: var(--xm-ink); }
/* Vendor rates and stalls: the yellow buttons need the same rollover the gold screens use. */
.gnm-christmas .stack-page--rates .split2__copy .pill--gold:hover, .gnm-christmas .stack-page--stalls .pill--gold:hover { background: var(--xm-ink); color: var(--xm-cream); }

/* Date page: what the market is, in four words. */
.gnm-christmas .knit-tagline { margin: 1.2rem 0 0; font-size: clamp(.95rem, 1.5vw, 1.25rem); font-weight: 800; letter-spacing: .16em; text-transform: uppercase; color: var(--xm-gold); }

/* Interface polish: crisper text, balanced headings, snappy press feedback, bigger tap targets. */
.gnm-public { -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }
.gnm-christmas :is(.display-2, .hero-date, .lede) { text-wrap: balance; }
.gnm-christmas .pill:active,
.gnm-christmas .sticky-nav .nav-flat:active,
.gnm-christmas #mobile-menu a:active { transform: scale(.96); transition-duration: .12s; }
.gnm-christmas .pill:focus-visible,
.gnm-christmas .sticky-nav a:focus-visible,
.gnm-christmas .mobile-menu-toggle:focus-visible,
.gnm-christmas #mobile-menu a:focus-visible { outline: 2px solid currentColor; outline-offset: 3px; }
@media (max-width: 767px) { .gnm-christmas .mobile-menu-toggle { min-width: 44px; min-height: 44px; display: grid; place-items: center; } }

/* Give the larger early-bird figures room beside the introduction. */
.gnm-christmas .stack-page--rates .split2 { width: min(100%, 1480px); }
@media (min-width: 821px) {
  .gnm-christmas .stack-page--rates .split2 { grid-template-columns: minmax(0, .8fr) minmax(0, 1.3fr); gap: clamp(2rem, 4vw, 4rem); }
}
.gnm-christmas .stack-page--rates .package-table tbody th { white-space: normal; }
.gnm-christmas .stack-page--rates .package-table :is(th, td) { padding-inline: .65rem; }
@media (max-width: 560px) {
  .gnm-christmas .package-table b.deal { font-size: 1.2em; white-space: nowrap; }
  .gnm-christmas .stack-page--rates .package-table :is(th, td) { padding-inline: .35rem; }
}

/* Rates remain readable and scrollable on short screens. */
.gnm-christmas .screen--vendor-stack .brands-stack { scrollbar-width: thin; scrollbar-color: var(--xm-gold) transparent; }
.gnm-christmas .screen--vendor-stack .brands-stack::-webkit-scrollbar { display: block; width: 5px; }
.gnm-christmas .screen--vendor-stack .brands-stack::-webkit-scrollbar-thumb { background: var(--xm-gold); }
@media (min-width: 821px) and (max-height: 800px) {
  .gnm-christmas .screen--vendor-stack .stack-page--rates { justify-content: flex-start; padding-bottom: 2rem; }
  .gnm-christmas .stack-page--rates .package-table :is(th, td) { padding-block: .65rem; }
}
.gnm-christmas .pill strong { color: inherit; }
.gnm-christmas :is(.stack-page--rates, .stack-page--stalls) .pill--gold:is(:hover, :focus-visible, :active) { background: var(--xm-ink); color: var(--xm-cream); }
.gnm-christmas .pill:active { transform: none; transition: background-color .1s ease-out, color .1s ease-out; }

/* The final invitation pairs the market's green with one oversized candy cane. */
.gnm-christmas footer.footer--closing { position: relative; background: var(--xm-b-solid) url("../img/christmas_tree_editorial_3048px.png") center / cover no-repeat; overflow-y: auto; }
.gnm-christmas footer.footer--closing::before { content: ""; position: absolute; inset: 0; background: linear-gradient(0deg, rgba(0,0,0,.82) 0%, rgba(0,0,0,.55) 28%, rgba(0,0,0,.22) 52%, transparent 72%); pointer-events: none; }
.gnm-christmas footer.footer--closing > * { position: relative; z-index: 1; }
.gnm-christmas footer.footer--closing .footer-cta { position: relative; width: min(100%, 76rem); margin-inline: auto; text-align: left; padding-right: clamp(10rem, 22vw, 21rem); margin-bottom: 3rem; }
.gnm-christmas footer.footer--closing .display-2 { margin: 0; max-width: 12ch; }
.gnm-christmas footer.footer--closing .footer-cta__actions { display: flex; flex-wrap: nowrap; justify-content: flex-start; gap: .75rem; margin: 3.4rem 0 0; width: auto; }
.gnm-christmas footer.footer--closing .footer-cta__actions .pill { width: auto; flex: 0 0 auto; }
.gnm-christmas footer.footer--closing .pill--gold { background: var(--xm-gold); color: var(--xm-ink); }
.gnm-christmas footer.footer--closing .pill--gold:is(:hover, :focus-visible) { background: var(--xm-cream); color: var(--xm-ink); }
.gnm-christmas footer.footer--closing .footer-cta + div { width: min(100%, 76rem); margin-inline: auto; padding-top: 1.5rem; }
@media (max-width: 767px) {
  .gnm-christmas footer.footer--closing .footer-cta { padding-right: 0; padding-top: 5rem; }
  .gnm-christmas footer.footer--closing .footer-cta__actions { width: 100%; flex-wrap: nowrap; gap: .5rem; overflow-x: auto; }
  .gnm-christmas footer.footer--closing .pill { min-width: 0; padding-inline: .55rem; }
  .gnm-christmas footer.footer--closing .pill strong { white-space: nowrap; font-size: .85rem; }
}

/* Welcome date and venue share the same baseline and type size. */
.gnm-christmas .screen--hero .meta__dates { flex-direction: row; align-items: baseline; gap: .5rem; white-space: nowrap; }
.gnm-christmas .screen--hero .meta__dates > * { font-size: 1.5em; line-height: 1.1; white-space: nowrap; }
.gnm-christmas .screen--hero .meta__sep { opacity: .5; }
@media (max-width: 767px) {
  .gnm-christmas .screen--hero .meta--visit { font-size: clamp(.65rem, 2.4vw, 1rem); }
  .gnm-christmas .screen--hero .meta__dates { gap: .3rem; }
}

/* Button feedback stays in place and retargets smoothly between states. */
.gnm-christmas .pill { transition: background-color 320ms cubic-bezier(.4, 0, .2, 1), color 320ms cubic-bezier(.4, 0, .2, 1), box-shadow 320ms cubic-bezier(.4, 0, .2, 1); }
.gnm-christmas .pill strong { color: inherit; transition: none; }
.gnm-christmas .pill:active { transform: none; transition-duration: 100ms; }
.gnm-christmas .pill--outline:active,
.gnm-christmas .pill--ghost:active { background-color: var(--xm-cream); color: var(--xm-ink); }
.gnm-christmas .pill--gold:active,
.gnm-christmas .pill--light:active,
.gnm-christmas .pill--ink:active { background-color: var(--xm-ink); color: var(--xm-cream); }
.gnm-christmas :is(.stack-page--rates, .stack-page--stalls) .pill--gold:active { background-color: var(--xm-ink); color: var(--xm-cream); }
.gnm-christmas footer.footer--closing .pill--gold:active { background-color: var(--xm-cream); color: var(--xm-ink); }
@media (prefers-reduced-motion: reduce) {
  .gnm-christmas .pill, .gnm-christmas .pill:active { transition-duration: 0ms; }
}

/* Welcome copy wraps naturally while avoiding a lone final word. */
.gnm-christmas .screen--hero .lede--hero { text-wrap: pretty; }

/* Venue descriptions use the same natural paragraph wrapping as Welcome. */
.gnm-christmas .screen--venue-stack .lede { text-wrap: pretty; }

/* Brands: the closure note belongs beside the market dates. */
.gnm-christmas .screen--concept .meta__dates { flex-direction: row; align-items: center; flex-wrap: wrap; gap: .5rem 1rem; }
.gnm-christmas .screen--concept .meta__dates .closed-pill { margin-top: 0; white-space: nowrap; }

/* Welcome uses the deeper green from the site's existing palette. */
.gnm-christmas .screen.screen--hero { background: var(--xm-photo-solid); }

/* Welcome: ornament photo, no holly, whisper of black from the foot so cream copy still reads. */
.gnm-christmas .screen.screen--hero { background: var(--xm-photo-solid) url("../img/hanging_ornament.jpg") center / cover no-repeat; }
.gnm-christmas .screen.screen--hero::before { content: ""; position: absolute; inset: 0; z-index: 1; background: linear-gradient(0deg, rgba(0, 0, 0, .9) 0%, rgba(0, 0, 0, .66) 28%, rgba(0, 0, 0, .26) 52%, transparent 78%); }
.gnm-christmas .screen--hero > .holly { display: none; }
/* Phone: pull figure left, drop holly, cream foot veil + dark copy. */
@media (max-width: 767px) {
  .gnm-christmas .screen.screen--hero { background-position: 72% center; }
  .gnm-christmas .screen--hero > .holly { display: none; }
  .gnm-christmas .screen.screen--hero::before {
    background: linear-gradient(0deg, rgba(250, 243, 220, .98) 0%, rgba(250, 243, 220, .9) 34%, rgba(250, 243, 220, .5) 60%, transparent 84%);
  }
  .gnm-christmas .screen--hero .display-2,
  .gnm-christmas .screen--hero .hero-static,
  .gnm-christmas .screen--hero .lede,
  .gnm-christmas .screen--hero .meta,
  .gnm-christmas .screen--hero .meta__dates,
  .gnm-christmas .screen--hero h1 .hero-date {
    color: var(--xm-ink);
  }
  /* Light walk ends on cream desktop — on cream veil that vanishes; land on green instead. */
  .gnm-christmas .screen--hero .swap__b .xm-l3 {
    animation: xm-to-green .7s ease-in-out 6.7s 1 both;
    color: var(--xm-green);
  }
  .gnm-christmas .screen--hero .pill--outline {
    color: var(--xm-ink);
    box-shadow: inset 0 0 0 2px var(--xm-ink);
  }
  .gnm-christmas .screen--hero .pill--outline:hover {
    background: var(--xm-ink);
    color: var(--xm-cream);
  }
}
@keyframes xm-to-green { from { color: var(--xm-gold); } to { color: var(--xm-green); } }

/* Film grain on every photograph — noise.png tile (SVG filters unreliable across browsers). */
.gnm-christmas { --xm-noise: url("../img/noise.png"); }
.gnm-christmas .screen--photo > picture {
  position: absolute;
  inset: 0;
  z-index: 0;
  display: block;
  overflow: hidden;
}
.gnm-christmas .screen--photo > picture::after,
.gnm-christmas .stack-page__bg::before,
.gnm-christmas .screen.screen--hero::after,
.gnm-christmas .screen--contact::after,
.gnm-christmas .screen--concept::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  background: var(--xm-noise) center / 180px 180px repeat;
  opacity: .07;
  mix-blend-mode: soft-light;
}
/* Concept previously cleared ::after — grain uses it now. */
.gnm-christmas .screen--concept::after { background: var(--xm-noise) center / 180px 180px repeat; box-shadow: none; }
/* Venue Nuanu stack: grain under the existing veil (::after stays the gradient). */
.gnm-christmas .screen--venue-stack .stack-page__bg { position: absolute; inset: 0; z-index: -1; }
.gnm-christmas .screen--venue-stack .stack-page__bg::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  background: var(--xm-noise) center / 180px 180px repeat;
  opacity: .07;
  mix-blend-mode: soft-light;
}
/* Vendor: light grain only on the opening photo screen. */
.page--photo-bg::before {
  background: url("../img/presents.png") center / cover no-repeat;
}
/* Phone: pull the presents figure left into frame (cover was cropping her off-screen). */
@media (max-width: 767px) {
  .page--photo-bg::before { background-position: 72% center; }
}
.page--photo-bg .screen-track > .screen:first-child::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  background: var(--xm-noise) center / 180px 180px repeat;
  opacity: .07;
  mix-blend-mode: soft-light;
}

.gnm-christmas .brand-label-mobile { display: none; }
@media (max-width: 767px) {
  .gnm-christmas .brand-label-desktop { display: none; }
  .gnm-christmas .brand-label-mobile { display: inline; }
}

/* On phones the bunny sits below the date card instead of over its actions. */
@media (max-width: 767px) {
  .gnm-christmas .screen--knit .knit-page > .mr-christmas { grid-area: 2 / 1; margin: -2rem -.25rem 0 0; }
}

/* Tablets keep a left-aligned menu bar and an inset date card. */
@media (min-width: 768px) and (max-width: 1180px) {
  .gnm-christmas .sticky-nav > div.nav--flat { justify-content: flex-start; }
  .gnm-christmas .sticky-nav > div.nav--flat > a { display: none; }
  .gnm-christmas .sticky-nav > div.nav--flat > .md\:flex { display: flex; justify-content: flex-start; max-width: 100%; width: 100%; }
  .gnm-christmas .sticky-nav button.md\:hidden { display: none; }
  .gnm-christmas .screen--date-stack .knit-page > .knit-card { width: min(100%, 36rem); max-width: calc(100% - 3rem); margin-inline: auto; padding: 2.5rem; }
}

/* Small portrait tablets need more breathing room at the page edges. */
@media (min-width: 768px) and (max-width: 834px) and (max-aspect-ratio: 1/1) {
  .gnm-christmas:not(.apply-ui) .screen--stack .stack-page:not(.screen--map) { padding-inline: 2rem; }
}

.gnm-christmas .sticky-nav .nav-label-tablet { display: none; }
@media (min-width: 768px) and (max-width: 1180px) {
  .gnm-christmas .sticky-nav .nav-label-full { display: none; }
  .gnm-christmas .sticky-nav .nav-label-tablet { display: inline; }
}

@media (min-width: 768px) and (max-width: 1180px) {
  .gnm-christmas .sticky-nav > div.nav--flat > .md\:flex > a:nth-last-child(2):has(.nav-label-tablet) { margin-left: auto; }
}

/* Tablet navigation actions stay compact beside the page links. */
@media (min-width: 768px) and (max-width: 1180px) {
  .gnm-christmas .sticky-nav a:has(.nav-label-tablet) { padding: .45rem .85rem; min-height: 36px; display: inline-flex; align-items: center; font-size: 10px; letter-spacing: .04em; line-height: 1.2; }
}

/* iPad mini: bring the portrait into frame and keep the corner clear. */
@media (min-width: 768px) and (max-width: 834px) and (max-aspect-ratio: 1/1) {
  .gnm-christmas .screen.screen--hero { background-position: 72% center; }
  .gnm-christmas .screen--hero > .holly { display: none; }
}

/* Small tablets: fit the navigation and both actions on one line. */
@media (min-width: 768px) and (max-width: 1180px) {
  .gnm-christmas .sticky-nav > div.nav--flat > .md\:flex { column-gap: .6rem; flex-wrap: nowrap; }
  .gnm-christmas .sticky-nav .nav-flat { font-size: 9px; letter-spacing: .02em; flex-shrink: 0; }
  .gnm-christmas .sticky-nav a:has(.nav-label-tablet) { padding: .35rem .6rem; min-height: 30px; font-size: 9px; letter-spacing: .02em; flex-shrink: 0; }
}

/* Every public screen uses one horizontal content gutter. Stacks own it once. */
.gnm-christmas:not(.apply-ui) .screen { padding-inline: var(--xm-gutter); }
.js .gnm-christmas:not(.apply-ui) .screen-track > .screen--stack { padding-inline: 0; }
.gnm-christmas:not(.apply-ui) .screen--stack .stack-page:not(.screen--map),
.js .gnm-christmas:not(.apply-ui) .screen-track .screen--dir-stack #getting-here.dir-page { padding-inline: var(--xm-gutter); }
.gnm-christmas:not(.apply-ui) .screen--stack .stack-page > .photo-feature__caption,
.gnm-christmas:not(.apply-ui) .screen--stack .stack-page > .venue-cap { padding-inline: 0; }

/* Portrait tablets: the ticket calendar must fit inside both page gutters. */
@media (min-width: 768px) and (max-width: 834px) and (max-aspect-ratio: 1/1) {
  .js .gnm-christmas .screen-track > .screen--tickets > .photo-split { width: 100%; max-width: 100%; min-width: 0; grid-template-columns: minmax(0, 1fr); margin-inline: 0; box-sizing: border-box; }
  .gnm-christmas .screen--tickets .photo-split__copy,
  .gnm-christmas .screen--tickets .photo-split__cal { min-width: 0; width: 100%; max-width: 100%; }
  .gnm-christmas .screen--tickets .photo-split__cal .xm-cal { width: 100%; max-width: 100%; min-width: 0; box-sizing: border-box; }
}

/* iPad mini: shift the vendor photograph left within its frame. */
@media (min-width: 768px) and (max-width: 834px) and (max-aspect-ratio: 1/1) {
  .gnm-christmas.page--photo-bg::before { background-position: 72% center; }
}

/* Tablet closing actions fit the content width instead of running off screen. */
@media (min-width: 768px) and (max-width: 1180px) {
  .gnm-christmas footer .footer-cta .footer-cta__actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); width: 100%; max-width: 38rem; gap: .75rem; overflow: visible; }
  .gnm-christmas footer .footer-cta .footer-cta__actions .pill { width: 100%; min-width: 0; box-sizing: border-box; padding-inline: .8rem; }
  .gnm-christmas footer .footer-cta .footer-cta__actions .pill strong { white-space: normal; }
}

/* Over the light Welcome photograph, navigation recedes into the image. */
html.on-first-screen .gnm-christmas:has(.screen--hero) .sticky-nav { background: rgba(12,42,32,.28); box-shadow: none; backdrop-filter: blur(5px); -webkit-backdrop-filter: blur(5px); }
html.on-first-screen .gnm-christmas:has(.screen--hero) .sticky-nav .nav-flat,
html.on-first-screen .gnm-christmas:has(.screen--hero) .sticky-nav > div > a,
html.on-first-screen .gnm-christmas:has(.screen--hero) .mobile-menu-toggle { color: var(--xm-cream, #faf3dc); opacity: 1; }
html.on-first-screen .gnm-christmas:has(.screen--hero) .sticky-nav .nav-flat:is(.is-current, :hover) { color: var(--xm-gold, #f5d04e); }
html.on-first-screen .gnm-christmas:has(.screen--hero) .sticky-nav a[href^="https://canva.link"] { color: var(--xm-cream, #faf3dc); border-color: var(--xm-cream, #faf3dc); }