/* ░░░ BASIS KLEUREN ░░░ */
:root {
  --bg-main: #8E44AD;
  --bg-dark: #34283A;
  --surface: #F5F1EA;
  --surface-strong: #FFFFFF;
  --text-dark: #34283A;
  --text-light: #FFFFFF;
  --accent: #5A2A6C;
  --accent-hover: #8E44AD;
  --nav-pill: rgba(255, 255, 255, 0.12);
  --nav-pill-active: #F5F1EA;
  --shadow-soft: 0 12px 32px rgba(52, 40, 58, 0.16);
}

/* Two explicit routes for proof of work, kept editorial instead of card-like. */
.work-more {
  display: grid;
  grid-template-columns: .82fr 1.18fr;
  gap: clamp(3rem, 8vw, 9rem);
  padding: clamp(5rem, 10vw, 9rem) clamp(1.5rem, 8vw, 9rem);
  background: #21151b;
  color: #f4ecdf;
}

.work-more .eyebrow {
  margin: 0 0 1rem;
  color: #d1a05f;
}

.work-more h2 {
  margin: 0;
  font: 400 clamp(4rem, 7vw, 7.4rem)/.81 "Bebas Neue", sans-serif;
  letter-spacing: .01em;
}

.work-more h2 em {
  color: #d1a05f;
  font-style: normal;
}

.work-more-links {
  border-top: 1px solid rgba(244, 236, 223, .55);
}

.work-more-links > a {
  display: grid;
  grid-template-columns: 2.4rem minmax(0, 1fr) auto;
  gap: 1.2rem;
  align-items: center;
  padding: 1.7rem 0;
  border-bottom: 1px solid rgba(244, 236, 223, .28);
  color: inherit;
  text-decoration: none;
  transition: padding .2s ease, color .2s ease;
}

.work-more-links > a:hover {
  padding-right: .8rem;
  padding-left: .8rem;
  color: #e0b273;
}

.work-more-links span,
.work-more-links b {
  font-size: .67rem;
  font-weight: 700;
  letter-spacing: .1em;
  text-transform: uppercase;
}

.work-more-links span {
  align-self: start;
  color: #d1a05f;
}

.work-more-links strong {
  display: block;
  font: 400 clamp(2.1rem, 3.8vw, 4rem)/.88 "Bebas Neue", sans-serif;
  letter-spacing: .025em;
}

.work-more-links p {
  max-width: 27rem;
  margin: .6rem 0 0;
  color: rgba(244, 236, 223, .68);
  font-size: .9rem;
  line-height: 1.55;
}

.work-more-links b {
  color: #f4ecdf;
  white-space: nowrap;
}

.work-closing p {
  margin-top: 0;
}

@media (max-width: 800px) {
  .work-more {
    grid-template-columns: minmax(0, 1fr);
  }

  .work-more > *,
  .work-more-links {
    min-width: 0;
  }
}

@media (max-width: 560px) {
  .work-more-links > a {
    grid-template-columns: 2rem minmax(0, 1fr);
  }

  .work-more-links b {
    grid-column: 2;
    justify-self: start;
  }
}

/* ░░░ RESET BODY EN HTML ░░░ */
html, body {
  margin: 0;
  padding: 0;
  height: 100%;
  overflow-x: hidden; /* Geen horizontale scroll */
  overflow-y: auto;   /* Wel normale verticale scroll */
}

body {
  font-family: Arial, sans-serif;
  background: var(--bg-main);
  color: var(--text-light);
}

/* Alleen het logo links krijgt Bebas Neue */
.logo {
  font-family: 'Bebas Neue', sans-serif;
  text-transform: uppercase;
  font-size: 1.8em;
  letter-spacing: 2px;
}


/* NAVIGATIEBALK */
.navbar {
  display: flex;
  justify-content: space-between;
  align-items: center;
  background: rgba(52, 40, 58, 0.92);
  padding: 1em 2em;
  position: sticky;
  top: 0;
  z-index: 10;
  backdrop-filter: blur(14px);
  box-shadow: 0 8px 24px rgba(52, 40, 58, 0.22);
}

.logo {
  font-size: 1.5em;
  color: white;
  font-weight: bold;
}

.nav-links {
  list-style: none;
  display: flex;
  gap: 1.5em;
}

.nav-meta {
  display: flex;
  align-items: center;
  gap: 1.1em;
}

.nav-links li a {
  text-decoration: none;
  color: white;
  background-color: var(--nav-pill);
  padding: 0.65em 1.1em;
  border-radius: 50px; /* Maakt het ovaal/rond */
  font-weight: bold;
  transition: background-color 0.3s ease, transform 0.2s ease, color 0.3s ease, box-shadow 0.3s ease;
}

.nav-links li a:hover {
  background-color: rgba(255, 255, 255, 0.22);
  transform: scale(1.05); /* Laat de knop iets 'groeien' bij hover */
}

.nav-links li a.active {
  background: var(--nav-pill-active);
  color: var(--text-dark);
  box-shadow: 0 8px 20px rgba(52, 40, 58, 0.18);
}

.language-switch {
  display: inline-flex;
  align-items: center;
  gap: 0.45em;
  padding: 0.45em 0.75em;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.1);
  color: rgba(255, 255, 255, 0.82);
  font-size: 0.8rem;
  font-weight: bold;
  letter-spacing: 0.06em;
}

.language-toggle {
  -webkit-appearance: none !important;
  appearance: none !important;
  background: none !important;
  background-color: transparent !important;
  border: none !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  outline: none;
  padding: 0 !important;
  margin: 0 !important;
}

.language-pill {
  appearance: none;
  -webkit-appearance: none;
  background: transparent;
  background-color: transparent;
  border: 0;
  border-radius: 0;
  box-shadow: none;
  color: inherit;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font: inherit;
  letter-spacing: inherit;
  line-height: 1;
  margin: 0;
  min-width: 0;
  opacity: 0.72;
  padding: 0;
}

.language-toggle::-moz-focus-inner {
  border: 0;
  padding: 0;
}

.language-pill-active {
  opacity: 1;
  color: #FFFFFF;
}

.language-pill:hover {
  opacity: 1;
}

.language-divider {
  opacity: 0.45;
}


/* ░░░ HERO: layout zonder scroll en fullscreen ░░░ */
html, body {
  margin: 0;
  padding: 0;
  height: 100%;
}

.hero {
  position: relative;
  width: 100vw;
  min-height: 72vh;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}









/* 📹 Volledige video */
.hero-video {
  position: absolute;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  z-index: 0;
  pointer-events: none;
  border: none;
}

.bg-video {
  position: absolute;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100%;
  object-fit: cover;
  z-index: 0;
  pointer-events: none;
  border: none;
}

@media (max-width: 700px) {
  .bg-video {
    object-position: center 42%;
    transform: scale(1.34);
    transform-origin: center;
  }
}



/* 🔵 Overlay */
.overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100%;
  background:
    linear-gradient(180deg, rgba(52, 40, 58, 0.28) 0%, rgba(52, 40, 58, 0.72) 45%, rgba(90, 42, 108, 0.86) 100%);
  z-index: 1;
}

/* ✨ Tekst gecentreerd */
.hero-content {
  position: relative;
  z-index: 2;
  text-align: center;
  color: white;
  max-width: 900px;
  padding: 2em;
}

.hero-content h1 {
  font-family: 'Bebas Neue', sans-serif;
  font-size: clamp(4.2rem, 10vw, 7rem);
  margin-bottom: 0.2em;
  text-transform: uppercase;
  letter-spacing: 1px;
  line-height: 0.92;
  text-shadow: 0 8px 22px rgba(0, 0, 0, 0.2);
}

.hero-kicker,
.hero-title {
  display: block;
}

.hero-kicker {
  font-size: 0.48em;
  letter-spacing: 0.22em;
  margin-bottom: 0.2em;
  opacity: 0.9;
}

.hero-title {
  font-size: 1em;
}

.hero-content p {
  font-size: 1.2em;
  margin-bottom: 1.5em;
  text-shadow: none;
}

.cta-button {
  background: linear-gradient(135deg, var(--accent) 0%, var(--bg-main) 100%);
  color: white;
  padding: 0.9em 1.6em;
  border-radius: 999px;
  text-decoration: none;
  font-weight: bold;
  margin-top: 1.2em;
  display: inline-block;
  border: none;
  box-shadow: 0 12px 28px rgba(52, 40, 58, 0.24);
  transition: transform 0.2s ease, box-shadow 0.3s ease, background-color 0.3s ease;
}

.cta-button:hover {
  background: linear-gradient(135deg, var(--accent-hover) 0%, var(--accent) 100%);
  transform: translateY(-2px);
  box-shadow: 0 16px 30px rgba(52, 40, 58, 0.28);
}

/* ░░░ UITGEBREIDE INTRODUCTIE STYLING ░░░ */
.intro-snippet {
  background: linear-gradient(135deg, rgba(245, 241, 234, 0.98) 0%, rgba(255, 255, 255, 0.92) 100%);
  max-width: 1140px;
  margin: 4.5em auto;
  padding: 3.4em;
  border-radius: 36px;
  box-shadow: 0 18px 44px rgba(52, 40, 58, 0.14);
}

.section-label {
  font-family: 'Bebas Neue', sans-serif;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  margin: 0 0 0.4em;
  color: var(--accent);
  font-size: 1rem;
}

.section-label-light {
  color: rgba(255, 255, 255, 0.74);
}

.home-highlights,
.home-proof,
.home-process {
  max-width: 1080px;
  margin: 0 auto 3.2em;
  padding: 0 2em;
}

.home-highlights {
  margin-top: 4.2em;
}

.highlights-grid {
  display: grid;
  grid-template-columns: 1.25fr 0.85fr;
  grid-template-rows: auto auto;
  gap: 1.1em;
}

.highlight-card {
  background: rgba(245, 241, 234, 0.92);
  color: var(--text-dark);
  border-radius: 28px;
  padding: 1.5em;
  box-shadow: 0 14px 28px rgba(52, 40, 58, 0.12);
  position: relative;
  overflow: hidden;
}

.highlight-card h3,
.proof-copy h2,
.process-intro h2,
.process-step h3 {
  font-family: 'Bebas Neue', sans-serif;
  letter-spacing: 0.5px;
}

.highlight-card h3 {
  font-size: 1.75rem;
  margin: 0 0 0.35em;
}

.highlight-card p:last-child {
  margin: 0;
  line-height: 1.7;
}

.highlight-card-feature {
  grid-row: 1 / span 2;
  background: linear-gradient(145deg, #34283A 0%, #5A2A6C 55%, #8E44AD 100%);
  color: #FFFFFF;
  padding: 1.8em;
  min-height: 280px;
}

.highlight-card-feature::after {
  content: "";
  position: absolute;
  right: -40px;
  bottom: -40px;
  width: 150px;
  height: 150px;
  border-radius: 50%;
  background: rgba(245, 241, 234, 0.1);
}

.highlight-card-feature::before {
  content: "FLEUR";
  position: absolute;
  top: 0.1em;
  right: 0.25em;
  font-family: 'Bebas Neue', sans-serif;
  font-size: clamp(2.8rem, 6vw, 4.2rem);
  line-height: 1;
  color: rgba(255, 255, 255, 0.08);
  pointer-events: none;
}

.highlight-card-feature h3 {
  font-size: clamp(1.8rem, 3vw, 2.6rem);
  line-height: 0.98;
  max-width: 10ch;
}

.highlight-card-feature p:last-of-type {
  max-width: 34ch;
  color: rgba(255, 255, 255, 0.82);
}

.highlight-metrics {
  display: flex;
  flex-wrap: wrap;
  gap: 0.55em;
  margin-top: 1.2em;
}

.highlight-metrics span {
  background: rgba(255, 255, 255, 0.12);
  border: 1px solid rgba(255, 255, 255, 0.18);
  color: #FFFFFF;
  border-radius: 999px;
  padding: 0.55em 0.8em;
  font-weight: bold;
  font-size: 0.85rem;
}

.highlight-card-accent {
  background: linear-gradient(160deg, #F5F1EA 0%, #ffffff 100%);
  border: 2px solid rgba(90, 42, 108, 0.12);
  box-shadow:
    inset 0 0 0 1px rgba(255, 255, 255, 0.7),
    0 18px 36px rgba(52, 40, 58, 0.12);
}

.highlight-card-dark {
  background: #34283A;
  color: #FFFFFF;
  border: 1px solid rgba(245, 241, 234, 0.1);
}

.highlight-card-dark p:last-child {
  color: rgba(255, 255, 255, 0.82);
}

.home-proof {
  margin-top: 1em;
}

.proof-wrapper {
  background:
    radial-gradient(circle at top right, rgba(245, 241, 234, 0.12) 0%, transparent 28%),
    linear-gradient(135deg, rgba(52, 40, 58, 0.94) 0%, rgba(90, 42, 108, 0.92) 100%);
  border-radius: 30px;
  padding: 2em;
  display: grid;
  grid-template-columns: 1.05fr 0.95fr;
  gap: 1.4em;
  align-items: center;
  box-shadow: 0 16px 32px rgba(52, 40, 58, 0.16);
  position: relative;
  overflow: hidden;
}

.proof-wrapper::after {
  content: "";
  position: absolute;
  inset: auto auto -40px -40px;
  width: 140px;
  height: 140px;
  border-radius: 50%;
  background: rgba(245, 241, 234, 0.07);
}

.proof-copy h2 {
  font-size: clamp(1.7rem, 3vw, 2.3rem);
  margin: 0 0 0.25em;
  color: #FFFFFF;
}

.proof-super,
.process-super,
.intro-super {
  font-family: 'Bebas Neue', sans-serif;
  letter-spacing: 1px;
  text-transform: uppercase;
  margin: 0 0 0.3em;
  font-size: 0.82rem;
}

.proof-super {
  color: rgba(255, 255, 255, 0.62);
}

.proof-copy p:last-child {
  margin: 0;
  color: rgba(255, 255, 255, 0.82);
}

.proof-note {
  display: flex;
  flex-wrap: wrap;
  gap: 0.8em;
  margin-top: 1em;
}

.proof-note span {
  border-bottom: 1px solid rgba(255, 255, 255, 0.25);
  padding-bottom: 0.3em;
  color: rgba(255, 255, 255, 0.78);
  font-weight: bold;
}

.proof-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.75em;
  align-content: center;
  position: relative;
  z-index: 1;
}

.proof-pill {
  background: rgba(255, 255, 255, 0.08);
  border: 1px solid rgba(255, 255, 255, 0.18);
  color: #FFFFFF;
  padding: 0.8em 0.9em;
  border-radius: 20px;
  font-weight: bold;
  backdrop-filter: blur(6px);
  min-height: 56px;
  display: flex;
  align-items: center;
  transition: transform 0.2s ease, background-color 0.2s ease;
  font-size: 0.88rem;
}

.proof-pill:hover {
  transform: translateY(-2px);
}

.proof-pill-feature {
  background: #F5F1EA;
  color: #34283A;
  box-shadow: 0 12px 24px rgba(52, 40, 58, 0.12);
}

.proof-pill-wide {
  grid-column: span 2;
}

.proof-pill-dark {
  background: rgba(52, 40, 58, 0.95);
  border-color: rgba(245, 241, 234, 0.22);
}

.process-wrapper {
  background: linear-gradient(180deg, #F5F1EA 0%, #fffaf4 100%);
  color: var(--text-dark);
  border-radius: 30px;
  padding: 2em;
  box-shadow: 0 16px 30px rgba(52, 40, 58, 0.12);
  position: relative;
  overflow: hidden;
}

.process-wrapper::before {
  content: "";
  position: absolute;
  top: -40px;
  right: -30px;
  width: 120px;
  height: 120px;
  border-radius: 50%;
  background: rgba(90, 42, 108, 0.08);
}

.process-intro h2 {
  font-size: clamp(1.7rem, 3vw, 2.3rem);
  margin: 0 0 0.5em;
}

.process-super {
  color: rgba(52, 40, 58, 0.56);
}

.process-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 0.9em;
  align-items: start;
  position: relative;
  z-index: 1;
}

.process-step {
  background: #FFFFFF;
  border-radius: 22px;
  padding: 1.1em;
  border: 1px solid rgba(90, 42, 108, 0.08);
  box-shadow: 0 18px 30px rgba(52, 40, 58, 0.08);
  min-height: 165px;
  position: relative;
  overflow: hidden;
}

.step-number {
  display: inline-block;
  font-family: 'Bebas Neue', sans-serif;
  color: rgba(90, 42, 108, 0.2);
  font-size: 1.7rem;
  line-height: 1;
  margin-bottom: 0.2em;
}

.process-step h3 {
  font-size: 1.2rem;
  margin: 0 0 0.25em;
}

.process-step p {
  margin: 0;
  line-height: 1.7;
}

.process-step-tilt-left {
  border-top: 6px solid #8E44AD;
}

.process-step-tilt-right {
  border-top: 6px solid #5A2A6C;
}

.process-step-feature {
  background: linear-gradient(165deg, #34283A 0%, #5A2A6C 100%);
  color: #FFFFFF;
  border: none;
  box-shadow: 0 24px 40px rgba(52, 40, 58, 0.22);
}

.process-step-feature .step-number,
.process-step-feature h3,
.process-step-feature p {
  color: #FFFFFF;
}

.process-step-soft {
  background: rgba(255, 255, 255, 0.88);
  border-top: 6px solid rgba(90, 42, 108, 0.45);
}

.intro-content {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 3em;
}

.intro-text {
  flex: 1;
  min-width: 290px;
}

.intro-super {
  color: rgba(52, 40, 58, 0.55);
}

.intro-text h2 {
  font-family: 'Bebas Neue', sans-serif;
  font-size: clamp(2.4rem, 4.8vw, 3.6rem);
  margin-bottom: 0.35em;
  color: var(--text-dark);
  line-height: 0.96;
}

.intro-text p {
  font-size: 1.08rem;
  line-height: 1.8;
  color: #333;
}

.intro-points {
  display: flex;
  flex-wrap: wrap;
  gap: 0.8em;
  margin-top: 1.4em;
}

.intro-points span {
  background: rgba(90, 42, 108, 0.08);
  color: var(--text-dark);
  padding: 0.75em 1em;
  border-radius: 999px;
  font-weight: bold;
  font-size: 0.95rem;
}

.intro-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 1.2em;
  margin-top: 1.7em;
}

.text-link {
  color: var(--accent);
  text-decoration: none;
  font-weight: bold;
}

.text-link:hover {
  text-decoration: underline;
}

.intro-image {
  flex: 1;
  display: flex;
  justify-content: center;
  min-width: 280px;
}

.intro-image-frame {
  position: relative;
  width: min(100%, 430px);
  padding: 1.1em;
  border-radius: 32px;
  background: linear-gradient(180deg, rgba(142, 68, 173, 0.2) 0%, rgba(90, 42, 108, 0.1) 100%);
}

.intro-image img {
  width: 100%;
  aspect-ratio: 4 / 5;
  height: auto;
  object-fit: cover;
  border-radius: 26px;
  border: 6px solid rgba(255, 255, 255, 0.7);
  box-shadow: 0 18px 40px rgba(52, 40, 58, 0.18);
}

.home-profile-photo {
  object-position: center 22%;
}

.intro-floating-card {
  position: absolute;
  left: -1.2em;
  bottom: 1.6em;
  max-width: 240px;
  background: rgba(52, 40, 58, 0.94);
  color: #FFFFFF;
  border-radius: 22px;
  padding: 1em 1.1em;
  box-shadow: 0 16px 32px rgba(52, 40, 58, 0.24);
}

.floating-label {
  margin: 0 0 0.35em;
  font-family: 'Bebas Neue', sans-serif;
  letter-spacing: 1px;
  color: rgba(255, 255, 255, 0.72);
}

.floating-title {
  margin: 0;
  line-height: 1.5;
}


.cta-button {
  display: inline-block;
  background: linear-gradient(135deg, var(--accent) 0%, var(--bg-main) 100%);
  color: white;
  padding: 0.9em 1.6em;
  border-radius: 999px;
  text-decoration: none;
  font-weight: bold;
  font-family: Arial, sans-serif;
  transition: transform 0.2s ease, box-shadow 0.3s ease, background-color 0.3s ease;
}

.cta-button:hover {
  background: linear-gradient(135deg, var(--accent-hover) 0%, var(--accent) 100%);
}

.about-section {
  background-color: #8E44AD;
  min-height: 100vh;
  padding: 6em 2em;
  color: white;
}

.about-shell {
  max-width: 1120px;
  margin: 0 auto;
}

.about-board {
  display: flex;
  flex-direction: column;
  gap: 1.2em;
}

.about-hero-layout {
  display: grid;
  grid-template-columns: 1.05fr 0.95fr;
  gap: 1.2em;
  align-items: stretch;
}

.about-card {
  border-radius: 30px;
  padding: 1.6em;
  box-shadow: 0 16px 30px rgba(52, 40, 58, 0.14);
}

.about-card-main {
  background: linear-gradient(145deg, #34283A 0%, #5A2A6C 100%);
  color: #FFFFFF;
}

.about-card-main h1 {
  margin: 0 0 0.3em;
  font-family: 'Bebas Neue', sans-serif;
  font-size: clamp(2.2rem, 4.2vw, 3.8rem);
  line-height: 0.94;
  letter-spacing: 0.5px;
  max-width: 11.5ch;
}

.about-lead {
  font-size: 1.04rem;
  line-height: 1.8;
  margin: 0;
  color: rgba(255, 255, 255, 0.86);
  max-width: 40ch;
}

.about-visual-stack {
  display: grid;
  grid-template-rows: auto auto;
  gap: 1em;
}

.about-photo-card {
  background: rgba(245, 241, 234, 0.1);
  padding: 0.9em;
  border-radius: 30px;
  box-shadow: 0 16px 30px rgba(52, 40, 58, 0.16);
}

.about-photo-card-single {
  width: 100%;
  max-width: 420px;
  justify-self: end;
}

.about-foto {
  width: 100%;
  aspect-ratio: 4 / 5;
  object-fit: cover;
  border-radius: 24px;
  display: block;
  border: 5px solid rgba(245, 241, 234, 0.72);
}

.about-foto-wide {
  aspect-ratio: 4 / 4.8;
}

.about-filming-photo {
  object-position: center 34%;
}


.about-card-quote {
  background: #F5F1EA;
  color: #34283A;
}

.about-card-quote p {
  margin: 0;
  font-family: 'Bebas Neue', sans-serif;
  font-size: 1.6rem;
  line-height: 1;
}

.about-content-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1.2em;
}

.about-card-light {
  background: #F5F1EA;
  color: var(--text-dark);
}

.about-card-dark {
  background: linear-gradient(145deg, #34283A 0%, #5A2A6C 100%);
  color: #FFFFFF;
}

.about-card-wide {
  grid-column: 1 / -1;
  background: linear-gradient(180deg, #F5F1EA 0%, #fffaf4 100%);
  color: var(--text-dark);
}

.about-card-wide p:last-of-type,
.about-card-light p:last-of-type,
.about-card-dark p:last-of-type {
  margin: 0;
  line-height: 1.8;
}

.about-card-dark p:last-of-type {
  color: rgba(255, 255, 255, 0.84);
}

.about-strip {
  margin-top: 1.2em;
  display: flex;
  flex-wrap: wrap;
  gap: 0.7em;
}

.about-strip span {
  background: rgba(90, 42, 108, 0.08);
  border: 1px solid rgba(90, 42, 108, 0.12);
  color: var(--text-dark);
  padding: 0.7em 0.95em;
  border-radius: 999px;
  font-weight: bold;
  font-size: 0.88rem;
}

.work-section {
  background-color: #8E44AD;
  min-height: 100vh;
  padding: 3em 2em;
  color: white;
}

.work-wrapper {
  max-width: 1200px;
  margin: 0 auto;
  text-align: center;
}

.work-wrapper h1 {
  font-family: 'Bebas Neue', sans-serif;
  font-size: clamp(2.8rem, 5vw, 4.5rem);
  color: white;
  margin: 0;
}

.work-wrapper p {
  font-size: 1.05rem;
  margin-bottom: 1em;
}

.work-page-intro {
  margin-bottom: 3.2em;
}

.work-page-intro p:last-child {
  max-width: 46ch;
  line-height: 1.8;
  margin: 0.7em auto 0;
}

.work-grid {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 1.4em;
  margin-bottom: 0;
}

.work-card {
  background: #F5F1EA;
  color: #333;
  border-radius: 22px;
  padding: 1.1em;
  width: 290px;
  text-align: center;
  box-shadow: 0 10px 20px rgba(52,40,58,0.08);
  transition: transform 0.2s ease;
}


.work-card img {
  width: 100%;
  border-radius: 12px;
  margin-bottom: 1em;
}

.photo-wrapper {
  aspect-ratio: 4 / 5;
  overflow: hidden;
  border-radius: 16px;
  background: #34283A;
}

.photo-wrapper img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  margin-bottom: 0;
}

.work-card h3 {
  font-size: 1.2em;
  margin-bottom: 1em;
}

.contact-section {
  position: relative;
  padding: 5.5em 2em 6.5em;
  overflow: hidden;
}

.contact-section::before,
.contact-section::after {
  content: "";
  position: absolute;
  border-radius: 999px;
  pointer-events: none;
}

.contact-section::before {
  width: 360px;
  height: 360px;
  top: 80px;
  left: -120px;
  background: rgba(245, 241, 234, 0.12);
  animation: contactFloatOne 16s ease-in-out infinite;
}

.contact-section::after {
  width: 280px;
  height: 280px;
  right: -60px;
  bottom: 70px;
  background: rgba(52, 40, 58, 0.22);
  animation: contactFloatTwo 20s ease-in-out infinite;
}

.contact-wrapper {
  position: relative;
  z-index: 1;
  max-width: 1180px;
  margin: 0 auto;
  padding: 0;
  color: var(--text-dark);
}

.contact-layout {
  display: grid;
  grid-template-columns: minmax(320px, 0.95fr) minmax(0, 1.1fr);
  gap: 1.6em;
  align-items: start;
}

.contact-side {
  display: grid;
  gap: 1.4em;
}

.contact-card {
  border-radius: 28px;
  padding: 2.1em;
  box-shadow: var(--shadow-soft);
  border: 1px solid rgba(90, 42, 108, 0.12);
}

.contact-card-main {
  background: linear-gradient(145deg, rgba(52, 40, 58, 0.96), rgba(90, 42, 108, 0.92));
  color: var(--text-light);
}

.contact-card-main h1 {
  font-family: 'Bebas Neue', sans-serif;
  font-size: clamp(3.2rem, 7vw, 5.6rem);
  line-height: 0.95;
  letter-spacing: 1px;
  margin: 0.18em 0 0.2em;
}

.contact-intro {
  max-width: 28ch;
  margin: 0 0 1.8em;
  font-size: 1.05rem;
}

.contact-tag-row {
  display: flex;
  flex-wrap: wrap;
  gap: 0.7em;
}

.contact-tag-row span {
  display: inline-flex;
  align-items: center;
  padding: 0.68em 1.1em;
  border-radius: 999px;
  background: rgba(245, 241, 234, 0.12);
  border: 1px solid rgba(245, 241, 234, 0.2);
  font-size: 0.9rem;
  letter-spacing: 0.04em;
}

.contact-side-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1.2em;
}

.contact-card-dark {
  background: rgba(52, 40, 58, 0.92);
  color: var(--text-light);
}

.contact-card-soft {
  background: rgba(245, 241, 234, 0.9);
  color: var(--text-dark);
}

.contact-photo-card {
  padding: 0.85em;
  overflow: hidden;
}

.contact-photo-card img {
  width: 100%;
  height: 210px;
  object-fit: cover;
  display: block;
  border-radius: 20px;
  margin-bottom: 0.9em;
}

.contact-photo-note {
  margin: 0;
  padding: 0 0.2em 0.1em;
  line-height: 1.6;
}

.contact-mini-label {
  margin: 0 0 1em;
  font-family: 'Bebas Neue', sans-serif;
  font-size: 1.2rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.contact-links {
  display: grid;
  gap: 0.85em;
}

.contact-links a {
  color: inherit;
  text-decoration: none;
  font-weight: bold;
}

.contact-links a:hover {
  opacity: 0.72;
}

.contact-note {
  margin: 0;
  line-height: 1.7;
}

.contact-form-card {
  background: rgba(245, 241, 234, 0.98);
}

@keyframes contactFloatOne {
  0% {
    transform: translate3d(0, 0, 0) scale(1);
  }
  50% {
    transform: translate3d(44px, -30px, 0) scale(1.07);
  }
  100% {
    transform: translate3d(0, 0, 0) scale(1);
  }
}

@keyframes contactFloatTwo {
  0% {
    transform: translate3d(0, 0, 0) scale(1);
  }
  50% {
    transform: translate3d(-40px, 30px, 0) scale(0.94);
  }
  100% {
    transform: translate3d(0, 0, 0) scale(1);
  }
}

.contact-button {
  margin-top: 1.4em;
}

.contact-button:hover {
  background: linear-gradient(135deg, var(--accent-hover) 0%, var(--accent) 100%);
}
.work-section {
  background-color: #8E44AD;
  padding: 6em 2em;
  color: white;
  text-align: center;
}

.contact-form {
  display: flex;
  flex-direction: column;
  gap: 1.35em;
  text-align: left;
}

.contact-field-group {
  display: grid;
  gap: 0.7em;
}

.contact-form label {
  font-weight: bold;
  font-size: 0.98em;
  color: var(--text-dark);
}

.contact-form input,
.contact-form textarea {
  width: 100%;
  padding: 0.95em 1.1em;
  border-radius: 18px;
  border: 1px solid rgba(90, 42, 108, 0.18);
  font-size: 1em;
  background: rgba(255, 255, 255, 0.86);
  color: var(--text-dark);
  box-sizing: border-box;
}

.contact-form input:focus,
.contact-form textarea:focus {
  border-color: var(--accent);
  outline: none;
  box-shadow: 0 0 8px rgba(90, 42, 108, 0.25);
}

.contact-form button {
  align-self: flex-start;
  margin-top: 0.4em;
}

.contact-form button:hover {
  background-color: var(--bg-dark);
}

.service-options {
  display: flex;
  flex-wrap: wrap;
  gap: 0.85em;
}

.checkbox-wrapper {
  display: flex;
  align-items: center;
  gap: 0.72em;
  padding: 0.82em 1em;
  border-radius: 16px;
  border: 1px solid rgba(90, 42, 108, 0.16);
  background: rgba(255, 255, 255, 0.72);
  cursor: pointer;
  transition: transform 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease;
}

.checkbox-wrapper:hover {
  transform: translateY(-2px);
  border-color: rgba(90, 42, 108, 0.3);
  box-shadow: 0 8px 18px rgba(52, 40, 58, 0.08);
}

.checkbox-wrapper input[type="checkbox"] {
  width: 18px;
  height: 18px;
  accent-color: var(--accent);
  cursor: pointer;
  margin: 0;
  flex-shrink: 0;
}

.checkbox-wrapper span {
  font-size: 0.95em;
  color: var(--text-dark);
  cursor: pointer;
}

.work-wrapper {
  max-width: 1200px;
  margin: 0 auto;
}

.work-category {
  font-family: 'Bebas Neue', sans-serif;
  font-size: clamp(2rem, 4vw, 3rem);
  margin: 0.1em 0 0;
  color: #FFFFFF;
}

.work-block {
  margin-bottom: 4.4em;
}

.work-block:last-of-type {
  margin-bottom: 0;
}

.work-block-head {
  margin-bottom: 1.3em;
}

.work-block-head-sub {
  margin-top: 1.35em;
  margin-bottom: 1em;
}

.work-block-action {
  display: flex;
  justify-content: center;
  margin-top: 1.5em;
}

.work-block-action .cta-button {
  background: rgba(52, 40, 58, 0.9);
  color: var(--text-light);
  padding: 0.9em 1.55em;
  border: 1px solid rgba(245, 241, 234, 0.16);
  box-shadow: 0 14px 30px rgba(24, 16, 28, 0.24);
  position: relative;
}

.work-block-action .cta-button::after {
  content: "→";
  display: inline-block;
  margin-left: 0.5em;
  transition: transform 0.2s ease;
}

.work-block-action .cta-button:hover {
  background: rgba(90, 42, 108, 0.98);
  color: var(--text-light);
  border-color: rgba(245, 241, 234, 0.24);
}

.work-block-action .cta-button:hover::after {
  transform: translateX(3px);
}

.work-detail-intro {
  max-width: 760px;
}

.work-back-button {
  margin-top: 1.5em;
}


.work-grid {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 1.2em;
  margin-bottom: 0;
}

.work-card {
  background: #F5F1EA;
  color: #333;
  border-radius: 22px;
  padding: 1.1em;
  width: 290px;
  text-align: center;
  box-shadow: 0 10px 20px rgba(52,40,58,0.08);
  transition: transform 0.2s ease;
}

.work-card:hover {
  transform: translateY(-5px);
}

.work-card h3 {
  margin-bottom: 0.5em;
  font-size: 1.2em;
}

.work-card p {
  margin-bottom: 1em;
  font-size: 0.95em;
}

.work-grid-wide .work-card {
  width: min(100%, 340px);
}

.work-grid-horizontal {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(320px, 430px));
  justify-content: center;
  gap: 1.2em;
}

.work-grid-horizontal .work-card {
  width: auto;
}

.cta-button {
  background-color: var(--accent);
  color: white;
  padding: 0.6em 1.2em;
  border-radius: 30px;
  text-decoration: none;
  font-weight: bold;
  font-family: Arial, sans-serif;
  transition: background-color 0.3s ease;
}

.cta-button:hover {
  background-color: var(--bg-dark);
}

.short-wrapper {
  position: relative;
  width: 100%;
  padding-top: 177.77%; /* 9:16 verhouding → VERTICAAL */
  border-radius: 12px;
  overflow: hidden;
  margin-bottom: 0;
}


.short-wrapper iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border: none;
}

.video-wrapper {
  position: relative;
  width: 100%;
  padding-top: 56.25%; /* 16:9 verhouding */
  border-radius: 12px;
  overflow: hidden;
  margin-bottom: 0;
}

.video-wrapper iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border: none;
}

/* ░░░ KLANTEN (CLIENTS) ░░░ */
.clients-section {
  background-color: var(--bg-main);
  padding: 6em 2em;
  color: white;
  text-align: center;
}

.clients-wrapper {
  max-width: 1200px;
  margin: 0 auto;
}

.clients-wrapper h1 {
  font-family: 'Bebas Neue', sans-serif;
  font-size: 2em;
  color: white;
  margin: 0 0 0.3em;
  letter-spacing: 1px;
}

.clients-wrapper p {
  font-size: 1.1em;
  opacity: 0.95;
  margin-bottom: 2em;
}

/* Grid met kaarten */
.clients-grid {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 1.5em;
  align-items: stretch;
}

/* Kaarten (voor nu met klantnamen; straks ook geschikt voor logo's) */
.client-card {
  background: white;
  color: var(--text-dark);
  border-radius: 24px;
  width: 100%;
  max-width: 280px;  /* iets groter gemaakt */
  aspect-ratio: 1 / 1; /* perfect vierkant */
  padding: 1.8em;      /* wat ruimere binnenkant */
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 8px 15px rgba(0,0,0,0.1);
  transition: transform 0.15s ease, box-shadow 0.2s ease;
}

