/*
 * CEB shared design system. Loaded after the retained ceb-legacy layout layer.
 * Roles: display (64px), section (44px), subsection (28px), body (16px),
 * lead (20px), supporting text (14px), labels (12px), controls (15px).
 * Ivory, white and charcoal content surfaces share one 4px texture.
 * Black banners and navigation stay plain deliberately.
 */
:root {
  --ceb-crimson: #b92f32;
  --ceb-crimson-hover: #9f272a;
  --ceb-crimson-on-dark: #e3696c;
  --ceb-plum: #98549b;
  --ceb-plum-on-dark: #c89acb;
  --ceb-charcoal: #202020;
  --ceb-black: #000;
  --ceb-ivory: #fbf9f2;
  --ceb-white: #fff;
  --ceb-ink: #252522;
  --ceb-muted: #5b5751;
  --ceb-light-copy: #d1ccc5;
  --ceb-line: #2525222b;
  --ceb-body-font: Arial, Helvetica, sans-serif;
  --ceb-heading-font: Georgia, 'Times New Roman', serif;
  --ceb-display-size: clamp(2.25rem, 4.45vw, 4rem);
  --ceb-title-size: clamp(2rem, 3.1vw, 2.75rem);
  --ceb-subtitle-size: clamp(1.5rem, 2vw, 1.75rem);
  --ceb-body-size: 1rem;
  --ceb-lead-size: 1.25rem;
  --ceb-small-size: .875rem;
  --ceb-label-size: .75rem;
  --ceb-control-size: .9375rem;
  --ceb-section-space: clamp(48px, 5vw, 80px);
  --ceb-gutter: max(4vw, calc((100% - 1600px) / 2));
  --ceb-texture-light: radial-gradient(#6e583b0c .6px, transparent 1px);
  --ceb-texture-dark: radial-gradient(#fbf9f209 .6px, transparent 1px);
  --ceb-texture-size: 4px 4px;
  --ceb-copy: #343330;
  --ceb-heading: #171715;
  --ceb-label: var(--ceb-crimson);

  /* Compatibility aliases keep the existing layouts in the current palette. */
  --ink: var(--ceb-ink);
  --dark: var(--ceb-charcoal);
  --dark-raised: #292929;
  --footer-bg: #111;
  --paper: var(--ceb-ivory);
  --paper-deep: #f0ece3;
  --muted: var(--ceb-muted);
  --purple: var(--ceb-crimson);
  --accent: var(--ceb-crimson);
  --accent-2: var(--ceb-plum);
  --button-bg: var(--ceb-crimson);
  --button-hover: var(--ceb-crimson-hover);
  --button-text: var(--ceb-ivory);
  --focus: var(--ceb-plum);
  --berry: var(--ceb-crimson);
  --sessions-bg: var(--ceb-charcoal);
  --text-on-dark: var(--ceb-light-copy);
  --muted-on-dark: #bdb6ad;
  --line: var(--ceb-line);
  --orbit-line: #fbf9f24d;
  --orbit-faint: #fbf9f21f;
  --accent-glow: #b92f3218;
  --record-base: #202020;
  --record-groove: #393939;
  --photo-fallback: #ddd8ce;
  --hero-overlay-start: #202020f7;
  --hero-overlay-end: #202020db;
  --image-overlay: #111c;
}

body {
  background-color: var(--ceb-ivory);
  background-image: var(--ceb-texture-light);
  background-size: var(--ceb-texture-size);
  color: var(--ceb-ink);
  font: 400 var(--ceb-body-size)/1.7 var(--ceb-body-font);
}
a:hover { color: var(--ceb-plum); }
:focus-visible { outline: 3px solid var(--ceb-plum); outline-offset: 4px; }
::selection { background: var(--ceb-plum); color: #fff; }

/* Surface roles also define readable foreground colours for their children. */
.featured-section, .sessions-showcase, .page-hero, .feature-section,
.contact-section, .section-dark, .studio-section:not(.studio-editorial) {
  --ceb-copy: var(--ceb-light-copy);
  --ceb-heading: var(--ceb-ivory);
  --ceb-label: var(--ceb-crimson-on-dark);
}
.welcome-copy, .feedback-paper {
  --ceb-copy: #343330;
  --ceb-heading: #171715;
  --ceb-label: var(--ceb-crimson);
}
.ceb-statement {
  --ceb-copy: var(--ceb-light-copy);
  --ceb-heading: var(--ceb-ivory);
  --ceb-label: var(--ceb-ivory);
  background: var(--ceb-black);
}
.home-partners, .about-paper, .venue-editorial, .welcome-section,
.detail-grid, .profile-grid, .team-links, .page-section-nav,
.section-pad:not(.feature-section) {
  background-color: var(--ceb-ivory);
  background-image: var(--ceb-texture-light);
  background-size: var(--ceb-texture-size);
}
.featured-section, .sessions-showcase, .page-hero, .feature-section, .contact-section {
  background-color: var(--ceb-charcoal);
  background-image: var(--ceb-texture-dark);
  background-size: var(--ceb-texture-size);
}
/* Keep the grid above the photo fade so it stays continuous at the image edge. */
.featured-section { background-image: none; }
.featured-section::after, .home-corporate::after {
  content: '';
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  background-image: var(--ceb-texture-dark);
  background-size: var(--ceb-texture-size);
}
.home-corporate { background: var(--ceb-white); }
.home-corporate::after { background-image: var(--ceb-texture-light); }
.studio-editorial {
  --studio-disc-size: clamp(48px, max(calc(4vw + 20px), calc((100vw - 1600px) / 2 + 20px)), 230px);
  background-color: var(--ceb-white);
  background-image: var(--ceb-texture-light);
  background-size: var(--ceb-texture-size);
}
.studio-editorial::before, .studio-editorial::after {
  content: '';
  position: absolute;
  z-index: 0;
  pointer-events: none;
  border-radius: 50%;
}
.studio-editorial::before {
  width: var(--studio-disc-size);
  height: var(--studio-disc-size);
  left: calc(var(--studio-disc-size) * -.15);
  top: calc(var(--studio-disc-size) * -.2);
  background: #b92f32c9;
}
.studio-editorial::after {
  width: calc(var(--studio-disc-size) * .283);
  height: calc(var(--studio-disc-size) * .283);
  left: calc(var(--studio-disc-size) * .248);
  top: calc(var(--studio-disc-size) * .935);
  background: var(--ceb-crimson);
}
.studio-frame { position: relative; z-index: 1; background: transparent; }
.welcome-copy::before, .feedback-paper::before {
  background-color: var(--ceb-ivory);
  background-image: var(--ceb-texture-light), linear-gradient(115deg, #fffefb80, #eae3d72b);
  background-size: var(--ceb-texture-size), auto;
}
.about-visual::after {
  background-image: var(--ceb-texture-dark), linear-gradient(0deg, #111b, transparent 50%);
  background-size: var(--ceb-texture-size), auto;
}

/* Text roles are shared by every layout, rather than sized by section name. */
main p, main li {
  color: var(--ceb-copy);
  font: 400 var(--ceb-body-size)/1.7 var(--ceb-body-font);
}
main p { margin-block: 0 20px; }
h1, h2, h3 { color: var(--ceb-heading); font-family: var(--ceb-heading-font); font-weight: 400; }
h1, .ceb-display {
  font: 400 var(--ceb-display-size)/1.08 var(--ceb-heading-font);
  letter-spacing: -.045em;
  margin-block: 0 24px;
  white-space: normal;
  text-wrap: balance;
}
h2, .ceb-title {
  font: 400 var(--ceb-title-size)/1.1 var(--ceb-heading-font);
  letter-spacing: -.04em;
  margin-block: 0 24px;
  white-space: normal;
  text-wrap: balance;
}
h3, .ceb-subtitle {
  font: 400 var(--ceb-subtitle-size)/1.15 var(--ceb-heading-font);
  letter-spacing: -.025em;
  margin-block: 0 20px;
  white-space: normal;
}
.ceb-title::after {
  content: '';
  display: block;
  width: 54px;
  height: 2px;
  background: var(--ceb-crimson);
  margin-top: 22px;
}
.ceb-subtitle::after {
  content: '';
  display: block;
  width: 36px;
  height: 2px;
  background: var(--ceb-crimson);
  margin-top: 14px;
}
.ceb-kicker, .eyebrow, .about-kicker, .home-partners-kicker,
.welcome-kicker, .about-contact-label, .profile .role {
  color: var(--ceb-label);
  font: 700 var(--ceb-label-size)/1.4 var(--ceb-body-font);
  letter-spacing: .15em;
  text-transform: uppercase;
  margin-block: 0 16px;
}
.ceb-statement .ceb-display { margin-block: 0; }
.ceb-statement .ceb-kicker { margin-bottom: 24px; }
.ceb-statement h2 em { color: var(--ceb-crimson); }
.ceb-statement > p:last-child {
  color: var(--ceb-light-copy);
  font: 400 var(--ceb-small-size)/1.6 var(--ceb-body-font);
  letter-spacing: .025em;
  margin: 26px 0 0;
}
.contact-section h2 em { color: var(--ceb-crimson-on-dark); }
.page-hero .ceb-display { max-width: 22ch; }
.contact-section .ceb-display { max-width: 22ch; margin-inline: auto; }
.ceb-display::after { content: none; }
.welcome-copy { container-type: inline-size; }
.welcome-heading {
  font-size: min(var(--ceb-display-size), 5.9cqw);
  white-space: nowrap;
  text-wrap: nowrap;
}
.welcome-heading::after {
  content: '';
  display: block;
  width: 54px;
  height: 2px;
  margin-top: 22px;
  background: var(--ceb-crimson);
}
.lead, .welcome-introduction, .page-hero > p:not(.ceb-kicker):not(.eyebrow) {
  color: var(--ceb-copy);
  font: 400 var(--ceb-lead-size)/1.55 var(--ceb-body-font);
  letter-spacing: normal;
  margin-block: 0 24px;
}
.welcome-question, .about-contact, .about-contact address,
.session-production p, .home-payment-copy p {
  color: var(--ceb-copy);
  font: 400 var(--ceb-body-size)/1.7 var(--ceb-body-font);
}
.about-contact { margin-top: 32px; }
.about-contact address { margin-top: 18px; }
.about-contact .about-contact-label { margin-bottom: 12px; }
.home-partners-intro { margin-bottom: 40px; }
.partner-heading { margin-bottom: 20px; }
.partner-heading .ceb-subtitle { margin: 0; }
.home-payments .ceb-subtitle { margin-bottom: 20px; }
.home-payment-copy p { font-size: var(--ceb-small-size); }

/* Consistent frame, section rhythm, controls and links. */
.page-hero, .detail-grid, .profile-grid, .team-links, .page-section-nav,
.section-pad, .site-header, .site-footer, .contact-section { padding-inline: var(--ceb-gutter); }
.home-editorial:not(.home-about), .home-partners, .featured-section,
.sessions-showcase, .page-hero, .detail-grid, .section-pad, .contact-section {
  padding-block: var(--ceb-section-space);
}
.home-corporate { padding-inline: var(--ceb-gutter); }
.ceb-statement { padding: var(--ceb-section-space) var(--ceb-gutter); }
.studio-statement { padding: var(--ceb-section-space) var(--ceb-gutter); }
.venue-photo figcaption, .page-photo figcaption { left: var(--ceb-gutter); right: var(--ceb-gutter); }
.page-section-nav { background-color: var(--ceb-ivory); }
.page-section-nav a, .team-links a {
  color: var(--ceb-crimson);
  font: 600 var(--ceb-control-size)/1.5 var(--ceb-body-font);
  text-decoration: none;
}
.page-section-nav a:hover, .team-links a:hover { color: var(--ceb-plum); }
.button, .wheel-spin-button, .header-enquire {
  font: 600 var(--ceb-control-size)/1.4 var(--ceb-body-font);
  letter-spacing: normal;
  border-radius: 3px;
  min-height: 48px;
}
.button { padding: 13px 23px; }
.wheel-spin-button {
  width: auto;
  min-width: 0;
  padding: 12px 20px;
  gap: 10px;
  justify-content: center;
  box-shadow: none;
  transform: none;
  transition: background 180ms ease, border-color 180ms ease;
}
.wheel-spin-button > span { margin: 0; font: inherit; }
.wheel-spin-icon { width: 18px; height: 18px; flex: 0 0 18px; }
.wheel-spin-button:hover { box-shadow: none; transform: none; }
.button-primary, .button-dark, .home-enquire, .partner-button,
.sessions-watch-button, .wheel-spin-button {
  background: var(--ceb-crimson);
  color: var(--ceb-ivory);
  border-color: var(--ceb-crimson);
}
.button-primary:hover, .button-dark:hover, .home-enquire:hover,
.partner-button:hover, .sessions-watch-button:hover, .wheel-spin-button:hover {
  background: var(--ceb-crimson-hover);
  color: #fff;
  border-color: var(--ceb-crimson-hover);
}
.button-outline { color: var(--ceb-crimson); border-color: var(--ceb-crimson); background: transparent; }
.button-outline:hover { color: var(--ceb-crimson-hover); border-color: var(--ceb-crimson-hover); background: #b92f3208; }
.text-link, .sessions-production-links a {
  color: var(--ceb-label);
  font: 600 var(--ceb-control-size)/1.5 var(--ceb-body-font);
}
.text-link:hover { color: var(--ceb-plum); }

/* The same black header and navigation on the homepage and every standalone page. */
.site-header {
  --ceb-label: var(--ceb-ivory);
  height: 94px;
  gap: clamp(16px, 1.5vw, 24px);
  border: 0;
  background: var(--ceb-black);
  color: var(--ceb-ivory);
}
.site-header a { color: var(--ceb-ivory); }
.site-header a:hover { color: var(--ceb-ivory); }
.desktop-nav { gap: clamp(16px, 1.5vw, 24px); font: 400 var(--ceb-control-size)/1.4 var(--ceb-body-font); }
.desktop-nav a { position: relative; display: inline-flex; align-items: center; min-height: 48px; padding-block: 10px; }
.desktop-nav a:hover { text-decoration: none; }
.desktop-nav a::after { content: ''; position: absolute; inset: auto 0 7px; height: 2px; background: var(--ceb-plum); transform: scaleX(0); transform-origin: left; transition: transform 180ms ease; }
.desktop-nav a:hover::after, .desktop-nav a:focus-visible::after,
.desktop-nav a[aria-current="page"]::after { transform: scaleX(1); }
.desktop-nav a[aria-current="page"] { color: var(--ceb-ivory); }
.header-enquire { min-width: 138px; margin-left: 0; padding: 10px 20px; align-items: center; justify-content: center; gap: 0; background: var(--ceb-crimson); border: 0; }
.site-header .header-enquire:hover { background: var(--ceb-crimson-hover); color: #fff; text-decoration: none; }
.menu-toggle { width: 44px; height: 44px; padding: 11px; }
.menu-toggle span { background: var(--ceb-ivory); }
.main-nav { right: var(--ceb-gutter); background: #111; }
.main-nav a { font: 400 var(--ceb-control-size)/1.5 var(--ceb-body-font); }
.main-nav a:hover, .main-nav a[aria-current="page"] { color: var(--ceb-crimson-on-dark); }

/* Secondary roles retain a deliberate scale of their own. */
.feedback-note-heading h3 { font: 400 1.125rem/1.2 var(--ceb-heading-font); letter-spacing: -.025em; }
.feedback-note-scroll blockquote p { font: 400 1rem/1.55 var(--ceb-heading-font); color: #343330; margin-bottom: 16px; }
.feedback-note-scroll blockquote footer { font: 400 .75rem/1.5 var(--ceb-body-font); color: var(--ceb-muted); }
.act-card h3 { font: 400 var(--ceb-subtitle-size)/1.15 var(--ceb-heading-font); }
.act-card p, .profile p:not(.role):not(.profile-initials) { font: 400 var(--ceb-body-size)/1.7 var(--ceb-body-font); }
.act-meta, .roster-filters button, .section-note, #rosterCount,
.profile summary, .session-player-caption, .session-card-series, .session-feature-series {
  font-family: var(--ceb-body-font);
  font-size: var(--ceb-small-size);
  line-height: 1.5;
}
.session-feature-artist, .session-card-artist { font-family: var(--ceb-heading-font); font-weight: 400; }
.session-feature-artist { font-size: var(--ceb-subtitle-size); line-height: 1.15; }
.session-card-artist { font-size: 1.25rem; line-height: 1.15; }
.session-feature-song { font: 400 var(--ceb-small-size)/1.5 var(--ceb-body-font); }
.session-gallery-count, .session-card-duration { font: 400 .75rem/1.4 var(--ceb-body-font); }
.sessions-facts span, .about-stats li > span { font: 700 var(--ceb-label-size)/1.6 var(--ceb-body-font); letter-spacing: .12em; }
.session-production { gap: 40px; }
.session-production p { font-size: var(--ceb-small-size); }
.session-poster:hover, .session-poster:visited, .session-card:hover { color: var(--ceb-ivory); }
.session-player-caption a:hover, .sessions-production-links a:hover { color: var(--ceb-plum-on-dark); }
.partner-heading > svg { color: var(--ceb-crimson); }
.profile .role { color: var(--ceb-crimson); }
.profile-initials { color: var(--ceb-crimson); font: italic 4rem/1 var(--ceb-heading-font); }
.page-photo figcaption, .venue-photo figcaption, .name-cloud span, .contact-phone {
  font: 400 var(--ceb-small-size)/1.5 var(--ceb-body-font);
  letter-spacing: normal;
}
.event-stages article > span {
  color: var(--ceb-crimson);
  font: 700 var(--ceb-label-size)/1.4 var(--ceb-body-font);
  letter-spacing: .15em;
}
.about-stats strong { font-family: var(--ceb-heading-font); }
.home-partner-columns > article { padding-right: clamp(30px, 3vw, 56px); }
.home-partner-columns > article + article { padding-left: clamp(30px, 3vw, 56px); padding-right: 0; }

.site-footer { background: #111; background-image: none; color: var(--ceb-light-copy); font: 400 var(--ceb-small-size)/1.7 var(--ceb-body-font); }
.site-footer p, .site-footer address { color: inherit; font: inherit; }
.site-footer .footer-label { color: var(--ceb-ivory); font: 700 var(--ceb-label-size)/1.4 var(--ceb-body-font); letter-spacing: .15em; margin-bottom: 22px; }
.site-footer .footer-bottom { font: 400 .75rem/1.5 var(--ceb-body-font); color: #bdb6ad; }
.site-footer a:hover { color: var(--ceb-plum-on-dark); }
.site-footer address { margin-top: 20px; }
.back-to-services { font: 600 var(--ceb-control-size)/1.4 var(--ceb-body-font); background: var(--ceb-crimson); color: var(--ceb-ivory); }
.back-to-services:hover { background: var(--ceb-crimson-hover); color: #fff; }

@media (max-width: 1280px) {
  .desktop-nav { display: none; }
  .header-enquire { margin-left: auto; }
}
@media (max-width: 1100px) {
  .home-corporate { padding-bottom: 0; }
}
@media (max-width: 760px) {
  .home-partner-columns > article { padding-right: 0; }
  .home-partner-columns > article + article { padding: 30px 0 0; }
  .session-production { gap: 24px; }
}
@media (max-width: 650px) {
  :root { --ceb-gutter: 6vw; --ceb-lead-size: 1.125rem; }
  .site-header { height: 80px; gap: 10px; }
  .brand-logo { width: clamp(110px, 36vw, 178px); }
  .header-enquire { min-width: 0; min-height: 44px; padding-inline: 10px; font-size: .875rem; }
  .menu-toggle { width: 40px; flex-basis: 40px; padding: 9px; }
  .ceb-statement { padding-block: 48px; }
  .partner-button { min-width: 0; max-width: 100%; }
  .about-paper h2 { white-space: normal; }
  .sessions-facts li { padding-inline: 0; }
  .sessions-facts span { font-size: var(--ceb-label-size); }
}
@media (max-width: 360px) {
  .site-header { gap: 8px; }
  .brand-logo { width: 110px; }
  .header-enquire { padding-inline: 8px; font-size: .8125rem; }
}
@media (prefers-reduced-motion: reduce) {
  .desktop-nav a::after { transition: none; }
}