/* ═══════════════════════════════════════════════════════════════════
   OS-SITE — page-composition layer on top of os-kit.css.
   Shared by index.html (home) and the city template (sydney.html).
   Colours: kit tokens ONLY.
   ══════════════════════════════════════════════════════════════════ */

/* Nothing may push the page sideways: the carousel track and the hero rig both
   bleed past the viewport by design, and the page was scrolling 102px to the
   right because of it. On the root so the clip reaches the whole viewport —
   on body alone, absolutely-positioned descendants escape it.
   `clip`, never `hidden`: hidden makes a scroll container and kills every
   sticky element on the page (the nav, the pinned hero, the FAQ rail). */
html, body { overflow-x: clip; }

body { margin: 0; background: var(--k-void); color: var(--k-cream);
  font-family: var(--k-mono); -webkit-font-smoothing: antialiased; }

/* ── UNIFIED SITE BACKDROP ──────────────────────────────────────────
   One continuous, quietly-alive ground under every page so sections
   stop reading as separate blocks. Two fixed full-viewport layers,
   both pointer-transparent, both behind all content (z-index -1;
   --k-void propagates from body to the canvas, so they still show):
   · body::before — static: faint 64px blueprint grid + a sparse
     deterministic speck field (pure CSS radial-gradients, no files,
     no runtime randomness; mismatched tile sizes de-grid the specks)
   · body::after  — alive: two huge soft colour washes (teal upper-
     left, red lower-right) drifting a few % over 60s, transform-only.
   Layers are oversized (inset -6%) so the drift never reveals edges;
   fixed elements don't extend the scrollable area, so no overflow. */
body::before, body::after { content: ""; position: fixed; inset: -6%;
  z-index: -1; pointer-events: none; }
body::before {
  background-image:
    radial-gradient(circle at 41px 37px,   rgba(236,229,216,.09) 0 1px, transparent 1.6px),
    radial-gradient(circle at 173px 122px, rgba(236,229,216,.06) 0 1px, transparent 1.6px),
    radial-gradient(circle at 262px 58px,  rgba(0,229,204,.08)   0 1px, transparent 1.6px),
    radial-gradient(circle at 97px 231px,  rgba(236,229,216,.05) 0 1px, transparent 1.6px),
    radial-gradient(circle at 224px 287px, rgba(232,72,63,.07)   0 1px, transparent 1.6px),
    radial-gradient(circle at 318px 176px, rgba(236,229,216,.07) 0 1px, transparent 1.6px),
    repeating-linear-gradient(0deg,  rgba(255,255,255,.012) 0 1px, transparent 1px 64px),
    repeating-linear-gradient(90deg, rgba(255,255,255,.012) 0 1px, transparent 1px 64px);
  background-size: 340px 340px, 420px 380px, 300px 460px, 460px 300px,
    380px 420px, 500px 360px, auto, auto; }
body::after {
  background-image:
    radial-gradient(55% 50% at 16% 12%, rgba(0,229,204,.05), transparent 70%),
    radial-gradient(62% 56% at 86% 90%, rgba(232,72,63,.05), transparent 72%);
  will-change: transform;
  animation: site-drift 60s ease-in-out infinite alternate; }
@keyframes site-drift {
  from { transform: translate3d(-1.2%, -0.8%, 0); }
  to   { transform: translate3d(1.2%, 1%, 0); } }
@media (prefers-reduced-motion: reduce) {
  body::after { animation: none; will-change: auto; } }
.wrap { max-width: 1500px; margin: 0 auto; padding-inline: clamp(20px, 4vw, 56px); }
section { padding-block: clamp(56px, 8vw, 110px); }
.sec-head { display: flex; flex-wrap: wrap; align-items: baseline; gap: 28px; margin-block-end: clamp(28px, 4vw, 48px); }
.sec-head .rule { flex: 1; block-size: 1px; background: var(--k-line); }
h2.k-display { font-size: clamp(38px, 5.4vw, 72px); margin: 0; }
.sec-tag { margin-block-end: 10px; }

/* ── NAV (NAV—02, composed) ─────────────────────────────────────── */
:root {
  --nav-h: 112px;             /* bar height at top of page */
  --nav-h-stuck: 84px;        /* compressed height once scrolled */
  --nav-pad-x: clamp(20px, 4vw, 56px);
  --dd-w: min(690px, calc(100vw - 48px));   /* panel width: rows + pixel column */
  --t-fast: 140ms;
  --t-med: 240ms;
  --t-slow: 380ms;
}

/* Scroll-up glitch fix: the nav box keeps a CONSTANT layout height (row + 1px
   rule) in both states, so the 86→64px compression never moves the page under
   the reader mid-scroll (a sticky bar's height participates in layout — the
   old height change re-fed the scroll threshold and flapped is-stuck).
   The visible bar is painted by .nav::before, which tracks the row's animated
   height; the empty strip under the compressed bar is click-transparent
   (pointer-events) so content beneath stays interactive. */
.nav { position: sticky; inset-block-start: 0; z-index: 200;
  block-size: calc(var(--nav-h) + 1px); pointer-events: none; }
.nav::before { content: ""; position: absolute; inset-block-start: 0; inset-inline: 0;
  z-index: -1; block-size: calc(var(--nav-h) + 1px); background: var(--k-void);
  transition: block-size var(--t-med) var(--k-ease),
    background var(--t-med) var(--k-ease), box-shadow var(--t-med) var(--k-ease); }
.nav > * { pointer-events: auto; }
/* nav scope sizes to border-box so min-block-size includes padding/border —
   keeps CTAs inside the 64px stuck bar */
.nav *, .nav *::before, .nav *::after { box-sizing: border-box; }
.nav__row { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center;
  gap: clamp(16px, 2.6vw, 48px); block-size: var(--nav-h);
  padding-inline: var(--nav-pad-x); max-width: 2000px; margin: 0 auto;
  transition: block-size var(--t-med) var(--k-ease); }
.brand { display: inline-flex; align-items: center; gap: 16px; text-decoration: none;
  min-height: 44px; justify-self: start; }
.brand__ring { inline-size: 40px; block-size: 40px; transition: transform var(--t-med) var(--k-ease); }
.brand__word { font-family: var(--k-display); font-size: clamp(22px, 2.2vw, 32px);
  color: var(--k-cream); text-transform: uppercase; line-height: 1; letter-spacing: .02em; }
.brand__word em { font-style: normal; color: var(--k-teal); }
.links { display: flex; align-items: center; gap: clamp(8px, 1.6vw, 34px); justify-self: center; }
.nav-dd { display: inline-flex; position: static; }
.link { font-weight: 700; font-size: 15px; letter-spacing: .17em; text-transform: uppercase;
  color: var(--k-cream); text-decoration: none; background: none; border: 0; cursor: pointer;
  padding: 12px 2px; min-block-size: 44px; display: inline-flex; align-items: center; gap: 9px;
  border-block-end: 2px solid transparent; font-family: var(--k-mono); }