.client-card:hover,
.client-card:focus {
  transform: translateY(-4px);
  box-shadow: 0 12px 22px rgba(0,0,0,0.12);
  outline: none;
}

/* Alvast klaar voor logo's (later): */
.client-card img {
  max-width: 80%;
  max-height: 60px;
  object-fit: contain;
  display: block;
}

/* Responsive breekpunten */
@media (max-width: 1100px) {
  .clients-grid { grid-template-columns: repeat(4, 1fr); }
}
@media (max-width: 900px) {
  .clients-grid { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 650px) {
  .clients-grid { grid-template-columns: repeat(2, 1fr); }
  .client-card { min-height: 96px; padding: 1.2em; }
}
@media (max-width: 420px) {
  .clients-grid { grid-template-columns: 1fr; }
}

/* ░░░ KLANTEN: 3 BREDE KAARTEN MET RUIMTE ░░░ */
.clients-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr); /* ⬅️ 4 naast elkaar */
  gap: 30px;
}


.client-card {
  background: white;
  color: var(--text-dark);
  border-radius: 24px;
  width: 240px;        /* ✔ kleiner formaat */
  height: 240px;       /* ✔ vierkant */
  padding: 1.8em;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 8px 15px rgba(0,0,0,0.1);
  transition: transform 0.15s ease, box-shadow 0.2s ease;
}

.client-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 12px 22px rgba(0,0,0,0.12);
}

.client-card img {
  max-width: 85%;
  max-height: 85%;
  object-fit: contain;
  display: block;
}

/* Responsive: mooi op tablet en mobiel */
@media (max-width: 900px) {
  .client-card {
    width: 200px;
    height: 200px;
  }
}

@media (max-width: 600px) {
  .client-card {
    width: 100%;
    max-width: 280px;
    height: auto;
    aspect-ratio: 1 / 1;
  }
}

/* ░░░ KLANTEN BLOK ░░░ */
.clients-section {
  background-color: var(--bg-main);
  padding: 6em 2em;
  color: white;
  text-align: center;
}

.clients-wrapper {
  max-width: 1200px;
  margin: 0 auto;
}

.clients-wrapper h1 {
  font-family: 'Bebas Neue', sans-serif;
  font-size: 3em;
  color: white;
  margin-bottom: 0.3em;
}

.clients-wrapper p {
  font-size: 1.1em;
  opacity: 0.95;
  margin-bottom: 2em;
}

/* GRID */
.clients-grid {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 2em;
}

/* WITTE VIERKANTEN */
.client-card {
  background: var(--surface);
  color: var(--text-dark);
  border-radius: 24px; /* ronde hoeken */
  width: 240px;
  height: 240px;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 8px 15px rgba(0,0,0,0.1);
  transition: transform 0.15s ease, box-shadow 0.2s ease;
}

.client-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 12px 22px rgba(0,0,0,0.12);
}

/* LOGO'S BINNENIN */
.client-card img {
  width: 85%;
  height: auto;
  object-fit: contain;
  border-radius: 12px; /* afgeronde hoeken voor het logo zelf */
  display: block;
  transition: transform 0.2s ease;
}

.client-card:hover img {
  transform: scale(1.05); /* subtiel pop-effect */
}

/* RESPONSIVE */
@media (max-width: 900px) {
  .client-card {
    width: 200px;
    height: 200px;
  }
}

@media (max-width: 600px) {
  .client-card {
    width: 100%;
    max-width: 280px;
    aspect-ratio: 1 / 1;
  }
}

.client-card img {
  width: 100%;          /* logo mag de volle breedte van het vierkant gebruiken */
  height: 100%;         /* vult ook de hoogte */
  object-fit: contain;  /* houdt de verhoudingen van het logo */
  border-radius: 16px;  /* zachte hoekjes */
  display: block;
  transform: scale(1.1); /* maakt het logo direct iets groter binnen het vlak */
  transition: transform 0.2s ease;
}

.client-card:hover img {
  transform: scale(1.18); /* bij hover ietsje groter */
}

/* ░░░ KAART MET LOGO + NAAM (strak & gecentreerd) ░░░ */
.client-card {
  background: var(--surface);
  color: var(--text-dark);
  border-radius: 24px;
  width: 240px;
  height: 300px;               /* iets langer dan vierkant */
  padding: 14px 14px 16px;
  box-shadow: 0 8px 15px rgba(0,0,0,0.1);
  transition: transform 0.15s ease, box-shadow 0.2s ease;

  /* Lay-out: logo boven (flex-ruimte), naam onder (auto) */
  display: grid;
  grid-template-rows: 1fr auto;
  align-items: center;
  justify-items: center;
  row-gap: 12px;
}

.client-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 12px 22px rgba(0,0,0,0.12);
}

/* Vast ‘logo-gebied’ zodat alle kaarten gelijk ogen */
.client-card .logo-area {
  width: 100%;
  height: 70%;                 /* ruimte voor het logo */
  display: flex;
  align-items: center;
  justify-content: center;
}

/* Logo zelf: afgeronde hoeken, groter, niet vervormen */
.client-card img {
  max-width: 85%;
  max-height: 100%;
  height: auto;
  object-fit: contain;
  border-radius: 14px;         /* ✅ afgeronde hoeken logo */
  display: block;
  transition: transform 0.2s ease;
}

.client-card:hover img {
  transform: scale(1.05);
}

/* Klantnaam: duidelijk, gecentreerd, consistent */
.client-name {
  font-family: 'Bebas Neue', sans-serif;
  font-size: 1.5em;            /* ✅ groter en leesbaar */
  line-height: 1;
  text-align: center;
  letter-spacing: 0.5px;
  color: var(--text-dark);
  margin: 0;                   /* geen rare extra ruimte */
}

.client-card-538 img {
  max-width: 72%;
  transform: none;
}

.client-card-538:hover img {
  transform: scale(1.03);
}

/* Responsiveness */
@media (max-width: 900px) {
  .client-card { width: 210px; height: 270px; }
  .client-name { font-size: 1.4em; }
}
@media (max-width: 600px) {
  .client-card { width: 100%; max-width: 280px; height: 320px; }
  .client-name { font-size: 1.6em; }
}

.project-section {
  position: relative;
  padding: 100px 20px;
  background: linear-gradient(180deg, #8E44AD 0%, #5A2A6C 100%);
  overflow: hidden;
}

.project-section::before,
.project-section::after {
  content: "";
  position: absolute;
  border-radius: 999px;
  pointer-events: none;
}

.project-section::before {
  width: 340px;
  height: 340px;
  top: 70px;
  left: -110px;
  background: rgba(245, 241, 234, 0.12);
}

.project-section::after {
  width: 240px;
  height: 240px;
  right: -60px;
  bottom: 80px;
  background: rgba(52, 40, 58, 0.18);
}

.project-wrapper {
  position: relative;
  z-index: 1;
  max-width: 980px;
  margin: 0 auto;
  background: var(--surface);
  border-radius: 30px;
  padding: 3em;
  box-shadow: var(--shadow-soft);
}

.project-intro {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(240px, 0.85fr);
  gap: 2em;
  align-items: center;
  margin-bottom: 2em;
}

.project-copy {
  text-align: left;
}

.project-section h1 {
  font-family: 'Bebas Neue', sans-serif;
  font-size: clamp(3rem, 6vw, 4.7rem);
  line-height: 0.95;
  margin: 0.12em 0 0.22em;
  color: var(--text-dark);
}

.project-visual-card {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 260px;
  padding: 1.8em;
  border-radius: 26px;
  background: linear-gradient(145deg, rgba(90, 42, 108, 0.12), rgba(255, 255, 255, 0.9));
  border: 1px solid rgba(90, 42, 108, 0.12);
}

.project-logo {
  max-width: 100%;
  max-height: 170px;
  margin: 0;
}

.project-section p {
  font-size: 1.1rem;
  line-height: 1.6;
  color: var(--text-dark);
}

.client-work-page .project-wrapper {
  max-width: 900px;
}

.client-work-hero {
  text-align: center;
  margin-bottom: 2.2em;
}

.client-work-hero .section-label {
  margin-bottom: 0.35em;
}

.client-work-hero h1 {
  margin-top: 0;
}

.client-work-subtitle {
  max-width: 560px;
  margin: 0 auto;
}

.project-copy p {
  margin: 0 0 1.25em;
}

.project-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75em;
}

.project-tags span {
  display: inline-flex;
  align-items: center;
  padding: 0.7em 1.05em;
  border-radius: 999px;
  background: rgba(90, 42, 108, 0.08);
  border: 1px solid rgba(90, 42, 108, 0.14);
  color: var(--text-dark);
  font-size: 0.92rem;
}

.project-meta-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1.2em;
  margin-bottom: 2em;
}

.project-work-button {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.45em;
  width: min(100%, 340px);
  margin: 0 auto 1.2em;
  padding: 0.95em 1.4em;
  background: linear-gradient(135deg, var(--accent) 0%, var(--bg-dark) 100%);
  color: #FFFFFF;
  border: 1px solid rgba(255, 255, 255, 0.12);
  box-shadow: 0 18px 34px rgba(52, 40, 58, 0.22);
  position: relative;
  font-size: 1rem;
  letter-spacing: 0.03em;
}

.project-work-button::after {
  content: "→";
  transition: transform 0.2s ease;
}

.project-work-button:hover::after {
  transform: translateX(3px);
}

.project-work-button:hover {
  background: linear-gradient(135deg, var(--accent-hover) 0%, var(--accent) 100%);
  color: #FFFFFF;
  border-color: rgba(255, 255, 255, 0.18);
  box-shadow: 0 20px 38px rgba(52, 40, 58, 0.26);
}

.project-work-section {
  margin: 0 0 1.6em;
}

.client-work-page .project-work-section {
  margin-top: 0.5em;
}

.project-work-head {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 1em;
  margin: 1.6em 0 1em;
  flex-wrap: wrap;
}

.project-work-head h2 {
  margin: 0;
  font-family: 'Bebas Neue', sans-serif;
  font-size: clamp(2rem, 4vw, 3rem);
  line-height: 0.95;
  color: var(--text-dark);
}

.project-work-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1.2em;
}

.project-work-card {
  background: rgba(255, 255, 255, 0.8);
  border: 1px solid rgba(90, 42, 108, 0.12);
  border-radius: 22px;
  padding: 1em;
  box-shadow: 0 12px 24px rgba(52, 40, 58, 0.1);
  overflow: hidden;
}

.project-work-card .short-wrapper,
.project-work-card .video-wrapper {
  margin-bottom: 0;
}

.project-work-card-text {
  display: flex;
  align-items: center;
  min-height: 220px;
}

.project-work-card-text h3 {
  margin: 0 0 0.45em;
  font-family: 'Bebas Neue', sans-serif;
  font-size: 2rem;
  line-height: 0.95;
  color: var(--text-dark);
}

.project-work-card-text p {
  margin: 0;
  line-height: 1.6;
  color: var(--text-dark);
}

@media (max-width: 760px) {
  .project-work-grid {
    grid-template-columns: 1fr;
  }
}

