/* Shared archive, artist and media layouts. Uses the existing Instinct type and colour system. */
[hidden] { display: none !important; }
:focus-visible { outline: 2px solid var(--accent); outline-offset: 5px; }
.archive-shell { width: min(1200px, calc(100% - 64px)); margin: 0 auto; padding: 48px 0 72px; }
.archive-heading { padding: 24px 0 32px; }
.archive-kicker { margin: 0 0 20px; font: 12px/1.5 var(--font-mono); text-transform: uppercase; letter-spacing: .16em; color: var(--accent); }
.archive-heading h1 { margin: 0; max-width: 100%; font: 800 clamp(42px, 6.7vw, 92px)/1.04 var(--font-display); font-stretch: 125%; letter-spacing: -.035em; overflow-wrap: anywhere; }
.archive-intro { max-width: 670px; color: var(--muted); font-size: 19px; line-height: 1.65; margin: 24px 0 0; }
.archive-shell h2, .archive-home-spotlight h2 { font: 750 clamp(26px, 3.2vw, 44px)/1.15 var(--font-display); font-stretch: 125%; letter-spacing: -.02em; }
.archive-shell h3 { line-height: 1.3; }
.archive-section { border-top: 1px solid var(--line); padding-top: 36px; margin-top: 40px; }
.archive-section-heading { display: flex; gap: 24px; justify-content: space-between; align-items: baseline; margin-bottom: 24px; }
.archive-section-heading h2 { margin: 0; }
.archive-section-heading > span, .archive-result-count { color: var(--dim); font: 12px/1.6 var(--font-mono); }
.archive-link { color: var(--accent); font-size: 14px; line-height: 1.5; text-decoration: underline; text-underline-offset: 5px; text-decoration-color: var(--accent-line); }
.archive-link:hover { color: #fff; text-decoration-color: #fff; }
.archive-actions { display: flex; gap: 16px 24px; align-items: center; flex-wrap: wrap; margin: 24px 0; }
.archive-actions .archive-link { padding: 8px 0; }
.archive-back { display: inline-flex; min-height: 44px; align-items: center; color: var(--dim); font: 12px var(--font-mono); }
.archive-card-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 24px; }
.archive-card { display: block; border: 1px solid var(--line); background: #07070b; transition: border-color 180ms; }
.archive-card:hover { border-color: var(--accent); }
.archive-card-image { position: relative; aspect-ratio: 4/3; overflow: hidden; background: #111; }
.archive-card-image img { width: 100%; height: 100%; object-fit: cover; }
.archive-card-image:has(img[alt*="event poster"]) img { object-fit: contain; padding: 10px; }
.archive-badge { position: absolute; left: 12px; bottom: 12px; padding: 6px 9px; color: #fff; background: rgba(0,0,0,.88); border: 1px solid var(--line); font: 10px/1.4 var(--font-mono); text-transform: uppercase; }
.archive-card-copy { padding: 20px; }
.archive-card-copy h3 { font: 750 23px/1.2 var(--font-display); margin: 10px 0; }
.archive-card-copy p { color: var(--dim); font: 12px/1.7 var(--font-mono); margin: 0; }
.archive-card-copy p:last-child { color: var(--muted); }
.archive-home-spotlight { background: linear-gradient(120deg,rgba(155,93,229,.10),transparent 65%); }
.archive-home-spotlight .archive-shell { padding-top: 54px; padding-bottom: 54px; }
.archive-home-spotlight h2 { max-width: 850px; margin: 16px 0; }
.archive-home-spotlight p { color: var(--muted); line-height: 1.7; }
.archive-home-spotlight .archive-kicker { color: var(--accent); }
.archive-spotlight-grid { display: grid; grid-template-columns: 1fr 380px; gap: 48px; align-items: center; }
.archive-spotlight-poster img { width: 100%; max-height: 500px; object-fit: contain; }
.archive-home-gallery { margin-top: 0; padding-top: 48px; }
.archive-home-gallery h2 { max-width: 900px; }
.archive-home-gallery p { color: var(--muted); }
.archive-film-link { display: block; position: relative; width: 100%; height: 100%; }
.archive-film-link img { width: 100%; height: 100%; object-fit: cover; }
.archive-play { position: absolute; bottom: 20px; left: 50%; transform: translateX(-50%); padding: 12px 20px; background: var(--accent); color: #000; font: 700 12px/1.5 var(--font-mono); white-space: nowrap; }
.archive-event-meta { font: 13px/1.9 var(--font-mono); color: var(--muted); }
.archive-event .archive-heading { padding-bottom: 8px; }
.archive-event-intro { max-width: 850px; font-size: 19px; line-height: 1.8; color: var(--muted); margin: 32px 0 48px; }
.archive-announcement-grid { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: 64px; align-items: center; }
.archive-announcement-grid figure { margin: 0; }
.archive-announcement-grid p { line-height: 1.8; color: var(--muted); }
.archive-announcement-grid .archive-kicker { color: var(--accent); }
.archive-poster { background: #08090a; border: 1px solid var(--line); padding: 12px; width: 100%; cursor: zoom-in; }
.archive-poster img { max-height: 660px; width: 100%; object-fit: contain; }
.archive-subheading { margin-top: 40px; }
.archive-lineup-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 20px; }
.archive-lineup-card { background: #08080c; border: 1px solid var(--line); min-width: 0; }
.archive-lineup-image { display: block; position: relative; width: 100%; aspect-ratio: 1; overflow: hidden; }
.archive-lineup-card .archive-lineup-image img { position: absolute; inset: 0; width: 100%; height: 100%; max-height: none; object-fit: cover; }
.archive-lineup-card > div { padding: 18px; }
.archive-lineup-card h3 { margin: 0; font-size: 19px; }
.archive-lineup-card p { color: var(--muted); font: 12px/1.7 var(--font-mono); }
.archive-lineup-card .archive-actions { margin: 12px 0 0; gap: 12px; }
.archive-lineup-card .archive-link { font-size: 12px; }
.archive-credit { color: var(--dim); font: 12px/1.7 var(--font-mono); margin: 24px 0; }
.archive-credit .archive-link { font-size: inherit; }
.archive-pager { display: grid; grid-template-columns: 1fr auto 1fr; gap: 24px; border-top: 1px solid var(--line); margin-top: 56px; padding: 24px 0 0; align-items: start; }
.archive-pager a { padding: 12px 0; }
.archive-pager > :last-child { text-align: right; }
.archive-empty { padding: 40px; border: 1px solid var(--line); background: #08080c; }
.archive-empty h2 { font-size: 28px; }
.archive-empty p { color: var(--muted); line-height: 1.7; }
.archive-details { margin-top: 36px; border: 1px solid var(--line); padding: 20px; }
.archive-details summary { cursor: pointer; font-size: 14px; }
.archive-details .archive-lineup-grid { margin-top: 20px; }
.archive-details img { max-height: 260px; width: 100%; object-fit: contain; }
.archive-details p { font-size: 14px; color: var(--muted); }
.archive-search, .archive-filters label { display: grid; gap: 10px; font: 12px/1.5 var(--font-mono); }
.archive-search { max-width: 500px; margin-top: 10px; }
.archive-search input, .archive-filters select { min-height: 48px; width: 100%; padding: 10px 14px; border: 1px solid var(--line); border-radius: 0; background: #09090e; color: #fff; font: 15px var(--font-body); }
.archive-artist-grid { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 24px; }
.archive-artist-card { min-width: 0; border-bottom: 1px solid var(--line); }
.archive-artist-image { display: block; position: relative; aspect-ratio: 1; overflow: hidden; background: #0d0a14; }
.archive-artist-card img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; filter: saturate(.8); }
.archive-artist-card:hover { border-color: var(--accent); }
.archive-artist-card:hover img { filter: saturate(1); }
.archive-artist-card > div { padding: 16px 0; }
.archive-artist-card h3 { margin: 0 0 6px; font: 700 20px/1.25 var(--font-display); overflow-wrap: anywhere; }
.archive-artist-card p { margin: 0; color: var(--dim); font: 11px var(--font-mono); }
.archive-artist-hero { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1.1fr); gap: 64px; align-items: center; margin-top: 24px; }
.archive-artist-hero figure { margin: 0; }
.archive-artist-hero img { width: 100%; max-height: 650px; object-fit: contain; }
.archive-artist-hero .archive-heading h1 { font-size: clamp(42px,5.5vw,76px); }
.archive-bio { max-width: 850px; }
.archive-bio p { font-size: 18px; color: var(--muted); line-height: 1.8; }
.archive-appearances { display: grid; gap: 12px; }
.archive-appearance { display: flex; align-items: center; justify-content: space-between; gap: 24px; padding: 24px; background: #08080c; border: 1px solid var(--line); }
.archive-appearance:hover { border-color: var(--accent); }
.archive-appearance h3 { font-size: 24px; margin: 8px 0; }
.archive-appearance p { font: 12px/1.7 var(--font-mono); color: var(--muted); margin: 4px 0; }
.archive-appearance > span { color: var(--accent); font-size: 26px; }
.archive-qa-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 20px; }
.archive-qa-grid article { padding: 24px; border-top: 1px solid var(--accent-line); background: rgba(155,93,229,.07); }
.archive-qa-grid h3 { font-size: 18px; }
.archive-qa-grid p { font-size: 16px; line-height: 1.7; color: var(--muted); }
.archive-filters { display: flex; align-items: end; justify-content: space-between; gap: 24px; padding: 24px 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.archive-filters [role="group"] { display: flex; gap: 8px; }
.archive-filters button { min-height: 48px; padding: 12px 24px; border: 1px solid var(--line); background: #08080c; cursor: pointer; font: 12px var(--font-mono); }
.archive-filters button[aria-pressed="true"] { background: var(--accent); color: #000; border-color: var(--accent); }
.archive-filters label { max-width: 430px; width: 100%; }
.archive-filters select { text-overflow: ellipsis; }
.archive-gallery-context { margin: 28px 0; }
.archive-gallery-context p { color: var(--muted); font: 12px/1.8 var(--font-mono); }
.archive-media-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 24px; align-items: start; }
.archive-media-card { min-width: 0; padding: 0; text-align: left; border: 0; background: transparent; cursor: zoom-in; }
.archive-media-image { position: relative; display: block; aspect-ratio: 4/3; overflow: hidden; background: #09090d; }
.archive-media-image img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.archive-media-card:hover .archive-media-image { outline: 1px solid var(--accent); outline-offset: 4px; }
.archive-media-card.is-video { cursor: pointer; }
.archive-media-caption { display: grid; gap: 5px; padding: 12px 0 20px; }
.archive-media-caption strong { font-size: 14px; font-weight: 500; }
.archive-media-caption small { font: 10px/1.5 var(--font-mono); color: var(--dim); }
.archive-album-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 24px; }
.archive-album { min-width: 0; }
.archive-album img { width: 100%; height: auto; aspect-ratio: 4/3; object-fit: cover; }
.archive-album h3 { font-size: 20px; margin: 14px 0 8px; }
.archive-album p { font: 11px/1.7 var(--font-mono); color: var(--dim); }
.archive-footer-links { display: flex; flex-wrap: wrap; justify-content: center; gap: 24px; margin: 20px 0; }
.media-viewer { width: min(1100px,calc(100vw - 40px)); max-width: none; max-height: calc(100dvh - 32px); padding: 16px; border: 1px solid var(--line); color: #fff; background: #08080c; overflow: auto; }
.media-viewer::backdrop { background: rgba(0,0,0,.94); }
.viewer-toolbar { display: flex; gap: 12px; align-items: center; justify-content: space-between; padding-bottom: 12px; }
.viewer-toolbar button { background: transparent; border: 1px solid var(--line); padding: 10px 16px; min-height: 44px; cursor: pointer; font: 12px var(--font-mono); }
.viewer-toolbar button:disabled { opacity: .3; cursor: default; }
.viewer-toolbar > div { display: flex; gap: 8px; }
.viewer-stage { display: grid; place-items: center; min-height: 100px; }
.viewer-stage img, .viewer-stage video { max-width: 100%; max-height: calc(100dvh - 245px); width: auto; height: auto; object-fit: contain; }
.viewer-caption { padding: 12px 4px 4px; font-size: 13px; }
.viewer-caption p { margin: 4px 0 8px; line-height: 1.6; }
.viewer-counter { margin-left: 16px; font: 11px var(--font-mono); color: var(--dim); }
.viewer-caption .archive-link { font-size: 12px; }
@media (max-width: 1050px) {
  .archive-card-grid, .archive-media-grid, .archive-album-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .archive-artist-grid { grid-template-columns: repeat(3,minmax(0,1fr)); }
  .archive-announcement-grid, .archive-artist-hero { gap: 32px; }
}
@media (max-width: 720px) {
  .archive-shell { width: calc(100% - 40px); padding-top: 28px; padding-bottom: 44px; }
  .archive-heading { padding-top: 16px; padding-bottom: 24px; }
  .archive-heading h1 { font-size: clamp(38px,11vw,62px); }
  .archive-intro { font-size: 16px; line-height: 1.7; margin-top: 20px; }
  .archive-section { margin-top: 32px; padding-top: 28px; }
  .archive-section-heading { flex-wrap: wrap; gap: 16px; margin-bottom: 20px; }
  .archive-card-grid { grid-template-columns: 1fr; }
  .archive-card-image { aspect-ratio: 4/3; }
  .archive-card-copy h3 { font-size: 24px; }
  .archive-home-spotlight .archive-shell { padding-top: 32px; padding-bottom: 32px; }
  .archive-spotlight-grid, .archive-announcement-grid, .archive-artist-hero { grid-template-columns: 1fr; gap: 24px; }
  .archive-home-spotlight h2 { font-size: 30px; }
  .archive-event-intro { font-size: 16px; line-height: 1.8; }
  .archive-event-meta { font-size: 12px; }
  .archive-lineup-grid { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px; }
  .archive-lineup-card > div { padding: 12px; }
  .archive-lineup-card h3 { font-size: 16px; overflow-wrap: anywhere; }
  .archive-lineup-card .archive-link { font-size: 11px; }
  .archive-pager { grid-template-columns: 1fr 1fr; gap: 8px 24px; }
  .archive-pager > :nth-child(2) { grid-column: 1 / -1; grid-row: 2; text-align: center; border-top: 1px solid var(--line); }
  .archive-pager > :last-child { grid-column: 2; grid-row: 1; }
  .archive-pager .archive-link { font-size: 12px; }
  .archive-empty { padding: 24px; }
  .archive-empty h2 { font-size: 25px; }
  .archive-artist-grid { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 24px 16px; }
  .archive-artist-card h3 { font-size: 16px; }
  .archive-artist-hero img { max-height: 440px; }
  .archive-artist-hero .archive-heading h1 { font-size: 42px; }
  .archive-artist-hero .archive-heading { padding-bottom: 8px; }
  .archive-bio p { font-size: 16px; }
  .archive-appearance { padding: 18px; }
  .archive-appearance h3 { font-size: 20px; }
  .archive-qa-grid { grid-template-columns: 1fr; }
  .archive-filters { align-items: stretch; flex-direction: column; gap: 20px; padding: 20px 0; }
  .archive-filters [role="group"] { display: grid; grid-template-columns: repeat(3,1fr); }
  .archive-filters button { padding: 12px 16px; }
  .archive-filters label { max-width: none; }
  .archive-media-grid, .archive-album-grid { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 16px; }
  .archive-media-caption strong { font-size: 12px; line-height: 1.5; }
  .archive-media-caption small { font-size: 9px; }
  .archive-album h3 { font-size: 16px; }
  .archive-album p { font-size: 10px; }
  .archive-media-image .archive-play { font-size: 10px; padding: 8px 12px; bottom: 12px; }
  .media-viewer { width: calc(100vw - 16px); padding: 12px; }
  .viewer-toolbar button { padding: 10px 12px; }
  .viewer-stage img, .viewer-stage video { max-height: calc(100dvh - 250px); }
  .viewer-caption p { font-size: 12px; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; transition: none !important; animation: none !important; }
}

.archive-more { display: block; margin: 24px auto; border: 1px solid var(--accent-line); background: transparent; padding: 14px 24px; min-height: 48px; font: 12px var(--font-mono); cursor: pointer; }
.archive-more:hover { color: var(--accent); }

.archive-heading h1 { text-wrap: balance; }
.archive-artist-hero figcaption { color: var(--dim); font: 11px/1.6 var(--font-mono); margin-top: 12px; }
.visually-hidden { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }

/* A quiet definition below the artwork, shared by both home layouts. */
.home-definition { padding: 28px 0 88px; background: #000; }
.home-definition__inner { width: min(1200px, calc(100% - 64px)); margin: 0 auto; }
.home-definition__label { margin: 0 0 12px; color: var(--accent); font: 12px/1.5 var(--font-mono); letter-spacing: .1em; text-transform: uppercase; }
.home-definition__label span { color: var(--dim); }
.home-definition__text { max-width: 60ch; margin: 0; color: var(--muted); font: 15px/1.7 var(--font-body); text-align: left; }
@media (max-width: 720px) {
  .home-definition { padding: 24px 0 70px; }
  .home-definition__inner { width: calc(100% - 48px); }
  .home-definition__text { font-size: 14px; }
}

/* Shorter opening section; retain the definition and its breathing room. */
.home-hero { min-height: 750px; }
@media (max-width: 720px) {
  .mobile-home-hero { height: 620px; }
}
/* Position the wordmark slightly below centre within the shortened hero. */
.home-hero__image {
  inset: auto 0 auto 0;
  top: calc(57% + 10px);
  width: 100%;
  height: auto;
  transform: translateY(-46.2%);
}

/* Irregular light fields deform with motion and spread as their energy fades. */
.home-hero__image, .mobile-home-hero > img { filter: brightness(1.35) saturate(1.12); }
.home-hero::after { background: linear-gradient(180deg, transparent 30%, rgba(0,0,0,.65) 100%); }
.mobile-home-hero { isolation: isolate; }
.hero-energy {
  position: absolute; inset: 0; z-index: 0; pointer-events: none;
  mix-blend-mode: screen; opacity: .55; transition: opacity 700ms ease;
  mask-image: linear-gradient(transparent, #000 14%, #000 80%, transparent);
}
.hero-energy::before, .hero-energy::after {
  content: ''; position: absolute; top: 0; left: 0;
  width: 640px; height: 560px;
  filter: url(#hero-refraction);
  will-change: transform;
}
.hero-light-filter { position: absolute; overflow: hidden; pointer-events: none; }
.hero-energy::before {
  opacity: calc(.28 + var(--light-energy, 0) * .72);
  background:
    radial-gradient(ellipse 34% 43% at 41% 47%, rgba(20,205,93,.3), rgba(14,166,81,.1) 47%, transparent 100%),
    radial-gradient(ellipse 30% 23% at 66% 58%, rgba(20,182,112,.17), transparent 100%),
    radial-gradient(ellipse 24% 30% at 49% 30%, rgba(39,167,63,.12), transparent 100%);
  transform: translate3d(calc(var(--glow-x) - 50%), calc(var(--glow-y) - 50%), 0) skew(var(--bend-x, 0deg), var(--bend-y, 0deg)) scale(var(--light-spread, 1.24));
}
.hero-energy::after {
  opacity: calc(.22 + var(--light-energy, 0) * .65);
  background:
    radial-gradient(ellipse 39% 26% at 58% 44%, rgba(126,47,220,.23), transparent 100%),
    radial-gradient(ellipse 24% 36% at 35% 61%, rgba(92,42,194,.15), transparent 100%);
  transform: translate3d(calc(var(--echo-x) - 50%), calc(var(--echo-y) - 50%), 0) skew(calc(var(--bend-y, 0deg) * -1), var(--bend-x, 0deg)) scale(var(--light-spread, 1.24));
}
.energy-paused .hero-energy::before, .energy-paused .hero-energy::after { will-change: auto; }
.is-tracking .hero-energy { opacity: 1; }
.mobile-home-welcome { z-index: 1; }
@media (hover: none), (pointer: coarse) {
  .hero-energy { animation: hero-breathe 8s ease-in-out infinite alternate; }
  .energy-paused .hero-energy { animation-play-state: paused; }
}
@keyframes hero-breathe { from { opacity: .35; } to { opacity: .7; } }
@media (prefers-reduced-motion: reduce) {
  .hero-energy { animation: none; transition: none; opacity: .5; }
}

/* Give each footer group its own aligned row instead of one wrapping flex row. */
.site-footer > .site-footer__inner {
  display: grid; justify-items: center; gap: 18px;
  width: min(1200px, 100%); min-width: 0;
}
.site-footer .site-footer__brand { color: #fff; }
.site-footer .archive-footer-links { margin: 0; gap: 8px 24px; align-items: center; }
.site-footer .archive-footer-links a { font-size: 13px; }
.site-footer__contacts { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px 24px; }
.site-footer__contacts a { overflow-wrap: anywhere; }
.site-footer .site-footer__inner > p { color: var(--dim); line-height: 1.7; }
@media (max-width: 720px) {
  .site-footer__contacts { flex-direction: column; gap: 8px; }
}

/* Solid green cursor throughout the site; translucent over the hero only. */
@media (hover: hover) and (pointer: fine) {
  html {
    --site-cursor: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 20 20'%3E%3Ccircle cx='10' cy='10' r='5' fill='%2332e07a' stroke='%2307100a' stroke-width='1'/%3E%3C/svg%3E") 10 10, auto;
  }
  html, body, body * { cursor: var(--site-cursor) !important; }
  .home-hero, .mobile-home-hero {
    --site-cursor: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 20 20'%3E%3Ccircle cx='10' cy='10' r='5' fill='%2332e07a' fill-opacity='.4' stroke='%2332e07a' stroke-opacity='.55' stroke-width='1'/%3E%3C/svg%3E") 10 10, auto;
  }

}

/* One continuous backdrop, clipped only after the definition. */
.home-opening { position: relative; isolation: isolate; overflow: hidden; background: #000; }
.home-opening .home-hero, .home-opening .mobile-home-hero {
  overflow: visible; isolation: auto; background: transparent;
}
.home-opening .home-definition { position: relative; z-index: 1; background: transparent; }
.home-opening .home-hero::after { display: none; }
.home-opening::after {
  content: ''; position: absolute; inset: 0; z-index: -1; pointer-events: none;
  background: linear-gradient(180deg, transparent 30%, rgba(0,0,0,.45) 100%);
}
@media (max-width: 720px) {
  .home-opening .mobile-home-hero > img {
    position: absolute; z-index: -2; top: -120px; left: 0;
    width: 100%; height: calc(100% + 240px); object-fit: contain;
  }
}