.link:hover { color: var(--k-white); border-block-end-color: var(--k-line-strong); }
.link:focus-visible { outline: 2px solid var(--k-teal); outline-offset: 3px; }
.link .caret { transition: transform 180ms var(--k-ease), color 180ms var(--k-ease); color: var(--k-faint); }
.link:hover .caret { color: var(--k-cream); }
.link[aria-expanded="true"] { border-block-end-color: var(--k-red); color: var(--k-white); }
.link[aria-expanded="true"] .caret { transform: rotate(180deg); color: var(--k-red); }
.link[aria-current="page"], .link.link--here { border-block-end-color: var(--k-teal); }
.nav__acts { justify-self: end; display: inline-flex; align-items: center; gap: clamp(10px, 1.4vw, 18px); }
.cta-ghost {  /* GET TICKETS — outline sibling of .cta-nav */
  font-family: var(--k-mono); font-weight: 700; font-size: 13px; letter-spacing: .26em;
  text-transform: uppercase; color: var(--k-cream); text-decoration: none;
  border: 1px solid var(--k-line-strong); padding: 13px 22px; min-block-size: 46px;
  display: inline-flex; align-items: center;
  clip-path: polygon(0 0, calc(100% - 10px) 0, 100% 10px, 100% 100%, 0 100%);
  transition: border-color var(--t-fast) var(--k-ease), color var(--t-fast) var(--k-ease); }
.cta-ghost:hover { border-color: var(--k-teal); color: var(--k-white); }
.cta-ghost:focus-visible { outline: 2px solid var(--k-teal); outline-offset: 3px; }
.cta-nav { background: var(--k-red); color: var(--k-white); font-weight: 700; font-size: 13.5px;
  letter-spacing: .28em; text-transform: uppercase; padding: 15px 28px; text-decoration: none;
  min-block-size: 48px; display: inline-flex; align-items: center; font-family: var(--k-mono);
  clip-path: polygon(0 0, calc(100% - 10px) 0, 100% 10px, 100% 100%, 0 100%); }
.cta-nav:hover { filter: brightness(1.1); }
.cta-nav:focus-visible { outline: 2px solid var(--k-teal); outline-offset: 3px; }
.nav__rule { position: relative; block-size: 1px; background: var(--k-line-strong); }
.nav__rule::after { content: ""; position: absolute; inset: 0; background: var(--k-grad);
  opacity: 0; transition: opacity var(--t-med) var(--k-ease); }
.nav__meta { position: absolute; inset-block-start: 8px; inset-inline-end: clamp(20px, 4vw, 56px);
  display: flex; gap: 12px; align-items: center; color: var(--k-faint); font-size: 11px;
  letter-spacing: .28em; transition: opacity var(--t-fast) var(--k-ease); }
.nav__meta .ticks { display: inline-flex; gap: 5px; }
.nav__meta .ticks i { inline-size: 2px; block-size: 9px; background: var(--k-line-strong); }

/* scrolled state — visual chrome lives on ::before (the painted bar), which
   compresses in lockstep with the row while the nav box height stays put */
.nav.is-stuck::before { background: rgba(5, 5, 6, 0.82);            /* --k-void at 82% */
  -webkit-backdrop-filter: blur(14px) saturate(1.15);
  backdrop-filter: blur(14px) saturate(1.15);
  box-shadow: 0 18px 44px -22px rgba(0,0,0,.65);
  block-size: calc(var(--nav-h-stuck) + 1px); }
.nav.is-stuck .nav__row { block-size: var(--nav-h-stuck); }
.nav.is-stuck .brand__ring { transform: scale(.85); }
.nav.is-stuck .nav__rule::after { opacity: .8; }
.nav.is-stuck .nav__meta { opacity: 0; }

/* dropline connector — drawn from trigger, docks into the panel tick */
.dropline { position: absolute; inline-size: 1.5px; background: var(--k-red);
  inset-block-start: 0; display: none; pointer-events: none; z-index: 40; transform-origin: top; }
.nav.nav--dd-open .dropline { animation: dd-line-draw 160ms var(--k-ease) both; }
.dropline::after { content: ""; position: absolute; inset-block-end: -2px; inset-inline-start: -2.25px;
  inline-size: 6px; block-size: 6px; background: var(--k-red); }
@keyframes dd-line-draw { from { transform: scaleY(0); } to { transform: scaleY(1); } }

/* panel shell: header strip / (rows | pixel column) / footer strip.
   Anchors to the VISUAL bar bottom (--nav-h-live, set by navInit) — the nav
   box is layout-constant so 100% would overshoot in the stuck state. */
.dd-panel { position: absolute;
  inset-block-start: calc(var(--nav-h-live, calc(var(--nav-h) + 1px)) + 18px); z-index: 50;
  inline-size: var(--dd-w); background: var(--k-bg); border: 1px solid var(--k-line);
  clip-path: polygon(26px 0, 100% 0, 100% calc(100% - 26px),
                     calc(100% - 26px) 100%, 0 100%, 0 26px);
  display: none; grid-template-rows: auto 1fr auto;
  grid-template-columns: minmax(0, 1fr) auto;
  grid-template-areas: "head head" "rows px" "foot foot";
  filter: drop-shadow(0 30px 35px rgba(0,0,0,.55)); }
.nav-dd.is-open > .dd-panel { display: grid; animation: dd-panel-in var(--t-med) var(--k-ease) both; }
.dd-panel.is-closing { display: grid; animation: dd-panel-out 120ms var(--k-ease) both; pointer-events: none; }
@keyframes dd-panel-in { from { opacity: 0; transform: translateY(-10px); } to { opacity: 1; transform: none; } }
@keyframes dd-panel-out { from { opacity: 1; } to { opacity: 0; transform: translateY(-6px); } }
/* landing tick on the panel frame — JS sets --dd-anchor-x */
.dd-panel::before { content: ""; position: absolute; inset-block-start: -1px;
  inset-inline-start: calc(var(--dd-anchor-x, 50%) - 12px);
  inline-size: 24px; block-size: 2px; background: var(--k-red); z-index: 2; }

/* header strip */
.dd-head { grid-area: head; display: flex; align-items: center; gap: 16px;
  padding: 12px 22px 12px 34px;             /* 34px clears the top-left chamfer */
  border-block-end: 1px solid var(--k-line); }
.dd-head__code { font-size: 12px; font-weight: 600; letter-spacing: .32em; color: var(--k-teal); }
.dd-head__sep  { color: var(--k-faint); }
.dd-head__count{ font-size: 11px; letter-spacing: .3em; color: var(--k-faint); }
.dd-head .k-pixels { margin-inline-start: auto; }

/* rows column — column flex so rows share panel height evenly */
.dd-rows { grid-area: rows; list-style: none; margin: 0; padding: 4px 0;
  background-image: repeating-linear-gradient(90deg, rgba(255,255,255,.015) 0 1px, transparent 1px 7px); }
.dd-panel .dd-rows { display: flex; flex-direction: column; }
.dd-panel .dd-rows li { flex: 1; display: grid; }
.dd-panel .dd-row { align-content: center; block-size: 100%; }
.dd-rows li + li { border-block-start: 1px solid var(--k-line-soft); }
.nav-dd.is-open .dd-rows li { animation: dd-row-in 200ms var(--k-ease) both; }
.nav-dd.is-open .dd-rows li:nth-child(1) { animation-delay: 90ms; }
.nav-dd.is-open .dd-rows li:nth-child(2) { animation-delay: 125ms; }
.nav-dd.is-open .dd-rows li:nth-child(3) { animation-delay: 160ms; }
.nav-dd.is-open .dd-rows li:nth-child(4) { animation-delay: 195ms; }
.nav-dd.is-open .dd-rows li:nth-child(5) { animation-delay: 230ms; }
@keyframes dd-row-in { from { opacity: 0; transform: translateY(-6px); } to { opacity: 1; transform: none; } }
.dd-row { position: relative; display: grid;
  grid-template-columns: 1fr auto auto 20px;   /* city / tz / pill / arrow (code retired — city carries the row) */
  gap: clamp(10px, 1.4vw, 20px); align-items: center; text-decoration: none;
  padding: 16px 20px 16px 30px; min-block-size: 44px;
  transition: background var(--t-fast) var(--k-ease), padding-inline-start var(--t-fast) var(--k-ease); }