.portfolio-hero { padding: clamp(5rem, 10vw, 9rem) clamp(1.5rem, 10vw, 10rem) clamp(4rem, 7vw, 6rem); background: var(--theatre-ink); }
.portfolio-hero h1, .portfolio-feature h2, .archive-heading h2 { font-family: "Playfair Display", Georgia, serif; font-weight: 500; letter-spacing: -.045em; line-height: .98; margin: 0; font-size: clamp(3.4rem, 6.7vw, 6.7rem); }
.portfolio-hero h1 em, .portfolio-feature h2 em, .archive-heading h2 em { color: var(--theatre-gold); }
.portfolio-hero > p:last-child { max-width: 33rem; margin: 2rem 0 0; line-height: 1.7; color: rgba(241,236,227,.7); }
.portfolio-feature { background: #292123; display: grid; grid-template-columns: 1.12fr .88fr; align-items: stretch; }
.portfolio-feature-image { min-height: 620px; overflow: hidden; }
.portfolio-feature-image img { height: 100%; width: 100%; display: block; object-fit: cover; object-position: center 38%; }
.portfolio-feature > div:last-child { padding: clamp(3.5rem, 7vw, 7rem); align-self: center; }
.portfolio-feature > div:last-child > p:not(.eyebrow) { max-width: 26rem; color: rgba(241,236,227,.72); line-height: 1.7; margin: 1.7rem 0 2rem; }
.portfolio-archive { color: var(--theatre-ink); background: var(--theatre-paper); padding: clamp(5rem, 9vw, 8rem) clamp(1.5rem, 10vw, 10rem); display: grid; grid-template-columns: .8fr 1.2fr; gap: clamp(3rem, 7vw, 8rem); }
.archive-heading > p:last-child { max-width: 28rem; line-height: 1.7; color: #625a58; margin: 1.7rem 0 0; }
.archive-grid { display: grid; grid-template-columns: repeat(3, 1fr); align-self: end; }
.archive-card { min-height: 270px; padding: 1.6rem; display: flex; flex-direction: column; background: #e2d9ca; color: var(--theatre-ink); text-decoration: none; border-right: 1px solid rgba(28,23,24,.15); transition: background .2s, transform .2s; }
.archive-card:hover { transform: translateY(-6px); background: var(--theatre-gold); }
.archive-card span { color: var(--theatre-wine); font-size: .72rem; letter-spacing: .09em; }
.archive-card h3 { font-family: "Playfair Display", Georgia, serif; font-size: 1.8rem; font-weight: 500; margin: auto 0 .5rem; }
.archive-card p { line-height: 1.55; margin: 0 0 1.6rem; font-size: .9rem; }
.archive-card b { font-size: .69rem; letter-spacing: .09em; text-transform: uppercase; }
.archive-card-dark { background: var(--theatre-wine); color: var(--theatre-paper); }
.archive-card-dark span { color: var(--theatre-gold); }
@media (max-width: 760px) { .portfolio-feature, .portfolio-archive { grid-template-columns: 1fr; } .portfolio-feature-image { min-height: 440px; } .archive-grid { grid-template-columns: 1fr; } .archive-card { min-height: 190px; border-bottom: 1px solid rgba(28,23,24,.15); } }

.about-theatre, .contact-theatre { display: grid; grid-template-columns: 1fr 1fr; min-height: 680px; }
.about-theatre-copy, .contact-theatre > div:first-child { padding: clamp(4rem, 9vw, 8rem) clamp(1.5rem, 9vw, 9rem); align-self: center; }
.about-theatre h1, .contact-theatre h1, .about-statement h2 { font-family: "Playfair Display", Georgia, serif; font-weight: 500; line-height: .98; letter-spacing: -.045em; font-size: clamp(3.3rem, 6vw, 6.4rem); margin: 0; }
.about-theatre h1 em, .contact-theatre h1 em, .about-statement h2 em { color: var(--theatre-gold); }
.about-theatre-copy > p:not(.eyebrow), .contact-theatre > div > p:not(.eyebrow) { max-width: 31rem; line-height: 1.7; color: rgba(241,236,227,.75); margin: 1.6rem 0 0; }
.about-theatre-image { min-height: 680px; position: relative; overflow: hidden; }
.about-theatre-image img { width: 100%; height: 100%; object-fit: cover; object-position: center; filter: saturate(.75); }
.about-theatre-image p { position: absolute; bottom: 1.5rem; right: 1.5rem; text-align: right; margin: 0; font-family: "Playfair Display", Georgia, serif; line-height: 1.4; }
.about-theatre-image p span { font-family: "DM Sans", Arial, sans-serif; color: rgba(241,236,227,.66); text-transform: uppercase; letter-spacing: .08em; font-size: .62rem; }
.about-statement { background: var(--theatre-paper); color: var(--theatre-ink); padding: clamp(5rem, 10vw, 9rem) clamp(1.5rem, 10vw, 10rem); display: grid; grid-template-columns: 1.15fr .85fr; gap: 7vw; }
.about-statement h2 { font-size: clamp(2.8rem, 5vw, 5.2rem); }
.about-statement div { align-self: end; }
.about-statement div p { font-family: "Playfair Display", Georgia, serif; font-size: 1.35rem; line-height: 1.55; margin: 0 0 2rem; }
.contact-theatre { background: var(--theatre-wine); }
.contact-notes { display: flex; flex-wrap: wrap; gap: .5rem; margin-top: 2rem; }
.contact-notes span { border: 1px solid rgba(241,236,227,.35); color: rgba(241,236,227,.85); font-size: .69rem; text-transform: uppercase; letter-spacing: .07em; padding: .6rem .75rem; }
.contact-social { display: flex; gap: 1.3rem; margin-top: 2.4rem !important; }
.contact-social a { color: var(--theatre-paper); font-size: .72rem; letter-spacing: .09em; text-transform: uppercase; text-decoration: none; border-bottom: 1px solid rgba(241,236,227,.5); padding-bottom: .3rem; }
.theatre-form { background: var(--theatre-paper); color: var(--theatre-ink); padding: clamp(3rem, 8vw, 7rem); display: flex; flex-direction: column; justify-content: center; gap: 1.3rem; }
.theatre-form label { font-size: .7rem; text-transform: uppercase; letter-spacing: .1em; font-weight: 700; display: grid; gap: .7rem; }
.theatre-form input, .theatre-form textarea, .theatre-form select { font: inherit; font-size: 1rem; color: var(--theatre-ink); border: 0; border-bottom: 1px solid rgba(28,23,24,.35); background: transparent; padding: .35rem 0 .75rem; border-radius: 0; outline: none; }
.theatre-form textarea { resize: vertical; }
.theatre-form .theatre-button { align-self: start; margin-top: .6rem; border: 0; cursor: pointer; }
@media (max-width: 760px) { .about-theatre, .contact-theatre, .about-statement { grid-template-columns: 1fr; } .about-theatre-image { min-height: 450px; } .about-theatre-copy, .contact-theatre > div:first-child { padding-top: 5rem; padding-bottom: 5rem; } .theatre-form { padding: 3rem 1.5rem; } }

@media (max-width: 760px) {
  .contact-theatre {
    grid-template-columns: minmax(0, 1fr);
  }

  .contact-theatre > *,
  .theatre-form label,
  .theatre-form input,
  .theatre-form textarea,
  .theatre-form select {
    min-width: 0;
    box-sizing: border-box;
  }

  .contact-theatre > * {
    width: 100%;
    max-width: 100%;
  }

  .theatre-form input,
  .theatre-form textarea,
  .theatre-form select {
    width: 100%;
    max-width: 100%;
  }
}

.production-intro { padding: clamp(3rem, 7vw, 6rem) clamp(1.5rem, 10vw, 10rem) clamp(3.5rem, 7vw, 6rem); }
.back-to-work { display: inline-block; color: rgba(241,236,227,.75); margin-bottom: 4rem; text-decoration: none; font-size: .72rem; text-transform: uppercase; letter-spacing: .1em; }
.production-intro h1 { font: 500 clamp(3.2rem, 6vw, 6.4rem)/.98 "Playfair Display", Georgia, serif; letter-spacing: -.045em; margin: 0; }
.production-intro h1 em { color: var(--theatre-gold); }
.production-intro > p:last-child { color: rgba(241,236,227,.7); max-width: 31rem; line-height: 1.7; margin: 1.7rem 0 0; }
.production-gallery { background: var(--theatre-paper); padding: clamp(1rem, 3vw, 3rem) clamp(1.5rem, 7vw, 7rem) clamp(5rem, 9vw, 8rem); display: grid; grid-template-columns: 1.2fr .8fr; gap: clamp(1rem, 2vw, 2rem); }
.production-gallery img { width: 100%; height: 100%; min-height: 400px; object-fit: cover; display: block; }
.production-gallery img:first-child { grid-row: span 2; min-height: 820px; object-position: center 35%; }
.production-gallery img:nth-child(2) { object-position: center; }
.production-gallery img:nth-child(3) { object-position: center; }
@media (max-width: 760px) { .production-gallery { grid-template-columns: 1fr; } .production-gallery img:first-child, .production-gallery img { min-height: 440px; grid-row: auto; } }

/* Keep the theatre colour palette, but bring the typography back to Fleur's
   more direct, graphic style. */
.fleur-site, .fleur-site .theatre-button, .fleur-site .theatre-form input, .fleur-site .theatre-form textarea, .fleur-site .theatre-form select { font-family: "Dosis", Arial, sans-serif; }
.fleur-site .theatre-hero h1, .fleur-site .theatre-intro h2, .fleur-site .theatre-services h2, .fleur-site .theatre-cta h2, .fleur-site .portfolio-hero h1, .fleur-site .archive-heading h2, .fleur-site .production-intro h1 { font-family: "Bebas Neue", sans-serif; font-style: normal; letter-spacing: .01em; line-height: .94; }
.fleur-site .theatre-hero h1 em, .fleur-site .theatre-intro h2 em, .fleur-site .theatre-services h2 em, .fleur-site .theatre-cta h2 em, .fleur-site .portfolio-hero h1 em, .fleur-site .archive-heading h2 em, .fleur-site .production-intro h1 em { font-family: inherit; font-style: normal; }
.fleur-site .services-list h3, .fleur-site .archive-card h3 { font-family: "Bebas Neue", sans-serif; letter-spacing: .02em; }
.fleur-site .eyebrow, .fleur-site .theatre-button, .fleur-site .theatre-text-link, .fleur-site .arrow-link { font-family: "Dosis", Arial, sans-serif; }
.theatre-site .about-theatre h1, .theatre-site .contact-theatre h1, .theatre-site .about-statement h2 { font-family: "Bebas Neue", sans-serif; font-style: normal; letter-spacing: .01em; line-height: .94; }
.theatre-site .about-theatre h1 em, .theatre-site .contact-theatre h1 em, .theatre-site .about-statement h2 em { font-style: normal; }

/* Fuller, more playful homepage — without the editorial / newspaper type. */
.fleur-site { font-family: "Dosis", Arial, sans-serif; }
.fleur-site .theatre-hero h1, .fleur-site .theatre-intro h2, .fleur-site .theatre-services h2, .fleur-site .theatre-cta h2, .fleur-site .portfolio-hero h1, .fleur-site .archive-heading h2, .fleur-site .production-intro h1 { font-family: "Dosis", Arial, sans-serif; font-weight: 600; letter-spacing: -.04em; line-height: .98; text-transform: none; }
.fleur-site .theatre-hero h1 { font-size: clamp(3.3rem, 6.1vw, 6.1rem); }
.fleur-site .theatre-intro h2, .fleur-site .theatre-services h2, .fleur-site .theatre-cta h2 { font-size: clamp(2.6rem, 4.5vw, 4.7rem); }
.fleur-site .theatre-hero h1 em, .fleur-site .theatre-intro h2 em, .fleur-site .theatre-services h2 em, .fleur-site .theatre-cta h2 em, .fleur-site .portfolio-hero h1 em, .fleur-site .archive-heading h2 em, .fleur-site .production-intro h1 em { font-family: inherit; font-style: normal; font-weight: 700; }
.fleur-site .intro-body-wrap p { font-family: "Dosis", Arial, sans-serif; font-size: clamp(1.2rem, 1.7vw, 1.55rem); font-weight: 500; }
.fleur-site .services-list h3, .fleur-site .archive-card h3 { font-family: "Dosis", Arial, sans-serif; font-weight: 700; }
.home-workboard { background: #241e20; padding: clamp(3.5rem, 7vw, 6rem) clamp(1.5rem, 10vw, 10rem); display: grid; grid-template-columns: .9fr 1.1fr; gap: clamp(2rem, 6vw, 7rem); align-items: center; position: relative; overflow: hidden; }
.home-workboard::after { content: ""; width: 360px; height: 360px; border: 1px solid rgba(197,158,107,.35); border-radius: 50%; position: absolute; right: -160px; top: -150px; }
.workboard-photo { height: 510px; position: relative; z-index: 1; overflow: hidden; transform: rotate(-2.5deg); box-shadow: 20px 20px 0 rgba(155,63,61,.55); }
.workboard-photo img { width: 100%; height: 100%; object-fit: cover; object-position: center 35%; display: block; }
.workboard-copy { position: relative; z-index: 1; max-width: 34rem; }
.workboard-copy h2 { font: 600 clamp(2.5rem, 4vw, 4.3rem)/.98 "Dosis", Arial, sans-serif; margin: 0; }
.workboard-copy > p:not(.eyebrow) { color: rgba(241,236,227,.75); line-height: 1.65; font-size: 1.1rem; margin: 1.2rem 0 1.4rem; }
.workboard-tags { display: flex; flex-wrap: wrap; gap: .55rem; margin: 0 0 1.5rem; }
.workboard-tags span { border: 1px solid rgba(241,236,227,.28); padding: .5rem .75rem; color: rgba(241,236,227,.85); font-size: .82rem; border-radius: 999px; }
.workboard-note { position: absolute; left: calc(50% - 1rem); bottom: 2rem; background: var(--theatre-gold); color: var(--theatre-ink); padding: .9rem 1rem; transform: rotate(5deg); z-index: 2; display: grid; gap: .15rem; }
.workboard-note b { font-size: .88rem; }.workboard-note span { font-size: .72rem; }
@media (max-width: 760px) { .home-workboard { grid-template-columns: 1fr; } .workboard-photo { height: 390px; max-width: 330px; } .workboard-note { left: auto; right: 1rem; bottom: 1rem; } }

.theatre-site .about-theatre h1, .theatre-site .contact-theatre h1, .theatre-site .about-statement h2 { font-family: "DM Sans", Arial, sans-serif; font-weight: 600; letter-spacing: -.04em; text-transform: none; }

/* Portfolio gallery: intentionally varied formats and no repeated image. */
.gallery-caption a { color: inherit; text-decoration: none; border-bottom: 1px solid currentColor; padding-bottom: .18rem; }
.full-photo-grid { background: #191516; padding: clamp(1.2rem, 4vw, 4rem) clamp(1rem, 6vw, 6rem) clamp(5rem, 9vw, 8rem); display: grid; grid-template-columns: repeat(12, 1fr); grid-auto-flow: dense; gap: clamp(.75rem, 1.5vw, 1.5rem); }
.photo-grid-item { grid-column: span 4; min-height: 280px; margin: 0; overflow: hidden; background: #282123; }
.photo-grid-item.photo-grid-wide { grid-column: span 6; min-height: 360px; }
.photo-grid-item.photo-grid-tall { grid-row: span 2; min-height: 620px; }
.photo-grid-item img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .45s ease, filter .45s ease; }
.photo-grid-item:hover img { transform: scale(1.035); filter: saturate(1.13); }
.photo-grid-item:nth-child(1) img, .photo-grid-item:nth-child(4) img, .photo-grid-item:nth-child(10) img, .photo-grid-item:nth-child(18) img { object-position: center top; }
@media (max-width: 760px) { .full-photo-grid { grid-template-columns: repeat(2, 1fr); gap: .8rem; padding: .8rem .8rem 4rem; } .photo-grid-item, .photo-grid-item.photo-grid-wide { grid-column: span 1; min-height: 250px; } .photo-grid-item.photo-grid-tall { grid-row: span 2; min-height: 510px; } }

/* Creative theatre layer: photos belong to the layout instead of floating on it. */
.creative-site { --pink: #e95a66; --blue: #4857bf; --lime: #b8d36a; --cream: #f7f0df; --ink: #241928; }
.creative-site .theatre-hero { min-height: min(830px, calc(100vh - 74px)); background: var(--blue); }
.creative-site .theatre-hero-image { filter: none; object-position: 52% center; }
.creative-site .theatre-hero-wash { background: linear-gradient(90deg, rgba(20,13,33,.94) 0%, rgba(27,16,38,.65) 42%, rgba(26,17,37,.1) 80%), linear-gradient(0deg, rgba(17,8,34,.4), transparent 45%); }
.hero-spotlight { position: absolute; width: 58vw; height: 58vw; max-width: 850px; max-height: 850px; left: -23vw; top: -12vw; border-radius: 50%; border: 1px solid rgba(247,240,223,.24); box-shadow: 0 0 0 45px rgba(247,240,223,.04), 0 0 0 110px rgba(247,240,223,.03); z-index: 1; }
.creative-site .theatre-hero-content { max-width: 740px; }
.creative-site .theatre-hero h1 { font-size: clamp(3.45rem, 6.3vw, 6.5rem); letter-spacing: -.055em; }
.creative-site .theatre-hero h1 em { color: var(--lime); }
.creative-site .theatre-button { background: var(--pink); border-radius: 9px; box-shadow: 6px 6px 0 rgba(12,8,16,.45); }
.creative-site .theatre-button:hover { background: var(--lime); color: var(--ink); }
.hero-ticket { position: absolute; z-index: 2; right: clamp(1.5rem, 5vw, 5rem); bottom: 3rem; width: 145px; padding: 1rem; color: var(--ink); background: var(--cream); transform: rotate(5deg); display: grid; gap: .85rem; box-shadow: 9px 10px 0 rgba(12,8,16,.28); }
.hero-ticket::after { content: "✂ ✂ ✂ ✂ ✂"; position: absolute; left: 0; top: -9px; color: var(--cream); letter-spacing: 2px; font-size: .85rem; }
.hero-ticket span, .hero-ticket small { font-size: .62rem; letter-spacing: .1em; text-transform: uppercase; }.hero-ticket b { font: 700 1.75rem/.9 "Dosis", sans-serif; }
.hero-doodle { position: absolute; z-index: 2; right: 23%; top: 20%; color: var(--lime); font-size: clamp(2.4rem, 5vw, 5rem); transform: rotate(17deg); text-shadow: 2px 3px 0 var(--ink); }
.creative-intro { background: var(--cream); color: var(--ink); padding: clamp(4rem, 8vw, 7.5rem) clamp(1.5rem, 10vw, 10rem); display: grid; grid-template-columns: .55fr 1.45fr; gap: clamp(2rem, 7vw, 8rem); align-items: center; }
.intro-icon-card { justify-self: end; width: 190px; aspect-ratio: 1; background: var(--lime); display: flex; flex-direction: column; justify-content: center; gap: .8rem; padding: 1.4rem; transform: rotate(-5deg); box-shadow: 10px 10px 0 var(--blue); }.intro-icon-card span { font-size: 3rem; }.intro-icon-card b { font-size: 1rem; line-height: 1.05; }
.creative-intro-copy h2, .creative-board h2 { font: 700 clamp(2.6rem, 4.5vw, 5rem)/.96 "Dosis", sans-serif; margin: 0; letter-spacing: -.05em; }.creative-intro-copy h2 em, .creative-board h2 em { color: var(--pink); font-style: normal; }.creative-intro-copy > p:not(.eyebrow) { max-width: 39rem; font-size: 1.25rem; font-weight: 500; line-height: 1.55; margin: 1.5rem 0 1.8rem; }
.creative-photo-story { background: var(--cream); color: var(--ink); padding: 0 clamp(1.5rem, 10vw, 10rem) clamp(5rem, 9vw, 8rem); display: grid; grid-template-columns: 1.15fr .55fr; gap: clamp(1rem, 3vw, 3rem); align-items: end; position: relative; }
.photo-story-main { min-height: 480px; position: relative; overflow: hidden; background: var(--blue); }.photo-story-main img { width: 100%; height: 100%; object-fit: cover; display: block; }.photo-story-main p { position: absolute; left: 1.2rem; bottom: 1rem; margin: 0; background: var(--cream); padding: .6rem .8rem; font-weight: 700; transform: rotate(-2deg); }.image-tape { position: absolute; height: 27px; width: 115px; background: rgba(247,240,223,.72); top: -8px; left: 49%; transform: rotate(-3deg); }
.photo-story-side { min-height: 395px; background: var(--pink); padding: 1rem 1rem 3.7rem; transform: translateY(3.5rem) rotate(2.5deg); box-shadow: 9px 10px 0 var(--ink); }.photo-story-side img { width: 100%; height: 330px; object-fit: cover; object-position: center; display: block; }.photo-story-side p { margin: .8rem 0 0; font-size: 1.2rem; font-weight: 700; line-height: 1; }
.photo-story-note { position: absolute; left: clamp(1.5rem, 4vw, 4rem); bottom: 2rem; display: grid; gap: .25rem; color: var(--cream); }.photo-story-note span { font-size: .75rem; }.photo-story-note b { font-size: 1.1rem; }.photo-story-note small { font-size: .78rem; }
.creative-board { background: var(--blue); }.creative-board::after { border-color: rgba(184,211,106,.6); }.creative-board .workboard-photo { box-shadow: 16px 16px 0 var(--lime); transform: rotate(1.5deg); }.creative-board .workboard-copy h2 { color: var(--cream); }.creative-board .workboard-copy h2 em { color: var(--lime); }.creative-board .workboard-tags span { background: rgba(247,240,223,.1); }.creative-board .workboard-note { background: var(--pink); color: #fff; }
.creative-services { background: var(--ink); padding-top: clamp(5rem, 9vw, 8rem); }.creative-services .services-list { display: grid; grid-template-columns: repeat(3, 1fr); border: 0; gap: 1rem; }.creative-services .services-list article { display: flex; flex-direction: column; padding: 1.5rem; min-height: 220px; background: #32233b; border: 0; border-radius: 14px; }.creative-services .services-list article:nth-child(2) { background: var(--pink); }.creative-services .services-list article:nth-child(3) { background: var(--lime); color: var(--ink); }.service-icon { font-size: 2.2rem; margin-bottom: auto; }.creative-services .services-list h3 { font-size: 1.8rem; }.creative-services .services-list p { color: inherit; opacity: .82; }
.creative-cta { background: var(--lime); position: relative; overflow: hidden; }.creative-cta h2 { color: var(--ink); }.creative-cta h2 em { color: var(--blue); }.creative-cta .theatre-button { background: var(--blue); }.cta-star { position: absolute; font-size: 15rem; line-height: 1; color: var(--pink); right: 4%; top: -2.5rem; transform: rotate(15deg); }
.creative-site .theatre-footer { background: var(--ink); }
@media (max-width: 760px) { .hero-ticket { right: 1.3rem; bottom: 1.5rem; transform: rotate(3deg) scale(.82); transform-origin: bottom right; }.hero-doodle { right: 1.5rem; top: 16%; }.creative-intro { grid-template-columns: 1fr; }.intro-icon-card { justify-self: start; }.creative-photo-story { grid-template-columns: 1fr; }.photo-story-main { min-height: 330px; }.photo-story-side { min-height: 330px; max-width: 250px; margin-left: auto; }.photo-story-side img { height: 260px; }.photo-story-note { position: static; grid-column: 1; color: var(--ink); margin-top: 2rem; }.creative-services .services-list { grid-template-columns: 1fr; }.creative-services .services-list article { min-height: 170px; }.cta-star { font-size: 9rem; right: -1rem; } }

/* Creative continuity on portfolio, gallery, about and contact. */
.fleur-site .portfolio-hero { background-color: #4857bf; background-image: radial-gradient(circle at 14% 22%, rgba(184,211,106,.95) 0 4px, transparent 5px), radial-gradient(circle at 80% 74%, rgba(233,90,102,.9) 0 7px, transparent 8px); }.fleur-site .portfolio-hero h1 { color: var(--cream, #f7f0df); }.fleur-site .portfolio-hero h1 em { color: #b8d36a; }.fleur-site .portfolio-hero > p:last-child { background: rgba(247,240,223,.12); padding: 1rem; border-radius: 10px; }
.fleur-site .portfolio-images { background: #f7f0df; }.fleur-site .portfolio-images .gallery-image { outline: 10px solid #f7f0df; box-shadow: 8px 9px 0 #e95a66; }.fleur-site .portfolio-images .gallery-image-wide { box-shadow: 10px 10px 0 #4857bf; }.fleur-site .gallery-caption { font-weight: 700; }
.fleur-site .production-intro { background: #e95a66; }.fleur-site .production-intro h1 { color: #f7f0df; }.fleur-site .production-intro h1 em { color: #b8d36a; }.fleur-site .production-intro > p:last-child { color: #fff; font-weight: 500; }.fleur-site .back-to-work { color: #f7f0df; }
.fleur-site .full-photo-grid { background-color: #f7f0df; background-image: linear-gradient(90deg, rgba(72,87,191,.07) 1px, transparent 1px), linear-gradient(rgba(72,87,191,.07) 1px, transparent 1px); background-size: 28px 28px; }.fleur-site .photo-grid-item { border: 8px solid #fff; box-shadow: 7px 8px 0 #241928; }.fleur-site .photo-grid-item:nth-child(3n) { transform: rotate(1deg); }.fleur-site .photo-grid-item:nth-child(4n) { transform: rotate(-1deg); box-shadow: 7px 8px 0 #4857bf; }
.theatre-site .about-theatre { background: #4857bf; }.theatre-site .about-theatre-copy { position: relative; }.theatre-site .about-theatre-copy::before { content: "✦"; position: absolute; top: 1.8rem; right: 2rem; font-size: 4rem; color: #b8d36a; }.theatre-site .about-theatre-image { border-left: 12px solid #e95a66; }.theatre-site .about-statement { background: #f7f0df; }.theatre-site .about-statement h2 em { color: #e95a66; }
.theatre-site .contact-theatre { background: #e95a66; }.theatre-site .contact-theatre > div:first-child::before { content: "🎭"; display: block; width: max-content; padding: .65rem; background: #b8d36a; color: #241928; font-size: 1.8rem; transform: rotate(-5deg); margin-bottom: 1.7rem; }.theatre-site .theatre-form { background: #f7f0df; }.theatre-site .theatre-form .theatre-button { border-radius: 8px; background: #4857bf; }

.project-meta-card {
  padding: 1.4em 1.5em;
  border-radius: 22px;
  background: rgba(255, 255, 255, 0.72);
  border: 1px solid rgba(90, 42, 108, 0.1);
}

.project-meta-card p {
  margin: 0;
}

.project-meta-label {
  font-family: 'Bebas Neue', sans-serif;
  font-size: 1.1rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  margin-bottom: 0.55em !important;
}

.project-meta-card-photo {
  padding: 0.6em;
  overflow: hidden;
}

.project-meta-card-photo img {
  width: 100%;
  height: 100%;
  min-height: 180px;
  object-fit: cover;
  border-radius: 18px;
  display: block;
}

.project-photo-538 {
  object-position: center 18%;
  transform: scale(1.06);
  transform-origin: center;
}

.back-button {
  display: inline-block;
  padding: 12px 24px;
  background: var(--accent);
  color: white;
  text-decoration: none;
  border-radius: 30px;
  transition: 0.2s ease;
}

.back-button:hover {
  background: var(--bg-dark);
}

/* ░░░ POLISH OVERRIDES ░░░ */
.intro-snippet,
.about-wrapper,
.contact-wrapper {
  box-shadow: var(--shadow-soft);
}

.intro-snippet {
  margin: 5em auto;
  padding: 3.5em;
}

.intro-text p,
.about-wrapper p,
.contact-wrapper p,
.clients-wrapper p,
.work-wrapper p {
  line-height: 1.7;
}

.clients-wrapper h1,
.work-wrapper h1,
.about-wrapper h1,
.contact-wrapper h1,
.project-section h1 {
  letter-spacing: 1px;
}

.work-card,
.client-card {
  box-shadow: var(--shadow-soft);
}

.work-card {
  border: 1px solid rgba(36, 50, 77, 0.06);
}

.client-card {
  background: var(--surface);
}

@media (max-width: 800px) {
  .project-intro,
  .project-meta-grid {
    grid-template-columns: 1fr;
  }

  .project-copy {
    text-align: center;
  }

  .project-tags {
    justify-content: center;
  }

  .project-visual-card {
    min-height: 220px;
  }

  .client-work-hero {
    margin-bottom: 1.5em;
  }

  .navbar {
    flex-direction: column;
    gap: 1em;
    padding: 1em 1.2em;
  }

  .nav-links {
    flex-wrap: wrap;
    justify-content: center;
    padding: 0;
    margin: 0;
  }

  .hero {
    min-height: 64vh;
  }

  .hero-content {
    padding: 1.5em 1em;
  }

  .intro-snippet,
  .about-wrapper,
  .project-wrapper {
    padding: 2.2em 1.5em;
  }

  .contact-section {
    padding: 4.5em 1.2em 5.5em;
  }

  .contact-layout,
  .contact-side-grid {
    grid-template-columns: 1fr;
  }

  .project-meta-grid {
    grid-template-columns: 1fr;
  }

  .contact-card {
    padding: 1.6em;
  }

  .contact-card-main h1 {
    font-size: clamp(2.8rem, 16vw, 4.2rem);
  }

  .home-highlights,
  .home-proof,
  .home-process {
    padding: 0 1.2em;
  }

  .home-highlights {
    margin-top: 4em;
  }

  .highlights-grid,
  .process-grid,
  .proof-wrapper {
    grid-template-columns: 1fr;
  }

  .highlight-card-accent,
  .highlight-card-dark,
  .proof-pill-feature,
  .proof-pill-dark,
  .process-step-tilt-left,
  .process-step-tilt-right,
  .process-step-feature {
    transform: none;
  }

  .proof-list {
    grid-template-columns: 1fr;
  }

  .proof-pill-wide {
    grid-column: auto;
  }

  .highlight-card-feature {
    min-height: auto;
  }

  .highlight-card-feature::before,
  .proof-wrapper::after,
  .process-wrapper::before {
    display: none;
  }

  .step-number {
    font-size: 3rem;
  }

  .intro-actions {
    flex-direction: column;
    align-items: flex-start;
  }

  .intro-image-frame {
    width: 100%;
  }

  .intro-floating-card {
    position: static;
    margin-top: 1em;
    max-width: none;
  }

  .about-hero-layout,
  .about-content-grid {
    grid-template-columns: 1fr;
  }

  .about-card-wide {
    grid-column: auto;
  }
}

/* ░░░ FOOTER ░░░ */
.site-footer {
  background: linear-gradient(180deg, #34283A 0%, #5A2A6C 100%);
  color: var(--text-light);
  padding: 3.5em 2em 1.5em;
  margin-top: 0;
}

.footer-top {
  max-width: 1200px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1.5fr 1fr 1fr 1fr;
  gap: 2.5em;
  align-items: start;
}

.footer-brand h2 {
  font-family: 'Bebas Neue', sans-serif;
  font-size: 2.2rem;
  margin: 0.15em 0 0.35em;
  letter-spacing: 0.5px;
}

.footer-eyebrow,
.footer-heading {
  font-family: 'Bebas Neue', sans-serif;
  letter-spacing: 1px;
  text-transform: uppercase;
  margin: 0 0 0.5em;
  color: #F5F1EA;
  opacity: 0.92;
}

.footer-text {
  color: rgba(255, 255, 255, 0.78);
  line-height: 1.7;
  margin: 0;
}

.footer-socials {
  display: flex;
  gap: 0.85em;
  margin-top: 1.4em;
}

.social-link {
  width: 46px;
  height: 46px;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: rgba(255, 255, 255, 0.1);
  color: #FFFFFF;
  transition: transform 0.2s ease, background-color 0.2s ease;
}

.social-link:hover {
  transform: translateY(-2px);
  background: rgba(255, 255, 255, 0.18);
}

.social-link svg {
  width: 21px;
  height: 21px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.footer-links-group {
  display: flex;
  flex-direction: column;
  gap: 0.45em;
}

.footer-links {
  display: flex;
  flex-direction: column;
  gap: 0.7em;
}

.footer-links a,
.footer-links span {
  color: rgba(255, 255, 255, 0.82);
  text-decoration: none;
  font-size: 0.98rem;
}

.footer-links a:hover {
  color: #FFFFFF;
}

.footer-cta {
  background: rgba(245, 241, 234, 0.1);
  border: 1px solid rgba(255, 255, 255, 0.12);
  border-radius: 24px;
  padding: 1.35em;
}

.footer-button {
  margin-top: 1.2em;
}

.footer-bottom {
  max-width: 1200px;
  margin: 2.4em auto 0;
  padding-top: 1.2em;
  border-top: 1px solid rgba(255, 255, 255, 0.12);
  display: flex;
  justify-content: space-between;
  gap: 1em;
  color: rgba(255, 255, 255, 0.68);
  font-size: 0.92rem;
}

@media (max-width: 950px) {
  .footer-top {
    grid-template-columns: 1fr 1fr;
  }
}

/* Polderjongens — one editorial story from the supplied horizontal and vertical set. */
.polder-page {
  --polder-ink: #120e10;
  --polder-wine: #6a2e43;
  --polder-rust: #9e4b36;
  --polder-gold: #d1a05f;
  --polder-paper: #efe5d5;
  background: var(--polder-ink);
  color: var(--polder-paper);
}

.polder-hero {
  position: relative;
  display: flex;
  align-items: flex-end;
  min-height: min(880px, calc(100vh - 72px));
  padding: clamp(6rem, 12vw, 11rem) clamp(1.25rem, 7vw, 7rem) clamp(4rem, 7vw, 7rem);
  box-sizing: border-box;
  overflow: hidden;
  background: var(--polder-ink);
}

.polder-hero > img,
.polder-hero-wash {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}

.polder-hero > img {
  object-fit: cover;
  object-position: 52% center;
  filter: saturate(.84) contrast(1.08);
}

.polder-hero-wash {
  background:
    linear-gradient(90deg, rgba(18,14,16,.95) 0%, rgba(18,14,16,.62) 37%, rgba(18,14,16,.08) 73%),
    linear-gradient(0deg, rgba(18,14,16,.85) 0%, transparent 58%);
}

.polder-back {
  position: absolute;
  z-index: 2;
  top: 2rem;
  left: clamp(1.25rem, 7vw, 7rem);
  color: var(--polder-paper);
  font-size: .78rem;
  font-weight: 700;
  letter-spacing: .09em;
  text-decoration: none;
  text-transform: uppercase;
}

.polder-back:hover { color: var(--polder-gold); }

.polder-hero-copy {
  position: relative;
  z-index: 1;
  max-width: 52rem;
}

.polder-hero-copy .eyebrow {
  margin: 0 0 1.15rem;
  color: var(--polder-gold);
}

.polder-hero-copy h1,
.polder-intro h2,
.polder-section-heading h2,
.polder-closing h2 {
  margin: 0;
  font-family: "Bebas Neue", sans-serif;
  font-weight: 400;
  letter-spacing: .01em;
  line-height: .8;
}

.polder-hero-copy h1 { font-size: clamp(6.8rem, 16vw, 15rem); }

.polder-hero-copy h1 em,
.polder-intro h2 em,
.polder-section-heading h2 em,
.polder-closing h2 em {
  color: var(--polder-gold);
  font-style: normal;
}

.polder-hero-copy > p:last-child {
  max-width: 34rem;
  margin: 1.75rem 0 0;
  font-size: clamp(1rem, 1.45vw, 1.2rem);
  line-height: 1.65;
}

.polder-hero-number {
  position: absolute;
  right: clamp(1.25rem, 4vw, 4rem);
  bottom: -.18em;
  z-index: 1;
  margin: 0;
  color: rgba(239,229,213,.14);
  font: 400 clamp(12rem, 25vw, 27rem)/.7 "Bebas Neue", sans-serif;
}

.polder-intro {
  display: grid;
  grid-template-columns: .48fr 1.2fr 1fr;
  gap: clamp(2rem, 5vw, 6rem);
  align-items: end;
  padding: clamp(5rem, 10vw, 10rem) clamp(1.25rem, 7vw, 7rem);
  background: var(--polder-paper);
  color: #21151b;
}

.polder-intro > .eyebrow {
  align-self: start;
  margin: .4rem 0 0;
  color: var(--polder-wine);
}

.polder-intro h2 { font-size: clamp(4.2rem, 8vw, 8.2rem); }
.polder-intro h2 em { color: var(--polder-wine); }

.polder-intro > div > p {
  max-width: 33rem;
  margin: 0 0 2rem;
  font-size: 1rem;
  line-height: 1.75;
}

.polder-intro dl { margin: 0; border-top: 1px solid rgba(33,21,27,.35); }

.polder-intro dl > div {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 1rem;
  padding: .8rem 0;
  border-bottom: 1px solid rgba(33,21,27,.22);
}

.polder-intro dt {
  font-size: .75rem;
  font-weight: 700;
  letter-spacing: .1em;
  text-transform: uppercase;
}

.polder-intro dd {
  margin: 0;
  color: var(--polder-wine);
  font: 400 1.55rem/1 "Bebas Neue", sans-serif;
  letter-spacing: .03em;
}

.polder-video-section,
.polder-photo-section {
  padding: clamp(5rem, 10vw, 10rem) clamp(1rem, 6vw, 6rem);
}

.polder-video-section { background: #21151b; }
.polder-photo-section { background: var(--polder-ink); }

.polder-section-heading {
  display: grid;
  grid-template-columns: 1.35fr .65fr;
  gap: 2rem 6vw;
  align-items: end;
  max-width: 1320px;
  margin: 0 auto clamp(3.5rem, 7vw, 7rem);
}

.polder-section-heading .eyebrow {
  margin: 0 0 1rem;
  color: var(--polder-gold);
}

.polder-section-heading h2 { font-size: clamp(4.2rem, 8vw, 8.3rem); }

.polder-section-heading > p {
  max-width: 26rem;
  margin: 0 0 .45rem;
  color: rgba(239,229,213,.68);
  font-size: 1rem;
  line-height: 1.65;
}

.polder-video-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: clamp(2.5rem, 6vw, 6rem) clamp(1rem, 2vw, 2rem);
  max-width: 1320px;
  margin: 0 auto;
}

.polder-video-card { margin: 0; }
.polder-video-feature { grid-column: 1 / -1; width: 83%; }
.polder-video-card:last-child { margin-top: clamp(3rem, 8vw, 8rem); }

.polder-video-card video {
  display: block;
  width: 100%;
  aspect-ratio: 16 / 9;
  object-fit: cover;
  background: #080708;
  border: 1px solid rgba(239,229,213,.2);
}

.polder-video-card > div {
  display: flex;
  align-items: flex-start;
  gap: 1rem;
  padding-top: .9rem;
  border-top: 1px solid rgba(209,160,95,.65);
}

.polder-video-card > div > span {
  color: var(--polder-gold);
  font: 400 2.3rem/.8 "Bebas Neue", sans-serif;
}

.polder-video-card p { display: grid; gap: .18rem; margin: 0; }
.polder-video-card strong { font: 400 1.7rem/.9 "Bebas Neue", sans-serif; letter-spacing: .025em; }
.polder-video-card small { color: rgba(239,229,213,.6); font-size: .75rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }

.polder-photo-grid {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: clamp(4.5rem, 10vw, 11rem) clamp(1rem, 2vw, 2rem);
  align-items: start;
  max-width: 1320px;
  margin: 0 auto;
}

.polder-photo {
  position: relative;
  display: block;
  grid-column: span 6;
  width: 100%;
  margin: 0;
  padding: 0;
  overflow: visible;
  border: 0;
  background: transparent;
  color: var(--polder-paper);
  cursor: zoom-in;
  text-align: left;
}

.polder-photo::before {
  content: attr(data-index);
  position: absolute;
  z-index: 2;
  top: -.55em;
  left: -.08em;
  color: var(--polder-gold);
  font: 400 clamp(4rem, 8vw, 8rem)/1 "Bebas Neue", sans-serif;
  mix-blend-mode: screen;
  pointer-events: none;
}

.polder-photo img {
  display: block;
  width: 100%;
  height: auto;
  border: 1px solid rgba(239,229,213,.2);
  background: #080708;
  transition: border-color .25s ease, transform .35s ease;
}

.polder-photo:hover img { border-color: var(--polder-gold); transform: translateY(-.35rem); }
.polder-photo:focus-visible { outline: 3px solid var(--polder-gold); outline-offset: .5rem; }

.polder-photo > span {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 1rem;
  padding-top: .8rem;
  border-top: 1px solid rgba(209,160,95,.56);
}

.polder-photo b { font: 400 clamp(1.5rem, 2.4vw, 2.4rem)/1 "Bebas Neue", sans-serif; letter-spacing: .025em; }
.polder-photo small { color: var(--polder-gold); font-size: .75rem; font-weight: 700; letter-spacing: .08em; text-align: right; text-transform: uppercase; }
.polder-photo-wide { grid-column: span 8; }
.polder-photo-tall { grid-column: span 4; }
.polder-photo-lead { grid-column: 1 / 13; }
.polder-photo-offset { margin-top: clamp(5rem, 10vw, 10rem); }
.polder-photo-bow { grid-column: 2 / 6; }
.polder-photo-rein { grid-column: 6 / 13; margin-top: clamp(4rem, 8vw, 8rem); }
.polder-photo-cast { grid-column: 1 / 9; margin-top: clamp(4rem, 8vw, 8rem); }
.polder-photo-closing { grid-column: 9 / 13; }

.polder-closing {
  padding: clamp(6rem, 12vw, 12rem) clamp(1.25rem, 8vw, 9rem);
  background: var(--polder-rust);
  color: var(--polder-paper);
}

.polder-closing .eyebrow { margin: 0 0 1.15rem; color: #28151a; }
.polder-closing h2 { font-size: clamp(4.8rem, 10vw, 10.5rem); }
.polder-closing h2 em { color: #28151a; }

.polder-closing a {
  display: inline-flex;
  align-items: center;
  gap: 1rem;
  margin-top: 2.3rem;
  padding: 1rem 1.15rem;
  background: var(--polder-paper);
  color: #21151b;
  font-size: .78rem;
  font-weight: 700;
  letter-spacing: .09em;
  text-decoration: none;
  text-transform: uppercase;
}

.polder-closing a:hover { background: var(--polder-gold); }

.polder-lightbox {
  width: min(96vw, 1320px);
  max-width: none;
  max-height: none;
  margin: auto;
  padding: 0;
  overflow: visible;
  border: 0;
  background: transparent;
  color: var(--polder-paper);
}

.polder-lightbox::backdrop { background: rgba(8,7,8,.96); backdrop-filter: blur(7px); }

.polder-lightbox figure {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  width: min(82vw, 1080px);
  height: 82vh;
  margin: 0 auto;
  background: #080708;
  box-shadow: 12px 14px 0 rgba(209,160,95,.38);
}

.polder-lightbox img { display: block; max-width: 100%; max-height: 100%; width: auto; height: auto; object-fit: contain; }

.polder-lightbox figcaption {
  position: absolute;
  right: 0;
  bottom: 0;
  display: grid;
  gap: .18rem;
  padding: .8rem .95rem;
  background: var(--polder-paper);
  color: #21151b;
  box-shadow: -5px -5px 0 rgba(18,14,16,.35);
}

.polder-lightbox figcaption strong { font: 400 1.35rem/.9 "Bebas Neue", sans-serif; letter-spacing: .035em; }
.polder-lightbox figcaption span { color: var(--polder-wine); font-size: .75rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }

.polder-lightbox-close,
.polder-lightbox-previous,
.polder-lightbox-next {
  position: absolute;
  z-index: 3;
  display: grid;
  place-items: center;
  width: 3rem;
  height: 3rem;
  padding: 0;
  border: 1px solid rgba(239,229,213,.72);
  background: #21151b;
  color: var(--polder-paper);
  cursor: pointer;
  font-size: 1.35rem;
}

.polder-lightbox-close { top: -3.8rem; right: calc(9% - 1.5rem); color: var(--polder-gold); font-size: 2rem; }
.polder-lightbox-previous { top: calc(50% - 1.5rem); left: 0; }
.polder-lightbox-next { top: calc(50% - 1.5rem); right: 0; }
.polder-lightbox-close:hover,
.polder-lightbox-previous:hover,
.polder-lightbox-next:hover { background: var(--polder-gold); color: #21151b; }

.production-card-polderjongens img { object-position: center center; }
.production-card-polderjongens > div::after { content: ""; right: -1rem; bottom: -1rem; width: 11rem; height: 11rem; border: 1px solid rgba(240,201,142,.8); border-radius: 50%; transform: scale(.5); }
.production-card-polderjongens:hover > div::after { opacity: 1; transform: translateX(0) scale(1); }
.production-card-polderjongens:hover h2 { color: #f0c98e; text-shadow: 0 0 20px rgba(158,75,54,.78); }
.production-card-polderjongens:hover b { background: #d1a05f; }

@media (max-width: 850px) {
  .polder-intro { grid-template-columns: .4fr 1.25fr; }
  .polder-intro > div { grid-column: 2; }
  .polder-section-heading { grid-template-columns: 1fr; }
  .polder-section-heading > p { max-width: 38rem; }
  .polder-video-feature { width: 100%; }
}

@media (max-width: 680px) {
  .polder-hero { min-height: 720px; padding-bottom: 4rem; }
  .polder-hero > img { object-position: 48% center; }
  .polder-hero-wash { background: linear-gradient(0deg, rgba(18,14,16,.94) 0%, rgba(18,14,16,.35) 69%, rgba(18,14,16,.08)); }
  .polder-hero-copy h1 { font-size: clamp(6.4rem, 31vw, 9.5rem); }
  .polder-hero-number { display: none; }
  .polder-intro { grid-template-columns: 1fr; }
  .polder-intro > .eyebrow,
  .polder-intro > div { grid-column: 1; }
  .polder-video-grid,
  .polder-photo-grid { grid-template-columns: 1fr; }
  .polder-video-feature,
  .polder-video-card,
  .polder-video-card:last-child,
  .polder-photo,
  .polder-photo-wide,
  .polder-photo-tall,
  .polder-photo-lead,
  .polder-photo-bow,
  .polder-photo-rein,
  .polder-photo-cast,
  .polder-photo-closing { grid-column: 1; width: 100%; margin-top: 0; }
  .polder-photo-offset { margin-top: 0; }
  .polder-photo-grid { row-gap: 4.5rem; }
  .polder-photo > span { align-items: flex-start; flex-direction: column; gap: .25rem; }
  .polder-photo small { text-align: left; }
  .polder-lightbox { width: 100vw; }
  .polder-lightbox figure { width: min(82vw, 620px); height: 76vh; }
  .polder-lightbox-close { top: -3.6rem; right: 8vw; }
  .polder-lightbox-previous { left: 1.2vw; }
  .polder-lightbox-next { right: 1.2vw; }
}

@media (prefers-reduced-motion: reduce) {
  .polder-photo img,
  .production-card-polderjongens > div::after { transition: none; }
  .polder-photo:hover img { transform: none; }
}

@media (max-width: 640px) {
  .site-footer {
    padding: 3em 1.2em 1.4em;
  }

  .footer-top {
    grid-template-columns: 1fr;
    gap: 2em;
  }

  .footer-bottom {
    flex-direction: column;
  }
}

@media (max-width: 800px) {
  .work-grid,
  .work-grid-wide {
    justify-content: center;
  }
}

/* ░░░ CLIENTS POLISH ░░░ */
.clients-page-intro {
  max-width: 620px;
  margin: 0 auto 2.4em;
}

.clients-page-intro p:last-child {
  margin: 0.5em auto 0;
  line-height: 1.75;
}

.clients-mini-strip {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 0.7em;
  margin-top: 1.1em;
}

.clients-mini-strip span {
  background: rgba(245, 241, 234, 0.12);
  border: 1px solid rgba(245, 241, 234, 0.18);
  color: #FFFFFF;
  padding: 0.5em 0.8em;
  border-radius: 999px;
  font-size: 0.82rem;
  font-weight: bold;
}

.clients-section {
  position: relative;
  overflow: hidden;
}

.clients-section::before {
  content: "";
  position: absolute;
  top: -80px;
  right: -80px;
  width: 240px;
  height: 240px;
  border-radius: 50%;
  background: rgba(245, 241, 234, 0.08);
}

.clients-section::after {
  content: "";
  position: absolute;
  left: -70px;
  bottom: -70px;
  width: 180px;
  height: 180px;
  border-radius: 50%;
  background: rgba(52, 40, 58, 0.12);
}

.clients-wrapper {
  position: relative;
  z-index: 1;
}

.clients-grid {
  justify-content: center;
  gap: 1.6em;
}

.client-card {
  background: linear-gradient(180deg, #F5F1EA 0%, #fffaf4 100%);
  border: 1px solid rgba(90, 42, 108, 0.08);
  box-shadow: 0 16px 28px rgba(52, 40, 58, 0.12);
  position: relative;
}

.client-card:hover {
  transform: translateY(-4px) scale(1.01);
}

.client-card::after {
  content: "View project";
  position: absolute;
  bottom: 12px;
  right: 14px;
  font-size: 0.72rem;
  font-weight: bold;
  letter-spacing: 0.4px;
  text-transform: uppercase;
  color: rgba(52, 40, 58, 0.45);
}

.client-card img {
  max-width: 82%;
}

.client-name {
  margin-top: 0.15em;
  font-size: 1.35rem;
  letter-spacing: 0.4px;
}

/* ░░░ FINAL POLISH ░░░ */
html {
  scroll-behavior: smooth;
}

.cta-button {
  letter-spacing: 0.02em;
  box-shadow: 0 12px 28px rgba(52, 40, 58, 0.2);
}

.cta-button:hover {
  transform: translateY(-2px);
}

.cta-button:active {
  transform: translateY(0);
}

.section-label {
  letter-spacing: 1.8px;
  opacity: 0.95;
}

.text-link {
  text-underline-offset: 0.22em;
  transition: color 0.2s ease, opacity 0.2s ease, text-decoration-color 0.2s ease;
}

.text-link:hover {
  color: var(--bg-dark);
}

.highlight-card,
.proof-wrapper,
.process-wrapper,
.about-card,
.contact-card,
.project-wrapper,
.project-meta-card,
.client-card,
.work-card,
.footer-cta {
  border-color: rgba(90, 42, 108, 0.12);
}

.highlight-card,
.process-step,
.about-card,
.contact-card,
.project-meta-card,
.work-card,
.client-card {
  transition: transform 0.2s ease, box-shadow 0.25s ease, border-color 0.25s ease;
}

.highlight-card:hover,
.process-step:hover,
.about-card:hover,
.project-meta-card:hover,
.work-card:hover {
  transform: translateY(-3px);
  box-shadow: 0 18px 34px rgba(52, 40, 58, 0.12);
  border-color: rgba(90, 42, 108, 0.18);
}

.work-page-intro,
.clients-page-intro,
.contact-simple-intro,
.process-intro {
  text-wrap: balance;
}

.work-page-intro,
.clients-page-intro {
  max-width: 700px;
  margin-left: auto;
  margin-right: auto;
}

.about-lead,
.contact-intro,
.project-copy p,
.project-meta-card p,
.footer-text {
  line-height: 1.75;
}

.proof-pill,
.highlight-metrics span,
.intro-points span,
.about-strip span,
.project-tags span,
.clients-mini-strip span,
.contact-tag-row span,
.checkbox-wrapper {
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.18);
}

.footer-links a,
.footer-links span {
  transition: color 0.2s ease, transform 0.2s ease, opacity 0.2s ease;
}

.footer-links a:hover {
  transform: translateX(2px);
}

.footer-cta {
  box-shadow: 0 12px 28px rgba(20, 14, 24, 0.16);
  backdrop-filter: blur(8px);
}

.social-link {
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.08);
}

.client-card::after {
  letter-spacing: 0.7px;
}

/* ─── Theatre-led redesign ─────────────────────────────────────────────── */
:root {
  --theatre-ink: #1c1718;
  --theatre-wine: #57232b;
  --theatre-red: #9b3f3d;
  --theatre-paper: #f1ece3;
  --theatre-gold: #c59e6b;
}

.theatre-site { background: var(--theatre-ink); color: var(--theatre-paper); font-family: "DM Sans", Arial, sans-serif; }
.theatre-site .navbar { background: rgba(20, 17, 18, .74); box-shadow: none; padding: 1.35rem clamp(1.3rem, 4vw, 4.5rem); border-bottom: 1px solid rgba(241,236,227,.13); }
.theatre-site .logo, .theatre-footer .logo { color: var(--theatre-paper); font-size: 1.7rem; letter-spacing: .11em; text-decoration: none; }
.theatre-site .nav-links { gap: .2rem; margin: 0; padding: 0; }
.theatre-site .nav-links li a { background: transparent; color: rgba(241,236,227,.78); border-radius: 0; padding: .55rem .85rem; font-size: .82rem; letter-spacing: .08em; text-transform: uppercase; }
.theatre-site .nav-links li a:hover, .theatre-site .nav-links li a.active { background: transparent; color: #fff; box-shadow: none; transform: none; }
.theatre-site .nav-links li a.active { border-bottom: 1px solid var(--theatre-gold); }
.theatre-site .language-switch { background: transparent; border: 1px solid rgba(241,236,227,.25); border-radius: 0; padding: .45rem .6rem; }
.theatre-site .language-pill-active { color: var(--theatre-gold); }
.theatre-hero { min-height: min(780px, calc(100vh - 74px)); position: relative; overflow: hidden; display: flex; align-items: center; padding: clamp(5rem, 11vw, 9rem) clamp(1.5rem, 10vw, 10rem); box-sizing: border-box; }
.theatre-hero-image { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center 31%; filter: saturate(.8) contrast(1.08); }
.theatre-hero-wash { position: absolute; inset: 0; background: linear-gradient(90deg, rgba(18,13,14,.93) 0%, rgba(27,17,18,.76) 43%, rgba(23,14,15,.2) 78%), linear-gradient(0deg, rgba(18,13,14,.45), transparent 45%); }
.theatre-hero-content { max-width: 780px; position: relative; z-index: 1; }
.eyebrow { font-size: .72rem; text-transform: uppercase; letter-spacing: .19em; font-weight: 700; color: var(--theatre-gold); margin: 0 0 1.5rem; }
.theatre-hero h1, .theatre-intro h2, .theatre-services h2, .featured-case h2, .theatre-cta h2 { font-family: "Playfair Display", Georgia, serif; font-weight: 500; letter-spacing: -.045em; line-height: .98; margin: 0; }
.theatre-hero h1 { font-size: clamp(3.75rem, 7.4vw, 7.5rem); }
.theatre-hero h1 em, .theatre-intro h2 em, .theatre-services h2 em, .featured-case h2 em, .theatre-cta h2 em { color: var(--theatre-gold); font-weight: 500; }
.hero-copy { max-width: 38rem; color: rgba(241,236,227,.82); font-size: clamp(1rem, 1.4vw, 1.2rem); line-height: 1.65; margin: 2rem 0; }
.hero-actions { display: flex; align-items: center; gap: 1.65rem; flex-wrap: wrap; }
.theatre-button { display: inline-flex; gap: 1.1rem; align-items: center; background: var(--theatre-red); color: #fff; text-decoration: none; padding: .95rem 1.15rem 1rem 1.3rem; font-size: .8rem; letter-spacing: .08em; text-transform: uppercase; font-weight: 700; transition: background .2s ease, transform .2s ease; }
.theatre-button:hover { background: var(--theatre-gold); transform: translateY(-2px); }
.theatre-button span { font-size: 1.15rem; }
.theatre-text-link, .arrow-link { color: var(--theatre-paper); font-size: .82rem; text-transform: uppercase; font-weight: 700; letter-spacing: .08em; text-decoration: none; border-bottom: 1px solid rgba(241,236,227,.45); padding-bottom: .35rem; }
.theatre-text-link span, .arrow-link span { margin-left: .7rem; }
.hero-side-note { z-index: 1; position: absolute; right: clamp(1.5rem, 4vw, 4.5rem); bottom: 2.2rem; text-align: right; font-family: "Playfair Display", Georgia, serif; line-height: 1.35; font-size: .95rem; }
.hero-side-note span { color: rgba(241,236,227,.6); font-family: "DM Sans", Arial, sans-serif; font-size: .66rem; letter-spacing: .08em; text-transform: uppercase; }
.hero-scroll { position: absolute; z-index: 1; left: clamp(1.5rem, 4vw, 4.5rem); bottom: 2.2rem; color: rgba(241,236,227,.75); font-size: .67rem; letter-spacing: .12em; text-transform: uppercase; text-decoration: none; display: flex; align-items: center; gap: .7rem; }
.hero-scroll span { height: 1px; width: 3.5rem; background: var(--theatre-gold); display: block; }
.theatre-intro { background: var(--theatre-paper); color: var(--theatre-ink); display: grid; grid-template-columns: 1.2fr .8fr; gap: 8vw; padding: clamp(5rem, 10vw, 9rem) clamp(1.5rem, 10vw, 10rem); }
.eyebrow-dark { color: var(--theatre-wine); }
.theatre-intro h2, .theatre-services h2, .featured-case h2, .theatre-cta h2 { font-size: clamp(2.7rem, 5.4vw, 5.75rem); }
.intro-body-wrap { align-self: end; max-width: 30rem; }
.intro-body-wrap p { font-family: "Playfair Display", Georgia, serif; font-size: clamp(1.25rem, 2vw, 1.7rem); line-height: 1.5; margin: 0 0 2.3rem; }
.arrow-link { color: var(--theatre-wine); border-color: var(--theatre-wine); }
.theatre-gallery { background: var(--theatre-paper); color: var(--theatre-ink); padding: 0 clamp(1.5rem, 10vw, 10rem) clamp(5rem, 9vw, 8rem); display: grid; grid-template-columns: .62fr 1.38fr; gap: clamp(1rem, 3vw, 3rem); position: relative; }
.gallery-image { margin: 0; overflow: hidden; background: #211718; }
.gallery-image-tall { margin-top: 11vw; max-height: 520px; }
.gallery-image-wide { max-height: 650px; }
.gallery-image img { width: 100%; height: 100%; min-height: 100%; object-fit: cover; display: block; }
.gallery-image-tall img { object-position: center center; }
.gallery-image-wide img { object-position: center 35%; }
.gallery-caption { grid-column: 1/-1; display: flex; justify-content: space-between; padding-top: .9rem; border-top: 1px solid rgba(28,23,24,.26); color: #6b6260; font-size: .69rem; text-transform: uppercase; letter-spacing: .1em; }
.theatre-services { background: var(--theatre-wine); padding: clamp(5rem, 10vw, 9rem) clamp(1.5rem, 10vw, 10rem); display: grid; grid-template-columns: .9fr 1.1fr; gap: 8vw; }
.theatre-services .eyebrow { color: #e2bf8f; }
.services-list { border-top: 1px solid rgba(241,236,227,.35); }
.services-list article { display: grid; grid-template-columns: 3rem 1fr; column-gap: 1.2rem; padding: 1.75rem 0; border-bottom: 1px solid rgba(241,236,227,.25); }
.services-list article > span { font-size: .72rem; color: var(--theatre-gold); letter-spacing: .08em; }
.services-list h3 { grid-column: 2; margin: 0; font-family: "Playfair Display", Georgia, serif; font-weight: 500; font-size: clamp(1.6rem, 2.5vw, 2.25rem); }
.services-list p { grid-column: 2; margin: .65rem 0 0; color: rgba(241,236,227,.72); line-height: 1.6; max-width: 30rem; }
.featured-case { display: grid; grid-template-columns: 1.06fr .94fr; background: #272020; min-height: 650px; }
.featured-case-image { min-height: 100%; overflow: hidden; }
.featured-case-image img { height: 100%; width: 100%; object-fit: cover; object-position: center 38%; display: block; }
.featured-case-content { align-self: center; padding: clamp(3.5rem, 8vw, 7.5rem); }
.featured-case-content > p:not(.eyebrow) { color: rgba(241,236,227,.7); max-width: 28rem; line-height: 1.7; margin: 1.7rem 0 1.8rem; }
.theatre-button-light { background: var(--theatre-paper); color: var(--theatre-ink); }
.theatre-cta { text-align: center; background: var(--theatre-paper); color: var(--theatre-ink); padding: clamp(5rem, 11vw, 9rem) 1.5rem; }
.theatre-cta h2 { margin-bottom: 2rem; }
.theatre-footer { background: #171314; color: var(--theatre-paper); padding: 3.4rem clamp(1.5rem, 5vw, 4.5rem) 1.6rem; display: grid; grid-template-columns: 1.4fr .8fr .8fr; gap: 2rem; }
.theatre-footer p { color: rgba(241,236,227,.62); line-height: 1.6; font-size: .86rem; max-width: 19rem; }
.footer-nav, .theatre-footer .footer-socials { display: flex; flex-direction: column; align-items: flex-start; gap: .7rem; }
.footer-nav a, .theatre-footer .footer-socials a { color: var(--theatre-paper); font-size: .78rem; letter-spacing: .07em; text-transform: uppercase; text-decoration: none; }
.theatre-footer .footer-bottom-line { grid-column: 1/-1; border-top: 1px solid rgba(241,236,227,.15); max-width: none; padding-top: 1.25rem; margin: 1rem 0 0; font-size: .68rem; letter-spacing: .07em; text-transform: uppercase; }

@media (max-width: 760px) {
  .theatre-site .navbar { padding: 1rem 1.2rem; }
  .theatre-site .nav-meta { gap: .35rem; }
  .theatre-site .nav-links { display: none; }
  .theatre-hero { min-height: 690px; padding: 4rem 1.5rem 7rem; align-items: end; }
  .theatre-hero-image { object-position: 57% center; }
  .theatre-hero-wash { background: linear-gradient(0deg, rgba(18,13,14,.95) 8%, rgba(18,13,14,.35) 75%), linear-gradient(90deg, rgba(18,13,14,.4), transparent); }
  .hero-side-note { display: none; }
  .theatre-intro, .theatre-services, .featured-case { grid-template-columns: 1fr; gap: 3rem; }
  .theatre-gallery { grid-template-columns: .82fr 1.18fr; gap: 1rem; padding-bottom: 4.5rem; }
  .gallery-image-tall { margin-top: 5rem; }
  .theatre-footer { grid-template-columns: 1fr; }
}

/* Final warm palette and image-fit corrections. */
.creative-site { --pink: #a74750; --blue: #55273b; --lime: #d1a05f; --cream: #f4ecdf; --ink: #21151b; }
.creative-site .theatre-hero { background: #54263a; }.creative-site .theatre-hero h1 em { color: #e0b273; }.creative-site .hero-doodle { color: #d1a05f; }.creative-site .theatre-button { background: #9d3f49; }.creative-site .theatre-button:hover { background: #d1a05f; }.hero-ticket, .creative-intro, .creative-photo-story { background: #f4ecdf; }.intro-icon-card { background: #d1a05f; box-shadow: 10px 10px 0 #7d3b4a; }.creative-intro-copy h2 em { color: #9d3f49; }
.creative-board { background: #56283d; }.creative-board .workboard-photo { box-shadow: 16px 16px 0 #d1a05f; }.creative-board .workboard-copy h2 em { color: #e0b273; }.creative-board .workboard-note { background: #9d3f49; }.creative-services { background: #21151b; }.creative-services .services-list article { background: #3c2633; }.creative-services .services-list article:nth-child(2) { background: #87404b; }.creative-services .services-list article:nth-child(3) { background: #d1a05f; }.creative-cta { background: #d1a05f; }.creative-cta h2 em { color: #6a2e43; }.creative-cta .theatre-button { background: #6a2e43; }.cta-star { color: #a74750; }
.fleur-site .portfolio-hero { background-color: #6a2e43; background-image: radial-gradient(circle at 14% 22%, rgba(209,160,95,.82) 0 4px, transparent 5px), radial-gradient(circle at 80% 74%, rgba(167,71,80,.8) 0 7px, transparent 8px); }.fleur-site .portfolio-hero h1 em { color: #e0b273; }.fleur-site .portfolio-images .gallery-image { box-shadow: 8px 9px 0 #a74750; }.fleur-site .portfolio-images .gallery-image-wide { box-shadow: 10px 10px 0 #6a2e43; }.fleur-site .production-intro { background: #87404b; }.fleur-site .production-intro h1 em { color: #e0b273; }.fleur-site .full-photo-grid { background-color: #f4ecdf; background-image: linear-gradient(90deg, rgba(106,46,67,.08) 1px, transparent 1px), linear-gradient(rgba(106,46,67,.08) 1px, transparent 1px); }.fleur-site .photo-grid-item:nth-child(4n) { box-shadow: 7px 8px 0 #87404b; }
.theatre-site .about-theatre { background: #6a2e43; }.theatre-site .about-theatre-copy::before { color: #e0b273; }.theatre-site .about-theatre-image { border-left-color: #a74750; }.theatre-site .about-statement { background: #f4ecdf; }.theatre-site .about-statement h2 em { color: #9d3f49; }.theatre-site .contact-theatre { background: #87404b; }.theatre-site .contact-theatre > div:first-child::before { background: #d1a05f; }.theatre-site .theatre-form { background: #f4ecdf; }.theatre-site .theatre-form .theatre-button { background: #6a2e43; }
.full-photo-grid .photo-grid-item { display: flex; align-items: center; justify-content: center; background: #2c1d25; }.full-photo-grid .photo-grid-item img { object-fit: contain; object-position: center; }.full-photo-grid .photo-grid-item.photo-grid-tall img { object-position: center top; }
.creative-site .theatre-hero-image { object-position: center center; }.creative-site .photo-story-main img { object-position: center center; }.creative-site .photo-story-side img { object-position: center 18%; }.creative-site .workboard-photo img { object-position: center 16%; }.fleur-site .portfolio-images .gallery-image-tall img { object-position: center top; }.fleur-site .portfolio-images .gallery-image-wide img { object-position: center center; }

/* Detail pages: the video archive now belongs to the same theatre world. */
.fleur-detail { background: #f4ecdf; color: #21151b; font-family: "DM Sans", Arial, sans-serif; }
.fleur-detail .navbar { background: #21151b; box-shadow: none; padding: 1.35rem clamp(1.3rem, 4vw, 4.5rem); border-bottom: 1px solid rgba(244,236,223,.14); display: flex; align-items: center; justify-content: space-between; }
.fleur-detail .logo { color: #f4ecdf; font-family: "Bebas Neue", sans-serif; font-size: 1.7rem; letter-spacing: .11em; text-decoration: none; }
.fleur-detail .nav-meta { display: flex; align-items: center; gap: 1.1rem; }.fleur-detail .nav-links { display: flex; gap: .2rem; margin: 0; padding: 0; list-style: none; }.fleur-detail .nav-links li a { background: transparent; color: rgba(244,236,223,.78); border-radius: 0; padding: .55rem .85rem; font-size: .82rem; letter-spacing: .08em; text-transform: uppercase; text-decoration: none; }.fleur-detail .nav-links li a.active { border-bottom: 1px solid #d1a05f; color: #fff; }
.fleur-detail .language-switch { background: transparent; border: 1px solid rgba(244,236,223,.25); border-radius: 0; padding: .45rem .6rem; }.fleur-detail .language-pill { color: rgba(244,236,223,.7); background: transparent; border: 0; }.fleur-detail .language-pill-active { color: #d1a05f; }
.fleur-detail .work-section { background: #f4ecdf; padding: clamp(3rem, 7vw, 6.5rem) clamp(1.2rem, 7vw, 7rem) clamp(5rem, 9vw, 8rem); }.fleur-detail .work-wrapper { max-width: 1320px; margin: 0 auto; }.fleur-detail .work-detail-intro { background: #6a2e43; color: #f4ecdf; padding: clamp(2rem, 6vw, 5.5rem); margin: 0 0 clamp(2.4rem, 5vw, 4.5rem); border-left: 10px solid #d1a05f; }.fleur-detail .work-detail-intro .section-label { color: #e0b273; }.fleur-detail .work-detail-intro h1 { color: #f4ecdf; font-family: "Bebas Neue", sans-serif; font-size: clamp(3.6rem, 8vw, 7.4rem); line-height: .84; letter-spacing: .01em; margin: 0 0 1rem; }.fleur-detail .work-detail-intro > p:not(.section-label) { max-width: 39rem; margin: 0; font-size: 1.05rem; line-height: 1.65; color: rgba(244,236,223,.82); }.fleur-detail .work-back-button { display: inline-block; color: #f4ecdf; border-color: #e0b273; margin-top: 2rem; text-decoration: none; text-transform: uppercase; letter-spacing: .1em; font-size: .75rem; padding-bottom: .35rem; border-bottom: 1px solid; }
.fleur-detail .work-block { padding: 0; margin: 0; }.fleur-detail .work-block-head { margin: 3.5rem 0 1.1rem; }.fleur-detail .work-block-head .section-label { color: #6a2e43; font-size: .75rem; text-transform: uppercase; letter-spacing: .14em; font-weight: 700; }.fleur-detail .work-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: clamp(1rem, 2vw, 1.7rem); }.fleur-detail .work-grid-wide, .fleur-detail .work-grid-horizontal { grid-template-columns: repeat(auto-fit, minmax(340px, 1fr)); }.fleur-detail .work-card { background: #2c1d25; padding: .55rem; box-shadow: 9px 10px 0 #d1a05f; }.fleur-detail .video-wrapper, .fleur-detail .short-wrapper { margin: 0; background: #120d12; }.fleur-detail iframe { display: block; width: 100%; border: 0; }.fleur-detail .video-wrapper iframe { aspect-ratio: 16 / 9; height: auto; }.fleur-detail .short-wrapper iframe { aspect-ratio: 9 / 16; height: auto; }
.archive-callout { display: inline-flex; align-items: center; margin: 2rem 0 0; padding: .75rem .95rem; background: #d1a05f; color: #21151b; font-size: .72rem; font-weight: 700; letter-spacing: .09em; text-transform: uppercase; }.archive-grid { position: relative; }.archive-grid::before { content: "MEER WERK"; display: block; grid-column: 1 / -1; color: #6a2e43; font-size: .72rem; font-weight: 700; letter-spacing: .15em; margin: 0 0 1rem; }

/* Make the portfolio routes unmistakably clickable. */
.portfolio-images .gallery-caption { align-items: center; gap: 1rem; padding: 1.35rem 0 0; }.portfolio-images .gallery-caption > span { font-weight: 700; color: #6a2e43; }.portfolio-images .gallery-caption a { display: inline-flex; align-items: center; justify-content: center; background: #6a2e43; color: #f4ecdf; padding: .9rem 1.1rem; font-size: .76rem; font-weight: 700; letter-spacing: .09em; text-decoration: none; text-transform: uppercase; transition: transform .18s ease, background .18s ease; }.portfolio-images .gallery-caption a:hover { background: #d1a05f; color: #21151b; transform: translateY(-3px); }
.portfolio-archive .archive-card { border: 2px solid transparent; box-shadow: 0 0 0 1px rgba(106,46,67,.16); }.portfolio-archive .archive-card:hover { border-color: #6a2e43; box-shadow: 8px 9px 0 #d1a05f; }.portfolio-archive .archive-card b { display: flex; align-items: center; justify-content: space-between; width: 100%; box-sizing: border-box; margin-top: auto; padding: .9rem 1rem; background: #6a2e43; color: #f4ecdf; font-size: .73rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }.portfolio-archive .archive-card b::after { content: "OPEN"; color: #e0b273; font-size: .62rem; letter-spacing: .13em; }.portfolio-archive .archive-card-dark b { background: #f4ecdf; color: #6a2e43; }.portfolio-archive .archive-card-dark b::after { color: #a74750; }
@media (max-width: 760px) { .portfolio-images .gallery-caption { align-items: stretch; flex-direction: column; }.portfolio-images .gallery-caption a { width: 100%; box-sizing: border-box; }.portfolio-archive .archive-card b { padding: 1rem; } }

/* A new, less card-like route into the portfolio. */
.my-work-rebuild { background: #f4ecdf; color: #21151b; }.work-opening { min-height: min(760px, calc(100vh - 74px)); display: grid; grid-template-columns: 1.02fr .98fr; background: #55273b; color: #f4ecdf; overflow: hidden; }.work-opening-copy { padding: clamp(4rem, 10vw, 9rem) clamp(1.5rem, 8vw, 8rem); align-self: center; }.work-opening-copy .eyebrow { color: #e0b273; }.work-opening h1 { margin: 0; font-family: "Bebas Neue", sans-serif; font-size: clamp(4.2rem, 8vw, 8.6rem); font-weight: 400; letter-spacing: .01em; line-height: .83; }.work-opening h1 em { color: #e0b273; font-style: normal; }.work-opening-copy > p:not(.eyebrow) { max-width: 31rem; margin: 2rem 0; color: rgba(244,236,223,.84); font-size: 1.08rem; line-height: 1.7; }.work-direction { color: #e0b273; font-size: .72rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; }.work-opening-image { min-height: 100%; margin: 0; position: relative; background: #21151b; display: flex; align-items: center; justify-content: center; }.work-opening-image img { height: 100%; width: 100%; object-fit: contain; object-position: center; display: block; }.work-opening-image figcaption { position: absolute; right: 1.3rem; bottom: 1.25rem; max-width: 12rem; padding: .75rem .9rem; background: #d1a05f; color: #21151b; font-size: .68rem; font-weight: 700; letter-spacing: .07em; line-height: 1.45; text-transform: uppercase; }
.work-choices { padding: clamp(5rem, 11vw, 10rem) clamp(1.5rem, 8vw, 8rem); }.choices-intro { display: grid; grid-template-columns: 1fr 1fr; align-items: end; margin-bottom: clamp(2.5rem, 6vw, 5rem); }.choices-intro .eyebrow { color: #6a2e43; margin: 0 0 .5rem; }.choices-intro h2 { grid-column: 1 / -1; margin: 0; font-family: "Bebas Neue", sans-serif; font-size: clamp(3.7rem, 7vw, 7.2rem); line-height: .84; font-weight: 400; letter-spacing: .01em; }.choices-intro h2 em { color: #a74750; font-style: normal; }.choice-list { border-top: 2px solid #21151b; }.work-choice { display: grid; grid-template-columns: .55fr 1.3fr 1.15fr .7fr; align-items: end; gap: 1.2rem; min-height: 215px; padding: 1.7rem 0; border-bottom: 1px solid rgba(33,21,27,.35); color: inherit; text-decoration: none; transition: padding .22s ease, background .22s ease; }.work-choice:hover { padding-left: 1.2rem; padding-right: 1.2rem; background: #e9ddce; }.choice-number { align-self: start; color: #6a2e43; font-size: .67rem; font-weight: 700; letter-spacing: .1em; }.work-choice h3 { margin: 0; font-family: "Bebas Neue", sans-serif; font-size: clamp(2.8rem, 5.2vw, 5.7rem); line-height: .79; letter-spacing: .01em; font-weight: 400; }.work-choice p { max-width: 18rem; margin: 0; font-size: .93rem; line-height: 1.55; }.work-choice b { align-self: center; justify-self: end; display: inline-flex; align-items: center; gap: .85rem; padding: .9rem 1rem; background: #6a2e43; color: #f4ecdf; font-size: .7rem; letter-spacing: .08em; text-transform: uppercase; white-space: nowrap; }.work-choice b i { color: #e0b273; font-size: 1rem; font-style: normal; }.choice-two { background: #e9ddce; }.choice-three { background: #87404b; color: #f4ecdf; }.choice-three .choice-number { color: #e0b273; }.choice-three b { background: #f4ecdf; color: #6a2e43; }.choice-four { background: #d1a05f; }.work-closing { padding: clamp(4rem, 8vw, 7rem) 1.5rem; background: #21151b; color: #f4ecdf; text-align: center; }.work-closing > div { display: flex; flex-direction: column; align-items: center; }.work-closing span { font-size: 2rem; }.work-closing p { margin: 1rem 0; font-family: "Bebas Neue", sans-serif; font-size: clamp(2.3rem, 4vw, 4.4rem); letter-spacing: .02em; }.work-closing a { color: #21151b; background: #d1a05f; padding: 1rem 1.2rem; text-decoration: none; text-transform: uppercase; font-size: .74rem; font-weight: 700; letter-spacing: .08em; }.work-closing a b { margin-left: 1rem; font-size: 1.1rem; }
@media (max-width: 850px) { .work-opening { grid-template-columns: 1fr; }.work-opening-image { min-height: 580px; }.choices-intro { display: block; }.work-choice { grid-template-columns: .55fr 1.25fr 1fr; }.work-choice b { grid-column: 2 / -1; justify-self: start; }.work-choice p { align-self: end; } }
@media (max-width: 560px) { .work-opening { min-height: auto; }.work-opening-copy { padding-top: 5rem; padding-bottom: 4rem; }.work-opening-image { min-height: 470px; }.work-opening-image figcaption { right: .8rem; bottom: .8rem; }.work-choice { grid-template-columns: 1fr; gap: .8rem; min-height: 0; padding: 1.7rem 0; }.work-choice h3 { font-size: 3.8rem; }.work-choice b { grid-column: 1; justify-self: start; }.choice-number { margin-bottom: .4rem; } }

/* A compact dark gallery: no pale background, no oversized portrait panels. */
.fleur-site .full-photo-grid { background: #21151b; background-image: none; }.full-photo-grid .photo-grid-item { transform: none !important; grid-row: span 1; min-height: clamp(330px, 32vw, 460px); border: 1px solid rgba(224,178,115,.38); box-shadow: none; background: #120d12; }.full-photo-grid .photo-grid-item.photo-grid-wide { min-height: clamp(240px, 18vw, 340px); }.full-photo-grid .photo-grid-item.photo-grid-tall { grid-column: span 3; min-height: clamp(470px, 33vw, 590px); }.full-photo-grid .photo-grid-item img { object-fit: cover; object-position: center center; }.full-photo-grid .photo-grid-item.photo-grid-tall img { object-position: center top; }.full-photo-grid .photo-grid-item:hover { border-color: #d1a05f; }
@media (max-width: 760px) { .full-photo-grid .photo-grid-item, .full-photo-grid .photo-grid-item.photo-grid-wide { min-height: 260px; }.full-photo-grid .photo-grid-item.photo-grid-tall { grid-column: span 1; min-height: 390px; } }

/* Production and cast credits sit inside the image, never underneath it. */
.full-photo-grid .photo-grid-item { position: relative; }.photo-credit { position: absolute; right: 0; bottom: 0; z-index: 2; display: flex; flex-direction: column; gap: .18rem; min-width: 10.5rem; margin: 0; padding: .7rem .85rem .75rem; background: #f4ecdf; color: #21151b; box-shadow: -5px -5px 0 rgba(33,21,27,.34); }.photo-credit strong { font-family: "Bebas Neue", sans-serif; font-size: 1.2rem; font-weight: 400; letter-spacing: .04em; line-height: .9; }.photo-credit span { color: #6a2e43; font-size: .63rem; font-weight: 700; letter-spacing: .08em; line-height: 1.25; text-transform: uppercase; }

/* One extra column for the two-person portrait; the middle image gives up
   exactly that column, so the last portrait stays flush right. */
.full-photo-grid .photo-grid-item.photo-grid-tall.gallery-row-six-first { grid-column: span 4; }.full-photo-grid .photo-grid-item.photo-grid-wide.gallery-row-six-middle { grid-column: span 5; }
@media (max-width: 760px) { .full-photo-grid .photo-grid-item.photo-grid-tall.gallery-row-six-first, .full-photo-grid .photo-grid-item.photo-grid-wide.gallery-row-six-middle { grid-column: span 1; } }

/* The final three portraits share the last row equally and fill it fully. */
.full-photo-grid .photo-grid-item.photo-grid-tall.gallery-last-row { grid-column: span 4; }
.full-photo-grid .photo-grid-item.gallery-last-row img { object-fit: contain; }
.full-photo-grid .photo-grid-item.photo-grid-tall.gallery-last-row { min-height: clamp(370px, 28vw, 470px); }
@media (max-width: 760px) { .full-photo-grid .photo-grid-item.photo-grid-tall.gallery-last-row { grid-column: span 1; } }


@media (max-width: 760px) { .fleur-detail .navbar { padding: 1rem 1.2rem; }.fleur-detail .nav-links { display: none; }.fleur-detail .work-grid-wide, .fleur-detail .work-grid-horizontal { grid-template-columns: 1fr; }.fleur-detail .work-card { box-shadow: 6px 7px 0 #d1a05f; } }

/* Carry the production-story two-tone headline rhythm into overview titles. */
.fleur-detail .work-detail-intro h1 em,
.production-card h2 em,
.work-choice h3 em {
  color: #e0b273;
  font: inherit;
}

.work-choice h3 em {
  color: #9d3f49;
}

.choice-three h3 em,
.choice-five h3 em {
  color: #e0b273;
}

.choice-four h3 em {
  color: #6a2e43;
}

/* Final row: three equal portrait frames. Their 4:5 proportion follows the
   source photos, so no empty side space or artificial stretched panels. */
.full-photo-grid .photo-grid-item.photo-grid-tall.gallery-last-row.gallery-last-row-first,
.full-photo-grid .photo-grid-item.photo-grid-tall.gallery-last-row.gallery-last-row-short,
.full-photo-grid .photo-grid-item.photo-grid-tall.gallery-last-row.gallery-last-row-last { grid-column: span 4; align-self: auto; height: auto; min-height: 0; aspect-ratio: 4 / 5; }
.full-photo-grid .photo-grid-item.gallery-last-row img { object-fit: cover; }
@media (max-width: 760px) { .full-photo-grid .photo-grid-item.photo-grid-tall.gallery-last-row.gallery-last-row-first, .full-photo-grid .photo-grid-item.photo-grid-tall.gallery-last-row.gallery-last-row-short, .full-photo-grid .photo-grid-item.photo-grid-tall.gallery-last-row.gallery-last-row-last { grid-column: span 1; height: auto; min-height: 390px; } }

/* About Fleur: a personal page with the rhythm of a programme rather than a standard biography. */
.about-reimagined { background: #f4ecdf; color: #21151b; overflow: hidden; }.about-opening { display: grid; grid-template-columns: 1.03fr .97fr; min-height: min(820px, calc(100vh - 75px)); background: #6a2e43; color: #f4ecdf; }.about-opening-copy { position: relative; z-index: 2; padding: clamp(4.5rem, 10vw, 9rem) clamp(1.5rem, 8vw, 9rem); }.about-opening .eyebrow { color: #e0b273; margin: 0 0 1.35rem; }.about-opening .eyebrow span { margin-left: .45rem; font-size: 1rem; }.about-opening h1, .about-introduction h2, .about-on-set h2, .about-process h2 { margin: 0; font-family: "Bebas Neue", sans-serif; font-size: clamp(4.4rem, 8.5vw, 9rem); font-weight: 400; letter-spacing: .01em; line-height: .81; }.about-opening h1 em, .about-introduction h2 em, .about-on-set h2 em, .about-process h2 em { color: #e0b273; font-style: normal; }.about-opening-lead { max-width: 30rem; margin: 2.2rem 0; color: rgba(244,236,223,.84); font-size: 1.05rem; line-height: 1.68; }.about-small-link { display: inline-flex; align-items: center; gap: .85rem; padding-bottom: .35rem; border-bottom: 1px solid #e0b273; color: #f4ecdf; font-size: .73rem; font-weight: 700; letter-spacing: .09em; text-decoration: none; text-transform: uppercase; }.about-small-link span { color: #e0b273; font-size: 1.2rem; }.about-opening-visual { position: relative; min-height: 100%; background: #21151b; }.about-photo-frame { position: absolute; inset: 7% 8% 7% 0; overflow: hidden; border-left: 10px solid #d1a05f; }.about-photo-frame img { width: 100%; height: 100%; object-fit: cover; object-position: 58% center; filter: saturate(.75) contrast(1.04); }.about-camera-note { position: absolute; top: 7%; right: 6%; padding: .75rem .82rem; background: #d1a05f; color: #21151b; font-size: .68rem; font-weight: 700; letter-spacing: .1em; line-height: 1.2; text-align: center; transform: rotate(5deg); }.about-circle-text { position: absolute; left: -1.8rem; bottom: 20%; width: 6.4rem; height: 6.4rem; display: flex; align-items: center; justify-content: center; border: 1px solid rgba(244,236,223,.8); border-radius: 50%; background: #21151b; color: #f4ecdf; font-size: .52rem; font-weight: 700; letter-spacing: .1em; line-height: 1.35; text-align: center; transform: rotate(-12deg); }.about-photo-caption { position: absolute; right: 6%; bottom: 7%; margin: 0; color: #f4ecdf; font-family: "Playfair Display", Georgia, serif; font-size: 1.05rem; line-height: 1.4; text-align: right; }.about-introduction { display: grid; grid-template-columns: .25fr 1.1fr 1fr; gap: 4vw; padding: clamp(5.5rem, 11vw, 10rem) clamp(1.5rem, 8vw, 9rem); background: #f4ecdf; }.about-introduction-number { color: #9d3f49; font-family: "Bebas Neue", sans-serif; font-size: clamp(4.5rem, 8vw, 8rem); line-height: .75; }.about-introduction .eyebrow, .about-on-set .eyebrow, .about-process .eyebrow { margin: 0 0 1rem; color: #6a2e43; }.about-introduction h2 { font-size: clamp(3.5rem, 6vw, 6.6rem); }.about-introduction h2 em { color: #9d3f49; }.about-introduction-copy { align-self: end; padding-bottom: .35rem; }.about-introduction-copy p { max-width: 28rem; margin: 0 0 1.15rem; font-size: 1.02rem; line-height: 1.72; }.about-on-set { display: grid; grid-template-columns: .92fr 1.08fr; min-height: 720px; background: #21151b; color: #f4ecdf; }.about-on-set-image { position: relative; overflow: hidden; }.about-on-set-image img { width: 100%; height: 100%; object-fit: cover; object-position: 65% center; filter: saturate(.68); }.about-on-set-image span { position: absolute; right: 1.5rem; bottom: 1.3rem; display: grid; width: 4rem; height: 4rem; place-items: center; border-radius: 50%; background: #d1a05f; font-size: 1.6rem; transform: rotate(-9deg); }.about-on-set-copy { align-self: center; padding: clamp(4rem, 9vw, 8rem); }.about-on-set-copy .eyebrow { color: #e0b273; }.about-on-set h2 { font-size: clamp(4rem, 7vw, 7.4rem); }.about-on-set-copy > p:not(.eyebrow) { max-width: 30rem; margin: 2rem 0 2.8rem; color: rgba(244,236,223,.78); font-size: 1.02rem; line-height: 1.7; }.about-post-it { width: fit-content; max-width: 18rem; padding: 1.15rem 1.3rem 1.2rem; background: #d1a05f; color: #21151b; transform: rotate(-2deg); }.about-post-it span { display: block; margin-bottom: .55rem; font-size: .68rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }.about-post-it strong { font-family: "Playfair Display", Georgia, serif; font-size: 1.03rem; font-weight: 500; line-height: 1.35; }.about-process { display: grid; grid-template-columns: .8fr 1.2fr; gap: 6vw; padding: clamp(5.5rem, 11vw, 10rem) clamp(1.5rem, 8vw, 9rem); background: #e9ddce; }.about-process h2 { font-size: clamp(3.8rem, 6.7vw, 7.1rem); }.about-process h2 em { color: #9d3f49; }.about-steps { margin: 0; padding: 0; list-style: none; border-top: 2px solid #21151b; }.about-steps li { display: grid; grid-template-columns: 3.2rem 1fr 2rem; gap: 1.2rem; align-items: start; padding: 1.55rem 0; border-bottom: 1px solid rgba(33,21,27,.35); }.about-steps li > span { color: #6a2e43; font-size: .73rem; font-weight: 700; letter-spacing: .08em; }.about-steps h3 { margin: 0 0 .35rem; font-family: "Bebas Neue", sans-serif; font-size: 2rem; font-weight: 400; letter-spacing: .03em; line-height: .9; }.about-steps p { max-width: 25rem; margin: 0; font-size: .93rem; line-height: 1.55; }.about-steps b { color: #9d3f49; font-size: 1.2rem; text-align: right; }.about-closing { display: flex; flex-direction: column; align-items: center; padding: clamp(5rem, 10vw, 9rem) 1.5rem; background: #6a2e43; color: #f4ecdf; text-align: center; }.about-closing > span { color: #e0b273; font-size: 2rem; }.about-closing p { margin: 1.1rem 0 1.9rem; font-family: "Bebas Neue", sans-serif; font-size: clamp(3.2rem, 6.5vw, 7rem); font-weight: 400; letter-spacing: .02em; line-height: .87; }.about-closing a { padding: 1rem 1.2rem; background: #d1a05f; color: #21151b; font-size: .75rem; font-weight: 700; letter-spacing: .09em; text-decoration: none; text-transform: uppercase; }.about-closing a b { margin-left: .8rem; font-size: 1.1rem; }
@media (max-width: 850px) { .about-opening, .about-on-set, .about-process { grid-template-columns: 1fr; }.about-opening-visual { min-height: 620px; }.about-photo-frame { inset: 0 8% 7% 8%; }.about-circle-text { left: 4%; bottom: 4%; }.about-on-set-image { min-height: 530px; }.about-introduction { grid-template-columns: .2fr 1fr; }.about-introduction-copy { grid-column: 2; }.about-process { gap: 3rem; } }
@media (max-width: 560px) { .about-opening-copy { padding-top: 5rem; padding-bottom: 4rem; }.about-opening-visual { min-height: 480px; }.about-photo-frame { inset: 0 0 0 0; border-left-width: 6px; }.about-camera-note { top: .8rem; right: .8rem; }.about-circle-text { width: 5.3rem; height: 5.3rem; left: .7rem; bottom: .7rem; }.about-photo-caption { display: none; }.about-introduction { grid-template-columns: 1fr; gap: 1.5rem; }.about-introduction-copy { grid-column: auto; }.about-introduction-number { font-size: 5.2rem; }.about-on-set-image { min-height: 420px; }.about-on-set-copy { padding: 4rem 1.5rem; }.about-process { padding-left: 1.5rem; padding-right: 1.5rem; }.about-steps li { grid-template-columns: 2.4rem 1fr 1.5rem; gap: .75rem; }.about-steps h3 { font-size: 1.75rem; } }

/* Home opening: an editorial opening spread instead of graphics on top of the photo. */
.home-opening-film { display: grid; grid-template-columns: 1.12fr .88fr; min-height: min(810px, calc(100vh - 74px)); background: #21151b; }.home-opening-film-image { position: relative; overflow: hidden; min-height: 100%; background: #120d12; }.home-opening-film-image img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: center center; filter: saturate(.8) contrast(1.04); }.home-opening-film-image::after { content: ""; position: absolute; inset: 0; background: linear-gradient(0deg, rgba(18,13,18,.72), transparent 36%); pointer-events: none; }.home-opening-film-image p { position: absolute; z-index: 1; bottom: 2rem; left: clamp(1.4rem,4vw,4rem); margin: 0; color: #f4ecdf; font-family: "Playfair Display", Georgia, serif; font-size: 1rem; }.home-opening-film-image p span { color: rgba(244,236,223,.7); font-family: "DM Sans", Arial, sans-serif; font-size: .62rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }.home-opening-film-copy { position: relative; display: flex; flex-direction: column; justify-content: center; padding: clamp(4rem,8vw,8rem) clamp(1.5rem,6vw,6.5rem); background: #6a2e43; color: #f4ecdf; }.home-opening-film-copy::before { content: "✦"; position: absolute; right: clamp(1.5rem,5vw,4rem); top: clamp(2rem,5vw,4rem); color: #d1a05f; font-size: 2.2rem; }.home-opening-film-copy .eyebrow { margin: 0 0 1.25rem; color: #e0b273; }.home-opening-film-copy h1 { max-width: 42rem; margin: 0; font-family: "Dosis", Arial, sans-serif; font-size: clamp(3.6rem,5.8vw,6.45rem); font-weight: 600; letter-spacing: -.055em; line-height: .94; }.home-opening-film-copy h1 em { color: #e0b273; font-style: normal; font-weight: 700; }.home-opening-film-copy > p:not(.eyebrow) { max-width: 29rem; margin: 1.8rem 0 2.2rem; color: rgba(244,236,223,.82); font-size: 1.05rem; line-height: 1.65; }.home-opening-film-copy .theatre-button { background: #9d3f49; }.home-opening-film-copy .theatre-button:hover { background: #d1a05f; }.home-opening-film-copy .theatre-text-link { color: #f4ecdf; }.home-opening-film-signature { position: absolute; right: clamp(1.5rem,5vw,4.2rem); bottom: clamp(1.5rem,4vw,3.5rem); display: grid; gap: .35rem; padding-top: .8rem; border-top: 1px solid rgba(224,178,115,.65); color: #e0b273; font-size: .6rem; font-weight: 700; letter-spacing: .11em; text-transform: uppercase; }.home-opening-film-signature b { color: #f4ecdf; font-family: "Bebas Neue", sans-serif; font-size: 1.25rem; font-weight: 400; letter-spacing: .06em; line-height: .9; }
@media (max-width: 850px) { .home-opening-film { grid-template-columns: 1fr; }.home-opening-film-image { min-height: 510px; }.home-opening-film-copy { min-height: 520px; }.home-opening-film-copy h1 { font-size: clamp(3.7rem,10vw,6.3rem); } }
@media (max-width: 560px) { .home-opening-film-image { min-height: 360px; }.home-opening-film-image p { left: 1.2rem; bottom: 1.25rem; }.home-opening-film-copy { min-height: 490px; padding: 4rem 1.5rem 7rem; }.home-opening-film-copy h1 { font-size: 3.85rem; }.home-opening-film-signature { left: 1.5rem; right: auto; bottom: 1.5rem; } }

/* Final theatre polish: deeper layers and a shared programme-like rhythm. */
.theatre-site .theatre-header { border-bottom: 1px solid rgba(224,178,115,.17); }.home-opening-film { position: relative; }.home-opening-film-image { border-right: 1px solid rgba(224,178,115,.4); }.home-opening-film-copy { background-image: radial-gradient(circle at 88% 13%, rgba(209,160,95,.12) 0 1px, transparent 1.6px); background-size: 15px 15px; }.home-opening-film-copy > * { position: relative; z-index: 1; }.home-opening-film-copy::after { content: "01"; position: absolute; left: clamp(1.5rem,6vw,6rem); bottom: clamp(1.5rem,4vw,3.5rem); color: rgba(244,236,223,.17); font-family: "Bebas Neue", sans-serif; font-size: clamp(4rem,8vw,8rem); line-height: .7; }.home-opening-film-signature { z-index: 2; }.home-programme-ribbon { display: flex; align-items: center; justify-content: center; gap: clamp(.85rem,3vw,3.7rem); min-height: 92px; padding: .8rem 1.5rem; background: #21151b; color: #f4ecdf; border-top: 1px solid rgba(224,178,115,.34); border-bottom: 1px solid rgba(224,178,115,.34); }.home-programme-ribbon p { display: flex; align-items: baseline; gap: .7rem; margin: 0; font-family: "Bebas Neue", sans-serif; font-size: clamp(1.35rem,2.1vw,2rem); font-weight: 400; letter-spacing: .035em; }.home-programme-ribbon p span { color: #d1a05f; font-family: "DM Sans", Arial, sans-serif; font-size: .58rem; font-weight: 700; letter-spacing: .13em; }.home-programme-ribbon > b { color: #d1a05f; font-size: 1rem; }.fleur-site .creative-intro { position: relative; overflow: hidden; padding-top: clamp(5.5rem,10vw,9rem); padding-bottom: clamp(5.5rem,10vw,9rem); }.fleur-site .creative-intro::after { content: "02"; position: absolute; right: clamp(1.5rem,7vw,7rem); bottom: clamp(1.2rem,5vw,4rem); color: rgba(106,46,67,.08); font-family: "Bebas Neue", sans-serif; font-size: clamp(8rem,18vw,18rem); line-height: .65; pointer-events: none; }.fleur-site .creative-intro-copy { position: relative; z-index: 1; }.fleur-site .intro-icon-card { position: relative; z-index: 1; border: 1px solid rgba(33,21,27,.25); box-shadow: 11px 12px 0 #9d3f49; }.creative-photo-story { position: relative; padding-top: clamp(3rem,6vw,6rem); padding-bottom: clamp(3rem,6vw,6rem); background: #21151b; }.creative-photo-story::before { content: "BEELD · RITME · EMOTIE"; position: absolute; top: 1.35rem; left: clamp(1.2rem,6vw,7rem); color: #d1a05f; font-size: .61rem; font-weight: 700; letter-spacing: .15em; }.creative-photo-story .photo-story-main, .creative-photo-story .photo-story-side { border: 1px solid rgba(224,178,115,.4); box-shadow: none; }.creative-photo-story .photo-story-note { border-left: 2px solid #d1a05f; }.fleur-site .home-workboard { position: relative; }.fleur-site .home-workboard::after { content: "03"; position: absolute; z-index: 0; right: 4%; bottom: 3%; color: rgba(106,46,67,.08); font-family: "Bebas Neue", sans-serif; font-size: clamp(9rem,19vw,18rem); line-height: .65; }.fleur-site .home-workboard > * { position: relative; z-index: 1; }.fleur-site .creative-services { border-top: 10px solid #d1a05f; }.fleur-site .creative-services .services-list article { position: relative; overflow: hidden; }.fleur-site .creative-services .services-list article::after { position: absolute; right: .9rem; bottom: -.7rem; color: rgba(244,236,223,.11); font-family: "Bebas Neue", sans-serif; font-size: 5.5rem; line-height: 1; }.fleur-site .creative-services .services-list article:nth-child(1)::after { content: "01"; }.fleur-site .creative-services .services-list article:nth-child(2)::after { content: "02"; }.fleur-site .creative-services .services-list article:nth-child(3)::after { content: "03"; }.theatre-footer { border-top: 1px solid rgba(224,178,115,.3); }
@media (max-width: 760px) { .home-programme-ribbon { align-items: flex-start; flex-direction: column; gap: .45rem; padding: 1.45rem 1.5rem; }.home-programme-ribbon > b { display: none; }.home-programme-ribbon p { font-size: 1.45rem; }.home-opening-film-copy::after { bottom: 1.35rem; }.fleur-site .creative-intro::after { font-size: 9rem; }.creative-photo-story { padding-top: 4.4rem; } }

/* The work-page opener uses the same clear cast credit as the gallery. */
.work-opening-image figcaption strong { display: block; margin-bottom: .28rem; color: #21151b; font-family: "Bebas Neue", sans-serif; font-size: 1.18rem; font-weight: 400; letter-spacing: .035em; line-height: .92; }.work-opening-image figcaption span { display: block; color: #6a2e43; font-family: "DM Sans", Arial, sans-serif; font-size: .61rem; font-weight: 700; letter-spacing: .09em; line-height: 1.2; text-transform: uppercase; }

/* Native video gallery: the clips belong to the portfolio, not to YouTube. */
.theatre-video-intro { max-width: 40rem; margin: 0 0 2.1rem; color: #4a363d; font-family: "Playfair Display", Georgia, serif; font-size: 1.15rem; line-height: 1.55; }.theatre-video-intro em { color: #6a2e43; font-style: normal; }.theatre-video-gallery { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(.85rem, 1.6vw, 1.45rem); }.theatre-video-card { position: relative; aspect-ratio: 1 / 1; overflow: hidden; background: #120d12; border: 1px solid rgba(106,46,67,.38); box-shadow: 7px 8px 0 rgba(106,46,67,.2); }.theatre-video-card video { display: block; width: 100%; height: 100%; object-fit: cover; background: #120d12; }.theatre-video-card::after { content: ""; position: absolute; inset: 0; pointer-events: none; background: linear-gradient(0deg, rgba(18,13,18,.56), transparent 44%); }.theatre-video-sound { position: absolute; z-index: 2; left: .8rem; bottom: .85rem; display: inline-flex; align-items: center; gap: .5rem; padding: .5rem .65rem; border: 1px solid rgba(244,236,223,.75); background: rgba(33,21,27,.74); color: #f4ecdf; cursor: pointer; font-family: "DM Sans", Arial, sans-serif; font-size: .57rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }.theatre-video-sound span { color: #e0b273; font-size: .85rem; }.theatre-video-card.is-playing-sound .theatre-video-sound { background: #d1a05f; border-color: #d1a05f; color: #21151b; }.theatre-video-card.is-playing-sound .theatre-video-sound span { color: #21151b; }.theatre-video-credit { position: absolute; z-index: 2; right: 0; bottom: 0; display: flex; flex-direction: column; gap: .15rem; max-width: 70%; margin: 0; padding: .65rem .78rem .68rem; background: #f4ecdf; color: #21151b; box-shadow: -4px -4px 0 rgba(33,21,27,.32); }.theatre-video-credit strong { font-family: "Bebas Neue", sans-serif; font-size: 1.05rem; font-weight: 400; letter-spacing: .035em; line-height: .9; }.theatre-video-credit span { color: #6a2e43; font-family: "DM Sans", Arial, sans-serif; font-size: .55rem; font-weight: 700; letter-spacing: .08em; line-height: 1.2; text-transform: uppercase; }
@media (max-width: 850px) { .theatre-video-gallery { grid-template-columns: repeat(2, minmax(0,1fr)); } }.theatre-video-card:last-child { grid-column: auto; }
@media (max-width: 560px) { .theatre-video-gallery { grid-template-columns: 1fr; }.theatre-video-card { aspect-ratio: 1 / 1; }.theatre-video-credit { max-width: 68%; }.theatre-video-intro { font-size: 1.05rem; } }

/* The theatre reel keeps every shot in the format its composition needs. */
.fleur-detail[data-page="theater-videography"] .theatre-video-gallery {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-items: start;
}

.fleur-detail[data-page="theater-videography"] .theatre-video-card-wide {
  grid-column: 1 / -1;
  aspect-ratio: 16 / 9;
}

.fleur-detail[data-page="theater-videography"] .theatre-video-card-portrait {
  width: min(100%, 460px);
  aspect-ratio: 9 / 16;
  justify-self: center;
}

.fleur-detail[data-page="theater-videography"] .theatre-video-card-wide video,
.fleur-detail[data-page="theater-videography"] .theatre-video-card-portrait video {
  object-fit: contain;
}

.fleur-detail[data-page="theater-videography"] .theatre-video-card-ben video,
.fleur-detail[data-page="theater-videography"] .theatre-video-card-lieke video {
  object-position: center 14%;
}

.fleur-detail[data-page="theater-videography"] .theatre-video-sound {
  top: 50%;
  bottom: auto;
  left: 50%;
  padding: .78rem 1rem;
  border-width: 2px;
  background: rgba(33,21,27,.88);
  box-shadow: 4px 5px 0 rgba(18,13,18,.35);
  font-size: .68rem;
  transform: translate(-50%, -50%);
}

.fleur-detail[data-page="theater-videography"] .theatre-video-card:hover .theatre-video-sound,
.fleur-detail[data-page="theater-videography"] .theatre-video-sound:focus-visible {
  border-color: #d1a05f;
  background: #d1a05f;
  color: #21151b;
}

.fleur-detail[data-page="theater-videography"] .theatre-video-card.is-playing-sound .theatre-video-sound {
  top: .8rem;
  left: .8rem;
  transform: none;
}

@media (max-width: 620px) {
  .fleur-detail[data-page="theater-videography"] .theatre-video-gallery {
    grid-template-columns: 1fr;
  }

  .fleur-detail[data-page="theater-videography"] .theatre-video-card-wide,
  .fleur-detail[data-page="theater-videography"] .theatre-video-card-portrait {
    grid-column: 1;
    width: 100%;
  }
}

/* Full-screen, next/previous viewing for the native theatre clips. */
.theatre-video-card { cursor: zoom-in; }.theatre-video-card:focus-visible { outline: 3px solid #d1a05f; outline-offset: 4px; }.theatre-video-lightbox { width: min(92vw, 1050px); max-width: none; max-height: none; margin: auto; padding: 0; overflow: visible; border: 0; background: transparent; color: #f4ecdf; }.theatre-video-lightbox::backdrop { background: rgba(18,13,18,.94); backdrop-filter: blur(7px); }.theatre-video-lightbox-content { position: relative; width: min(76vw, 870px); max-height: 82vh; margin: 0 auto; background: #120d12; box-shadow: 12px 14px 0 rgba(209,160,95,.45); }.theatre-video-lightbox-player { display: block; width: 100%; max-height: 82vh; aspect-ratio: 1 / 1; background: #120d12; object-fit: contain; }.theatre-video-lightbox-credit { position: absolute; right: 0; bottom: 0; display: flex; flex-direction: column; gap: .18rem; margin: 0; padding: .75rem .9rem; background: #f4ecdf; color: #21151b; box-shadow: -5px -5px 0 rgba(33,21,27,.36); }.theatre-video-lightbox-credit strong { font-family: "Bebas Neue", sans-serif; font-size: 1.25rem; font-weight: 400; letter-spacing: .04em; line-height: .9; }.theatre-video-lightbox-credit span { color: #6a2e43; font-family: "DM Sans", Arial, sans-serif; font-size: .6rem; font-weight: 700; letter-spacing: .09em; text-transform: uppercase; }.theatre-video-close, .theatre-video-previous, .theatre-video-next { position: absolute; z-index: 2; display: grid; place-items: center; width: 3rem; height: 3rem; padding: 0; border: 1px solid rgba(244,236,223,.75); background: #21151b; color: #f4ecdf; cursor: pointer; font-size: 1.35rem; }.theatre-video-close { top: -3.8rem; right: calc(12% - 1.5rem); color: #d1a05f; font-size: 2rem; }.theatre-video-previous { top: calc(50% - 1.5rem); left: 0; }.theatre-video-next { top: calc(50% - 1.5rem); right: 0; }.theatre-video-close:hover, .theatre-video-previous:hover, .theatre-video-next:hover { background: #d1a05f; color: #21151b; }
.theatre-video-lightbox.is-wide .theatre-video-lightbox-content { width: min(82vw, 1050px); aspect-ratio: 16 / 9; }
.theatre-video-lightbox.is-wide .theatre-video-lightbox-player { width: 100%; height: 100%; aspect-ratio: 16 / 9; }
.theatre-video-lightbox.is-portrait .theatre-video-lightbox-content { width: min(72vw, 46.125vh, 460px); aspect-ratio: 9 / 16; }
.theatre-video-lightbox.is-portrait .theatre-video-lightbox-player { width: 100%; height: 100%; aspect-ratio: 9 / 16; }
@media (max-width: 760px) { .theatre-video-lightbox { width: 100vw; }.theatre-video-lightbox-content { width: min(84vw, 620px); }.theatre-video-close { top: -3.6rem; right: 8vw; }.theatre-video-previous { left: 1.2vw; }.theatre-video-next { right: 1.2vw; } }

/* Full-screen browsing for the theatre photography archive. */
.full-photo-grid .photo-grid-item { cursor: zoom-in; }.full-photo-grid .photo-grid-item:focus-visible { outline: 3px solid #d1a05f; outline-offset: 4px; }.theatre-photo-lightbox { width: min(96vw, 1300px); max-width: none; max-height: none; margin: auto; padding: 0; overflow: visible; border: 0; background: transparent; color: #f4ecdf; }.theatre-photo-lightbox::backdrop { background: rgba(18,13,18,.95); backdrop-filter: blur(7px); }.theatre-photo-lightbox-content { position: relative; display: flex; align-items: center; justify-content: center; width: min(82vw, 1080px); height: 82vh; margin: 0 auto; background: #120d12; box-shadow: 12px 14px 0 rgba(209,160,95,.43); }.theatre-photo-lightbox-image { display: block; max-width: 100%; max-height: 100%; width: auto; height: auto; object-fit: contain; }.theatre-photo-lightbox-credit { position: absolute; right: 0; bottom: 0; display: flex; flex-direction: column; gap: .18rem; margin: 0; padding: .75rem .9rem; background: #f4ecdf; color: #21151b; box-shadow: -5px -5px 0 rgba(33,21,27,.36); }.theatre-photo-lightbox-credit strong { font-family: "Bebas Neue", sans-serif; font-size: 1.3rem; font-weight: 400; letter-spacing: .04em; line-height: .9; }.theatre-photo-lightbox-credit span { color: #6a2e43; font-family: "DM Sans", Arial, sans-serif; font-size: .61rem; font-weight: 700; letter-spacing: .09em; text-transform: uppercase; }.theatre-photo-close, .theatre-photo-previous, .theatre-photo-next { position: absolute; z-index: 2; display: grid; place-items: center; width: 3rem; height: 3rem; padding: 0; border: 1px solid rgba(244,236,223,.75); background: #21151b; color: #f4ecdf; cursor: pointer; font-size: 1.35rem; }.theatre-photo-close { top: -3.8rem; right: calc(9% - 1.5rem); color: #d1a05f; font-size: 2rem; }.theatre-photo-previous { top: calc(50% - 1.5rem); left: 0; }.theatre-photo-next { top: calc(50% - 1.5rem); right: 0; }.theatre-photo-close:hover, .theatre-photo-previous:hover, .theatre-photo-next:hover { background: #d1a05f; color: #21151b; }
@media (max-width: 760px) { .theatre-photo-lightbox { width: 100vw; }.theatre-photo-lightbox-content { width: min(82vw, 620px); height: 76vh; }.theatre-photo-close { top: -3.6rem; right: 8vw; }.theatre-photo-previous { left: 1.2vw; }.theatre-photo-next { right: 1.2vw; } }

/* Production index: each show opens its own filtered world of images. */
.work-opening-links { display: flex; flex-direction: column; align-items: flex-start; gap: .85rem; }.work-opening-links > a { display: inline-flex; align-items: center; gap: .75rem; color: #f4ecdf; font-size: .72rem; font-weight: 700; letter-spacing: .1em; text-decoration: none; text-transform: uppercase; }.work-opening-links > a b { display: grid; width: 1.65rem; height: 1.65rem; place-items: center; background: #d1a05f; color: #21151b; font-size: 1rem; }.productions-page { background: #21151b; color: #f4ecdf; }.productions-opening { padding: clamp(5rem, 10vw, 9rem) clamp(1.5rem, 8vw, 9rem) clamp(4rem, 8vw, 7rem); background: #6a2e43; }.productions-opening .eyebrow { margin: 0 0 1.3rem; color: #e0b273; }.productions-opening h1 { max-width: 52rem; margin: 0; font-family: "Bebas Neue", sans-serif; font-size: clamp(4.3rem, 8vw, 8.5rem); font-weight: 400; letter-spacing: .01em; line-height: .82; }.productions-opening h1 em { color: #e0b273; font-style: normal; }.productions-opening > p:not(.eyebrow) { max-width: 34rem; margin: 2rem 0 0; color: rgba(244,236,223,.8); font-size: 1.04rem; line-height: 1.65; }.production-cards { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }.production-card { position: relative; min-height: clamp(440px, 42vw, 670px); overflow: hidden; border: 1px solid rgba(224,178,115,.3); color: #f4ecdf; text-decoration: none; }.production-card img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; filter: saturate(.76) contrast(1.05); transition: transform .6s ease, filter .35s ease; }.production-card::after { content: ""; position: absolute; inset: 0; background: linear-gradient(0deg, rgba(18,13,18,.9) 2%, rgba(18,13,18,.12) 66%); }.production-card:hover img { transform: scale(1.045); filter: saturate(1) contrast(1.05); }.production-card-index { position: absolute; z-index: 1; top: 1.4rem; left: 1.5rem; color: #e0b273; font-size: .67rem; font-weight: 700; letter-spacing: .12em; }.production-card > div { position: absolute; z-index: 1; right: 1.5rem; bottom: 1.5rem; left: 1.5rem; }.production-card p { margin: 0 0 .75rem; color: #e0b273; font-size: .62rem; font-weight: 700; letter-spacing: .11em; text-transform: uppercase; }.production-card h2 { margin: 0; font-family: "Bebas Neue", sans-serif; font-size: clamp(3rem, 5.4vw, 5.8rem); font-weight: 400; letter-spacing: .015em; line-height: .8; }.production-card b { display: inline-flex; gap: .8rem; margin-top: 1.35rem; padding: .72rem .85rem; background: #f4ecdf; color: #21151b; font-size: .65rem; letter-spacing: .09em; text-transform: uppercase; }.production-card b i { color: #6a2e43; font-size: 1rem; font-style: normal; }.production-card-hp img { object-position: center 42%; }.production-card-willem img { object-position: center 44%; }.production-card-tick img { object-position: center center; }
@media (max-width: 700px) { .production-cards { grid-template-columns: 1fr; }.production-card { min-height: 490px; }.work-opening-links { margin-top: .8rem; } }

/* Make the route into the production archive impossible to miss. */
.work-opening-links > a { display: inline-flex; align-items: center; gap: 1rem; margin-top: .25rem; padding: .95rem 1.05rem .95rem 1.2rem; background: #d1a05f; color: #21151b; box-shadow: 6px 7px 0 rgba(18,13,18,.32); font-size: .72rem; font-weight: 700; letter-spacing: .1em; text-decoration: none; text-transform: uppercase; transition: transform .18s ease, background .18s ease; }.work-opening-links > a:hover { background: #f4ecdf; transform: translateY(-3px); }.work-opening-links > a b { display: grid; width: 1.75rem; height: 1.75rem; place-items: center; background: #6a2e43; color: #f4ecdf; font-size: 1rem; }

.productions-back { display: inline-block; margin: 0 0 2.3rem; padding-bottom: .4rem; border-bottom: 1px solid #e0b273; color: #f4ecdf; font-size: .7rem; font-weight: 700; letter-spacing: .1em; text-decoration: none; text-transform: uppercase; }

/* A friendly route for performers who recognise themselves in the gallery. */
.cast-photo-callout { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: clamp(1rem, 3vw, 2.5rem); padding: 1.5rem clamp(1.4rem, 6vw, 6rem); background: #d1a05f; color: #21151b; }.cast-photo-callout > span { font-size: 2rem; }.cast-photo-callout p { margin: 0 0 .25rem; font-family: "Bebas Neue", sans-serif; font-size: clamp(1.6rem, 2.4vw, 2.35rem); font-weight: 400; letter-spacing: .02em; line-height: .9; }.cast-photo-callout strong { display: block; max-width: 42rem; font-size: .78rem; font-weight: 500; line-height: 1.45; }.cast-photo-callout a { display: inline-flex; align-items: center; gap: .8rem; padding: .85rem 1rem; background: #6a2e43; color: #f4ecdf; font-size: .67rem; font-weight: 700; letter-spacing: .08em; text-decoration: none; text-transform: uppercase; white-space: nowrap; }.cast-photo-callout a b { color: #e0b273; font-size: 1rem; }
.cast-photo-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: .65rem; }
.cast-video-callout { margin-top: clamp(2.2rem, 5vw, 4rem); padding-right: clamp(1.4rem, 4vw, 4rem); padding-left: clamp(1.4rem, 4vw, 4rem); }

/* Keep the cast request visible even when visitors scroll quickly past the work. */
.cast-photo-callout { min-height: 112px; padding-top: 1.85rem; padding-bottom: 1.85rem; border-top: 2px solid #21151b; border-bottom: 2px solid #21151b; }.cast-photo-callout p { font-size: clamp(2rem, 3vw, 2.85rem); }.cast-photo-callout strong { font-size: .86rem; }.cast-photo-callout a { padding: 1rem 1.15rem; font-size: .72rem; box-shadow: 4px 5px 0 rgba(33,21,27,.3); }.cast-video-callout { margin: 0 0 clamp(2.2rem, 5vw, 4rem); }

.cast-photo-callout p { font-size: clamp(2.45rem, 3.7vw, 3.5rem); }.cast-photo-callout strong { max-width: 48rem; font-size: clamp(1rem, 1.25vw, 1.22rem); line-height: 1.5; }.cast-photo-callout a { font-size: .8rem; }

/* Home: remove decorative copy so the actual message gets the stage. */
.home-opening-film-copy::after, .creative-intro::after, .home-workboard::after { display: none; }.creative-photo-story::before { content: none; }.creative-photo-story { padding-top: clamp(2rem, 4vw, 4rem); }.photo-story-note > span { display: none; }.home-programme-ribbon { min-height: 70px; }.home-programme-ribbon p { font-size: clamp(1.25rem, 1.8vw, 1.65rem); }

/* Each production gets a small, text-only signature on hover. */
.production-card > div { overflow: visible; }.production-card > div::before, .production-card > div::after { position: absolute; z-index: -1; opacity: 0; pointer-events: none; transition: opacity .28s ease, transform .38s ease; }.production-card h2, .production-card p, .production-card b { position: relative; transition: color .25s ease, text-shadow .25s ease, letter-spacing .25s ease, transform .25s ease; }.production-card-svo > div::before { content: ""; right: -1.2rem; bottom: -1.2rem; width: 11rem; height: 11rem; border-radius: 50%; background: radial-gradient(circle, rgba(230,115,39,.65) 0%, rgba(230,115,39,.25) 32%, transparent 70%); filter: blur(2px); transform: scale(.5); }.production-card-svo:hover > div::before { opacity: 1; transform: scale(1); }.production-card-svo:hover h2 { color: #ffd5a5; text-shadow: 0 0 18px rgba(230,115,39,.72); }.production-card-svo:hover p { color: #ffd2a1; }.production-card-hp > div::before { content: "✦  ·  ✦  ·  ✦"; top: -1.2rem; left: .1rem; color: #ead399; font-size: 1.25rem; letter-spacing: .5rem; transform: translateY(8px) rotate(-3deg); }.production-card-hp > div::after { content: "✦"; right: 4%; top: 18%; color: #ead399; font-size: 2.7rem; transform: scale(.4) rotate(20deg); }.production-card-hp:hover > div::before, .production-card-hp:hover > div::after { opacity: 1; transform: translateY(0) rotate(0); }.production-card-hp:hover h2 { color: #f7e8ba; text-shadow: 0 0 15px rgba(234,211,153,.65); }.production-card-willem > div::before { content: "♛"; top: -3.35rem; left: 0; color: #d1a05f; font-size: 3rem; transform: translateY(10px); }.production-card-willem > div::after { content: ""; top: -.6rem; left: 0; width: 78%; height: 1px; background: #d1a05f; transform: scaleX(.15); transform-origin: left; }.production-card-willem:hover > div::before { opacity: 1; transform: translateY(0); }.production-card-willem:hover > div::after { opacity: 1; transform: scaleX(1); }.production-card-willem:hover h2 { color: #f1d08c; text-shadow: 0 0 12px rgba(209,160,95,.45); }.production-card-tick > div::before { content: "•  •  •"; top: -1.5rem; left: 0; color: #d5c7f0; font-size: 1.8rem; letter-spacing: .5rem; transform: translateX(-12px); }.production-card-tick > div::after { content: "TIK · TIK · TIK"; right: 0; bottom: 5.2rem; color: #d5c7f0; font-size: .58rem; font-weight: 700; letter-spacing: .16em; transform: translateY(8px); }.production-card-tick:hover > div::before, .production-card-tick:hover > div::after { opacity: 1; transform: translate(0,0); }.production-card-tick:hover h2 { color: #eee5ff; letter-spacing: .05em; text-shadow: 2px 0 0 rgba(169,131,215,.5), -2px 0 0 rgba(76,67,148,.6); }
@media (prefers-reduced-motion: reduce) { .production-card > div::before, .production-card > div::after, .production-card h2, .production-card p, .production-card b { transition: none; } }

.production-card > div { isolation: isolate; }.production-card > div::before, .production-card > div::after { z-index: 0; }.production-card h2, .production-card p, .production-card b { z-index: 1; }

/* Make the hover feel like the production title briefly takes over the stage. */
.production-card:hover > div { transform: translateY(-.35rem); }.production-card > div { transition: transform .38s cubic-bezier(.2,.8,.2,1); }.production-card h2 { transition: color .25s ease, text-shadow .25s ease, letter-spacing .25s ease, transform .38s cubic-bezier(.2,.8,.2,1); }.production-card:hover h2 { transform: scale(1.045); transform-origin: left bottom; }.production-card-svo > div::after { right: -2.5rem; bottom: -2.8rem; width: 18rem; height: 18rem; border: 1px solid rgba(255,198,117,.65); border-radius: 50%; box-shadow: 0 0 0 18px rgba(230,115,39,.12), 0 0 42px rgba(230,115,39,.62); transform: scale(.25); }.production-card-svo:hover > div::after { opacity: 1; transform: scale(1); animation: svoSignal 1.4s ease-out infinite; }.production-card-svo:hover b { background: #e8752d; }.production-card-hp:hover > div { animation: hpFloat 1.8s ease-in-out infinite; }.production-card-hp > div::before { font-size: 1.55rem; text-shadow: 0 0 14px rgba(234,211,153,.95); }.production-card-hp > div::after { font-size: 3.7rem; text-shadow: 0 0 21px rgba(234,211,153,.9); }.production-card-hp:hover b { background: #ead399; color: #281d32; }.production-card-willem > div::before { font-size: 4rem; text-shadow: 0 0 18px rgba(209,160,95,.55); }.production-card-willem:hover > div::before { animation: royalRise .75s cubic-bezier(.2,.8,.2,1) both; }.production-card-willem:hover b { background: #d1a05f; color: #21151b; }.production-card-tick:hover > div { animation: tickPulse .72s steps(2,end) infinite; }.production-card-tick > div::before { font-size: 2.25rem; text-shadow: 0 0 15px rgba(213,199,240,.8); }.production-card-tick > div::after { font-size: .68rem; }.production-card-tick:hover b { background: #d5c7f0; color: #2c1d45; }.production-card:hover img { transform: scale(1.075); }
@keyframes svoSignal { 0% { opacity:.8; } 100% { opacity:0; transform:scale(1.22); } } @keyframes hpFloat { 0%,100% { transform:translateY(-.35rem) rotate(0); } 50% { transform:translateY(-.65rem) rotate(.4deg); } } @keyframes royalRise { 0% { opacity:0; transform:translateY(20px) scale(.55); } 100% { opacity:1; transform:translateY(0) scale(1); } } @keyframes tickPulse { 0%,100% { transform:translateY(-.35rem); } 50% { transform:translateY(-.35rem) translateX(5px); } }
@media (prefers-reduced-motion: reduce) { .production-card:hover > div, .production-card:hover h2, .production-card:hover img { transform: none; }.production-card-svo:hover > div::after, .production-card-hp:hover > div, .production-card-willem:hover > div::before, .production-card-tick:hover > div { animation: none; } }

/* Tick, Tick… Boom!: a single warm burst behind the title, not a loud loop. */
.production-card-tick > div::before { content: "✦"; top: -3.7rem; left: 18%; display: grid; width: 11rem; height: 11rem; place-items: center; border-radius: 50%; background: radial-gradient(circle, rgba(255,230,184,.9) 0 3%, rgba(234,153,76,.45) 4% 8%, transparent 9%), repeating-conic-gradient(from 0deg, rgba(238,190,123,.65) 0deg 5deg, transparent 6deg 25deg); color: #fff0d1; font-size: 2.4rem; letter-spacing: 0; text-shadow: 0 0 18px rgba(255,219,166,.9); transform: scale(.08) rotate(-30deg); transform-origin: center; }.production-card-tick:hover > div { animation: none; }.production-card-tick:hover > div::before { opacity: 1; animation: tickBoom .62s cubic-bezier(.18,.9,.22,1) both; }.production-card-tick > div::after { content: "BOOM"; right: .2rem; bottom: 5.1rem; color: #ffdca4; letter-spacing: .22em; }.production-card-tick:hover h2 { text-shadow: 0 0 22px rgba(234,153,76,.72); }
@keyframes tickBoom { 0% { opacity:0; transform:scale(.08) rotate(-30deg); } 64% { opacity:1; transform:scale(1.06) rotate(9deg); } 100% { opacity:.72; transform:scale(.94) rotate(4deg); } }
@media (prefers-reduced-motion: reduce) { .production-card-tick:hover > div::before { animation: none; opacity: .72; transform: scale(.94) rotate(4deg); } }

/* Tick, Tick… Boom! — full title-card impact with a glass-like BOOM. */
.production-card-tick > div::before { top: -7rem; left: -9%; width: 22rem; height: 22rem; background: radial-gradient(circle, rgba(255,248,225,.98) 0 2%, rgba(255,209,134,.86) 3% 5%, rgba(234,121,74,.42) 6% 10%, transparent 11%), repeating-conic-gradient(from -10deg, rgba(255,221,159,.9) 0deg 3deg, transparent 4deg 18deg); filter: drop-shadow(0 0 18px rgba(255,185,93,.8)); }.production-card-tick > div::after { content: "BOOM!"; right: -.3rem; bottom: 4.35rem; color: transparent; background: linear-gradient(125deg, rgba(255,255,255,.98) 0 18%, rgba(255,212,151,.72) 29%, rgba(255,255,255,.95) 43%, rgba(173,115,214,.75) 63%, rgba(255,229,180,.95) 80%); -webkit-background-clip: text; background-clip: text; font-family: "Bebas Neue", sans-serif; font-size: clamp(4rem, 7vw, 7rem); font-weight: 400; letter-spacing: -.03em; line-height: .72; text-shadow: 0 3px 0 rgba(74,37,87,.55), 0 0 18px rgba(255,207,141,.75); transform: scale(.08) rotate(-16deg); transform-origin: 72% 72%; }.production-card-tick h2::before { content: ""; position: absolute; z-index: -1; top: 44%; left: 35%; width: .85rem; height: .85rem; border-radius: 1px; background: rgba(255,238,197,.95); box-shadow: -5rem -2.4rem 0 -.2rem rgba(255,209,137,.9), 4.8rem -2.8rem 0 -.18rem rgba(252,216,169,.95), -6.5rem .4rem 0 -.25rem rgba(193,146,229,.82), 6.5rem .5rem 0 -.26rem rgba(255,228,173,.95), -3.7rem 2.9rem 0 -.28rem rgba(255,230,189,.9), 3.8rem 3.1rem 0 -.3rem rgba(188,139,223,.76); opacity: 0; transform: scale(.1) rotate(0); }.production-card-tick:hover > div::after { opacity: 1; animation: tickGlassBoom .74s cubic-bezier(.1,.95,.2,1) both; }.production-card-tick:hover h2 { animation: tickTitleBoom .62s cubic-bezier(.1,.95,.18,1) both; color: #fff2d5; text-shadow: 0 0 3px #fff, 0 0 25px rgba(255,177,86,.92), 5px 5px 0 rgba(71,37,90,.65); }.production-card-tick:hover h2::before { animation: glassShatter .75s cubic-bezier(.1,.82,.18,1) both; }.production-card-tick:hover > div::before { animation: tickBoom .6s cubic-bezier(.1,.95,.18,1) both; }
@keyframes tickGlassBoom { 0% { opacity:0; transform:scale(.04) rotate(-18deg); filter:blur(10px); } 52% { opacity:1; transform:scale(1.25) rotate(5deg); filter:blur(0); } 100% { opacity:.92; transform:scale(1) rotate(-2deg); filter:blur(0); } } @keyframes tickTitleBoom { 0% { transform:scale(1) rotate(0); } 38% { transform:scale(1.18) rotate(-2deg); } 64% { transform:scale(.94) rotate(1deg); } 100% { transform:scale(1.055) rotate(0); } } @keyframes glassShatter { 0% { opacity:0; transform:scale(.1) rotate(0); } 45% { opacity:1; transform:scale(1.85) rotate(16deg); } 100% { opacity:.65; transform:scale(1.35) rotate(24deg); } }
@media (prefers-reduced-motion: reduce) { .production-card-tick:hover > div::after, .production-card-tick:hover h2, .production-card-tick:hover h2::before, .production-card-tick:hover > div::before { animation: none; }.production-card-tick:hover > div::after { opacity:.92; transform:scale(1) rotate(-2deg); }.production-card-tick:hover h2::before { opacity:.65; transform:scale(1.35) rotate(24deg); } }

/* The title itself breaks apart: three fragments fly away from the BOOM. */
.production-card-tick .tick-explosion-title { display: flex; flex-direction: column; gap: .04em; overflow: visible; }.production-card-tick .tick-explosion-title > span { display: block; position: relative; transform-origin: center; transition: none; }.production-card-tick:hover .tick-explosion-title { animation: none; transform: none; text-shadow: none; }.production-card-tick:hover .tick-explosion-title > span { color: #fff2d5; text-shadow: 0 0 14px rgba(255,203,126,.88); }.production-card-tick:hover .tick-explosion-title > span:nth-child(1) { animation: titleShardOne .7s cubic-bezier(.16,.78,.18,1) both; }.production-card-tick:hover .tick-explosion-title > span:nth-child(2) { animation: titleShardTwo .7s .02s cubic-bezier(.16,.78,.18,1) both; }.production-card-tick:hover .tick-explosion-title > span:nth-child(3) { animation: titleShardThree .7s .01s cubic-bezier(.16,.78,.18,1) both; }.production-card-tick:hover > div::after { z-index: 3; }
@keyframes titleShardOne { 0% { opacity:1; transform:translate(0,0) rotate(0) scale(1); } 25% { opacity:1; transform:translate(-.2rem,.05rem) rotate(-1deg) scale(1.08); } 100% { opacity:.1; transform:translate(-6.2rem,-4.5rem) rotate(-27deg) scale(.55); } } @keyframes titleShardTwo { 0% { opacity:1; transform:translate(0,0) rotate(0) scale(1); } 25% { opacity:1; transform:translate(.1rem,-.05rem) rotate(1deg) scale(1.1); } 100% { opacity:.08; transform:translate(6.6rem,-2.8rem) rotate(25deg) scale(.48); } } @keyframes titleShardThree { 0% { opacity:1; transform:translate(0,0) rotate(0) scale(1); } 24% { opacity:1; transform:translate(-.1rem,.06rem) rotate(-1deg) scale(1.12); } 100% { opacity:.06; transform:translate(-2.7rem,6.8rem) rotate(-19deg) scale(.42); } }
@media (prefers-reduced-motion: reduce) { .production-card-tick:hover .tick-explosion-title > span { animation: none; opacity: .18; } }

/* Keep Tick, Tick… Boom! compact: one small rhythmic pulse, nothing more. */
.production-card-tick > div::before, .production-card-tick > div::after, .production-card-tick h2::before { display: none; }.production-card-tick:hover > div, .production-card-tick:hover > div::before, .production-card-tick:hover > div::after { animation: none; }.production-card-tick:hover h2 { animation: tickCompact .38s ease-out both; color: #f4ecdf; letter-spacing: .025em; text-shadow: 2px 2px 0 rgba(93,62,115,.75); transform: none; }.production-card-tick:hover b { background: #d5c7f0; color: #2c1d45; }
@keyframes tickCompact { 0% { transform: scale(1); } 50% { transform: scale(1.045); } 100% { transform: scale(1); } }

@media (max-width: 700px) { .cast-photo-callout { grid-template-columns: auto 1fr; }.cast-photo-actions { grid-column: 1 / -1; justify-content: flex-start; } }

/* A restrained entrance while scrolling: enough movement to feel alive, never a jump. */
html.js .scroll-reveal { opacity: 0; transform: translateY(12px); transition: opacity .68s cubic-bezier(.2,.72,.24,1), transform .78s cubic-bezier(.16,.78,.24,1); transition-delay: var(--reveal-delay, 0ms); will-change: opacity, transform; }
html.js .scroll-reveal.is-visible { opacity: 1; transform: translateY(0); }
@media (prefers-reduced-motion: reduce) { html.js .scroll-reveal, html.js .scroll-reveal.is-visible { opacity: 1; transform: none; transition: none; } }

/* Keep De Opening visible as a named destination on the work overview. */
.work-opening-actions {
  display: flex;
  flex-wrap: nowrap;
  gap: .8rem;
}

.work-opening-actions > a {
  display: inline-flex;
  align-items: center;
  gap: 1rem;
  margin-top: .25rem;
  padding: .95rem 1.05rem .95rem 1.2rem;
  background: #d1a05f;
  color: #21151b;
  box-shadow: 6px 7px 0 rgba(18,13,18,.32);
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: .1em;
  text-decoration: none;
  text-transform: uppercase;
  transition: transform .18s ease, background .18s ease;
}

.work-opening-actions > a:hover {
  background: #f4ecdf;
  transform: translateY(-3px);
}

.work-opening-actions > a b {
  display: grid;
  width: 1.75rem;
  height: 1.75rem;
  place-items: center;
  background: #6a2e43;
  color: #f4ecdf;
  font-size: 1rem;
}

.work-opening-actions > .work-opening-event-link {
  background: #315c63;
  color: #f4ecdf;
}

.work-opening-actions > .work-opening-event-link b {
  background: #f4ecdf;
  color: #315c63;
}

@media (max-width: 560px) {
  .work-opening-actions {
    flex-wrap: wrap;
  }
}

/* De Opening: a city-wide event report, deliberately separate from the production archive. */
.choice-five { background: #315c63; color: #f4ecdf; }
.choice-five .choice-number { color: #e0b273; }
.choice-five b { background: #f4ecdf; color: #315c63; }
.choice-five:hover { background: #264c53; }

.event-case-page { --event-teal: #315c63; --event-teal-dark: #173d44; --event-cream: #f4ecdf; --event-gold: #d1a05f; }
.event-hero { position: relative; display: flex; align-items: flex-end; min-height: min(820px, calc(100vh - 74px)); padding: clamp(5rem, 10vw, 9rem) clamp(1.5rem, 7vw, 7rem); box-sizing: border-box; overflow: hidden; background: #120d12; color: var(--event-cream); }
.event-hero-image, .event-hero-wash { position: absolute; inset: 0; width: 100%; height: 100%; }
.event-hero-image { object-fit: cover; object-position: center 42%; filter: saturate(.82) contrast(1.05); }
.event-hero-wash { background: linear-gradient(90deg, rgba(18,13,18,.9) 0%, rgba(18,13,18,.58) 43%, rgba(18,13,18,.08) 73%), linear-gradient(0deg, rgba(18,13,18,.85), transparent 52%); }
.event-back-link { position: absolute; z-index: 2; top: clamp(1.4rem, 3vw, 2.5rem); left: clamp(1.5rem, 7vw, 7rem); color: var(--event-cream); border-bottom: 1px solid rgba(244,236,223,.65); padding-bottom: .25rem; font-size: .7rem; font-weight: 700; letter-spacing: .08em; text-decoration: none; text-transform: uppercase; }
.event-hero-copy { position: relative; z-index: 1; max-width: 47rem; }
.event-hero-copy .eyebrow, .event-gallery-heading .eyebrow, .event-closing .eyebrow { margin: 0 0 1.2rem; color: var(--event-gold); }
.event-hero h1, .event-story h2, .event-gallery-heading h2, .event-closing h2 { margin: 0; font-family: "Bebas Neue", sans-serif; font-weight: 400; letter-spacing: .01em; line-height: .82; }
.event-hero h1 { font-size: clamp(5.5rem, 12vw, 12rem); }
.event-hero h1 em, .event-story h2 em, .event-gallery-heading h2 em, .event-closing h2 em { color: var(--event-gold); font-style: normal; }
.event-hero-copy > p:last-child { max-width: 34rem; margin: 1.8rem 0 0; color: rgba(244,236,223,.86); font-size: clamp(1rem, 1.5vw, 1.2rem); line-height: 1.6; }
.event-hero-meta { position: absolute; z-index: 1; right: clamp(1.5rem, 7vw, 7rem); bottom: clamp(2rem, 7vw, 6.5rem); display: grid; gap: 1rem; width: min(21rem, 28vw); margin: 0; padding: 1.2rem 1.35rem; border-left: 5px solid var(--event-gold); background: rgba(23,61,68,.9); backdrop-filter: blur(7px); }
.event-hero-meta div { display: grid; grid-template-columns: 5.5rem 1fr; gap: .8rem; }
.event-hero-meta dt { color: var(--event-gold); font-size: .58rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }
.event-hero-meta dd { margin: 0; font-size: .78rem; font-weight: 600; line-height: 1.3; }

.event-story { display: grid; grid-template-columns: .9fr 1.1fr; gap: clamp(3rem, 8vw, 8rem); padding: clamp(5.5rem, 11vw, 10rem) clamp(1.5rem, 8vw, 9rem); background: var(--event-cream); color: #21151b; }
.event-story .eyebrow { margin: 0 0 1rem; color: var(--event-teal); }
.event-story h2, .event-gallery-heading h2, .event-closing h2 { font-size: clamp(4rem, 7.5vw, 8rem); }
.event-story h2 em { color: var(--event-teal); }
.event-story-copy { align-self: end; max-width: 38rem; }
.event-story-copy > p { margin: 0 0 1.25rem; font-size: 1.02rem; line-height: 1.72; }
.event-tags { display: flex; flex-wrap: wrap; gap: .55rem; margin: 2rem 0 0; padding: 0; list-style: none; }
.event-tags li { padding: .55rem .75rem; border: 1px solid rgba(23,61,68,.45); color: var(--event-teal-dark); font-size: .63rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }

.event-gallery-heading { display: flex; align-items: end; justify-content: space-between; gap: 3rem; padding: clamp(5rem, 9vw, 8rem) clamp(1.5rem, 8vw, 9rem) clamp(3rem, 6vw, 5rem); background: var(--event-teal-dark); color: var(--event-cream); }
.event-gallery-heading > p { max-width: 18rem; margin: 0 0 .35rem; color: rgba(244,236,223,.7); font-size: .8rem; letter-spacing: .04em; }
.event-gallery-heading h2 em { color: var(--event-gold); }
.event-photo-grid { padding-top: 0; background: var(--event-teal-dark) !important; }
.event-photo-grid .event-span-four { grid-column: span 4; }
.event-photo-grid .event-span-five { grid-column: span 5; }
.event-photo-grid .event-span-six { grid-column: span 6; }
.event-photo-grid .event-span-seven { grid-column: span 7; }
.event-photo-grid .event-span-eight { grid-column: span 8; }
.event-photo-grid .event-span-twelve { grid-column: span 12; }
.event-photo-grid .photo-grid-item { min-height: clamp(360px, 35vw, 540px); border-color: rgba(244,236,223,.22); }
.event-photo-grid .photo-grid-item.photo-grid-tall { min-height: clamp(500px, 48vw, 700px); }
.event-photo-grid .photo-credit { background: var(--event-cream); }
.event-photo-grid .photo-credit span { color: var(--event-teal); }

.event-closing { display: flex; flex-direction: column; align-items: center; padding: clamp(5.5rem, 11vw, 10rem) 1.5rem; background: var(--event-teal); color: var(--event-cream); text-align: center; }
.event-closing > p:not(.eyebrow) { margin: 1.5rem 0 2rem; color: rgba(244,236,223,.78); font-size: 1rem; }
.event-closing a { padding: 1rem 1.25rem; background: var(--event-gold); color: #21151b; font-size: .72rem; font-weight: 700; letter-spacing: .09em; text-decoration: none; text-transform: uppercase; }
.event-closing a b { margin-left: .85rem; font-size: 1rem; }

@media (max-width: 850px) {
  .event-hero { min-height: 800px; padding-bottom: 17rem; }
  .event-hero-meta { left: clamp(1.5rem, 7vw, 7rem); right: auto; bottom: 3rem; width: min(26rem, calc(100% - 3rem)); box-sizing: border-box; }
  .event-story { grid-template-columns: 1fr; }
  .event-story-copy { max-width: 42rem; }
}
@media (max-width: 760px) {
  .event-gallery-heading { align-items: flex-start; flex-direction: column; gap: 1.5rem; }
  .event-photo-grid .event-span-four, .event-photo-grid .event-span-five, .event-photo-grid .event-span-six, .event-photo-grid .event-span-seven, .event-photo-grid .event-span-eight, .event-photo-grid .event-span-twelve { grid-column: span 1; }
  .event-photo-grid .photo-grid-item { min-height: 300px; }
  .event-photo-grid .photo-grid-item.photo-grid-tall { min-height: 430px; }
}
@media (max-width: 560px) {
  .event-hero { min-height: 760px; padding: 5rem 1.5rem 17rem; }
  .event-hero h1 { font-size: 5rem; }
  .event-hero-meta { left: 1.5rem; bottom: 2rem; }
  .event-hero-meta div { grid-template-columns: 4.8rem 1fr; }
  .event-story h2, .event-gallery-heading h2, .event-closing h2 { font-size: 3.9rem; }
  .event-photo-grid .photo-credit { min-width: 8rem; max-width: calc(100% - 1.5rem); }
}

/* Editorial event gallery: respect every original crop and let musical work lead. */
.event-photo-grid { align-items: start; grid-auto-flow: row; row-gap: clamp(2rem, 5vw, 5.5rem); padding: 0 clamp(1rem, 6vw, 6rem) clamp(6rem, 11vw, 10rem); }
.event-photo-grid .photo-grid-item,
.event-photo-grid .photo-grid-item.photo-grid-tall,
.event-photo-grid .photo-grid-item.photo-grid-wide { display: block; align-self: start; min-height: 0; height: auto; margin: 0; overflow: visible; border: 0; background: transparent; box-shadow: none; grid-row: auto; }
.event-photo-grid .photo-grid-item img,
.event-photo-grid .photo-grid-item.photo-grid-tall img { display: block; width: 100%; height: auto; object-fit: contain; object-position: center; border: 1px solid rgba(244,236,223,.24); background: #120d12; transition: border-color .25s ease; }
.event-photo-grid .photo-grid-item:hover img { transform: none; filter: none; border-color: var(--event-gold); }
.event-photo-grid .photo-credit { position: static; display: flex; flex-direction: row; align-items: baseline; justify-content: space-between; gap: 1rem; width: 100%; min-width: 0; max-width: none; box-sizing: border-box; padding: .85rem 0 0; background: transparent; color: var(--event-cream); box-shadow: none; }
.event-photo-grid .photo-credit strong { font-size: clamp(1.3rem, 2vw, 1.9rem); }
.event-photo-grid .photo-credit span { color: rgba(244,236,223,.58); font-size: .62rem; text-align: right; }
.event-photo-grid .event-photo-lead .photo-credit { padding-top: 1rem; }
.event-gallery-break { display: grid; grid-template-columns: 1fr auto; align-items: end; gap: 1rem 3rem; margin-top: clamp(2rem, 5vw, 5rem); padding: clamp(4rem, 8vw, 7rem) 0 clamp(1rem, 2vw, 2rem); border-top: 1px solid rgba(209,160,95,.58); color: var(--event-cream); }
.event-gallery-break .eyebrow { grid-column: 1 / -1; margin: 0; color: var(--event-gold); }
.event-gallery-break h2 { margin: 0; font-family: "Bebas Neue", sans-serif; font-size: clamp(4rem, 7vw, 7.5rem); font-weight: 400; letter-spacing: .01em; line-height: .82; }
.event-gallery-break h2 em { color: var(--event-gold); font-style: normal; }
.event-gallery-break > p:last-child { max-width: 20rem; margin: 0 0 .45rem; color: rgba(244,236,223,.67); font-size: .9rem; line-height: 1.55; }

@media (max-width: 760px) {
  .event-photo-grid { grid-template-columns: 1fr; row-gap: 3rem; padding-left: 1rem; padding-right: 1rem; }
  .event-photo-grid .event-span-four, .event-photo-grid .event-span-five, .event-photo-grid .event-span-six, .event-photo-grid .event-span-seven, .event-photo-grid .event-span-eight, .event-photo-grid .event-span-twelve { grid-column: 1; }
  .event-gallery-break { grid-template-columns: 1fr; }
  .event-gallery-break .eyebrow { grid-column: 1; }
  .event-gallery-break > p:last-child { max-width: 28rem; }
}
@media (max-width: 560px) {
  .event-photo-grid .photo-credit { align-items: flex-start; flex-direction: column; gap: .25rem; }
  .event-photo-grid .photo-credit span { text-align: left; }
  .event-gallery-break h2 { font-size: 3.9rem; }
}

/* De Opening collections: Willem leads; individual acts can open a complete series. */
.event-hero-image-willem { object-position: 43% center; }
.event-photo-link { cursor: pointer; }
.event-photo-link .photo-credit > div { display: grid; gap: .25rem; }
.event-photo-link .photo-credit > div span { text-align: left; }
.photo-series-link { align-self: center; padding: .65rem .75rem; background: var(--event-gold); color: #21151b; font-size: .62rem; letter-spacing: .08em; line-height: 1.2; text-transform: uppercase; }
.event-photo-link:hover .photo-series-link, .event-photo-link:focus-visible .photo-series-link { background: var(--event-cream); }

.cats-series-page { background: var(--event-teal-dark); }
.cats-series-hero { position: relative; display: flex; align-items: flex-end; min-height: min(780px, calc(100vh - 74px)); padding: clamp(5rem, 10vw, 9rem) clamp(1.5rem, 8vw, 9rem); box-sizing: border-box; overflow: hidden; background: #120d12; color: var(--event-cream); }
.cats-series-hero > img, .cats-series-wash { position: absolute; inset: 0; width: 100%; height: 100%; }
.cats-series-hero > img { object-fit: cover; object-position: center 35%; filter: saturate(.9) contrast(1.04); }
.cats-series-wash { background: linear-gradient(90deg, rgba(18,13,18,.9) 0%, rgba(18,13,18,.52) 48%, rgba(18,13,18,.08) 78%), linear-gradient(0deg, rgba(18,13,18,.78), transparent 55%); }
.cats-series-copy { position: relative; z-index: 1; max-width: 47rem; }
.cats-series-copy .eyebrow { margin: 0 0 1.2rem; color: var(--event-gold); }
.cats-series-copy h1, .cats-series-intro h2 { margin: 0; font-family: "Bebas Neue", sans-serif; font-weight: 400; letter-spacing: .01em; line-height: .82; }
.cats-series-copy h1 { font-size: clamp(6rem, 14vw, 13rem); }
.cats-series-copy h1 em, .cats-series-intro h2 em { color: var(--event-gold); font-style: normal; }
.cats-series-copy > p:not(.eyebrow) { margin: 1.5rem 0 2rem; font-size: clamp(1rem, 1.5vw, 1.2rem); }
.cats-series-copy > a { display: inline-flex; align-items: center; gap: 1rem; padding: 1rem 1.15rem; background: var(--event-gold); color: #21151b; font-size: .7rem; font-weight: 700; letter-spacing: .09em; text-decoration: none; text-transform: uppercase; }
.cats-series-copy > a b { font-size: 1rem; }
.cats-series-intro { display: grid; grid-template-columns: 1fr 1fr; gap: 2rem 7vw; padding: clamp(5rem, 10vw, 9rem) clamp(1.5rem, 8vw, 9rem); background: var(--event-cream); color: #21151b; }
.cats-series-intro .eyebrow { grid-column: 1 / -1; margin: 0; color: var(--event-teal); }
.cats-series-intro h2 { font-size: clamp(4rem, 7vw, 7.5rem); }
.cats-series-intro h2 em { color: var(--event-teal); }
.cats-series-intro > p:last-child { align-self: end; max-width: 31rem; margin: 0 0 .45rem; font-size: 1rem; line-height: 1.7; }
.cats-photo-grid { padding-top: clamp(4rem, 7vw, 7rem); }
.cats-photo-grid .photo-grid-item { scroll-margin-top: 2rem; }
.cats-rehearsal-break h2 { color: var(--event-cream); }
.cats-series-closing { background: #6a2e43; }

@media (max-width: 760px) {
  .photo-series-link { align-self: flex-start; margin-top: .35rem; }
  .cats-series-hero { min-height: 700px; padding-bottom: 5rem; }
  .cats-series-hero > img { object-position: 55% center; }
  .cats-series-intro { grid-template-columns: 1fr; }
  .cats-series-intro .eyebrow { grid-column: 1; }
}
@media (max-width: 560px) {
  .cats-series-copy h1 { font-size: 6.2rem; }
  .cats-series-intro h2 { font-size: 4rem; }
}

/* De Opening 2026 — photo-led editorial direction. */
.event-overture {
  display: grid;
  grid-template-columns: .72fr 1.55fr 1fr;
  gap: clamp(2rem, 6vw, 7rem);
  align-items: end;
  padding: clamp(5rem, 10vw, 9rem) clamp(1.5rem, 7vw, 7rem);
  background: #efe5d5;
  color: #1d1719;
}
.event-overture > .eyebrow { align-self: start; margin: .35rem 0 0; color: #315c63; }
.event-overture-title { display: grid; grid-template-columns: auto 1fr; gap: clamp(1.3rem, 3vw, 3rem); align-items: start; }
.event-overture-title > span { color: #315c63; font: 400 clamp(4.8rem, 9vw, 9rem)/.62 "Bebas Neue", sans-serif; }
.event-overture-title > span small { font-size: .17em; letter-spacing: .15em; text-transform: uppercase; }
.event-overture h2 { margin: 0; font: 400 clamp(4rem, 7.5vw, 8rem)/.82 "Bebas Neue", sans-serif; letter-spacing: .01em; }
.event-overture h2 em { color: #9d3f49; font-style: normal; }
.event-overture-copy { max-width: 26rem; }
.event-overture-copy > p { margin: 0 0 2.5rem; font-size: 1.02rem; line-height: 1.75; }
.event-overture-copy > div { display: flex; gap: 1rem; align-items: center; padding-top: 1.1rem; border-top: 1px solid rgba(29,23,25,.35); }
.event-overture-copy b { color: #9d3f49; font: 400 3.3rem/.8 "Bebas Neue", sans-serif; }
.event-overture-copy span { font-size: .62rem; font-weight: 700; letter-spacing: .12em; line-height: 1.35; text-transform: uppercase; }

.event-afterfilm {
  padding: clamp(5.5rem, 10vw, 9rem) clamp(1rem, 6vw, 6rem) clamp(6rem, 11vw, 10rem);
  background: #6a2e43;
  color: #f4ecdf;
}
.event-afterfilm-heading {
  display: grid;
  grid-template-columns: 1.45fr .65fr;
  gap: clamp(2rem, 6vw, 7rem);
  align-items: end;
  max-width: 1240px;
  margin: 0 auto clamp(3rem, 6vw, 5.5rem);
}
.event-afterfilm-heading .eyebrow { margin: 0 0 1.1rem; color: #e0b273; }
.event-afterfilm-heading h2 { margin: 0; font: 400 clamp(4.6rem, 9vw, 9.5rem)/.79 "Bebas Neue", sans-serif; letter-spacing: .01em; }
.event-afterfilm-heading h2 em { color: #e0b273; font-style: normal; }
.event-afterfilm-heading > p { max-width: 24rem; margin: 0 0 .45rem; color: rgba(244,236,223,.78); font-size: 1rem; line-height: 1.7; }
.event-afterfilm-player { display: grid; grid-template-columns: minmax(280px, 460px) minmax(220px, 330px); gap: clamp(2.5rem, 7vw, 7rem); align-items: end; justify-content: center; max-width: 1000px; margin: 0 auto; }
.event-afterfilm-player video { display: block; width: 100%; aspect-ratio: 9 / 16; object-fit: contain; border: 1px solid rgba(244,236,223,.3); background: #120d12; box-shadow: 14px 16px 0 #315c63; }
.event-afterfilm-player figcaption { display: flex; flex-direction: column; gap: .45rem; align-items: flex-start; margin: 0 0 clamp(1rem, 5vw, 4rem); padding: 1.3rem 0 1.3rem 1.5rem; border-left: 1px solid rgba(224,178,115,.7); }
.event-afterfilm-player figcaption span,
.event-afterfilm-player figcaption small { color: #e0b273; font-size: .62rem; font-weight: 700; letter-spacing: .11em; text-transform: uppercase; }
.event-afterfilm-player figcaption strong { font: 400 clamp(1.8rem, 3vw, 3rem)/.9 "Bebas Neue", sans-serif; letter-spacing: .025em; }
.event-afterfilm-player figcaption small { margin-top: .45rem; text-align: left; }

.event-finale { padding: clamp(5.5rem, 10vw, 9rem) clamp(1rem, 5vw, 5rem) clamp(7rem, 12vw, 12rem); background: #120d12; color: #f4ecdf; }
.event-finale-heading { display: grid; grid-template-columns: 1.6fr .7fr; gap: 3rem; align-items: end; max-width: 1240px; margin: 0 auto clamp(4rem, 8vw, 8rem); }
.event-finale-heading .eyebrow { margin: 0 0 1.1rem; color: #d1a05f; }
.event-finale-heading h2 { margin: 0; font: 400 clamp(4.6rem, 9vw, 9.5rem)/.79 "Bebas Neue", sans-serif; letter-spacing: .01em; }
.event-finale-heading h2 em { color: #d1a05f; font-style: normal; }
.event-finale-heading > p { max-width: 21rem; margin: 0 0 .5rem; color: rgba(244,236,223,.66); font-size: .95rem; line-height: 1.65; }
.event-headliner { display: block; max-width: 1380px; margin: 0 auto clamp(6rem, 12vw, 12rem); color: inherit; text-decoration: none; }
.event-headliner figure { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); align-items: end; margin: 0; }
.event-headliner img { grid-area: 1 / 1 / 2 / 11; display: block; width: 100%; height: auto; border: 1px solid rgba(244,236,223,.18); }
.event-headliner figcaption { grid-area: 1 / 8 / 2 / 13; position: relative; z-index: 1; margin-bottom: clamp(2rem, 5vw, 5rem); padding: clamp(1.4rem, 3vw, 3rem); background: #d1a05f; color: #21151b; box-shadow: 14px 16px 0 #315c63; transition: transform .35s ease; }
.event-headliner:hover figcaption { transform: translate(-.45rem, -.45rem); }
.event-headliner figcaption span, .event-act figcaption span { font-size: .6rem; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; }
.event-headliner h3 { margin: .85rem 0 1rem; font: 400 clamp(4.2rem, 8vw, 8rem)/.78 "Bebas Neue", sans-serif; letter-spacing: .01em; }
.event-headliner figcaption p, .event-act figcaption p { margin: 0; font-size: .68rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }
.event-headliner figcaption b, .event-act figcaption b { margin-left: .45rem; font-size: 1rem; }

.event-act-grid { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: clamp(4rem, 9vw, 10rem) clamp(1rem, 3vw, 3rem); max-width: 1280px; margin: 0 auto; }
.event-act { color: #21151b; text-decoration: none; }
.event-act figure { margin: 0; }
.event-act img { display: block; width: 100%; height: auto; background: #21151b; }
.event-act figcaption { position: relative; margin: -1.2rem 1rem 0; padding: 1.1rem 1.25rem 1.2rem; background: #f4ecdf; color: #21151b; box-shadow: 7px 8px 0 var(--act-shadow, #315c63); transition: transform .3s ease; }
.event-act:hover figcaption { transform: translateY(-.45rem); }
.event-act h3 { margin: .55rem 0 .7rem; font: 400 clamp(2.7rem, 5vw, 5.1rem)/.8 "Bebas Neue", sans-serif; letter-spacing: .01em; }
.event-act-cats { grid-column: 1 / 7; --act-shadow: #9e4b20; }
.event-act-next { grid-column: 7 / 13; margin-top: clamp(5rem, 10vw, 10rem); --act-shadow: #6f1d27; }
.event-act-dalmatians { grid-column: 2 / 10; --act-shadow: #b54235; }
.event-act-dolly { grid-column: 9 / 13; align-self: end; --act-shadow: #8f356e; }
.event-act-evita { grid-column: 1 / 6; --act-shadow: #7f5c2f; }
.event-act-disney { grid-column: 6 / 13; margin-top: clamp(4rem, 8vw, 8rem); --act-shadow: #31557d; }
.event-act-cats figcaption { background: #d88348; }
.event-act-next figcaption { background: #ad3842; color: #f4ecdf; }
.event-act-dalmatians figcaption { background: #f0ddd2; }
.event-act-dolly figcaption { background: #d77ab6; }
.event-act-evita figcaption { background: #c79d5d; }
.event-act-disney figcaption { background: #6f99c8; color: #101a2a; }

.event-weekend { padding: clamp(6rem, 12vw, 11rem) clamp(1rem, 6vw, 6rem); background: #efe5d5; color: #21151b; }
.event-weekend-heading { display: grid; grid-template-columns: .65fr 1.4fr .8fr; gap: clamp(2rem, 5vw, 6rem); align-items: end; max-width: 1280px; margin: 0 auto clamp(5rem, 10vw, 10rem); }
.event-weekend-heading .eyebrow { align-self: start; margin: .4rem 0 0; color: #315c63; }
.event-weekend-heading h2 { margin: 0; font: 400 clamp(4.3rem, 8vw, 8.5rem)/.8 "Bebas Neue", sans-serif; }
.event-weekend-heading h2 em { color: #315c63; font-style: normal; }
.event-weekend-heading > p { margin: 0 0 .45rem; font-size: .96rem; line-height: 1.68; }
.event-weekend-collage { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: clamp(2.5rem, 6vw, 7rem) clamp(1rem, 2vw, 2rem); align-items: end; max-width: 1280px; margin: 0 auto; }
.event-weekend-collage figure { margin: 0; }
.event-weekend-collage img { display: block; width: 100%; height: auto; }
.event-weekend-collage figcaption { display: flex; justify-content: space-between; gap: 1rem; padding-top: .7rem; border-top: 1px solid #21151b; }
.event-weekend-collage figcaption b { font: 400 1.4rem/1 "Bebas Neue", sans-serif; letter-spacing: .03em; }
.event-weekend-collage figcaption span { color: #315c63; font-size: .58rem; font-weight: 700; letter-spacing: .1em; text-align: right; text-transform: uppercase; }
.weekend-soy { grid-column: 1 / 10; }
.weekend-sera { grid-column: 10 / 13; }
.event-weekend-collage blockquote { grid-column: 2 / 7; margin: 0; color: #9d3f49; font: 400 clamp(2.5rem, 5vw, 5rem)/.95 "Bebas Neue", sans-serif; }
.weekend-sparks { grid-column: 8 / 11; }
.weekend-jimmy { grid-column: 1 / 8; }
.weekend-interview { grid-column: 9 / 13; }
.weekend-city { grid-column: 2 / 12; }

/* Each musical opens as its own editorial sequence, with an individual palette. */
.cats-series-page { --series-bg: #12100f; --series-panel: #d67b3f; --series-accent: #efaa62; --series-paper: #f1e5d4; background: var(--series-bg); }
.musical-series-page[data-series="willem-van-oranje"] { --series-bg: #0b1820; --series-panel: #b98d4b; --series-accent: #d8b877; --series-paper: #efe5d5; }
.musical-series-page[data-series="101-dalmatiers"] { --series-bg: #241010; --series-panel: #ba3e36; --series-accent: #e66d58; --series-paper: #f1ded1; }
.musical-series-page[data-series="dolly-dots"] { --series-bg: #281027; --series-panel: #c95d9e; --series-accent: #e991c8; --series-paper: #f3dfec; }
.musical-series-page[data-series="next-to-normal"] { --series-bg: #140e12; --series-panel: #9f303b; --series-accent: #d24d50; --series-paper: #eaded8; }
.musical-series-page[data-series="evita"] { --series-bg: #1d160d; --series-panel: #b98b49; --series-accent: #d2ad6c; --series-paper: #efe3cd; }
.musical-series-page[data-series="disney-in-concert"] { --series-bg: #09182b; --series-panel: #557fae; --series-accent: #82aede; --series-paper: #e4eaf0; }
.cats-series-page .cats-series-wash { background: linear-gradient(90deg, rgba(12,10,11,.92), rgba(12,10,11,.55) 50%, rgba(12,10,11,.06) 82%), linear-gradient(0deg, rgba(12,10,11,.78), transparent 55%); }
.cats-series-page .cats-series-copy .eyebrow, .cats-series-page .cats-series-copy h1 em { color: var(--series-accent); }
.cats-series-page .cats-series-copy > a { background: var(--series-panel); }
.series-editorial-intro { grid-template-columns: .42fr 1.35fr .72fr; align-items: end; background: var(--series-paper); }
.series-editorial-intro > div:nth-child(2) .eyebrow { grid-column: auto; margin: 0 0 1rem; color: var(--series-panel); }
.series-editorial-intro h2 em { color: var(--series-panel); }
.series-intro-mark { align-self: stretch; display: flex; flex-direction: column; justify-content: flex-end; padding: 1.3rem; background: var(--series-panel); color: #171113; }
.series-intro-mark span, .series-intro-mark small { font-size: .58rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; }
.series-intro-mark b { margin: auto 0 .5rem; font: 400 clamp(5rem, 9vw, 9rem)/.7 "Bebas Neue", sans-serif; }
.series-editorial-intro > p:last-child { grid-column: 3; }
.series-editorial-grid { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: clamp(4rem, 10vw, 11rem) clamp(1rem, 2vw, 2rem); padding: clamp(5rem, 10vw, 10rem) clamp(1rem, 6vw, 6rem); background: var(--series-bg) !important; }
.series-editorial-grid .series-photo { position: relative; grid-row: auto; min-height: 0; overflow: visible; border: 0; box-shadow: none; transform: none; background: transparent; }
.series-editorial-grid .series-photo::before { content: attr(data-index); position: absolute; z-index: 1; top: -.55em; left: -.18em; color: var(--series-accent); font: 400 clamp(4rem, 8vw, 8rem)/1 "Bebas Neue", sans-serif; mix-blend-mode: screen; pointer-events: none; }
.series-editorial-grid .series-photo img { display: block; width: 100%; height: auto; object-fit: contain; border: 1px solid rgba(244,236,223,.2); background: #080708; }
.series-editorial-grid .series-photo:hover img { transform: none; filter: none; border-color: var(--series-accent); }
.series-editorial-grid .series-photo .photo-credit { position: static; display: flex; justify-content: space-between; gap: 1rem; width: 100%; padding: .8rem 0 0; background: transparent; color: var(--series-paper); box-shadow: none; }
.series-editorial-grid .series-photo .photo-credit strong { font: 400 clamp(1.5rem, 2.2vw, 2.2rem)/1 "Bebas Neue", sans-serif; }
.series-editorial-grid .series-photo .photo-credit span { color: var(--series-accent); font-size: .57rem; font-weight: 700; letter-spacing: .08em; text-align: right; text-transform: uppercase; }
.series-photo-opening { grid-column: 1 / 13; }
.series-photo-1 { grid-column: 1 / 7; }
.series-photo-2 { grid-column: 7 / 13; margin-top: clamp(5rem, 10vw, 10rem) !important; }
.series-photo-3 { grid-column: 2 / 12; }
.series-photo-4 { grid-column: 1 / 6; }
.series-photo-5 { grid-column: 6 / 13; margin-top: clamp(4rem, 8vw, 8rem) !important; }
.series-photo-closing { grid-column: 3 / 12; }
.series-editorial-grid .cats-rehearsal-break { grid-column: 1 / 13; display: grid; grid-template-columns: .6fr 1.4fr .7fr; margin: 0; padding: clamp(3rem, 7vw, 7rem) 0 0; border-top: 1px solid var(--series-accent); }
.series-editorial-grid .cats-rehearsal-break .eyebrow { grid-column: 1; color: var(--series-accent); }
.series-editorial-grid .cats-rehearsal-break h2 { color: var(--series-paper); }
.series-editorial-grid .cats-rehearsal-break > p:last-child { color: rgba(244,236,223,.65); }
.cats-series-closing { background: var(--series-panel); }

@media (max-width: 850px) {
  .event-overture, .event-weekend-heading { grid-template-columns: 1fr; }
  .event-afterfilm-heading { grid-template-columns: 1fr; }
  .event-afterfilm-player { grid-template-columns: minmax(0, 460px); justify-content: center; }
  .event-afterfilm-player figcaption { margin: 0; }
  .event-overture-title { max-width: 48rem; }
  .event-overture-copy { max-width: 38rem; }
  .event-finale-heading { grid-template-columns: 1fr; }
  .event-headliner img { grid-column: 1 / 13; }
  .event-headliner figcaption { grid-column: 5 / 13; }
  .series-editorial-intro { grid-template-columns: .4fr 1.6fr; }
  .series-editorial-intro > p:last-child { grid-column: 2; }
}
@media (max-width: 680px) {
  .event-overture-title { grid-template-columns: 1fr; }
  .event-headliner figure { display: block; }
  .event-headliner figcaption { margin: -1.25rem 1rem 0; box-shadow: 8px 9px 0 #315c63; }
  .event-act-grid, .event-weekend-collage, .series-editorial-grid { grid-template-columns: 1fr; }
  .event-act-cats, .event-act-next, .event-act-dalmatians, .event-act-dolly, .event-act-evita, .event-act-disney,
  .weekend-soy, .weekend-sera, .weekend-sparks, .weekend-jimmy, .weekend-interview, .weekend-city,
  .series-photo-opening, .series-photo-1, .series-photo-2, .series-photo-3, .series-photo-4, .series-photo-5, .series-photo-closing { grid-column: 1; margin-top: 0 !important; }
  .event-act-dolly { width: 82%; margin-left: auto; }
  .event-weekend-collage blockquote { grid-column: 1; }
  .weekend-sera, .weekend-sparks, .weekend-interview { width: 72%; margin-left: auto !important; }
  .series-editorial-intro { grid-template-columns: 1fr; }
  .series-intro-mark { min-height: 12rem; }
  .series-editorial-intro > p:last-child { grid-column: 1; }
  .series-editorial-grid .cats-rehearsal-break { grid-column: 1; grid-template-columns: 1fr; }
  .series-editorial-grid .cats-rehearsal-break .eyebrow { grid-column: 1; }
  .series-editorial-grid .series-photo .photo-credit { align-items: flex-start; flex-direction: column; gap: .25rem; }
  .series-editorial-grid .series-photo .photo-credit span { text-align: left; }
  .event-afterfilm-player video { box-shadow: 8px 9px 0 #315c63; }
  .event-afterfilm-player figcaption { gap: .35rem; padding: 1.15rem 0 0; border-left: 0; }
  .event-afterfilm-player figcaption small { text-align: left; }
}

/* Collaborations — visible proof of work, integrated with the editorial site. */
.home-collaborations {
  display: grid;
  grid-template-columns: .86fr 1.14fr;
  gap: clamp(3rem, 8vw, 9rem);
  padding: clamp(5rem, 10vw, 9rem) clamp(1.5rem, 8vw, 9rem);
  background: #e9ddce;
  color: #21151b;
}
.home-collaborations-intro { max-width: 34rem; }
.home-collaborations .eyebrow { margin: 0 0 1.1rem; color: #6a2e43; }
.home-collaborations h2 { margin: 0; font: 600 clamp(3.3rem, 6vw, 6.4rem)/.88 "Dosis", Arial, sans-serif; letter-spacing: -.05em; }
.home-collaborations h2 em { color: #9d3f49; font-style: normal; }
.home-collaborations-intro > p:not(.eyebrow) { max-width: 30rem; margin: 1.6rem 0 2rem; font-size: 1rem; line-height: 1.68; }
.home-collaborations-intro > a { display: inline-flex; align-items: center; gap: .8rem; padding-bottom: .35rem; border-bottom: 1px solid #6a2e43; color: #21151b; font-size: .67rem; font-weight: 700; letter-spacing: .1em; text-decoration: none; text-transform: uppercase; }
.home-collaborations-intro > a b { color: #9d3f49; font-size: 1rem; }
.home-collaboration-names { border-top: 1px solid #21151b; }
.home-collaboration-names span { display: grid; grid-template-columns: 3.3rem 1fr; align-items: center; padding: clamp(1rem, 2.2vw, 1.8rem) 0; border-bottom: 1px solid rgba(33,21,27,.45); font: 400 clamp(2.2rem, 4vw, 4.4rem)/.82 "Bebas Neue", sans-serif; letter-spacing: .02em; }
.home-collaboration-names small { color: #9d3f49; font: 700 .58rem/1 "DM Sans", Arial, sans-serif; letter-spacing: .1em; }
.home-collaboration-names span:nth-child(even) { padding-left: clamp(1rem, 4vw, 4rem); color: #6a2e43; }

.work-collaboration-feature { display: grid; grid-template-columns: 1.2fr .8fr; gap: clamp(3rem, 8vw, 9rem); align-items: end; padding: clamp(5rem, 10vw, 9rem) clamp(1.5rem, 8vw, 9rem); background: #21151b; color: #f4ecdf; }
.work-collaboration-feature .eyebrow { margin: 0 0 1rem; color: #d1a05f; }
.work-collaboration-feature h2 { margin: 0; font: 400 clamp(4rem, 7.4vw, 7.8rem)/.81 "Bebas Neue", sans-serif; letter-spacing: .01em; }
.work-collaboration-feature h2 em { color: #d1a05f; font-style: normal; }
.work-collaboration-feature > div:last-child { max-width: 29rem; padding-bottom: .4rem; }
.work-collaboration-feature > div:last-child p { margin: 0 0 2rem; color: rgba(244,236,223,.75); font-size: 1rem; line-height: 1.7; }
.work-collaboration-feature a { display: inline-flex; gap: .85rem; padding: 1rem 1.15rem; background: #d1a05f; color: #21151b; font-size: .67rem; font-weight: 700; letter-spacing: .1em; text-decoration: none; text-transform: uppercase; }

.collaborations-page { background: #21151b; color: #f4ecdf; }
.collaborations-hero { position: relative; display: grid; grid-template-columns: 1.08fr .92fr; min-height: min(830px, calc(100vh - 74px)); overflow: hidden; background: #21151b; }
.collaborations-back { position: absolute; z-index: 2; top: 2rem; left: clamp(1.5rem, 7vw, 7rem); padding-bottom: .3rem; border-bottom: 1px solid rgba(244,236,223,.55); color: #f4ecdf; font-size: .65rem; font-weight: 700; letter-spacing: .1em; text-decoration: none; text-transform: uppercase; }
.collaborations-hero-copy { align-self: center; padding: clamp(7rem, 12vw, 11rem) clamp(1.5rem, 7vw, 7rem); }
.collaborations-hero-copy .eyebrow { margin: 0 0 1.2rem; color: #d1a05f; }
.collaborations-hero h1 { margin: 0; font: 400 clamp(5rem, 9vw, 9.5rem)/.77 "Bebas Neue", sans-serif; letter-spacing: .01em; }
.collaborations-hero h1 em { color: #d1a05f; font-style: normal; }
.collaborations-hero-copy > p:last-child { max-width: 31rem; margin: 2rem 0 0; color: rgba(244,236,223,.74); font-size: 1.05rem; line-height: 1.7; }
.collaborations-roll { display: flex; flex-direction: column; justify-content: center; padding: clamp(5rem, 9vw, 8rem) clamp(1.5rem, 5vw, 5rem); border-left: 1px solid rgba(209,160,95,.35); background: #6a2e43; }
.collaborations-roll span { display: block; padding: clamp(1.1rem, 2.2vw, 1.8rem) 0; border-top: 1px solid rgba(244,236,223,.35); background: transparent; color: #f4ecdf; font: 400 clamp(2.3rem, 4.7vw, 5.2rem)/.78 "Bebas Neue", sans-serif; letter-spacing: .02em; box-shadow: none; transform: none; }
.collaborations-roll span:last-child { border-bottom: 1px solid rgba(244,236,223,.35); }
.collaborations-roll span:nth-child(even) { margin-left: 0; padding-left: clamp(1rem, 4vw, 4rem); background: transparent; color: #d1a05f; box-shadow: none; transform: none; }
.collaborations-intro { display: grid; grid-template-columns: .55fr 1.25fr .8fr; gap: clamp(2rem, 6vw, 7rem); align-items: end; padding: clamp(5.5rem, 11vw, 10rem) clamp(1.5rem, 8vw, 9rem); background: #efe5d5; color: #21151b; }
.collaborations-intro .eyebrow { align-self: start; margin: .35rem 0 0; color: #6a2e43; }
.collaborations-intro h2 { margin: 0; font: 400 clamp(4.2rem, 7.7vw, 8.2rem)/.8 "Bebas Neue", sans-serif; }
.collaborations-intro h2 em { color: #9d3f49; font-style: normal; }
.collaborations-intro > p:last-child { margin: 0 0 .4rem; font-size: .98rem; line-height: 1.7; }
.collaborations-ledger { display: block; padding: clamp(2rem, 5vw, 5rem) clamp(1.5rem, 8vw, 9rem) clamp(5rem, 10vw, 9rem); background: #efe5d5; color: #21151b; }
.collaboration-name-card { --row-accent: #6a2e43; display: grid; grid-template-columns: minmax(9rem, .36fr) minmax(0, 1fr) auto; gap: clamp(1.5rem, 4vw, 5rem); align-items: center; min-height: 0; box-sizing: border-box; padding: clamp(1.5rem, 3.2vw, 2.8rem) 0; border: 0; border-top: 1px solid rgba(33,21,27,.52); background: transparent; color: #21151b; text-decoration: none; transition: color .25s ease, padding .25s ease; }
.collaboration-name-card:last-child { border-bottom: 1px solid rgba(33,21,27,.52); }
.collaboration-name-card > span { color: var(--row-accent); font-size: .61rem; font-weight: 700; letter-spacing: .13em; text-transform: uppercase; }
.collaboration-name-card h3 { max-width: none; margin: 0; font: 400 clamp(3.7rem, 7vw, 7.4rem)/.78 "Bebas Neue", sans-serif; letter-spacing: .01em; transition: color .25s ease, transform .25s ease; }
.collaboration-name-card > p { margin: 0; color: #6b555d; font-size: .62rem; font-weight: 700; letter-spacing: .1em; text-align: right; text-transform: uppercase; }
.collaboration-name-card > p b { display: inline-block; margin-left: .55rem; color: var(--row-accent); font-size: 1rem; transition: transform .25s ease; }
a.collaboration-name-card:hover { padding-right: .75rem; padding-left: .75rem; background: transparent; color: #21151b; }
a.collaboration-name-card:hover h3 { color: var(--row-accent); transform: translateX(.35rem); }
a.collaboration-name-card:hover > p b { transform: translate(.25rem, -.2rem); }
.collaboration-card-ron { --row-accent: #315c63; }
.collaboration-card-538 { --row-accent: #9d3f49; }
.collaboration-card-talpa { --row-accent: #315c63; }
.collaboration-card-pending { cursor: default; opacity: .62; }
.collaboration-card-cloud { --row-accent: #4857bf; }
.collaboration-card-shorts { --row-accent: #6a2e43; }
.collaboration-card-thibo { --row-accent: #9d3f49; color: #21151b; }
.collaboration-card-alex { --row-accent: #173d44; }
.collaborations-closing { display: flex; flex-direction: column; align-items: center; padding: clamp(6rem, 12vw, 11rem) 1.5rem; background: #6a2e43; color: #f4ecdf; text-align: center; }
.collaborations-closing .eyebrow { margin: 0 0 1.2rem; color: #d1a05f; }
.collaborations-closing h2 { margin: 0 0 2.2rem; font: 400 clamp(4.3rem, 8vw, 8.5rem)/.8 "Bebas Neue", sans-serif; }
.collaborations-closing h2 em { color: #d1a05f; font-style: normal; }
.collaborations-closing a { padding: 1rem 1.2rem; background: #d1a05f; color: #21151b; font-size: .67rem; font-weight: 700; letter-spacing: .1em; text-decoration: none; text-transform: uppercase; }

@media (max-width: 800px) {
  .home-collaborations, .work-collaboration-feature, .collaborations-hero, .collaborations-intro { grid-template-columns: 1fr; }
  .collaborations-roll { border-top: 1px solid rgba(209,160,95,.35); border-left: 0; }
  .collaborations-hero-copy { padding-bottom: 4rem; }
  .collaborations-intro > p:last-child { max-width: 32rem; }
}
@media (max-width: 600px) {
  .collaborations-ledger { padding-right: 1.25rem; padding-left: 1.25rem; }
  .collaboration-name-card { grid-template-columns: minmax(0, 1fr) auto; gap: 1rem; min-height: 0; padding: 1.5rem 0; }
  .collaboration-name-card > span { grid-column: 1 / -1; }
  .collaboration-name-card h3 { font-size: clamp(3.1rem, 14vw, 4.8rem); }
  .collaboration-name-card > p { max-width: 7rem; line-height: 1.45; }
  a.collaboration-name-card:hover { padding-right: 0; padding-left: 0; }
  .collaborations-roll span:nth-child(even) { margin-left: 0; }
}

/* Existing client cases — rebuilt to match the current editorial portfolio. */
.client-profile-page,
.client-work-page { --client-bg: #21151b; --client-deep: #120d12; --client-accent: #d1a05f; --client-paper: #efe5d5; background: var(--client-deep); color: var(--client-paper); }
.client-profile-page[data-page="client-538"], .client-work-page[data-client="538"] { --client-bg: #8f2f3d; --client-accent: #f2b461; }
.client-profile-page[data-page="client-talpa"], .client-work-page[data-client="talpa"] { --client-bg: #182c33; --client-accent: #72aeb3; }
.client-profile-page[data-page="client-cloudpillo"], .client-work-page[data-client="cloudpillo"] { --client-bg: #4857bf; --client-accent: #b8d36a; }
.client-profile-page[data-page="client-shortslab"], .client-work-page[data-client="shortslab"] { --client-bg: #663149; --client-accent: #df9cbf; }
.client-profile-page[data-page="client-thibo"], .client-work-page[data-client="thibo"] { --client-bg: #315c63; --client-accent: #e0b273; }
.client-profile-page[data-page="client-alex"], .client-work-page[data-client="alex"] { --client-bg: #3f3579; --client-accent: #d8c0ee; }
.client-work-page[data-client="ron"] { --client-bg: #315c63; --client-accent: #e0b273; }

.client-profile-page > .navbar,
.client-work-page > .navbar { min-height: 74px; box-sizing: border-box; padding: 1rem clamp(1.2rem, 4vw, 4rem); border-bottom: 1px solid rgba(209,160,95,.28); background: var(--client-deep); color: var(--client-paper); }
.client-profile-page > .navbar .logo,
.client-work-page > .navbar .logo { color: var(--client-paper); font-family: "Bebas Neue", sans-serif; font-size: 1.55rem; letter-spacing: .055em; }
.client-profile-page > .navbar .nav-links a,
.client-work-page > .navbar .nav-links a { padding: .35rem 0; border-radius: 0; background: transparent; box-shadow: none; color: rgba(239,229,213,.7); font-size: .67rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.client-profile-page > .navbar .nav-links a.active,
.client-work-page > .navbar .nav-links a.active { border-bottom: 1px solid var(--client-accent); background: transparent; color: var(--client-accent); }
.client-profile-page > .navbar .language-switch,
.client-work-page > .navbar .language-switch { padding: .35rem .5rem; border: 1px solid rgba(239,229,213,.22); border-radius: 0; background: transparent; box-shadow: none; }
.client-profile-page > .navbar .language-pill,
.client-work-page > .navbar .language-pill { padding: .15rem .25rem; border: 0; border-radius: 0; background: transparent; color: rgba(239,229,213,.5); box-shadow: none; font-size: .6rem; font-weight: 700; letter-spacing: .08em; }
.client-profile-page > .navbar .language-pill-active,
.client-work-page > .navbar .language-pill-active { color: var(--client-accent); }

.client-profile-page .project-section,
.client-work-page .project-section { padding: 0; overflow: visible; background: var(--client-deep); }
.client-profile-page .project-section::before,
.client-profile-page .project-section::after,
.client-work-page .project-section::before,
.client-work-page .project-section::after { display: none; }
.client-profile-page .project-wrapper,
.client-work-page .project-wrapper { max-width: none; margin: 0; padding: 0; border: 0; border-radius: 0; background: transparent; box-shadow: none; }
.client-profile-page .project-intro { display: grid; grid-template-columns: 1.08fr .92fr; gap: 0; min-height: min(760px, calc(100vh - 74px)); margin: 0; background: var(--client-bg); }
.client-profile-page .project-copy { align-self: center; padding: clamp(5rem, 10vw, 9rem) clamp(1.5rem, 7vw, 7rem); color: var(--client-paper); }
.client-profile-page .project-copy .section-label { margin: 0 0 1.2rem; color: var(--client-accent); font-size: .62rem; font-weight: 700; letter-spacing: .13em; text-transform: uppercase; }
.client-profile-page .project-section h1 { max-width: 48rem; margin: 0 0 1.7rem; color: var(--client-paper); font: 400 clamp(5rem, 10vw, 10rem)/.76 "Bebas Neue", sans-serif; letter-spacing: .01em; }
.client-profile-page .project-copy > p:not(.section-label) { max-width: 37rem; margin: 0 0 1.7rem; color: rgba(239,229,213,.82); font-size: 1rem; line-height: 1.75; }
.client-profile-page .project-tags { gap: .55rem; }
.client-profile-page .project-tags span { padding: .55rem .72rem; border: 1px solid rgba(239,229,213,.38); border-radius: 0; background: transparent; color: var(--client-paper); box-shadow: none; font-size: .58rem; font-weight: 700; letter-spacing: .09em; text-transform: uppercase; }
.client-profile-page .project-visual-card { position: relative; min-height: 100%; margin: 0; padding: clamp(2rem, 7vw, 7rem); border: 0; border-left: 1px solid rgba(239,229,213,.28); border-radius: 0; background: var(--client-deep); }
.client-profile-page .project-visual-card::before { content: "SELECTED CLIENT"; position: absolute; top: 2rem; right: 2rem; color: var(--client-accent); font-size: .55rem; font-weight: 700; letter-spacing: .14em; }
.client-profile-page .project-logo { width: min(100%, 430px); max-width: 100%; max-height: 300px; margin: auto; padding: clamp(1.2rem, 3vw, 2.4rem); box-sizing: border-box; background: var(--client-paper); box-shadow: 13px 15px 0 var(--client-accent); object-fit: contain; }
.client-profile-page .project-meta-grid { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: clamp(1rem, 2vw, 2rem); margin: 0; padding: clamp(5rem, 10vw, 9rem) clamp(1.5rem, 8vw, 9rem) 2rem; background: var(--client-paper); }
.client-profile-page .project-meta-card { grid-column: span 6; min-height: 240px; margin: 0; padding: clamp(1.4rem, 3vw, 2.5rem); border: 1px solid rgba(33,21,27,.35); border-radius: 0; background: transparent; box-shadow: none; color: #21151b; }
.client-profile-page .project-meta-card:nth-child(even) { background: var(--client-accent); }
.client-profile-page .project-meta-card p { color: #21151b; }
.client-profile-page .project-meta-label { margin: 0 0 4rem; color: var(--client-bg) !important; font-size: .6rem !important; font-weight: 700; letter-spacing: .13em; text-transform: uppercase; }
.client-profile-page .project-meta-card:not(.project-meta-card-photo) > p:last-child { max-width: 29rem; margin: 0; font: 400 clamp(1.8rem, 3vw, 3rem)/1.08 "Bebas Neue", sans-serif; }
.client-profile-page .project-meta-card-photo { grid-column: 2 / 12; min-height: 520px; padding: 0; overflow: hidden; }
.client-profile-page .project-meta-card-photo img { width: 100%; height: 100%; max-height: none; object-fit: cover; }
.client-profile-page .project-work-button { width: fit-content; margin: 3rem auto 1rem; padding: 1rem 1.25rem; border: 0; border-radius: 0; background: var(--client-accent); color: #21151b; box-shadow: none; font-size: .65rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }
.client-profile-page .project-work-button:hover { background: var(--client-paper); color: #21151b; box-shadow: none; }
.client-profile-page .back-button,
.client-work-page .back-button { display: block; width: fit-content; margin: 1rem auto clamp(5rem, 9vw, 8rem); padding: .55rem 0; border-radius: 0; border-bottom: 1px solid currentColor; background: transparent; color: var(--client-paper); font-size: .62rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }

.client-work-page .client-work-hero { display: grid; place-content: end start; min-height: 480px; box-sizing: border-box; margin: 0; padding: clamp(6rem, 11vw, 10rem) clamp(1.5rem, 8vw, 9rem) clamp(4rem, 7vw, 7rem); background: var(--client-bg); text-align: left; }
.client-work-page .client-work-hero .section-label { margin: 0 0 1rem; color: var(--client-accent); font-size: .62rem; font-weight: 700; letter-spacing: .13em; text-transform: uppercase; }
.client-work-page .client-work-hero h1 { margin: 0; color: var(--client-paper); font: 400 clamp(5.5rem, 12vw, 12rem)/.74 "Bebas Neue", sans-serif; letter-spacing: .01em; }
.client-work-page .client-work-subtitle { max-width: 38rem; margin: 1.5rem 0 0; color: rgba(239,229,213,.75); font-size: 1rem; line-height: 1.6; }
.client-work-page .project-work-section { margin: 0; padding: clamp(4rem, 9vw, 8rem) clamp(1rem, 7vw, 7rem); background: var(--client-paper); }
.client-work-page .project-work-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(1rem, 3vw, 3rem); max-width: 1160px; margin: 0 auto; align-items: stretch; }
.client-work-page .project-work-card { min-width: 0; padding: .8rem; overflow: hidden; border: 1px solid rgba(33,21,27,.3); border-radius: 0; background: #fff; box-shadow: 9px 10px 0 var(--client-accent); }
.client-work-page .project-work-card:nth-child(even) { transform: translateY(clamp(2rem, 6vw, 6rem)); }
.client-work-page .project-work-card .short-wrapper,
.client-work-page .project-work-card .video-wrapper { border-radius: 0; background: #120d12; }
.client-work-page .project-work-card iframe { display: block; }
.client-work-page .project-work-card .tiktok-embed { margin-right: auto; margin-left: auto; }
.client-work-page .project-work-card-text { min-height: 360px; padding: clamp(1.5rem, 4vw, 3.5rem); background: var(--client-bg); color: var(--client-paper); box-shadow: 9px 10px 0 var(--client-accent); }
.client-work-page .project-work-card-text h3 { margin: 0 0 1rem; color: var(--client-paper); font: 400 clamp(3rem, 6vw, 6rem)/.8 "Bebas Neue", sans-serif; }
.client-work-page .project-work-card-text p { color: rgba(239,229,213,.76); }

.ron-client-page .client-work-hero h1 { max-width: 66rem; font-size: clamp(5rem, 10vw, 10rem); }
.ron-video-section { display: grid; grid-template-columns: minmax(0, .9fr) minmax(320px, 1.1fr); align-items: center; gap: clamp(3rem, 9vw, 9rem); padding: clamp(5rem, 10vw, 10rem) clamp(1.5rem, 9vw, 10rem); background: var(--client-paper); color: #21151b; }
.ron-video-copy { max-width: 35rem; }
.ron-video-copy .section-label { margin: 0 0 1.4rem; color: var(--client-bg); font-size: .62rem; font-weight: 700; letter-spacing: .13em; text-transform: uppercase; }
.ron-video-number { margin: 0 0 2.7rem; color: #7a5e66; font-size: .68rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; }
.ron-video-copy h2 { margin: 0 0 1.6rem; color: #21151b; font: 400 clamp(4.2rem, 7vw, 7.7rem)/.8 "Bebas Neue", sans-serif; letter-spacing: .015em; }
.ron-video-copy > p:last-of-type { max-width: 30rem; margin: 0; color: #4a363d; font-size: 1rem; line-height: 1.72; }
.ron-video-note { display: inline-block; margin-top: 3rem; padding-bottom: .45rem; border-bottom: 1px solid var(--client-bg); color: var(--client-bg); font-size: .67rem; font-weight: 700; letter-spacing: .13em; }
.ron-video-gallery { display: grid; place-items: center; }
.ron-video-card { width: min(100%, 420px); aspect-ratio: 9 / 16; border-color: rgba(49,92,99,.5); box-shadow: 12px 14px 0 var(--client-accent); }
.ron-video-card video { object-fit: cover; }
.ron-video-card .theatre-video-credit { max-width: 75%; }
.ron-video-lightbox .theatre-video-lightbox-content { width: min(72vw, 460px); height: min(82vh, 818px); aspect-ratio: 9 / 16; }
.ron-video-lightbox .theatre-video-lightbox-player { width: 100%; height: 100%; max-height: 82vh; aspect-ratio: 9 / 16; object-fit: contain; }
.ron-video-lightbox .theatre-video-close { right: calc(50% - min(36vw, 230px)); }

.client-profile-page .site-footer,
.client-work-page .site-footer { padding: clamp(4rem, 8vw, 7rem) clamp(1.5rem, 6vw, 6rem) 2rem; border-top: 1px solid rgba(209,160,95,.25); background: var(--client-deep); color: var(--client-paper); }
.client-profile-page .site-footer .footer-top,
.client-work-page .site-footer .footer-top { max-width: 1280px; margin: 0 auto; }
.client-profile-page .site-footer h2,
.client-work-page .site-footer h2 { color: var(--client-paper); }
.client-profile-page .site-footer a,
.client-work-page .site-footer a { color: var(--client-paper); }

@media (max-width: 800px) {
  .client-profile-page .project-intro { grid-template-columns: minmax(0, 1fr); }
  .client-profile-page .project-copy,
  .client-profile-page .project-visual-card {
    width: 100%;
    max-width: 100%;
    min-width: 0;
    box-sizing: border-box;
  }
  .client-profile-page .project-visual-card { min-height: 460px; border-top: 1px solid rgba(239,229,213,.28); border-left: 0; }
  .client-profile-page .project-meta-grid { grid-template-columns: 1fr; }
  .client-profile-page .project-meta-card,
  .client-profile-page .project-meta-card-photo { grid-column: 1; }
  .client-work-page .project-work-grid { grid-template-columns: 1fr; }
  .client-work-page .client-work-hero { grid-template-columns: minmax(0, 1fr); align-content: end; justify-content: stretch; }
  .client-work-page .client-work-hero > * { min-width: 0; }
  .client-work-page .project-work-card:nth-child(even) { transform: none; }
  .ron-video-section { grid-template-columns: 1fr; }
  .ron-video-copy { max-width: 38rem; }
}
@media (max-width: 560px) {
  .client-profile-page .project-section h1 { font-size: 5.2rem; }
  .client-profile-page .project-visual-card { min-height: 360px; }
  .client-profile-page .project-meta-card-photo { min-height: 360px; }
  .client-work-page .client-work-hero { min-height: 390px; }
  .client-work-page .client-work-hero h1 { font-size: 5.5rem; }
}

@media (max-width: 560px) {
  .full-photo-grid {
    grid-template-columns: minmax(0, 1fr);
  }

  .full-photo-grid .photo-grid-item,
  .full-photo-grid .photo-grid-item.photo-grid-wide,
  .full-photo-grid .photo-grid-item.photo-grid-tall {
    grid-column: 1;
  }

  .full-photo-grid .photo-credit {
    min-width: 0;
    max-width: calc(100% - .75rem);
    box-sizing: border-box;
  }
}

@media (max-width: 360px) {
  .productions-opening h1 {
    font-size: 3.65rem;
  }

  .client-profile-page .project-section h1,
  .client-work-page .client-work-hero h1 {
    font-size: 4.4rem;
  }

  .fleur-detail .work-card {
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
  }

  .work-more {
    padding-right: 1rem;
    padding-left: 1rem;
  }

  .work-more h2 {
    font-size: 3.25rem;
  }

  .work-more-links strong {
    font-size: 1.65rem;
  }

  .about-quote-strip p {
    font-size: 2.75rem;
  }
}

/* Productions index — a theatrical programme cover before the unchanged production tiles. */
body.theatre-site .productions-opening {
  position: relative;
  isolation: isolate;
  display: grid;
  grid-template-columns: minmax(0, 1.25fr) minmax(16rem, .55fr);
  gap: clamp(3rem, 8vw, 9rem);
  align-items: end;
  min-height: min(650px, calc(100vh - 74px));
  box-sizing: border-box;
  overflow: hidden;
  padding: clamp(5.5rem, 10vw, 9rem) clamp(1.5rem, 8vw, 9rem) clamp(4.5rem, 8vw, 7rem);
  border-bottom: 10px solid #d1a05f;
  background:
    radial-gradient(circle at 81% 42%, rgba(224,178,115,.3) 0 1px, rgba(209,160,95,.14) 1.5px 18%, transparent 42%),
    linear-gradient(118deg, #181014 0 60%, #54263a 60% 100%);
  color: #f4ecdf;
}

body.theatre-site .productions-opening::before {
  content: "";
  position: absolute;
  z-index: -1;
  top: -22%;
  right: 11%;
  width: 1px;
  height: 145%;
  background: rgba(224,178,115,.48);
  box-shadow: 34px 0 0 rgba(224,178,115,.11), -34px 0 0 rgba(224,178,115,.11);
  transform: rotate(17deg);
}

.productions-opening-copy {
  position: relative;
  z-index: 1;
}

.productions-opening-copy::before {
  content: "";
  position: absolute;
  top: 8.8rem;
  left: -2rem;
  width: .5rem;
  height: clamp(10rem, 19vw, 18rem);
  background: #d1a05f;
}

body.theatre-site .productions-opening .eyebrow {
  margin: 0 0 1.4rem;
  color: #d1a05f;
}

body.theatre-site .productions-opening h1 {
  max-width: 59rem;
  margin: 0;
  font-size: clamp(5.7rem, 10.5vw, 11rem);
  letter-spacing: .005em;
  line-height: .73;
}

body.theatre-site .productions-opening h1 em {
  display: inline-block;
  margin-left: clamp(1.5rem, 7vw, 7rem);
  color: #d1a05f;
  text-shadow: 4px 4px 0 rgba(106,46,67,.75);
}

body.theatre-site .productions-opening-copy > p:not(.eyebrow) {
  max-width: 34rem;
  margin: 2.5rem 0 0 clamp(1.5rem, 7vw, 7rem);
  padding-left: 1.25rem;
  border-left: 1px solid rgba(209,160,95,.72);
  color: rgba(244,236,223,.78);
  font-size: 1rem;
  line-height: 1.7;
}

.productions-opening-mark {
  position: relative;
  z-index: 1;
  display: grid;
  min-height: 21rem;
  box-sizing: border-box;
  align-content: space-between;
  justify-items: center;
  padding: 1.5rem;
  border: 1px solid rgba(224,178,115,.72);
  color: #d1a05f;
  transform: rotate(2.5deg);
}

.productions-opening-mark::before,
.productions-opening-mark::after {
  content: "";
  position: absolute;
  width: 1.2rem;
  height: 1.2rem;
  border-color: #f4ecdf;
}

.productions-opening-mark::before {
  top: -.4rem;
  left: -.4rem;
  border-top: 2px solid;
  border-left: 2px solid;
}

.productions-opening-mark::after {
  right: -.4rem;
  bottom: -.4rem;
  border-right: 2px solid;
  border-bottom: 2px solid;
}

.productions-opening-mark span,
.productions-opening-mark small {
  font-size: .68rem;
  font-weight: 700;
  letter-spacing: .16em;
  text-transform: uppercase;
}

.productions-opening-mark b {
  color: #f4ecdf;
  font: 400 clamp(7rem, 12vw, 11rem)/.7 "Bebas Neue", sans-serif;
  text-shadow: 0 0 34px rgba(224,178,115,.48);
}

.productions-opening-mark small {
  color: rgba(244,236,223,.72);
  text-align: center;
}

@media (max-width: 850px) {
  body.theatre-site .productions-opening {
    grid-template-columns: 1fr;
    min-height: 620px;
    background:
      radial-gradient(circle at 86% 23%, rgba(224,178,115,.25) 0 1px, rgba(209,160,95,.1) 1.5px 15%, transparent 35%),
      linear-gradient(145deg, #181014 0 72%, #54263a 72% 100%);
  }

  .productions-opening-copy::before {
    left: -.9rem;
  }

  .productions-opening-mark {
    position: absolute;
    top: 4rem;
    right: clamp(1.25rem, 6vw, 4rem);
    min-height: 9rem;
    width: 7.5rem;
    padding: .8rem;
    opacity: .72;
  }

  .productions-opening-mark b {
    font-size: 4.8rem;
  }

  .productions-opening-mark small {
    display: none;
  }
}

@media (max-width: 520px) {
  body.theatre-site .productions-opening {
    min-height: 570px;
    padding-top: 4rem;
  }

  body.theatre-site .productions-opening h1 {
    font-size: clamp(4.5rem, 23vw, 7rem);
  }

  body.theatre-site .productions-opening h1 em {
    margin-left: 1.2rem;
  }

  body.theatre-site .productions-opening-copy > p:not(.eyebrow) {
    margin-left: 1.2rem;
  }

  .productions-opening-mark {
    top: 3.25rem;
    right: .85rem;
    width: 5.8rem;
    min-height: 7rem;
  }

  .productions-opening-mark b {
    font-size: 3.8rem;
  }

  .productions-opening-mark span {
    font-size: .54rem;
  }
}

/* About — a maker's manifesto, led by the work rather than a portrait. */
.about-editorial { overflow: hidden; background: #f4ecdf; color: #21151b; }
.about-editorial-hero { display: grid; grid-template-columns: .93fr 1.07fr; min-height: min(860px, calc(100vh - 74px)); background: #21151b; color: #f4ecdf; }
.about-editorial-hero-copy { align-self: center; padding: clamp(5rem, 9vw, 8rem) clamp(1.5rem, 7vw, 7rem); }
.about-editorial-hero-copy .eyebrow { margin: 0 0 1.5rem; color: #d1a05f; font-size: .75rem; }
.about-editorial-hero-copy .eyebrow span { margin-left: .4rem; }
.about-editorial-hero h1 { max-width: 48rem; margin: 0; font: 400 clamp(4.5rem, 7.7vw, 8.2rem)/.78 "Bebas Neue", sans-serif; letter-spacing: .01em; }
.about-editorial-hero h1 em { color: #d1a05f; font-style: normal; }
.about-editorial-hero-copy > p:not(.eyebrow) { max-width: 33rem; margin: 2rem 0 2.2rem; color: rgba(244,236,223,.78); font-size: 1.05rem; line-height: 1.72; }
.about-editorial-hero-copy > a { display: inline-flex; align-items: center; gap: .85rem; padding-bottom: .4rem; border-bottom: 1px solid #d1a05f; color: #f4ecdf; font-size: .75rem; font-weight: 700; letter-spacing: .1em; text-decoration: none; text-transform: uppercase; }
.about-editorial-hero-copy > a span { color: #d1a05f; font-size: 1.1rem; }
.about-editorial-work-image { position: relative; min-height: 100%; margin: 0; overflow: hidden; border-left: 1px solid rgba(209,160,95,.35); background: #120d12; }
.about-editorial-work-image > img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 50%; filter: saturate(.9) contrast(1.06); }
.about-editorial-work-image::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(18,13,18,.12), transparent 48%, rgba(18,13,18,.48)); pointer-events: none; }
.about-editorial-work-image > p { position: absolute; z-index: 2; top: 2rem; left: 2rem; margin: 0; color: #f4ecdf; font: 400 clamp(2.8rem, 5vw, 5.4rem)/.78 "Bebas Neue", sans-serif; letter-spacing: .025em; text-shadow: 0 2px 20px rgba(18,13,18,.45); }
.about-editorial-work-image > p em { color: #d1a05f; font-style: normal; }
.about-editorial-work-image figcaption { position: absolute; z-index: 2; right: 0; bottom: 0; max-width: min(76%, 30rem); padding: 1rem 1.15rem; background: #f4ecdf; color: #21151b; box-shadow: -8px -8px 0 #d1a05f; }
.about-editorial-work-image figcaption strong { display: block; font: 400 1.35rem/.95 "Bebas Neue", sans-serif; letter-spacing: .035em; }
.about-editorial-work-image figcaption span { display: block; margin-top: .32rem; color: #6a2e43; font-size: .75rem; font-weight: 700; letter-spacing: .08em; line-height: 1.35; text-transform: uppercase; }

.about-manifesto { display: grid; grid-template-columns: .22fr 1.12fr .8fr; gap: clamp(2rem, 6vw, 7rem); align-items: end; padding: clamp(6rem, 11vw, 10rem) clamp(1.5rem, 8vw, 9rem); background: #f4ecdf; }
.about-section-index { align-self: start; color: #9d3f49; font: 400 clamp(4.5rem, 8vw, 8rem)/.75 "Bebas Neue", sans-serif; }
.about-manifesto .eyebrow, .about-experience .eyebrow, .about-editorial-process .eyebrow { margin: 0 0 1.1rem; color: #6a2e43; font-size: .75rem; }
.about-manifesto h2, .about-experience h2, .about-editorial-process h2 { margin: 0; font: 400 clamp(4rem, 7vw, 7.4rem)/.8 "Bebas Neue", sans-serif; letter-spacing: .01em; }
.about-manifesto h2 em, .about-experience h2 em, .about-editorial-process h2 em { color: #9d3f49; font-style: normal; }
.about-manifesto-copy { padding-bottom: .25rem; }
.about-manifesto-copy p { max-width: 30rem; margin: 0 0 1.2rem; font-size: 1rem; line-height: 1.75; }

.about-image-notes { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(1rem, 2.2vw, 2rem); width: min(100%, 1160px); box-sizing: border-box; margin: 0 auto; padding: 0 1.5rem clamp(6rem, 10vw, 9rem); background: #f4ecdf; }
.about-image-note { margin: 0; }
.about-image-note > img { display: block; width: 100%; aspect-ratio: 4 / 5; object-fit: cover; object-position: 50% 30%; filter: saturate(.9) contrast(1.03); }
.about-image-note figcaption { display: grid; grid-template-columns: 2.2rem minmax(0, 1fr); column-gap: .8rem; align-items: baseline; margin-top: .75rem; padding-top: .65rem; border-top: 1px solid rgba(33,21,27,.52); }
.about-image-note figcaption span { grid-row: 1 / 3; color: #9d3f49; font-size: .65rem; font-weight: 700; letter-spacing: .1em; }
.about-image-note figcaption strong { font: 400 clamp(1.15rem, 1.7vw, 1.7rem)/1 "Bebas Neue", sans-serif; letter-spacing: .025em; }
.about-image-note figcaption small { margin-top: .22rem; color: #725e65; font-size: .62rem; font-weight: 700; letter-spacing: .09em; text-transform: uppercase; }

.about-quote-strip { display: grid; grid-template-columns: minmax(10rem, .4fr) minmax(0, 1fr) auto; gap: clamp(2rem, 6vw, 7rem); align-items: center; margin: 0; padding: clamp(2.5rem, 5vw, 4.5rem) clamp(1.5rem, 8vw, 9rem); border-top: 2px solid #21151b; border-bottom: 2px solid #21151b; background: #d1a05f; color: #21151b; }
.about-quote-strip > span { font-size: .75rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; }
.about-quote-strip p { margin: 0; font: 400 clamp(3.2rem, 6vw, 6.2rem)/.8 "Bebas Neue", sans-serif; letter-spacing: .015em; }
.about-quote-strip b { color: #6a2e43; font-size: clamp(2rem, 4vw, 4rem); font-weight: 400; }

.about-experience { display: grid; grid-template-columns: .82fr 1.18fr; gap: clamp(4rem, 9vw, 10rem); padding: clamp(6rem, 11vw, 10rem) clamp(1.5rem, 8vw, 9rem); background: #21151b; color: #f4ecdf; }
.about-experience-intro { align-self: center; }
.about-experience .eyebrow { color: #d1a05f; }
.about-experience h2 { color: #f4ecdf; }
.about-experience h2 em { color: #d1a05f; }
.about-experience-intro > p:last-child { max-width: 31rem; margin: 2rem 0 0; color: rgba(244,236,223,.74); font-size: 1rem; line-height: 1.75; }
.about-experience-list { margin: 0; border-top: 1px solid rgba(244,236,223,.55); }
.about-experience-list > div { display: grid; grid-template-columns: 3rem minmax(0, 1fr); gap: 1.5rem; align-items: start; padding: clamp(1.35rem, 2.5vw, 2.1rem) 0; border-bottom: 1px solid rgba(244,236,223,.32); }
.about-experience-list dt { padding-top: .2rem; color: #d1a05f; font-size: .75rem; font-weight: 700; letter-spacing: .1em; }
.about-experience-list dd { display: flex; justify-content: space-between; gap: 2rem; align-items: baseline; margin: 0; }
.about-experience-list strong { font: 400 clamp(1.8rem, 3vw, 3.1rem)/.92 "Bebas Neue", sans-serif; letter-spacing: .025em; }
.about-experience-list span { max-width: 11rem; color: rgba(244,236,223,.58); font-size: .75rem; font-weight: 700; letter-spacing: .08em; line-height: 1.4; text-align: right; text-transform: uppercase; }

.about-editorial-process { display: grid; grid-template-columns: .78fr 1.22fr; gap: clamp(4rem, 9vw, 10rem); padding: clamp(6rem, 11vw, 10rem) clamp(1.5rem, 8vw, 9rem); background: #e9ddce; }
.about-editorial-process-heading { align-self: start; }
.about-editorial-process ol { margin: 0; padding: 0; list-style: none; border-top: 2px solid #21151b; }
.about-editorial-process li { display: grid; grid-template-columns: 3.2rem minmax(0, 1fr) 2rem; gap: 1.35rem; align-items: start; padding: clamp(1.4rem, 2.5vw, 2rem) 0; border-bottom: 1px solid rgba(33,21,27,.42); }
.about-editorial-process li > span { padding-top: .25rem; color: #6a2e43; font-size: .75rem; font-weight: 700; letter-spacing: .1em; }
.about-editorial-process h3 { margin: 0 0 .45rem; font: 400 clamp(2rem, 3.5vw, 3.3rem)/.9 "Bebas Neue", sans-serif; letter-spacing: .025em; }
.about-editorial-process li p { max-width: 31rem; margin: 0; font-size: 1rem; line-height: 1.62; }
.about-editorial-process li b { color: #9d3f49; font-size: 1.25rem; font-weight: 400; text-align: right; }

@media (max-width: 900px) {
  .about-editorial-hero, .about-experience, .about-editorial-process { grid-template-columns: 1fr; }
  .about-editorial-work-image { min-height: 760px; border-top: 1px solid rgba(209,160,95,.35); border-left: 0; }
  .about-manifesto { grid-template-columns: .2fr 1fr; }
  .about-manifesto-copy { grid-column: 2; max-width: 40rem; }
  .about-experience, .about-editorial-process { gap: 4rem; }
}
@media (max-width: 600px) {
  .about-editorial-hero-copy { padding-top: 4.5rem; padding-bottom: 4rem; }
  .about-editorial-hero h1 { font-size: clamp(4rem, 18vw, 5.6rem); }
  .about-editorial-work-image { min-height: 570px; }
  .about-editorial-work-image > p { top: 1.2rem; left: 1.2rem; font-size: 3.1rem; }
  .about-editorial-work-image figcaption { max-width: 84%; }
  .about-manifesto { grid-template-columns: 1fr; gap: 1.5rem; }
  .about-manifesto-copy { grid-column: auto; }
  .about-section-index { font-size: 5rem; }
  .about-image-notes { display: flex; gap: 1rem; padding-right: 1.5rem; padding-left: 1.5rem; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; }
  .about-image-notes::-webkit-scrollbar { display: none; }
  .about-image-note { flex: 0 0 72vw; scroll-snap-align: start; }
  .about-quote-strip { grid-template-columns: 1fr auto; gap: 1.2rem; }
  .about-quote-strip > span { grid-column: 1 / -1; }
  .about-quote-strip p { font-size: 3.6rem; }
  .about-experience, .about-editorial-process { padding-right: 1.5rem; padding-left: 1.5rem; }
  .about-experience-list dd { flex-direction: column; gap: .55rem; }
  .about-experience-list span { max-width: none; text-align: left; }
  .about-editorial-process li { grid-template-columns: 2.4rem minmax(0, 1fr) 1.4rem; gap: .8rem; }
}

/* Homepage — quiet, cinematic and editorial */
.home-reframe {
  background: #171116;
  color: #f4ecdf;
}

.home-reframe-main {
  overflow: hidden;
}

.home-reframe .home-clean-label {
  margin: 0;
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: .13em;
  line-height: 1.4;
  text-transform: uppercase;
}

.home-reframe em {
  color: #d1a05f;
  font-family: "Playfair Display", serif;
  font-weight: 500;
}

.home-clean-hero {
  position: relative;
  display: flex;
  min-height: min(900px, 100svh);
  align-items: flex-end;
  isolation: isolate;
  overflow: hidden;
  background: #120d12;
}

.home-clean-hero > img {
  position: absolute;
  z-index: -2;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 50% 44%;
  filter: saturate(.88) contrast(1.07);
  transform: scale(1.01);
}

.home-clean-hero-shade {
  position: absolute;
  z-index: -1;
  inset: 0;
  background: linear-gradient(180deg, rgba(18, 13, 18, .16) 8%, rgba(18, 13, 18, .18) 36%, rgba(18, 13, 18, .92) 100%);
}

.home-clean-hero-meta {
  position: absolute;
  top: 6.4rem;
  right: clamp(1.5rem, 4vw, 4.5rem);
  left: clamp(1.5rem, 4vw, 4.5rem);
  display: flex;
  justify-content: space-between;
  color: rgba(244, 236, 223, .78);
  font-size: .69rem;
  font-weight: 700;
  letter-spacing: .13em;
  text-transform: uppercase;
}

.home-clean-hero-copy {
  width: 100%;
  padding: 11rem clamp(1.5rem, 6vw, 7rem) clamp(3rem, 6vw, 6rem);
}

.home-clean-hero-copy > p {
  margin: 0 0 1.1rem;
  color: #d1a05f;
  font-size: .74rem;
  font-weight: 700;
  letter-spacing: .14em;
  text-transform: uppercase;
}

.home-clean-hero h1 {
  max-width: 1180px;
  margin: 0;
  color: #f4ecdf;
  font: 400 clamp(4.8rem, 10vw, 10.8rem)/.79 "Bebas Neue", sans-serif;
  letter-spacing: .005em;
}

.home-clean-hero h1 em {
  display: inline-block;
  font-size: .73em;
  line-height: 1;
}

.home-clean-hero-copy > div {
  display: grid;
  grid-template-columns: minmax(15rem, 31rem) auto;
  gap: 3rem;
  align-items: end;
  margin-top: clamp(2.2rem, 5vw, 4.5rem);
  padding-top: 1.25rem;
  border-top: 1px solid rgba(244, 236, 223, .45);
}

.home-clean-hero-copy > div > p {
  margin: 0;
  color: rgba(244, 236, 223, .82);
  font-size: 1rem;
  line-height: 1.65;
}

.home-clean-hero-copy a,
.home-clean-intro a,
.home-work-heading > a,
.home-video-feature-copy > a,
.home-clean-clients > a,
.home-clean-cta > a {
  color: inherit;
  font-size: .76rem;
  font-weight: 700;
  letter-spacing: .1em;
  text-decoration: none;
  text-transform: uppercase;
}

.home-clean-hero-copy a {
  justify-self: end;
  padding-bottom: .35rem;
  border-bottom: 1px solid currentColor;
}

.home-clean-hero-credit {
  position: absolute;
  right: 1.2rem;
  bottom: clamp(3rem, 6vw, 6rem);
  display: none;
  margin: 0;
  writing-mode: vertical-rl;
  color: rgba(244, 236, 223, .6);
  font-size: .62rem;
  letter-spacing: .1em;
  text-transform: uppercase;
}

.home-clean-hero-credit strong {
  margin-bottom: .55rem;
  color: #d1a05f;
}

.home-clean-intro {
  display: grid;
  grid-template-columns: .32fr 1.12fr .72fr;
  gap: clamp(2.5rem, 6vw, 7rem);
  align-items: start;
  padding: clamp(6.5rem, 11vw, 11rem) clamp(1.5rem, 7vw, 8rem);
  background: #f4ecdf;
  color: #21151b;
}

.home-clean-intro .home-clean-label,
.home-work-heading .home-clean-label,
.home-clean-clients .home-clean-label {
  color: #6a2e43;
}

.home-clean-intro h2,
.home-work-heading h2,
.home-clean-services h2,
.home-clean-clients h2,
.home-clean-cta h2 {
  margin: 0;
  font: 400 clamp(3.7rem, 7vw, 7.2rem)/.82 "Bebas Neue", sans-serif;
  letter-spacing: .01em;
}

.home-clean-intro h2 em,
.home-work-heading h2 em,
.home-clean-clients h2 em {
  color: #9d3f49;
}

.home-clean-intro > div {
  max-width: 31rem;
  padding-top: .2rem;
}

.home-clean-intro > div p {
  margin: 0 0 2rem;
  font-size: 1rem;
  line-height: 1.75;
}

.home-clean-intro a,
.home-work-heading > a,
.home-clean-clients > a {
  display: inline-block;
  padding-bottom: .4rem;
  border-bottom: 1px solid currentColor;
}

.home-selected-work {
  background: #171116;
}

.home-work-heading {
  display: grid;
  grid-template-columns: .32fr 1fr auto;
  gap: clamp(2.5rem, 6vw, 7rem);
  align-items: end;
  padding: clamp(6rem, 10vw, 9rem) clamp(1.5rem, 7vw, 8rem) clamp(3.5rem, 6vw, 6rem);
}

.home-work-heading .home-clean-label {
  color: #d1a05f;
  align-self: start;
}

.home-work-heading h2 {
  color: #f4ecdf;
}

.home-work-heading > a {
  margin-bottom: .25rem;
  color: #f4ecdf;
}

.home-photo-lead {
  position: relative;
  display: block;
  min-height: min(800px, 76vw);
  overflow: hidden;
  color: #f4ecdf;
  text-decoration: none;
}

.home-photo-lead > img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 50% 36%;
  filter: saturate(.9) contrast(1.06);
  transition: transform .8s cubic-bezier(.2, .7, .2, 1);
}

.home-photo-lead-shade {
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(18, 13, 18, .05) 30%, rgba(18, 13, 18, .82) 100%);
}

.home-photo-lead > p {
  position: absolute;
  z-index: 2;
  right: clamp(1.5rem, 6vw, 7rem);
  bottom: clamp(2.5rem, 6vw, 6rem);
  left: clamp(1.5rem, 6vw, 7rem);
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: end;
  margin: 0;
}

.home-photo-lead > p span {
  grid-column: 1 / -1;
  margin-bottom: .75rem;
  color: #d1a05f;
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: .13em;
  text-transform: uppercase;
}

.home-photo-lead > p strong {
  font: 400 clamp(4rem, 9vw, 9.5rem)/.76 "Bebas Neue", sans-serif;
  letter-spacing: .01em;
}

.home-photo-lead > p small {
  padding-bottom: .65rem;
  border-bottom: 1px solid currentColor;
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: .1em;
  text-transform: uppercase;
}

.home-photo-lead > p small b {
  margin-left: .4rem;
  color: #d1a05f;
}

.home-photo-lead figure {
  position: absolute;
  z-index: 2;
  top: 2rem;
  right: clamp(1.5rem, 3vw, 3rem);
  margin: 0;
  color: rgba(244, 236, 223, .72);
  font-size: .65rem;
  font-weight: 700;
  letter-spacing: .09em;
  line-height: 1.45;
  text-align: right;
  text-transform: uppercase;
}

.home-video-feature {
  display: grid;
  grid-template-columns: .82fr 1.18fr;
  min-height: 780px;
  background: #d1a05f;
  color: #21151b;
}

.home-video-feature-copy {
  align-self: center;
  padding: clamp(4rem, 8vw, 9rem);
}

.home-video-feature-copy .home-clean-label {
  color: #6a2e43;
}

.home-video-feature-copy h3,
.home-event-band h3 {
  margin: 1.25rem 0 2rem;
  font: 400 clamp(4.5rem, 8vw, 8.5rem)/.77 "Bebas Neue", sans-serif;
  letter-spacing: .01em;
}

.home-video-feature-copy h3 em {
  color: #6a2e43;
}

.home-video-feature-copy > p:not(.home-clean-label) {
  max-width: 31rem;
  margin: 0 0 2.3rem;
  font-size: 1rem;
  line-height: 1.72;
}

.home-video-feature-copy > a {
  display: inline-block;
  padding-bottom: .4rem;
  border-bottom: 1px solid currentColor;
}

.home-video-feature figure {
  position: relative;
  min-height: 780px;
  margin: 0;
  overflow: hidden;
  background: #21151b;
}

.home-video-feature figure img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 50% 32%;
  filter: saturate(.9) contrast(1.04);
}

.home-video-feature figcaption {
  position: absolute;
  right: 1.5rem;
  bottom: 1.5rem;
  color: rgba(244, 236, 223, .72);
  font-size: .65rem;
  font-weight: 700;
  letter-spacing: .1em;
  text-transform: uppercase;
}

.home-event-band {
  display: grid;
  grid-template-columns: 1.42fr .58fr;
  min-height: 610px;
  color: #f4ecdf;
  text-decoration: none;
}

.home-event-band figure {
  min-height: 610px;
  margin: 0;
  overflow: hidden;
  background: #120d12;
}

.home-event-band figure img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 50% 48%;
  filter: saturate(.9) contrast(1.07);
  transition: transform .8s cubic-bezier(.2, .7, .2, 1);
}

.home-event-band > div {
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: clamp(3.5rem, 6vw, 7rem);
  background: #6a2e43;
}

.home-event-band .home-clean-label {
  color: #d1a05f;
}

.home-event-band h3 {
  margin-top: 1.15rem;
}

.home-event-band h3 em {
  color: #d1a05f;
}

.home-event-band > div > p:not(.home-clean-label) {
  max-width: 25rem;
  margin: 0 0 2rem;
  color: rgba(244, 236, 223, .8);
  font-size: 1rem;
  line-height: 1.65;
}

.home-event-band > div > span {
  align-self: flex-start;
  padding-bottom: .4rem;
  border-bottom: 1px solid currentColor;
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: .1em;
  text-transform: uppercase;
}

.home-clean-services {
  display: grid;
  grid-template-columns: .76fr 1.24fr;
  gap: clamp(4rem, 9vw, 10rem);
  padding: clamp(6.5rem, 11vw, 11rem) clamp(1.5rem, 7vw, 8rem);
  background: #21151b;
  color: #f4ecdf;
}

.home-clean-services-heading {
  align-self: start;
}

.home-clean-services .home-clean-label {
  margin-bottom: 1.25rem;
  color: #d1a05f;
}

.home-clean-services h2 em {
  color: #d1a05f;
}

.home-clean-service-list {
  border-top: 1px solid rgba(244, 236, 223, .55);
}

.home-clean-service-list article {
  display: grid;
  grid-template-columns: 3rem minmax(9rem, .55fr) 1fr;
  gap: clamp(1.5rem, 3vw, 3rem);
  align-items: start;
  padding: clamp(1.5rem, 2.8vw, 2.4rem) 0;
  border-bottom: 1px solid rgba(244, 236, 223, .3);
}

.home-clean-service-list article > span {
  padding-top: .3rem;
  color: #d1a05f;
  font-size: .7rem;
  font-weight: 700;
  letter-spacing: .1em;
}

.home-clean-service-list h3 {
  margin: 0;
  font: 400 clamp(2rem, 3.5vw, 3.5rem)/.9 "Bebas Neue", sans-serif;
  letter-spacing: .02em;
}

.home-clean-service-list p {
  max-width: 27rem;
  margin: 0;
  color: rgba(244, 236, 223, .7);
  font-size: .95rem;
  line-height: 1.65;
}

.home-clean-clients {
  display: grid;
  grid-template-columns: 1fr .64fr;
  gap: clamp(4rem, 9vw, 10rem);
  padding: clamp(6.5rem, 11vw, 11rem) clamp(1.5rem, 7vw, 8rem);
  background: #e9ddce;
  color: #21151b;
}

.home-clean-clients h2 {
  margin-top: 1.25rem;
}

.home-clean-client-names {
  border-top: 2px solid #21151b;
}

.home-clean-client-names span {
  display: block;
  padding: 1.15rem 0;
  border-bottom: 1px solid rgba(33, 21, 27, .42);
  font: 400 clamp(1.8rem, 3.2vw, 3.2rem)/.95 "Bebas Neue", sans-serif;
  letter-spacing: .02em;
}

.home-clean-clients > a {
  grid-column: 2;
  justify-self: start;
}

.home-clean-cta {
  padding: clamp(7rem, 14vw, 14rem) 1.5rem;
  background: #6a2e43;
  color: #f4ecdf;
  text-align: center;
}

.home-clean-cta .home-clean-label {
  margin-bottom: 1.4rem;
  color: #d1a05f;
}

.home-clean-cta h2 {
  font-size: clamp(5rem, 11vw, 11rem);
}

.home-clean-cta h2 em {
  color: #d1a05f;
}

.home-clean-cta > a {
  display: inline-block;
  margin-top: 2.4rem;
  padding-bottom: .45rem;
  border-bottom: 1px solid currentColor;
}

@media (hover: hover) {
  .home-photo-lead:hover > img,
  .home-event-band:hover figure img {
    transform: scale(1.025);
  }

  .home-reframe a:hover span,
  .home-reframe a:hover b {
    color: #d1a05f;
  }
}

@media (max-width: 900px) {
  .home-clean-intro,
  .home-work-heading,
  .home-clean-services,
  .home-clean-clients {
    grid-template-columns: 1fr;
  }

  .home-clean-intro,
  .home-work-heading,
  .home-clean-services,
  .home-clean-clients {
    gap: 2.5rem;
  }

  .home-work-heading > a,
  .home-clean-clients > a {
    grid-column: auto;
    justify-self: start;
  }

  .home-video-feature,
  .home-event-band {
    grid-template-columns: 1fr;
  }

  .home-video-feature {
    min-height: 0;
  }

  .home-video-feature-copy {
    padding-top: 6rem;
    padding-bottom: 6rem;
  }

  .home-video-feature figure {
    min-height: 740px;
  }

  .home-event-band figure {
    min-height: 60vw;
  }

  .home-event-band > div {
    min-height: 470px;
  }
}

@media (max-width: 620px) {
  .home-clean-hero {
    min-height: 760px;
  }

  .home-clean-hero > img {
    object-position: 58% 42%;
  }

  .home-clean-hero-meta {
    top: 5.8rem;
  }

  .home-clean-hero-meta span:last-child {
    display: none;
  }

  .home-clean-hero-copy {
    padding-bottom: 2.2rem;
  }

  .home-clean-hero h1 {
    font-size: clamp(4.2rem, 20vw, 6.2rem);
  }

  .home-clean-hero-copy > div {
    grid-template-columns: 1fr;
    gap: 1.4rem;
    margin-top: 2rem;
  }

  .home-clean-hero-copy a {
    justify-self: start;
  }

  .home-clean-intro h2,
  .home-work-heading h2,
  .home-clean-services h2,
  .home-clean-clients h2 {
    font-size: clamp(3.5rem, 16vw, 5rem);
  }

  .home-photo-lead {
    min-height: 700px;
  }

  .home-photo-lead > img {
    object-position: 51% 36%;
  }

  .home-photo-lead > p {
    grid-template-columns: 1fr;
  }

  .home-photo-lead > p strong {
    font-size: clamp(3.6rem, 17vw, 5.4rem);
  }

  .home-photo-lead > p small {
    justify-self: start;
    margin-top: 1.3rem;
  }

  .home-photo-lead figure {
    top: 1.2rem;
    right: 1.2rem;
  }

  .home-video-feature-copy h3,
  .home-event-band h3 {
    font-size: clamp(4rem, 19vw, 6rem);
  }

  .home-video-feature figure {
    min-height: 620px;
  }

  .home-event-band figure {
    min-height: 75vw;
  }

  .home-event-band > div {
    min-height: 420px;
  }

  .home-clean-service-list article {
    grid-template-columns: 2.2rem 1fr;
    gap: .7rem 1rem;
  }

  .home-clean-service-list article p {
    grid-column: 2;
  }

  .home-clean-client-names span {
    padding: 1rem 0;
  }

  .home-clean-cta h2 {
    font-size: clamp(4.8rem, 21vw, 7rem);
  }
}

/* Clear site-wide routes: the same destinations stay visible on every page. */
@media (max-width: 1100px) and (min-width: 951px) {
  .theatre-site .nav-links li a,
  .fleur-detail .nav-links li a {
    padding-right: .58rem;
    padding-left: .58rem;
    font-size: .72rem;
  }
}

@media (max-width: 950px) {
  .theatre-site .navbar,
  .fleur-detail .navbar,
  .client-profile-page > .navbar,
  .client-work-page > .navbar {
    position: static !important;
    top: auto;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: .9rem 1rem;
    padding: .95rem 1.2rem .72rem;
  }

  .theatre-site .navbar > .logo,
  .fleur-detail .navbar > .logo,
  .client-profile-page > .navbar > .logo,
  .client-work-page > .navbar > .logo {
    grid-row: 1;
    grid-column: 1;
    align-self: center;
    font-size: 1.35rem;
    white-space: nowrap;
  }

  .theatre-site .nav-meta,
  .fleur-detail .nav-meta,
  .client-profile-page > .navbar .nav-meta,
  .client-work-page > .navbar .nav-meta {
    display: contents;
  }

  .theatre-site .language-switch,
  .fleur-detail .language-switch,
  .client-profile-page > .navbar .language-switch,
  .client-work-page > .navbar .language-switch {
    grid-row: 1;
    grid-column: 2;
    justify-self: end;
  }

  .theatre-site .nav-links,
  .fleur-detail .nav-links,
  .client-profile-page > .navbar .nav-links,
  .client-work-page > .navbar .nav-links {
    display: flex !important;
    grid-row: 2;
    grid-column: 1 / -1;
    justify-content: flex-start;
    gap: .15rem;
    width: 100%;
    margin: 0;
    padding: 0 0 .2rem;
    overflow-x: auto;
    overscroll-behavior-inline: contain;
    scrollbar-width: none;
    white-space: nowrap;
  }

  .theatre-site .nav-links::-webkit-scrollbar,
  .fleur-detail .nav-links::-webkit-scrollbar,
  .client-profile-page > .navbar .nav-links::-webkit-scrollbar,
  .client-work-page > .navbar .nav-links::-webkit-scrollbar {
    display: none;
  }

  .theatre-site .nav-links li a,
  .fleur-detail .nav-links li a,
  .client-profile-page > .navbar .nav-links li a,
  .client-work-page > .navbar .nav-links li a {
    display: block;
    padding: .52rem .7rem;
    font-size: .69rem;
  }
}

/* Work detail pages: a full-width editorial prologue, echoing the production stories. */
.fleur-detail .work-section {
  padding-top: 0;
}

.fleur-detail .work-detail-intro {
  isolation: isolate;
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1.55fr) minmax(18rem, .65fr);
  grid-template-rows: auto 1fr auto;
  column-gap: clamp(3rem, 8vw, 9rem);
  width: 100vw;
  max-width: none;
  min-height: clamp(500px, 64vh, 680px);
  box-sizing: border-box;
  margin: 0 0 clamp(3rem, 7vw, 6rem) calc(50% - 50vw);
  padding: clamp(3.8rem, 8vw, 7.5rem) clamp(1.5rem, 8vw, 9rem);
  overflow: hidden;
  border: 0;
  border-bottom: 12px solid #d1a05f;
  background: linear-gradient(108deg, #21151b 0 65%, #6a2e43 65% 100%);
  color: #f4ecdf;
  text-align: left;
}

.fleur-detail .work-detail-intro::before {
  content: "";
  position: absolute;
  z-index: -1;
  top: -12rem;
  right: -10rem;
  width: 31rem;
  height: 31rem;
  border: 1px solid rgba(224, 178, 115, .72);
  border-radius: 50%;
  box-shadow: 0 0 0 3rem rgba(209, 160, 95, .08), 0 0 0 7rem rgba(209, 160, 95, .04);
}

.fleur-detail .work-detail-intro::after {
  content: "";
  position: absolute;
  z-index: -1;
  right: clamp(1.5rem, 8vw, 9rem);
  bottom: clamp(2rem, 6vw, 5rem);
  width: clamp(5rem, 9vw, 9rem);
  height: 1px;
  background: #d1a05f;
}

.fleur-detail .work-detail-intro .section-label,
.fleur-detail .work-detail-intro h1,
.fleur-detail .work-detail-intro > p:not(.section-label),
.fleur-detail .work-detail-intro .work-back-button {
  position: relative;
  z-index: 1;
}

.fleur-detail .work-detail-intro .section-label {
  grid-column: 1;
  grid-row: 1;
  align-self: start;
  margin: 0;
  color: #d1a05f;
}

.fleur-detail .work-detail-intro h1 {
  grid-column: 1;
  grid-row: 2 / 4;
  align-self: end;
  max-width: 58rem;
  margin: clamp(2rem, 5vw, 4.5rem) 0 0;
  font-size: clamp(5.3rem, 10vw, 10.5rem);
  line-height: .75;
}

.fleur-detail .work-detail-intro h1 em {
  color: #d1a05f;
}

.fleur-detail .work-detail-intro > p:not(.section-label) {
  grid-column: 2;
  grid-row: 2;
  align-self: end;
  max-width: 28rem;
  margin: 0;
  padding: 1.4rem 0 0 1.5rem;
  border-top: 1px solid rgba(244, 236, 223, .34);
  color: rgba(244, 236, 223, .86);
  font-size: clamp(1rem, 1.25vw, 1.18rem);
  line-height: 1.65;
}

.fleur-detail .work-detail-intro .work-back-button {
  grid-column: 2;
  grid-row: 3;
  justify-self: start;
  margin-top: 2rem;
  border-color: #d1a05f;
}

@media (max-width: 1100px) {
  .fleur-detail .work-detail-intro {
    display: block;
    min-height: 0;
    padding-top: 4.5rem;
    padding-bottom: 4.5rem;
    border-bottom-width: 8px;
    background: linear-gradient(160deg, #21151b 0 68%, #6a2e43 68% 100%);
  }

  .fleur-detail .work-detail-intro::before {
    top: auto;
    right: -12rem;
    bottom: -15rem;
  }

  .fleur-detail .work-detail-intro::after {
    display: none;
  }

  .fleur-detail .work-detail-intro h1 {
    margin-top: 2.5rem;
    font-size: clamp(4.3rem, 20vw, 7.2rem);
    line-height: .78;
  }

  .fleur-detail .work-detail-intro > p:not(.section-label) {
    max-width: 34rem;
    margin-top: 2.5rem;
    padding-left: 0;
  }
}

/* Nederlands is de standaardtaal; de bezoeker kan de volledige site ook in
   het Engels bekijken. */
.language-switch {
  display: flex;
}

/* A more editorial opening for the theatre photography archive. */
.fleur-site .photography-intro {
  position: relative;
  isolation: isolate;
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(250px, .65fr);
  grid-template-rows: auto auto auto 1fr;
  column-gap: clamp(3rem, 8vw, 9rem);
  min-height: clamp(500px, 54vw, 680px);
  padding-top: clamp(2.3rem, 5vw, 4.5rem);
  overflow: hidden;
  background: linear-gradient(112deg, #6a2e43 0 66%, #21151b 66% 100%);
}

.fleur-site .photography-intro::before {
  content: "FOTO";
  position: absolute;
  z-index: -1;
  left: -.04em;
  bottom: -.18em;
  color: rgba(244,236,223,.055);
  font: 400 clamp(12rem, 29vw, 29rem)/.7 "Bebas Neue", sans-serif;
  letter-spacing: -.04em;
  pointer-events: none;
}

.fleur-site .photography-intro::after {
  content: "";
  position: absolute;
  z-index: -1;
  top: 0;
  right: 29%;
  width: 8px;
  height: 100%;
  background: #d1a05f;
  transform: skewX(-8deg);
  transform-origin: top;
}

.fleur-site .photography-intro .back-to-work {
  grid-column: 1 / -1;
  width: fit-content;
  margin-bottom: clamp(3.5rem, 7vw, 6rem);
  padding-bottom: .35rem;
  border-bottom: 1px solid rgba(224,178,115,.7);
}

.fleur-site .photography-intro > .eyebrow,
.fleur-site .photography-intro > h1,
.fleur-site .photography-intro > p:last-child {
  grid-column: 1;
}

.fleur-site .photography-intro > .eyebrow {
  align-self: end;
  margin: 0 0 1.1rem;
  color: #e0b273;
}

.fleur-site .photography-intro h1 {
  max-width: 760px;
  font-family: "Bebas Neue", sans-serif;
  font-size: clamp(5rem, 10vw, 10.5rem);
  font-weight: 400;
  letter-spacing: .01em;
  line-height: .76;
}

.fleur-site .photography-intro h1 em {
  color: #e0b273;
  font-weight: 400;
}

.fleur-site .photography-intro > p:last-child {
  align-self: end;
  max-width: 38rem;
  margin-top: clamp(2.2rem, 5vw, 4.5rem);
  padding-left: clamp(1rem, 3vw, 2.5rem);
  border-left: 2px solid #d1a05f;
  color: rgba(244,236,223,.86);
  font-size: clamp(1rem, 1.4vw, 1.2rem);
}

.photography-intro-board {
  grid-column: 2;
  grid-row: 2 / 5;
  align-self: center;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: .75rem;
  padding: clamp(1.5rem, 4vw, 3.2rem);
  border: 1px solid rgba(224,178,115,.45);
  color: #f4ecdf;
  transform: rotate(2deg);
}

.photography-intro-board span {
  display: block;
  width: 100%;
  padding-bottom: .65rem;
  border-bottom: 1px solid rgba(244,236,223,.25);
  font: 400 clamp(2.1rem, 4vw, 4rem)/.9 "Bebas Neue", sans-serif;
  letter-spacing: .04em;
}

.photography-intro-board span:nth-child(2) {
  color: #e0b273;
  transform: translateX(-1rem);
}

.photography-intro-board b {
  align-self: flex-end;
  margin-top: .7rem;
  color: #d1a05f;
  font-size: clamp(3rem, 6vw, 5rem);
  line-height: 1;
}

@media (max-width: 760px) {
  .fleur-site .photography-intro {
    display: block;
    min-height: 0;
    padding-bottom: 4.5rem;
    background: linear-gradient(156deg, #6a2e43 0 78%, #21151b 78% 100%);
  }

  .fleur-site .photography-intro::after {
    top: auto;
    right: 0;
    bottom: 3.2rem;
    width: 42%;
    height: 7px;
    transform: none;
  }

  .fleur-site .photography-intro h1 {
    font-size: clamp(4.8rem, 22vw, 7.4rem);
  }

  .fleur-site .photography-intro > p:last-child {
    margin-top: 2.5rem;
  }

  .photography-intro-board {
    display: none;
  }
}