.dd-code { display: none; }
.dd-city { font-family: var(--k-display); color: var(--k-cream); text-transform: uppercase;
  font-size: clamp(28px, 2.7vw, 38px); line-height: 1; white-space: nowrap; }
.dd-tz   { color: var(--k-faint); font-size: 11.5px; letter-spacing: .14em;
  font-variant-numeric: tabular-nums; white-space: nowrap; }
/* the venue took the clock's slot: a live time told a visitor nothing about
   whether to come, the room does */
.dd-venue { font-family: var(--k-mono); font-size: 12px; font-weight: 500;
  letter-spacing: .12em; text-transform: uppercase; color: var(--k-dim);
  white-space: nowrap; }
.dd-venue--tba { color: var(--k-faint); }
.dd-row:hover .dd-venue, .dd-row:focus-visible .dd-venue { color: var(--k-cream); }
/* ── per-city gradient schemes (keyed on the row's data-city; default = kit teal)
   --row-a / --row-b drive: selection bar, pill border, row wash, panel pixel column */
.dd-row { --row-a: var(--k-teal); --row-b: var(--k-teal); }
.dd-row[data-city="SYD"] { --row-a: #00e5cc; --row-b: #0a53d8; }  /* teal → deep sea */
.dd-row[data-city="MEL"] { --row-a: #7b2ff7; --row-b: #ff2fb9; }  /* violet → magenta */
.dd-row[data-city="BNE"] { --row-a: #ffb300; --row-b: #ff6a00; }  /* amber → orange */
.dd-row[data-city="ADL"] { --row-a: #ff5d8f; --row-b: #e8483f; }  /* rose → red */
.dd-row[data-city="PER"] { --row-a: #ffd24a; --row-b: #c85a17; }  /* gold → burnt orange */
.dd-row[data-city="DAL"] { --row-a: #ff8a3d; --row-b: #8a1f1f; }  /* ember → oxblood */
.dd-row[data-city="CHI"] { --row-a: #6fa8dc; --row-b: #d8f0ff; }  /* steel blue → ice */
.dd-row[data-city="NYC"] { --row-a: #ffb300; --row-b: #fff3d6; }  /* amber → white-hot */
.dd-row[data-city="DXB"] { --row-a: #ffd24a; --row-b: #9a6a2f; }  /* gold → bronze */
.dd-row[data-city="BKK"] { --row-a: #ff2fa0; --row-b: #ffd24a; }  /* hot pink → gold */
/* GET INVOLVED rows reuse the city-row grid; the scheme is keyed on data-inv
   instead of data-city, and the display word is a touch smaller because these
   labels are words rather than three-letter codes. */
.dd-row[data-inv="media"]     { --row-a: #00e5cc; --row-b: #0a53d8; }  /* teal → deep sea   */
.dd-row[data-inv="sponsor"]   { --row-a: #ffb300; --row-b: #e8483f; }  /* amber → red       */
.dd-row[data-inv="community"] { --row-a: #7b2ff7; --row-b: #00e5cc; }  /* violet → teal     */
.dd-row[data-inv="awards"]    { --row-a: #ffd24a; --row-b: #ff6a00; }  /* gold → orange     */
.dd-row--pg .dd-city { font-size: clamp(23px, 2.1vw, 31px); }
.dd-row--pg .dd-tz { font-size: 11px; letter-spacing: .1em; text-transform: uppercase;
  color: var(--k-dim); }
.dd-row[data-city="SIN"],
.dd-row[data-city="SHA"] { --row-a: #ff3b3b; --row-b: #00e5ff; }  /* neon red → cyan */
/* selection bar: grows from centre, takes the city scheme */
.dd-row::before { content: ""; position: absolute; inset-block: 0; inset-inline-start: 0;
  inline-size: 4px; background: linear-gradient(180deg, var(--row-a), var(--row-b));
  opacity: 0; z-index: 1;
  transform: scaleY(.35); transform-origin: center;
  transition: opacity var(--t-fast) var(--k-ease), transform var(--t-fast) var(--k-ease); }
.dd-row:hover, .dd-row:focus-visible {
  background: var(--k-panel);
  padding-inline-start: 36px;   /* 6px nudge */
  outline: none; }
.dd-row:hover::before, .dd-row:focus-visible::before { opacity: 1; transform: scaleY(1); }
.dd-row[aria-current="page"]::before { opacity: 1; transform: scaleY(1); }
/* subtle horizontal scheme wash across the row (panel only, not the sheet) */
.dd-panel .dd-row::after { content: ""; position: absolute; inset: 0; pointer-events: none;
  background: linear-gradient(90deg, var(--row-a), var(--row-b));
  opacity: 0; transition: opacity var(--t-fast) var(--k-ease); }
.dd-panel .dd-row:hover::after, .dd-panel .dd-row:focus-visible::after { opacity: .08; }
.dd-panel .dd-row > span { position: relative; z-index: 1; }   /* content above the wash */
.dd-pill { justify-self: end; font-size: 12px; font-weight: 700; letter-spacing: .14em;
  text-transform: uppercase; color: var(--k-cream); border: 1.5px solid var(--k-line-strong);
  padding: 7px 12px 7px 14px; white-space: nowrap;
  clip-path: polygon(0 0, calc(100% - 8px) 0, 100% 8px, 100% 100%, 8px 100%, 0 calc(100% - 8px));
  transition: color var(--t-fast), border-color var(--t-fast); }
.dd-row:hover .dd-pill, .dd-row:focus-visible .dd-pill,
.dd-row[aria-current="page"] .dd-pill { color: var(--k-teal); border-color: var(--k-teal); }
/* panel rows: pill border takes the scheme gradient (sheet keeps plain teal) */
.dd-panel .dd-row:hover .dd-pill, .dd-panel .dd-row:focus-visible .dd-pill {
  color: var(--row-a);
  border-image: linear-gradient(90deg, var(--row-a), var(--row-b)) 1; }
/* arrow glyph: mono "→", slides in */
.dd-row__go { color: var(--k-red); font-size: 15px; opacity: 0; transform: translateX(-6px);
  transition: opacity var(--t-fast) var(--k-ease), transform var(--t-fast) var(--k-ease); }
.dd-row:hover .dd-row__go, .dd-row:focus-visible .dd-row__go { opacity: 1; transform: none; }

/* photo preview pane retired (NAV—01 board: rows + pixel column, no photo).
   Markup still ships in the pages; keep it dead here. */
.dd-prev { display: none; }

/* decorative pixel-cluster column — injected by navInit on the panel's right edge.
   Neutral red→teal mix; recoloured per city scheme via --dd-px-a/--dd-px-b (JS). */
.dd-pxcol { grid-area: px; display: grid; grid-template-columns: repeat(5, 5px);
  gap: 3px; align-content: start; justify-content: center; overflow: hidden;
  padding: 14px 12px; border-inline-start: 1px solid var(--k-line-soft);
  pointer-events: none; contain: size;   /* decorative — must never drive panel height */
  --dd-px-a: var(--k-red); --dd-px-b: var(--k-teal); }
.dd-pxcol i { inline-size: 5px; block-size: 5px;
  transition: background-color 150ms var(--k-ease); }

/* footer strip */
.dd-foot { grid-area: foot; display: flex; align-items: center; gap: 18px;
  padding: 10px 34px 10px 22px;             /* 34px clears bottom-right chamfer */
  border-block-start: 1px solid var(--k-line); }
.dd-foot__txt { font-size: 10.5px; letter-spacing: .28em; color: var(--k-dim); }
.dd-foot .k-barcode { margin-inline-start: auto; inline-size: 86px; block-size: 12px; --k-bar: var(--k-ghost); }

/* burger (mobile only) */
.nav-burger { display: none; align-items: center; justify-content: center;
  inline-size: 46px; block-size: 46px; background: none; cursor: pointer;
  border: 1px solid var(--k-line-strong);
  clip-path: polygon(0 0, calc(100% - 10px) 0, 100% 10px, 100% 100%, 0 100%); }
.nav-burger:focus-visible { outline: 2px solid var(--k-teal); outline-offset: 3px; }
.nav-burger__bars { display: grid; gap: 5px; }
.nav-burger__bars i { display: block; inline-size: 18px; block-size: 2px; background: var(--k-cream);
  transition: transform 180ms var(--k-ease), opacity 180ms var(--k-ease); }
.nav.sheet-open .nav-burger__bars i:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.nav.sheet-open .nav-burger__bars i:nth-child(2) { opacity: 0; }
.nav.sheet-open .nav-burger__bars i:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

/* mobile sheet (hidden above 1080px — MUST match mqMobile in os-site.js) */
.nav-sheet { display: none; }
.sheet-acc { border-block-end: 1px solid var(--k-line-soft); }
.sheet-acc__btn { display: flex; align-items: center; gap: 12px; inline-size: 100%;
  background: none; border: 0; cursor: pointer; font-family: var(--k-mono); font-weight: 600;
  font-size: 14px; letter-spacing: .24em; text-transform: uppercase; color: var(--k-cream);
  padding: 18px 2px; min-block-size: 52px; text-align: start; }
.sheet-acc__btn:focus-visible { outline: 2px solid var(--k-teal); outline-offset: -2px; }
.sheet-acc__n { color: var(--k-faint); font-size: 11px; letter-spacing: .3em; }
.sheet-acc__btn .caret { margin-inline-start: auto; color: var(--k-faint);
  transition: transform 180ms var(--k-ease), color 180ms var(--k-ease); }
.sheet-acc__btn[aria-expanded="true"] .caret { transform: rotate(180deg); color: var(--k-red); }
.sheet-acc__panel { display: grid; grid-template-rows: 0fr; visibility: hidden;
  transition: grid-template-rows 240ms var(--k-ease), visibility 0s 240ms; }
.sheet-acc__panel > .dd-rows { grid-area: auto; overflow: hidden; min-block-size: 0;
  padding: 0; background-image: none; }
.sheet-acc.is-open .sheet-acc__panel { grid-template-rows: 1fr; visibility: visible;
  transition-delay: 0s, 0s; }
.nav-sheet .dd-row { padding: 14px 8px; grid-template-columns: 1fr auto auto; }
.nav-sheet .dd-city { font-size: clamp(24px, 6vw, 30px); }
.nav-sheet .dd-row:hover, .nav-sheet .dd-row:focus-visible { padding-inline-start: 8px; }
.nav-sheet .dd-row__go { display: none; }
.sheet-links { display: grid; padding-block: 8px; border-block-end: 1px solid var(--k-line-soft); }
.sheet-link { font-family: var(--k-mono); font-weight: 600; font-size: 14px; letter-spacing: .24em;
  text-transform: uppercase; color: var(--k-cream); text-decoration: none; padding: 12px 2px;
  min-block-size: 52px; display: inline-flex; align-items: center; }  /* matches .sheet-acc__btn rhythm */
.sheet-link:focus-visible { outline: 2px solid var(--k-teal); outline-offset: -2px; }
.sheet-acts { display: grid; gap: 12px; padding-block: 22px; }
.sheet-cta { font-family: var(--k-mono); font-weight: 700; font-size: 13px; letter-spacing: .26em;
  text-transform: uppercase; text-decoration: none; min-block-size: 52px;
  display: inline-flex; align-items: center; justify-content: center;
  clip-path: polygon(0 0, calc(100% - 10px) 0, 100% 10px, 100% 100%, 0 100%); }
.sheet-cta:focus-visible { outline: 2px solid var(--k-teal); outline-offset: 3px; }
.sheet-cta--ghost { color: var(--k-cream); border: 1px solid var(--k-line-strong); }
.sheet-cta--red { background: var(--k-red); color: var(--k-white); }
.sheet-meta { text-align: center; padding-block-end: 10px; }
html.u-scroll-lock, html.u-scroll-lock body { overflow: hidden; }

/* nav reduced motion (kit kill-switch only covers .k-stage) */
@media (prefers-reduced-motion: reduce) {
  .nav, .nav::before, .nav::after, .nav *, .nav *::before, .nav *::after {
    animation-duration: 0.01ms !important;
    animation-delay: 0ms !important;
    transition-duration: 0.01ms !important;
    transition-delay: 0ms !important;
  }
  .nav.is-stuck::before { -webkit-backdrop-filter: none; backdrop-filter: none; background: var(--k-void); }
}

/* compression tier — keep the full bar on one line down to the sheet breakpoint */
.cta-ghost, .cta-nav { white-space: nowrap; }
@media (max-width: 1450px) {
  .nav { --nav-pad-x: 24px; }
  .nav__row { gap: 20px; }
  .brand { gap: 10px; }
  .brand__word { font-size: 22px; }
  .links { gap: 14px; }
  .link { font-size: 13.5px; letter-spacing: .12em; }
  .nav__acts { gap: 12px; }
  .cta-ghost { font-size: 11.5px; letter-spacing: .18em; padding: 11px 14px; min-block-size: 42px; }
  .cta-nav { font-size: 11.5px; letter-spacing: .2em; padding: 12px 16px; min-block-size: 42px; }
}

/* ── COUNTDOWN STANDBY strip (CMP-03, composed) ─────────────────── */
.standby { border-block-start: 0; }
.standby__in { display: grid; grid-template-columns: auto 1fr auto; align-items: center;
  gap: clamp(24px, 4vw, 72px); padding-block: clamp(28px, 3.4vw, 44px); }
.standby__title { display: flex; align-items: center; gap: 14px; white-space: nowrap;
  font-weight: 700; font-size: clamp(15px, 1.4vw, 19px); letter-spacing: .3em; color: var(--k-white); }
.standby__sub { color: var(--k-faint); font-size: 12px; letter-spacing: .3em; margin-block-start: 8px; }
.spinner { inline-size: 30px; block-size: 30px; border-radius: 50%;
  border: 3px solid var(--k-line-soft); border-block-start-color: var(--k-teal);
  animation: spin 1.6s linear infinite; flex: 0 0 auto; }
@keyframes spin { to { transform: rotate(360deg); } }
.cells { display: flex; gap: clamp(14px, 2.4vw, 38px); justify-content: center; }
.cell { text-align: center; }
.cell__tag { font-size: 10.5px; letter-spacing: .3em; color: var(--k-faint); margin-block-end: 8px; }
.cell__box { inline-size: clamp(74px, 8vw, 116px); block-size: clamp(70px, 7.4vw, 106px);
  border: 1px solid var(--k-line); background: var(--k-panel); display: grid; place-items: center;
  clip-path: polygon(0 0, calc(100% - 14px) 0, 100% 14px, 100% 100%, 0 100%); position: relative; }
.cell__box::after { content: ""; position: absolute; inset: 0; pointer-events: none;
  background: repeating-linear-gradient(0deg, transparent 0 2px, rgba(0,0,0,.28) 2px 3px); }
.cell__num { font-family: var(--k-display); font-size: clamp(34px, 3.8vw, 58px);
  color: var(--k-cream); opacity: .25; }
.cell__lbl { font-size: 10.5px; letter-spacing: .4em; color: var(--k-faint); margin-block-start: 8px; }
.standby__right { display: flex; flex-direction: column; align-items: flex-end; gap: 14px; }
.pill-standby { display: inline-flex; align-items: center; gap: 12px; color: var(--k-red);
  border: 1.5px solid var(--k-red); font-weight: 700; font-size: 13px; letter-spacing: .3em;
  padding: 10px 22px;
  clip-path: polygon(12px 0, calc(100% - 12px) 0, 100% 50%, calc(100% - 12px) 100%, 12px 100%, 0 50%); }
.pill-standby i { inline-size: 8px; block-size: 8px; background: var(--k-red); }
.btn-outline { font-family: var(--k-mono); font-weight: 700; font-size: 13px; letter-spacing: .3em;
  text-transform: uppercase; color: var(--k-cream); background: none;
  border: 1px solid var(--k-line-strong); padding: 14px 26px; min-block-size: 48px;
  display: inline-flex; align-items: center; text-decoration: none; cursor: pointer; }
.btn-outline:hover { border-color: var(--k-cream); }
.btn-outline:focus-visible { outline: 2px solid var(--k-teal); outline-offset: 3px; }

/* ── TOUR GRID: city poster cards (CMP-01, composed) ────────────── */
.tour { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
  gap: clamp(16px, 2vw, 28px); }
.poster { position: relative; display: block; text-decoration: none;
  background: var(--k-bg); border: 1px solid var(--k-line); overflow: hidden;
  clip-path: polygon(0 0, calc(100% - 34px) 0, 100% 34px, 100% 100%, 0 100%);
  min-block-size: 430px; transition: border-color 200ms var(--k-ease); }
.poster:hover, .poster:focus-visible { border-color: var(--k-line-strong); outline: none; }
.poster:focus-visible { border-color: var(--k-teal); }
.poster__pin { position: absolute; inset: 0;
  background-image: repeating-linear-gradient(90deg, rgba(255,255,255,.02) 0 1px, transparent 1px 7px); }
.poster__tag { position: absolute; inset-block-start: 22px; inset-inline-start: 24px;
  color: var(--k-teal); font-weight: 700; font-size: 14px; letter-spacing: .13em;
  /* was a 6-char code at .3em; now it is a venue name, so the tracking comes in
     and the weight goes up rather than letting it read as a barcode */
  max-inline-size: calc(100% - 96px); white-space: nowrap; overflow: hidden;
  text-overflow: ellipsis; }
.poster__coords { position: absolute; inset-block-start: 46px; inset-inline-start: 24px;
  color: var(--k-faint); font-size: 10.5px; letter-spacing: .18em; }
.poster__px { position: absolute; inset-block-start: 10px; inset-inline-end: 12px; }
.poster__stack { position: absolute; inset-inline: 0; inset-block-start: 50%;
  transform: translateY(-58%); text-align: center; pointer-events: none; }
.poster__row { display: block; font-family: var(--k-display); text-transform: uppercase; line-height: .84;
  font-size: clamp(72px, 9vw, 118px); white-space: nowrap; }
.poster__row--stroke { color: transparent; -webkit-text-stroke: 1.5px rgba(0,229,204,.5); }
.poster__row--ghost { color: transparent; -webkit-text-stroke: 1.5px var(--k-ghost); }
.poster__row--photo { color: transparent; background-size: cover; background-position: center;
  -webkit-background-clip: text; background-clip: text; position: relative; }
.poster__foot { position: absolute; inset-inline: 0; inset-block-end: 0;
  border-block-start: 1px solid var(--k-line); padding: 18px 24px 22px;
  background: var(--k-void); }
.poster__status { display: flex; align-items: center; gap: 12px; font-weight: 700;
  font-size: 14px; letter-spacing: .3em; color: var(--k-white); }
.poster__status i { inline-size: 8px; block-size: 8px; background: var(--k-red); flex: 0 0 auto; }
.poster__sub { color: var(--k-faint); font-size: 11px; letter-spacing: .28em; margin-block-start: 8px; }
.poster__sts { position: absolute; inset-block-end: 64px; inset-inline-end: 24px;
  color: var(--k-faint); font-size: 10.5px; letter-spacing: .24em; }

/* international mini-tiles */
.intl { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr));
  gap: clamp(14px, 1.6vw, 22px); margin-block-start: clamp(20px, 3vw, 34px); }
.tile { border: 1px solid var(--k-line); background: var(--k-bg); padding: 22px 24px;
  clip-path: polygon(0 0, calc(100% - 18px) 0, 100% 18px, 100% 100%, 0 100%); }
.tile__code { color: var(--k-teal); font-weight: 600; font-size: 13px; letter-spacing: .3em; }
.tile__city { font-family: var(--k-display); text-transform: uppercase; color: var(--k-cream);
  font-size: clamp(22px, 2.4vw, 30px); margin-block: 8px 10px; }
.tile__meta { color: var(--k-faint); font-size: 11px; letter-spacing: .26em; }

/* ── CAPTURE (CMP-02, composed) ─────────────────────────────────── */
.capture { position: relative; }
.capture__panel { position: relative; border: 1px solid var(--k-line); background: var(--k-bg);
  clip-path: polygon(0 0, 100% 0, 100% calc(100% - 26px), calc(100% - 26px) 100%, 0 100%);
  padding: clamp(28px, 4vw, 52px) clamp(24px, 4vw, 72px); }
.capture__grid { display: grid; grid-template-columns: auto 1fr auto; gap: clamp(24px, 4vw, 64px);
  align-items: center; }
.capture__title { font-size: clamp(30px, 3.6vw, 52px); margin: 0; }
.capture__status { color: var(--k-dim); font-size: 12px; letter-spacing: .3em;
  margin-block-start: 10px; display: flex; align-items: center; gap: 10px; }
.field { position: relative; border: 1px solid var(--k-line-strong);
  clip-path: polygon(0 0, 100% 0, 100% 100%, 14px 100%, 0 calc(100% - 14px)); }
.field__lbl { position: absolute; inset-block-start: -8px; inset-inline-start: 18px;
  background: var(--k-bg); padding-inline: 10px; color: var(--k-faint);
  font-size: 10.5px; letter-spacing: .3em; }
.field input { inline-size: 100%; background: transparent; border: 0; color: var(--k-cream);
  font-family: var(--k-mono); font-size: 15px; letter-spacing: .18em; text-transform: uppercase;
  padding: 20px 20px; min-block-size: 56px; }
.field input:focus { outline: 2px solid var(--k-teal); outline-offset: -2px; }
.field input::placeholder { color: var(--k-dim); }
.btn-red { font-family: var(--k-mono); font-weight: 700; font-size: 14px; letter-spacing: .3em;
  text-transform: uppercase; background: var(--k-red); color: var(--k-white); border: 0;
  border-block-start: 2px solid var(--k-teal); padding: 20px 34px; min-block-size: 60px;
  cursor: pointer; display: inline-flex; align-items: center; gap: 12px; }
.btn-red:hover { filter: brightness(1.1); }
.btn-red:focus-visible { outline: 2px solid var(--k-teal); outline-offset: 3px; }
.btn-red[disabled] { opacity: .6; cursor: wait; }
.capture__fine { text-align: center; color: var(--k-dim); font-size: 11px;
  letter-spacing: .3em; margin-block-start: 20px; display: flex; justify-content: center;
  align-items: center; gap: 10px; }

/* ── FOOTER ─────────────────────────────────────────────────────── */
footer { border-block-start: 0; padding-block: 40px 60px; }
.foot { display: flex; flex-wrap: wrap; gap: 28px; align-items: center; }
.foot__brand { font-family: var(--k-display); text-transform: uppercase; font-size: 20px; }
.foot__brand em { font-style: normal; color: var(--k-teal); }
.foot__links { display: flex; gap: 22px; flex-wrap: wrap; margin-inline-start: auto; }
.foot__links a { color: var(--k-dim); text-decoration: none; font-size: 12px; letter-spacing: .22em;
  text-transform: uppercase; min-block-size: 34px; display: inline-flex; align-items: center; }
.foot__links a:hover { color: var(--k-cream); }
.foot__meta { inline-size: 100%; color: var(--k-faint); font-size: 11px; letter-spacing: .2em;
  display: flex; gap: 24px; flex-wrap: wrap; }

/* sheet breakpoint — MUST match mqMobile in os-site.js */
@media (max-width: 1080px) {
  .nav { --nav-h: 72px; --nav-h-stuck: 60px; }
  .links, .cta-ghost { display: none; }        /* GET TICKETS moves into the sheet */
  .nav__row { grid-template-columns: 1fr auto; }
  .nav-burger { display: inline-flex; }        /* bar = brand · REGISTER · burger */
  .dropline { display: none !important; }
  .dd-panel::before { display: none; }         /* landing tick needs the dropline */
  .nav-sheet { display: block; position: fixed; inset: var(--nav-h-live, 73px) 0 0 0;
    z-index: 70; background: var(--k-void); overflow-y: auto; overscroll-behavior: contain;
    padding: 10px var(--nav-pad-x) 40px;
    transform: translateY(-8px); opacity: 0; visibility: hidden;
    transition: transform 200ms var(--k-ease), opacity 200ms var(--k-ease), visibility 0s 200ms; }
  .nav.sheet-open .nav-sheet { transform: none; opacity: 1; visibility: visible; transition-delay: 0s; }
  /* sheet open: pin the bar to the viewport and drop backdrop-filter — a filtered
     ancestor becomes the containing block for the fixed sheet, and a sticky bar
     returns to document top under scroll lock (off-viewport when scrolled).
     Bar paint (bg/blur) lives on ::before now. */
  .nav.sheet-open { position: fixed; inset-block-start: 0; inset-inline: 0;
    inline-size: 100%; }
  .nav.sheet-open::before { background: var(--k-void);
    -webkit-backdrop-filter: none; backdrop-filter: none; }
}
/* narrow phones — tz pill is the sacrifice so every pill border stays on-screen */
@media (max-width: 480px) {
  .nav-sheet .dd-tz { display: none; }
  .nav-sheet .dd-row { grid-template-columns: 1fr auto; gap: 10px; }
}
@media (max-width: 1100px) {
  .standby__in { grid-template-columns: 1fr; justify-items: start; gap: 28px; }
  .standby__right { align-items: flex-start; }
}
@media (max-width: 980px) {
  .capture__grid { grid-template-columns: 1fr; }
}
/* small phones — keep brand · REGISTER · burger on one line */
@media (max-width: 560px) {
  .sec-head { align-items: flex-start; gap: 12px 18px; }
  .sec-head h2 { flex: 1 1 100%; }
  .sec-head .rule { min-inline-size: 40px; }
  .standby__in > * { min-inline-size: 0; }
  .standby__title { white-space: normal; line-height: 1.45; }
  .cells { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr));
    inline-size: 100%; gap: 16px; }
  .cell__box { inline-size: 100%; }
  .nav { --nav-pad-x: 16px; }
  .nav__row { gap: 12px; }
  .brand { gap: 8px; }
  .brand__ring { inline-size: 32px; block-size: 32px; }
  .brand__word { font-size: 17px; }
  .nav__acts { gap: 8px; }
  .cta-nav { font-size: 11px; letter-spacing: .14em; padding: 10px 12px; min-block-size: 40px; }
  .nav-burger { inline-size: 42px; block-size: 42px; }
}
.visually-hidden { position: absolute; inline-size: 1px; block-size: 1px;
  clip-path: inset(50%); overflow: hidden; white-space: nowrap; }

/* in-page anchor targets clear the stuck bar */
#tour, #pricing, #register {
  scroll-margin-block-start: calc(var(--nav-h-stuck, 64px) + 16px); }

/* ── post-review fixes ─────────────────────────────────────────── */
/* AA contrast: BUTTON FILLS use deepened red (>=4.5:1 w/ white); accent red stays --k-red */
.cta-nav, .sheet-cta--red, .btn-red, .k-btn--red { background: #c22d24; }
/* load-bearing disclaimer tags read at AA, not faint */
.k-note { color: var(--k-dim); }
/* nav corner meta collides with content on small phones */
@media (max-width: 480px) { .nav__meta { display: none; } }
/* FIELD—01 legend was clipped by the chamfer clip-path; input overflowed at 390px */
.field { clip-path: none; }
.field input { box-sizing: border-box; }

#tour27, #speakers, #contact { scroll-margin-block-start: calc(var(--nav-h-stuck, 64px) + 16px); }

/* declutter: retire the NAV—02 corner chip (same micro-label family the owner scrubbed) */
.nav__meta { display: none; }
/* AA: footer bottom strip carries real information */
.ftr__meta, .ftr__bot, .ftr__bottom, .foot__meta { color: var(--k-dim); }

/* ═══ HUD BUTTON SYSTEM (owner board, 30 Jul) — restyles existing CTA classes ═══
   Outline: thin teal frame, dark ground, white condensed label, dot-column accent,
   arrow nudge on hover. Fill: teal luminous ground, near-black ink (BOOK NOW ref). */
.cta-ghost, .btn-outline, .ef-btn, .spn-cta--ghost {
  position: relative; border: 1px solid rgba(0,229,204,.75); border-radius: 4px;
  background: rgba(4,10,10,.82); color: var(--k-white); clip-path: none;
  box-shadow: 0 0 0 1px rgba(0,229,204,.12), 0 0 18px rgba(0,229,204,.10), inset 0 0 22px rgba(0,229,204,.05);
  transition: border-color 160ms var(--k-ease), box-shadow 160ms var(--k-ease), color 160ms var(--k-ease); }
.cta-ghost::before, .btn-outline::before, .ef-btn::before {
  content: ''; position: absolute; inset-block: 8px; inset-inline-start: 7px; inline-size: 3px;
  background: repeating-linear-gradient(0deg, rgba(0,229,204,.7) 0 3px, transparent 3px 7px);
  border-radius: 1px; pointer-events: none; }
.cta-ghost:hover, .btn-outline:hover, .ef-btn:hover {
  border-color: var(--k-teal); color: var(--k-white); filter: none;
  box-shadow: 0 0 0 1px rgba(0,229,204,.3), 0 0 26px rgba(0,229,204,.22), inset 0 0 26px rgba(0,229,204,.08); }
.ef-btn { background: rgba(4,10,10,.82); }
.ef-btn::after { content: none; }
.cta-nav, .btn-red, .cf-send {
  border: 1px solid rgba(0,229,204,.9); border-radius: 4px; clip-path: none;
  background: linear-gradient(100deg, #16cdb8 0%, #2fe0cd 52%, #4df0df 100%);
  color: #041312; box-shadow: 0 0 22px rgba(0,229,204,.28), inset 0 0 18px rgba(255,255,255,.08); }
.cta-nav:hover, .btn-red:hover, .cf-send:hover { filter: brightness(1.07);
  box-shadow: 0 0 30px rgba(0,229,204,.4), inset 0 0 22px rgba(255,255,255,.1); }
.sheet-cta--red { border-radius: 4px; background: linear-gradient(100deg, #16cdb8 0%, #2fe0cd 52%, #4df0df 100%); color: #041312; }
.sheet-cta--ghost { border-radius: 4px; border-color: rgba(0,229,204,.75); }

/* ═══ FOOTER v2 (owner board, 30 Jul) — bordered panel, burst mark, three columns,
   hosting band, baseline. No email form per owner. ═══ */
.ftr2 { padding: clamp(24px, 4vw, 64px) 0 0; }
.ftr2 .wrap { max-width: 1500px; }
.ftr2__panel { position: relative; border: 1px solid var(--k-line); border-radius: 6px;
  background: rgba(4,6,9,.55); overflow: hidden;
  padding: clamp(28px, 4vw, 56px) clamp(22px, 3.4vw, 56px) 0; }
.ftr2__panel::after { content: ''; position: absolute; inset-block: 8%; inset-inline-end: -40px;
  inline-size: 46%; pointer-events: none; opacity: .5;
  background:
    radial-gradient(circle at 1px 1px, rgba(0,229,204,.28) 0 1px, transparent 1.6px),
    radial-gradient(circle at 1px 1px, rgba(0,229,204,.14) 0 1px, transparent 1.6px);
  background-size: 9px 9px, 5px 5px;
  -webkit-mask-image: radial-gradient(60% 70% at 70% 60%, black, transparent 75%);
  mask-image: radial-gradient(60% 70% at 70% 60%, black, transparent 75%); }
.ftr2__grid { position: relative; z-index: 1; display: grid;
  grid-template-columns: minmax(240px, 1.3fr) repeat(3, minmax(150px, 1fr));
  gap: clamp(28px, 4vw, 72px); }
.ftr2__mark { inline-size: clamp(88px, 8vw, 128px); display: block; margin-block-end: 18px;
  filter: drop-shadow(0 6px 18px rgba(0,229,204,.25)); }
.ftr2__word { font-family: var(--k-display); text-transform: none; color: var(--k-white);
  font-size: clamp(30px, 3vw, 44px); line-height: 1.02; margin: 0 0 14px; }
.ftr2__word em { font-style: normal; color: var(--k-teal); }
.ftr2__line { color: var(--k-dim); font-size: 12px; letter-spacing: .14em; line-height: 1.8;
  max-inline-size: 30ch; margin: 0 0 22px; }
.ftr2__soc { display: flex; gap: 12px; }
.ftr2__soc a { inline-size: 40px; block-size: 40px; border: 1px solid var(--k-line-strong);
  border-radius: 50%; display: inline-flex; align-items: center; justify-content: center;
  color: var(--k-cream); transition: border-color 160ms var(--k-ease), color 160ms var(--k-ease); }
.ftr2__soc a:hover { border-color: var(--k-teal); color: var(--k-teal); }
.ftr2__soc a:focus-visible { outline: 2px solid var(--k-teal); outline-offset: 3px; }
.ftr2__h { color: var(--k-teal); font-size: 13px; font-weight: 700; letter-spacing: .18em;
  text-transform: uppercase; margin: 6px 0 20px; }
.ftr2__col a { display: block; color: var(--k-cream); opacity: .78; text-decoration: none;
  font-size: 13.5px; letter-spacing: .04em; padding-block: 9px;
  transition: opacity 140ms var(--k-ease), color 140ms var(--k-ease); }
.ftr2__col a:hover { opacity: 1; color: var(--k-white); }
.ftr2__col a:focus-visible { outline: 2px solid var(--k-teal); outline-offset: 2px; }
.ftr2__host { position: relative; z-index: 1; margin-block-start: clamp(28px, 4vw, 52px);
  border: 1px solid var(--k-line); border-radius: 4px; overflow: hidden;
  display: flex; align-items: center; gap: clamp(18px, 3vw, 44px); flex-wrap: wrap;
  padding: clamp(18px, 2.4vw, 28px) clamp(18px, 2.6vw, 34px); background: rgba(6,9,12,.72); }
.ftr2__host::after { content: ''; position: absolute; inset-block: 0; inset-inline-end: 0;
  inline-size: 42%; pointer-events: none; opacity: .55;
  background: repeating-linear-gradient(90deg, rgba(0,229,204,.35) 0 2px, transparent 2px 6px);
  -webkit-mask-image: linear-gradient(90deg, transparent, black 40%),
    radial-gradient(80% 120% at 80% 50%, black 30%, transparent 80%);
  -webkit-mask-composite: source-in;
  mask-image: linear-gradient(90deg, transparent, black 40%);
  animation: ftr2wave 9s linear infinite; background-size: 200% 100%; }
@keyframes ftr2wave { from { background-position: 0 0; } to { background-position: 60px 0; } }
@media (prefers-reduced-motion: reduce) { .ftr2__host::after { animation: none; } }
.ftr2__hostcopy h2 { font-family: var(--k-display); text-transform: uppercase;
  color: var(--k-cream); font-size: clamp(20px, 2vw, 30px); line-height: 1.05; margin: 0; }
.ftr2__hostsub { color: var(--k-dim); font-size: 12.5px; letter-spacing: .08em;
  line-height: 1.7; margin: 0; max-inline-size: 40ch; }
.ftr2__hostbtn { margin-inline-start: auto; position: relative; z-index: 1; }
.ftr2__base { display: flex; flex-wrap: wrap; gap: 16px 32px; align-items: center;
  justify-content: space-between; color: var(--k-dim); font-size: 11.5px; letter-spacing: .1em;
  padding: 22px 4px 30px; }
.ftr2__base .pin { display: inline-flex; align-items: center; gap: 8px; }
@media (max-width: 900px) { .ftr2__grid { grid-template-columns: 1fr 1fr; }
  .ftr2__hostbtn { margin-inline-start: 0; } }
/* 80%+ of traffic is a phone, so the footer stays two columns all the way
   down rather than becoming one very long scroll. */
/* 80%+ of traffic is a phone. Each link group runs its own two columns, so the
   ten-city EVENT list is five rows rather than ten and the whole footer stops
   being a scroll of its own. */
@media (max-width: 540px) {
  .ftr2__grid { grid-template-columns: 1fr; gap: 22px; }
  .ftr2__col { display: grid; grid-template-columns: 1fr 1fr; column-gap: 14px;
    align-content: start; }
  .ftr2__h { grid-column: 1 / -1; margin: 0 0 8px; font-size: 12px; }
  .ftr2__col a { padding-block: 5px; font-size: 13px; }
  .ftr2__line { margin-block-end: 14px; line-height: 1.6; font-size: 11.5px; }
  .ftr2__mark { margin-block-end: 12px; }
  .ftr2__word { font-size: 26px; margin-block-end: 10px; }
  .ftr2__soc a { inline-size: 36px; block-size: 36px; }
  .ftr2__host { margin-block-start: 22px; padding: 15px; gap: 10px; }
  .ftr2__hostsub { font-size: 12px; line-height: 1.55; }
  .ftr2__base { padding: 14px 2px 20px; gap: 6px 16px; font-size: 10.5px; }
  /* the brand block and the partner CTA are the other two thirds of the
     footer's height; neither needs full desktop weight on a phone */
  .ftr2__mark { inline-size: 64px; }
  .ftr2__hostsub { display: none; }
  .ftr2__hostcopy h2 { font-size: 18px; }
  .ftr2__host { padding: 13px 14px; }
}

/* ═══ BRAND LOCKUP (new logo, 30 Jul) ═══ */
.brand__logo { display: block; block-size: 96px; inline-size: auto;
  transition: block-size var(--t-med) var(--k-ease); }
.nav.is-stuck .brand__logo { block-size: 72px; }
@media (max-width: 1080px) { .brand__logo { block-size: 74px; }
  .nav.is-stuck .brand__logo { block-size: 60px; } }
@media (max-width: 560px) { .brand__logo { block-size: 56px; }
  .nav.is-stuck .brand__logo { block-size: 48px; } }
.ftr2__logo { display: block; inline-size: min(100%, 330px); max-inline-size: 100%;
  block-size: auto; margin-block-end: 24px; }

/* ══ BUTTONS — one treatment across the whole site ═══════════════════════
   Every hollow / outline / ghost variant fills in. Buttons are the only solid
   fields on the page, so they read as the thing to press. Red variants keep
   their colour — the rule is "no grey", not "no colour". */
.k-btn, .k-btn--outline, .cta-ghost, .cta-nav,
.spn3-cta, .spn3-cta--line, .spn3-cta--teal,
.citix-cta, .citix-cta--ghost, .sp-btn, .sp-btn--line,
.cnf-btn, .cnf3-sbtn, .awd-cat__go, .trx-also__cta,
.chero-cta__in, .sheet-cta, .chero-cta--ghost .chero-cta__in,
.spn3-cta--ghost, .k-btn--outline, .med-tab, .awd-mode, .trx, .cnf3-act,
.sp-btn--line, .citix-cta--ghost, .pf-way__tag, .sp-tier .sp-btn {
  background: linear-gradient(100deg, #16cdb8 0%, #2fe0cd 52%, #4df0df 100%) !important;
  color: #041312 !important;
  border-color: transparent !important;
  box-shadow: none !important;
  font-weight: 800;
}
.k-btn--red, .spn3-cta--solid, .sheet-cta--red {
  background: var(--k-red) !important; color: var(--k-white) !important;
}
.k-btn:hover, .cta-ghost:hover, .cta-nav:hover, .spn3-cta:hover, .citix-cta:hover,
.sp-btn:hover, .cnf-btn:hover, .cnf3-sbtn:hover, .awd-cat__go:hover,
.trx-also__cta:hover, .sheet-cta:hover { filter: brightness(1.07); }
/* arrows and glyphs inside a filled button follow the ink */
.k-btn *, .spn3-cta *, .citix-cta *, .sp-btn *, .cnf3-sbtn *,
.awd-cat__go *, .chero-cta__in * { color: inherit !important; }

/* .k-btn--outline redeclares its own transparent background in os-kit.css after
   the shared fill, so it needs saying again here. */
.k-btn--outline, a.k-btn--outline {
  background: linear-gradient(100deg, #16cdb8 0%, #2fe0cd 52%, #4df0df 100%) !important;
  color: #041312 !important; border: 0 !important; }

/* ══ WTL — waitlist tiers (cities where tickets are not on sale yet) ══════
   Same shape as the live pricing grid so the offer reads identically, but
   the CTA joins a per-tier waitlist instead of opening a checkout. No price
   is asserted: none is set yet, and inventing one would be a false claim. */
.wtl { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px;
  margin-block: clamp(30px, 3.6vw, 48px) clamp(24px, 3vw, 38px); }
@media (max-width: 900px) { .wtl { grid-template-columns: minmax(0, 1fr); } }
.wtl-card { position: relative; display: flex; flex-direction: column;
  background: var(--k-bg); border: 1px solid var(--k-line);
  clip-path: polygon(0 0, calc(100% - 22px) 0, 100% 22px, 100% 100%, 0 100%);
  padding: clamp(24px, 2.6vw, 34px); }
.wtl-card--vip { border-color: rgba(0, 229, 204, .5); }
.wtl-num { position: absolute; inset-block-start: 12px; inset-inline-end: 16px;
  font-size: 42px; line-height: 1; }
.wtl-name { margin: 0 0 14px; font-family: var(--k-mono); font-weight: 800;
  font-size: clamp(24px, 1.95vw, 28px); letter-spacing: .04em; text-transform: uppercase;
  color: var(--k-cream); }
.wtl-price { margin: 0 0 20px; display: flex; align-items: baseline; gap: 12px; flex-wrap: wrap; }
.wtl-price__v { font-family: var(--k-display); font-size: clamp(38px, 4vw, 54px);
  line-height: .9; color: var(--k-cream); }
.wtl-price__u { font-family: var(--k-mono); font-size: 12px; font-weight: 700;
  letter-spacing: .18em; text-transform: uppercase; color: var(--k-cream); }
.wtl-feats { list-style: none; margin: 0 0 24px; padding: 0; display: grid; gap: 11px; }
.wtl-feats li { display: flex; gap: 11px; align-items: flex-start;
  font-family: var(--k-mono); font-size: 14px; line-height: 1.55; color: var(--k-cream); }
.wtl-feats .k-bit { flex: 0 0 auto; margin-block-start: 6px; }
.wtl-act { margin-block-start: auto; }
.wtl-cta { inline-size: 100%; }
.wtl-form { display: grid; gap: 10px; margin-block-start: 12px; }
.wtl-form[hidden] { display: none; }
.wtl-in { inline-size: 100%; min-block-size: 52px; padding: 0 16px;
  background: var(--k-well); border: 1px solid var(--k-line-strong); color: var(--k-cream);
  font-family: var(--k-mono); font-size: 15px; }
.wtl-in::placeholder { color: rgba(236, 229, 216, .92); }
.wtl-in:focus { outline: 2px solid var(--k-teal); outline-offset: -2px; }
.wtl-status { margin: 0; font-family: var(--k-mono); font-size: 13px; font-weight: 700;
  letter-spacing: .14em; text-transform: uppercase; color: var(--k-cream); }
.wtl-status--red { color: var(--k-red); }
.wtl-note { margin: 0; font-family: var(--k-mono); font-size: 14px; line-height: 1.6;
  color: var(--k-cream); }

/* The FOXX module defines its own hollow secondary button; the all-solid rule
   has to name it explicitly because that rule lives in the page's own <style>. */
.feat-cta--secondary, .foxxmod .feat-cta--secondary {
  background: linear-gradient(100deg, #16cdb8 0%, #2fe0cd 52%, #4df0df 100%) !important;
  color: #041312 !important; border-color: transparent !important; font-weight: 800; }
.feat-cta--secondary * { color: inherit !important; }
