:root {
  color-scheme: light;
  --paper: #d8d9d7;
  --ink: #24262b;
  --blue: #3158ff;
  --rule: #c8c9c7;
  --page-inset: 7.08vw;
  --data-column-gap: clamp(24px, 2.15vw, 55px);
  --arrow-shift: 5px;
  --arrow-transition: transform 160ms ease;
  --logo-flip-in: -2.5vw;
  --logo-flip-out: 2.5vw;
  --nav-height: clamp(66px, 4.48vw, 116px);
  --nav-inset-left: 4.3vw;
  --nav-inset-right: 3.12vw;
}

@font-face {
  font-family: "247 Grotesk";
  src: url("https://cdn.prod.website-files.com/67d059a33aa3cd1b877eba64/684831ab90ab6ab2621c4e85_247_GROTESK-Regular.woff2") format("woff2");
  font-style: normal;
  font-weight: 400;
  font-display: swap;
}

@font-face {
  font-family: "247 Grotesk";
  src: url("https://cdn.prod.website-files.com/67d059a33aa3cd1b877eba64/684831abce137e6ad18c4733_247_GROTESK-Medium.woff2") format("woff2");
  font-style: normal;
  font-weight: 500;
  font-display: swap;
}

@font-face {
  font-family: "247 Grotesk";
  src: url("https://cdn.prod.website-files.com/67d059a33aa3cd1b877eba64/684831abb75d57eb6ef80b05_247_GROTESK-Light.woff2") format("woff2");
  font-style: normal;
  font-weight: 300;
  font-display: swap;
}

@font-face {
  font-family: "247 Grotesk";
  src: url("https://cdn.prod.website-files.com/67d059a33aa3cd1b877eba64/684831aba5e532f614fd9822_247_GROTESK-Bold.woff2") format("woff2");
  font-style: normal;
  font-weight: 700;
  font-display: swap;
}

@font-face {
  font-family: "Ntbau";
  src: url("https://cdn.prod.website-files.com/67d059a33aa3cd1b877eba64/67dbda49ee4ab95735491c93_NTBau-Medium.woff") format("woff");
  font-style: normal;
  font-weight: 400;
  font-display: swap;
}

@font-face {
  font-family: "Ntbau";
  src: url("https://cdn.prod.website-files.com/67d059a33aa3cd1b877eba64/67dbda74d072214ec886fb7a_NTBau-Bold.woff") format("woff");
  font-style: normal;
  font-weight: 700;
  font-display: swap;
}

* { box-sizing: border-box; }

html {
  min-width: 320px;
  scroll-behavior: smooth;
  scrollbar-gutter: stable;
}

@supports not (scrollbar-gutter: stable) {
  html { overflow-y: scroll; }
}

body {
  min-height: 100vh;
  margin: 0;
  background: var(--paper);
  color: var(--ink);
  font-family: "247 Grotesk", Arial, Helvetica, sans-serif;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

body:not(.home-page) { padding-top: var(--nav-height); }
body.home-page {
  height: 100vh;
  height: 100svh;
  min-height: 0;
  overflow: hidden;
  overscroll-behavior: none;
}

a { color: inherit; text-decoration: none; }

.site-header {
  position: fixed;
  top: 0;
  right: 0;
  left: 0;
  z-index: 2;
  display: flex;
  height: var(--nav-height);
  min-height: var(--nav-height);
  align-items: center;
  justify-content: space-between;
  padding: 0 var(--nav-inset-right) 0 var(--nav-inset-left);
  border-bottom: 1px solid var(--rule);
  background-color: var(--paper);
}

.brand { display: inline-flex; flex: 0 0 auto; align-items: center; gap: 10px; line-height: 1; white-space: nowrap; }

.brand-mark {
  display: block;
  width: clamp(25px, 1.46vw, 38px);
  height: clamp(25px, 1.46vw, 38px);
  overflow: visible;
  fill: none;
  stroke: var(--blue);
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 2.25;
}

.brand-mark .mark-dot { fill: var(--blue); stroke: none; }
.brand-word { font-family: "247 Grotesk", Arial, sans-serif; font-size: clamp(23px, 1.55vw, 40px); font-weight: 700; letter-spacing: -0.065em; }
.brand-last { letter-spacing: -0.04em; }
.brand sup { position: relative; top: -0.44em; margin-left: 2px; font-size: 0.25em; font-weight: 600; letter-spacing: 0; }

.site-nav { display: flex; flex: 0 0 auto; height: 100%; align-items: stretch; gap: clamp(24px, 2.2vw, 56px); white-space: nowrap; }

.site-nav a {
  position: relative;
  display: flex;
  align-items: center;
  padding: 1px 0 0;
  font-family: "Ntbau", Arial, sans-serif;
  font-size: clamp(14px, 0.82vw, 21px);
  letter-spacing: 0.015em;
  transition: color 160ms ease;
}

.site-nav a:hover,
.site-nav a:focus-visible,
.site-nav a.is-current { color: var(--blue); }

.site-nav a.is-current::after {
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  height: 3px;
  background: var(--blue);
  content: "";
}

.home-page .site-header {
  position: fixed;
  inset: 0 0 auto;
  color: #f2f3f1;
  background-color: #101a20;
  border-bottom-color: rgba(242, 243, 241, 0.12);
}

.anchor-target { scroll-margin-top: var(--nav-height); }

.home-main { width: 100%; height: 100%; }

.home-hero {
  position: relative;
  width: 100%;
  height: 100%;
  min-height: 0;
  overflow: hidden;
  background-color: #101a20;
  background-image:
    radial-gradient(ellipse at 65% 63%, rgba(0, 78, 74, 0.34), transparent 42%),
    radial-gradient(ellipse at 25% 38%, rgba(92, 101, 108, 0.22), transparent 38%),
    linear-gradient(125deg, #101a20 10%, #17262b 55%, #071219 100%);
  color: #f2f3f1;
}

.home-hero-video,
.home-hero-shade {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}

.home-hero-video {
  z-index: 0;
  object-fit: cover;
  filter: brightness(0.68) saturate(0.78);
}

.home-hero-shade {
  z-index: 1;
  pointer-events: none;
  background:
    linear-gradient(180deg, rgba(6, 13, 18, 0.18) 0%, rgba(7, 14, 20, 0.04) 38%, rgba(7, 14, 20, 0.45) 100%),
    linear-gradient(90deg, rgba(7, 13, 19, 0.25), transparent 70%);
}

.home-hero-content {
  position: absolute;
  z-index: 2;
  right: 4.3vw;
  bottom: clamp(108px, 10.8vh, 142px);
  left: 4.3vw;
}

.home-hero-intro {
  margin: 0 0 clamp(30px, 3vw, 54px);
  color: rgba(247, 248, 247, 0.88);
  font-family: "247 Grotesk", Arial, Helvetica, sans-serif;
  font-size: clamp(15px, 0.95vw, 20px);
  font-weight: 500;
  line-height: 1.62;
}

.home-hero-heading {
  width: max-content;
  max-width: 100%;
  margin: 0;
  color: #f3f4f2;
  font-family: "247 Grotesk", Arial, Helvetica, sans-serif;
  font-size: clamp(58px, 8.4vw, 172px);
  font-weight: 700;
  letter-spacing: -0.075em;
  line-height: 0.88;
  text-transform: uppercase;
  white-space: nowrap;
  transform: scaleX(0.82);
  transform-origin: left center;
}

.home-hero-meta {
  position: absolute;
  z-index: 2;
  right: 4.3vw;
  bottom: clamp(16px, 2.2vh, 26px);
  left: 4.3vw;
  display: grid;
  min-height: 54px;
  grid-template-columns: minmax(260px, 1fr) 1.5fr auto;
  align-items: end;
  gap: 20px;
  padding-top: 15px;
  border-top: 1px solid rgba(242, 243, 241, 0.22);
  color: rgba(242, 243, 241, 0.72);
  font-family: "Ntbau", "Courier New", monospace;
  font-size: clamp(9px, 0.54vw, 12px);
  letter-spacing: 0.08em;
  line-height: 1.4;
  text-transform: uppercase;
}

.home-location {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 0;
}

.home-location svg {
  flex: 0 0 16px;
  width: 16px;
  height: 16px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.25;
}

.home-now-playing { margin: 0; text-align: center; }
.home-now-playing span { padding-inline: 8px; color: var(--blue); }
.home-hero-sound { min-width: 154px; }

.home-page .page-content { padding-top: clamp(48px, 3.45vw, 88px); }

body.reels-page { padding-top: 0; background: #101a20; color: #f2f3f1; }
.reels-page .site-header { color: #f2f3f1; background-color: transparent; border-bottom-color: rgba(242, 243, 241, 0.12); }
.reels-main { width: 100%; background: #101a20; }

.reel-card {
  position: relative;
  height: 50vh;
  height: 50svh;
  min-height: min(430px, 50svh);
  overflow: hidden;
  isolation: isolate;
  background: #17242b;
}

.reel-cover-wrap {
  position: absolute;
  z-index: -1;
  inset: 0;
  overflow: hidden;
  background-color: #14242b;
}

.reel-card--movies .reel-cover-wrap {
  background-image: radial-gradient(ellipse at 56% 47%, #50636b 0%, #28383f 65%, #111b22 100%);
}

.reel-card--games .reel-cover-wrap {
  background-image: linear-gradient(120deg, #324a4c 0%, #1c2b34 47%, #10171c 100%);
}

.reel-cover {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  filter: brightness(0.78) saturate(0.78);
}

.reel-cover.is-unavailable { display: none; }

.reel-scrim {
  position: absolute;
  z-index: 0;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(90deg, rgba(5, 12, 17, 0.48), rgba(5, 12, 17, 0.04) 66%), linear-gradient(0deg, rgba(5, 12, 17, 0.5), transparent 58%);
}

.reel-index {
  position: absolute;
  z-index: 1;
  top: clamp(102px, 5.4vw, 140px);
  left: var(--nav-inset-left);
  margin: 0;
  color: rgba(242, 243, 241, 0.78);
  font-family: "Ntbau", Arial, sans-serif;
  font-size: clamp(10px, 0.62vw, 15px);
  font-weight: 700;
  letter-spacing: 0.18em;
  line-height: 1.4;
  text-transform: uppercase;
}

.reel-index span { padding-inline: 8px; }

.reel-title-wrap {
  position: absolute;
  z-index: 1;
  bottom: clamp(42px, 3.6vw, 80px);
  left: var(--nav-inset-left);
  display: flex;
  align-items: center;
  gap: clamp(22px, 1.5vw, 38px);
}

.reel-play {
  display: inline-flex;
  flex: 0 0 auto;
  width: clamp(72px, 4.3vw, 90px);
  height: clamp(72px, 4.3vw, 90px);
  align-items: center;
  justify-content: center;
  border: 1px solid rgba(242, 243, 241, 0.55);
  border-radius: 50%;
  padding: 0;
  color: #f2f3f1;
  cursor: pointer;
  transition: background-color 180ms ease, border-color 180ms ease, transform 180ms ease;
}

.reel-play--primary,
.reel-play--secondary { background: rgba(15, 23, 29, 0.18); }
.reel-card:hover .reel-play,
.reel-card:focus-within .reel-play,
.reel-play:hover,
.reel-play:focus-visible { border-color: var(--blue); background: var(--blue); transform: scale(1.04); }

.reel-play svg {
  width: 27px;
  height: 27px;
  fill: currentColor;
  transform: translateX(1px);
}

.reel-heading-group h1,
.reel-heading-group h2 {
  margin: 0;
  color: #f4f4f2;
  font-family: "Ntbau", "Arial Narrow", Arial, sans-serif;
  font-size: clamp(60px, 4.9vw, 112px);
  font-weight: 700;
  letter-spacing: -0.035em;
  line-height: 0.9;
  text-transform: uppercase;
}

.reel-heading-group p {
  margin: 8px 0 0;
  color: rgba(242, 243, 241, 0.86);
  font-size: clamp(13px, 0.82vw, 18px);
  line-height: 1.4;
}

.reels-site-footer {
  width: 100%;
  margin: 0;
  padding: 0 var(--page-inset) 13px;
  background: var(--paper);
}

.reels-site-footer .footer-meta { margin-top: 0; padding-top: 24px; }

.reel-player[hidden] { display: none; }

.reel-player {
  position: fixed;
  z-index: 20;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #000;
  color: #fff;
}

.reel-player-close {
  position: absolute;
  top: 28px;
  right: 4.3vw;
  display: inline-flex;
  align-items: center;
  gap: 12px;
  border: 0;
  padding: 12px 0;
  background: transparent;
  color: #fff;
  cursor: pointer;
  font-family: "Ntbau", Arial, sans-serif;
  font-size: 13px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

.reel-player-close span { font-family: Arial, sans-serif; font-size: 28px; line-height: 0.8; }
.reel-player-stage { width: min(100vw, 177.78svh); aspect-ratio: 16 / 9; background: #000; }
.reel-player-stage iframe { display: block; width: 100%; height: 100%; border: 0; }
.reel-player-message { position: absolute; top: calc(50% + 10.5vw); left: 24px; right: 24px; margin: 0; color: #aaa; font-size: 14px; text-align: center; }

.page-content {
  width: calc(100% - (2 * var(--page-inset)));
  margin-inline: auto;
  padding-top: clamp(48px, 3.45vw, 88px);
}

.headline {
  max-width: 100%;
  margin: 0;
  font-size: clamp(36px, 3.43vw, 88px);
  font-weight: 400;
  letter-spacing: -0.038em;
  line-height: 1.1;
}

.headline-line { display: block; white-space: nowrap; }
.accent { color: var(--blue); }

.quick-links {
  display: grid;
  width: min(49vw, 1320px);
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin-top: clamp(42px, 3.45vw, 88px);
}

.quick-links a {
  display: inline-flex;
  width: fit-content;
  align-items: center;
  gap: clamp(12px, 0.8vw, 20px);
  padding-block: 4px;
  transition: color 160ms ease;
  font-family: "Ntbau", "Courier New", monospace;
  font-size: clamp(12px, 0.76vw, 20px);
  font-weight: 400;
  letter-spacing: 0.075em;
  line-height: 1.2;
  text-transform: uppercase;
}

.quick-links a:hover,
.quick-links a:focus-visible { color: var(--blue); }

.quick-links a:hover .arrow,
.quick-links a:focus-visible .arrow { transform: translateX(var(--arrow-shift)); }
.arrow { display: inline-block; font-family: Arial, Helvetica, sans-serif; font-size: 1.25em; font-weight: 400; transition: var(--arrow-transition); }

.brand-statement {
  margin: clamp(110px, 8.55vw, 220px) 0 0;
  font-family: "247 Grotesk", Arial, Helvetica, sans-serif;
  font-size: clamp(25px, 1.83vw, 47px);
  font-weight: 500;
  letter-spacing: 0.005em;
  line-height: 1.22;
  text-transform: uppercase;
}

.client-section {
  position: relative;
  left: calc(50% + 0.59vw);
  width: calc(100% + (2 * var(--page-inset)) - var(--nav-inset-left) - var(--nav-inset-right));
  margin-top: clamp(70px, 4.5vw, 115px);
  transform: translateX(-50%);
}

.client-grid {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  column-gap: clamp(16px, 1.2vw, 30px);
  row-gap: clamp(56px, 4.8vw, 122px);
  opacity: 0;
  transform: translateY(clamp(32px, 1.9vw, 48px));
  transition: opacity 750ms ease, transform 750ms cubic-bezier(0.2, 0.65, 0.3, 1);
  will-change: opacity, transform;
}

.client-section.is-visible .client-grid {
  opacity: 1;
  transform: translateY(0);
}

.client-tile {
  min-width: 0;
  opacity: 0;
  transform: translateY(16px);
  transition: opacity 500ms ease, transform 500ms cubic-bezier(0.2, 0.65, 0.3, 1);
  transition-delay: calc(var(--tile-index) * 45ms);
}

.client-section.is-visible .client-tile {
  opacity: 1;
  transform: translateY(0);
}

.client-index {
  display: flex;
  min-height: 1.9em;
  align-items: flex-start;
  justify-content: space-between;
  margin-bottom: clamp(12px, 1.1vw, 28px);
  padding-bottom: 0.58em;
  border-bottom: 1px solid #c9cac8;
  color: #929491;
  font-family: "Ntbau", Arial, sans-serif;
  font-size: clamp(11px, 0.58vw, 15px);
  line-height: 1.2;
}

.client-mark {
  position: relative;
  display: flex;
  width: 100%;
  height: clamp(76px, 5.2vw, 132px);
  align-items: center;
  justify-content: center;
  overflow: hidden;
  border: 0;
  padding: 0;
  background: transparent;
  color: inherit;
  font: inherit;
}

button.client-mark[data-alternate-name] { cursor: pointer; }

.client-logo {
  position: absolute;
  display: block;
  width: 93.6%;
  height: clamp(41px, 3.84vw, 96px);
  max-height: 84%;
  object-fit: contain;
  object-position: center;
  opacity: 1;
  transform: translateY(0);
  transition: opacity 520ms ease, transform 520ms cubic-bezier(0.22, 0.68, 0.25, 1);
}

.client-logo--alternate {
  opacity: 0;
  transform: translateY(var(--logo-flip-in));
}

.client-mark[data-alternate-name]:is(:hover, :focus-visible, .is-swapped) .client-logo--primary {
  opacity: 0;
  transform: translateY(var(--logo-flip-out));
}

.client-mark[data-alternate-name]:is(:hover, :focus-visible, .is-swapped) .client-logo--alternate {
  opacity: 1;
  transform: translateY(0);
}

.client-mark.is-flipping .client-logo--primary {
  animation: client-logo-flip 520ms cubic-bezier(0.22, 0.68, 0.25, 1) both;
}

.client-mark:not([data-alternate-name]):is(:hover, :focus-visible) .client-logo--primary {
  animation: client-logo-flip 520ms cubic-bezier(0.22, 0.68, 0.25, 1) both;
}

@keyframes client-logo-flip {
  0% { opacity: 1; transform: translateY(0); }
  45% { opacity: 0; transform: translateY(var(--logo-flip-out)); }
  55% { opacity: 0; transform: translateY(var(--logo-flip-in)); }
  100% { opacity: 1; transform: translateY(0); }
}

.client-more {
  margin: clamp(64px, 4vw, 102px) 0 0;
  color: #888b8e;
  font-family: "Ntbau", Arial, sans-serif;
  font-size: clamp(12px, 0.6vw, 16px);
  letter-spacing: 0.035em;
  line-height: 1.3;
  text-align: right;
  opacity: 0;
  transform: translateY(16px);
  transition: opacity 500ms ease, transform 500ms ease;
  transition-delay: 620ms;
}

.client-section.is-visible .client-more {
  opacity: 1;
  transform: translateY(0);
}

.experience-section {
  margin-top: clamp(150px, 8.95vw, 230px);
  padding-bottom: 0;
}

.experience-heading,
.awards-heading,
.exhibitions-heading,
.education-heading {
  margin: 0 0 clamp(42px, 2vw, 52px);
  color: #b9bab8;
  font-family: "247 Grotesk", Arial, Helvetica, sans-serif;
  font-size: clamp(48px, 3.43vw, 88px);
  font-weight: 400;
  letter-spacing: -0.045em;
  line-height: 1.1;
}

.experience-table {
  display: flex;
  flex-direction: column;
  gap: clamp(12px, 0.48vw, 13px);
}

.experience-row {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  column-gap: var(--data-column-gap);
  color: #858784;
  font-family: "247 Grotesk", Arial, Helvetica, sans-serif;
  font-size: clamp(15px, 0.78vw, 20px);
  font-weight: 400;
  line-height: 1.35;
}

.experience-row [role="cell"]:first-child {
  color: var(--ink);
}

.awards-section {
  margin-top: clamp(150px, 8.95vw, 230px);
  padding-bottom: clamp(80px, 7vw, 180px);
}

.awards-table {
  display: flex;
  flex-direction: column;
  gap: clamp(12px, 0.48vw, 13px);
}

.awards-row {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  column-gap: var(--data-column-gap);
  color: #858784;
  font-family: "247 Grotesk", Arial, Helvetica, sans-serif;
  font-size: clamp(15px, 0.78vw, 20px);
  font-weight: 400;
  line-height: 1.35;
}

.awards-row [role="cell"]:nth-child(2) { grid-column: 2; }
.awards-row [role="cell"]:nth-child(3) { grid-column: 4; }

.awards-row [role="cell"]:first-child {
  color: var(--ink);
}

.exhibitions-section {
  margin-top: 0;
}

.exhibitions-table {
  display: flex;
  flex-direction: column;
  gap: clamp(12px, 0.48vw, 13px);
}

.exhibitions-row {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  column-gap: var(--data-column-gap);
  color: #858784;
  font-family: "247 Grotesk", Arial, Helvetica, sans-serif;
  font-size: clamp(15px, 0.78vw, 20px);
  font-weight: 400;
  line-height: 1.35;
}

.exhibitions-row [role="cell"]:first-child {
  color: var(--ink);
}

.education-section {
  margin-top: clamp(150px, 7.1vw, 180px);
  padding-bottom: 0;
}

.education-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  align-items: start;
  column-gap: var(--data-column-gap);
  font-family: "247 Grotesk", Arial, Helvetica, sans-serif;
  font-size: clamp(15px, 0.78vw, 20px);
  font-weight: 400;
  line-height: 1.5;
}

.education-list {
  display: flex;
  grid-column: span 2;
  flex-direction: column;
  gap: clamp(24px, 1.35vw, 35px);
}

.education-entry {
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.education-entry p,
.education-label {
  margin: 0;
}

.education-entry p + p,
.education-column li {
  color: #858784;
}

.external-text-link {
  color: inherit;
  text-decoration: none;
  transition: color 160ms ease;
}

.external-text-link:hover,
.external-text-link:focus-visible { color: var(--blue); }

.education-column ul {
  margin: 0;
  padding: 0;
  list-style: none;
}

.education-column li {
  line-height: 1.5;
}

.contact-section {
  width: calc(100% - (2 * var(--page-inset)));
  margin: clamp(150px, 8.9vw, 220px) auto 0;
  padding-bottom: 13px;
}

.contact-top {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  column-gap: var(--data-column-gap);
  align-items: start;
}

.contact-heading {
  grid-column: 1 / span 3;
  margin: 0;
  color: #373c38;
  font-family: "247 Grotesk", Arial, Helvetica, sans-serif;
  font-size: clamp(78px, 10.4vw, 260px);
  font-weight: 400;
  letter-spacing: -0.06em;
  line-height: 0.98;
}

.contact-heading span { display: block; }
.contact-social { grid-column: 4; }

.contact-social-label {
  margin: 0;
  padding-bottom: 18px;
  border-bottom: 1px solid var(--rule);
  color: #858784;
  font-family: "247 Grotesk", Arial, Helvetica, sans-serif;
  font-size: clamp(12px, 0.68vw, 16px);
  letter-spacing: 0.075em;
  line-height: 1.3;
  text-transform: uppercase;
}

.contact-social ul {
  display: flex;
  flex-direction: column;
  gap: 12px;
  margin: 42px 0 0;
  padding: 0;
  list-style: none;
}

.contact-social a {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  color: var(--ink);
  font-family: "Ntbau", Arial, sans-serif;
  font-size: clamp(12px, 0.7vw, 16px);
  letter-spacing: 0.035em;
  line-height: 1.4;
  text-transform: uppercase;
  transition: color 160ms ease;
}

.contact-social a:hover,
.contact-social a:focus-visible,
.contact-email:hover,
.contact-email:focus-visible { color: var(--blue); }

.contact-social a span,
.contact-email span {
  font-family: Arial, Helvetica, sans-serif;
  transition: var(--arrow-transition);
}

.contact-social a:hover span,
.contact-social a:focus-visible span,
.contact-email:hover span,
.contact-email:focus-visible span { transform: translateX(var(--arrow-shift)); }

.contact-layout {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  column-gap: var(--data-column-gap);
  align-items: start;
  margin-top: clamp(140px, 8.8vw, 220px);
}

.contact-prompt-group { grid-column: 1 / span 2; }
.contact-details { grid-column: 4; }

.contact-kicker {
  margin: 0;
  color: #5f6461;
  font-family: "Ntbau", "Courier New", monospace;
  font-size: clamp(12px, 0.64vw, 14px);
  letter-spacing: 0.035em;
  line-height: 1.4;
  text-transform: uppercase;
}

.contact-prompt {
  margin: clamp(58px, 4.5vw, 96px) 0 0;
  color: #373c38;
  font-family: "Ntbau", "Courier New", monospace;
  font-size: clamp(38px, 2.8vw, 72px);
  font-weight: 400;
  letter-spacing: -0.035em;
  line-height: 1.18;
}

.contact-copy {
  max-width: 35em;
  margin: 0;
  color: #737976;
  font-family: "Ntbau", "Courier New", monospace;
  font-size: clamp(12px, 0.68vw, 16px);
  letter-spacing: 0.01em;
  line-height: 1.9;
}

.contact-email {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  margin-top: clamp(80px, 5.3vw, 110px);
  padding-bottom: 5px;
  border-bottom: 1px solid #7e8380;
  color: var(--ink);
  font-family: "Ntbau", "Courier New", monospace;
  font-size: clamp(18px, 1.2vw, 28px);
  line-height: 1.3;
  white-space: nowrap;
  transition: color 160ms ease;
}

.contact-email span { font-family: Arial, Helvetica, sans-serif; }

.footer-meta {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  align-items: center;
  column-gap: var(--data-column-gap);
  margin-top: clamp(90px, 6.5vw, 160px);
  padding-top: clamp(24px, 2.3vw, 48px);
  padding-bottom: 0;
}

.footer-legal { grid-column: 1 / span 2; }

.footer-copyright,
.footer-legal-links {
  margin: 0;
  color: #5e6461;
  font-family: "Ntbau", Arial, sans-serif;
  font-size: clamp(11px, 0.64vw, 14px);
  letter-spacing: 0.025em;
  line-height: 1.4;
  text-transform: uppercase;
}

.footer-legal-links {
  display: flex;
  gap: 20px;
  margin-top: 9px;
  text-transform: none;
}

.footer-legal-links a { transition: color 160ms ease; }
.footer-legal-links a:hover,
.footer-legal-links a:focus-visible { color: var(--blue); }

.footer-actions {
  display: flex;
  grid-column: 3 / span 2;
  width: min(20vw, 390px);
  align-items: center;
  justify-self: end;
  justify-content: space-between;
}

.footer-sound {
  display: inline-flex;
  min-width: 146px;
  height: 36px;
  align-items: center;
  justify-content: center;
  gap: 9px;
  border: 0;
  padding-inline: 14px;
  background: #050505;
  color: #fff;
  cursor: pointer;
  font-family: "Ntbau", Arial, sans-serif;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.09em;
  line-height: 1;
  text-transform: uppercase;
  transition: background-color 160ms ease;
}

.footer-sound.is-on { background: var(--blue); }

.footer-sound svg {
  display: block;
  width: 15px;
  height: 15px;
  fill: none;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 1.7;
}

.footer-sound .sound-waves { display: none; }
.footer-sound.is-on .sound-mute { display: none; }
.footer-sound.is-on .sound-waves { display: block; }

.footer-top {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  color: #5e6461;
  font-family: "Ntbau", Arial, sans-serif;
  font-size: clamp(11px, 0.64vw, 14px);
  letter-spacing: 0.04em;
  line-height: 1.4;
  text-transform: uppercase;
  transition: color 160ms ease;
}

.footer-top span {
  font-family: Arial, Helvetica, sans-serif;
  font-size: 1.35em;
  transition: var(--arrow-transition);
}

.footer-top:hover,
.footer-top:focus-visible { color: var(--blue); }
.footer-top:hover span,
.footer-top:focus-visible span { transform: translateX(var(--arrow-shift)); }

.legal-page {
  width: calc(100% - (2 * var(--page-inset)));
  margin-inline: auto;
  padding-block: clamp(64px, 6vw, 120px) 0;
}

.legal-detail-page {
  width: calc(100% - (2 * var(--page-inset)));
  padding-top: clamp(48px, 3vw, 64px);
}

.legal-page-nav {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  padding-bottom: 18px;
  border-bottom: 1px solid var(--rule);
}

.legal-content-column {
  width: min(100%, 1050px);
  margin-inline: auto;
}

.legal-breadcrumb {
  margin: 0;
  color: #858784;
  font-family: "Ntbau", "Courier New", monospace;
  font-size: 13px;
  letter-spacing: 0.075em;
  line-height: 1.4;
  text-transform: uppercase;
}

.legal-breadcrumb span { margin-inline: 10px; }

.legal-page-links {
  display: flex;
  align-items: center;
  gap: 18px;
  color: #858784;
  font-size: 14px;
  line-height: 1.4;
}

.legal-page-links a { transition: color 160ms ease; }
.legal-page-links a.is-current { color: var(--ink); }
.legal-page-links a:hover,
.legal-page-links a:focus-visible { color: var(--blue); }

.legal-detail-page .legal-heading {
  margin-top: clamp(56px, 5vw, 96px);
  color: var(--ink);
  font-size: clamp(72px, 5.5vw, 120px);
  letter-spacing: -0.045em;
  line-height: 1.05;
}

.legal-detail-page .legal-updated { margin-top: 18px; }
.legal-detail-page .legal-copy { max-width: 900px; margin-top: clamp(64px, 6vw, 100px); }

.credits-page .legal-intro {
  max-width: 900px;
  margin: 18px 0 0;
  color: #858784;
  font-family: "Ntbau", "Courier New", monospace;
  font-size: clamp(15px, 1vw, 20px);
  letter-spacing: 0.025em;
  line-height: 1.55;
}

.credits-table {
  width: 100%;
  max-width: 1050px;
  margin-top: clamp(64px, 6vw, 100px);
  border-collapse: collapse;
  table-layout: fixed;
}

.credits-table th {
  padding: 0 18px 17px 0;
  border-bottom: 1px solid var(--ink);
  color: var(--ink);
  font-family: "Ntbau", "Courier New", monospace;
  font-size: clamp(12px, 0.68vw, 16px);
  font-weight: 700;
  letter-spacing: 0.1em;
  line-height: 1.4;
  text-align: left;
  text-transform: uppercase;
}

.credits-table th:nth-child(1) { width: 8%; }
.credits-table th:nth-child(2) { width: 58%; }
.credits-table th:nth-child(3) { width: 16%; }
.credits-table th:nth-child(4) { width: 18%; }

.credits-table td {
  padding: 16px 18px 17px 0;
  border-bottom: 1px solid var(--rule);
  color: var(--ink);
  font-size: clamp(15px, 0.88vw, 18px);
  line-height: 1.45;
  text-align: left;
  vertical-align: top;
}

.credits-table td:first-child { white-space: nowrap; }
.credits-table td:nth-child(1),
.credits-table td:nth-child(3),
.credits-table td:nth-child(4) { color: #858784; }
.credits-table td::before { display: none; }

.legal-back {
  margin-top: clamp(64px, 6vw, 100px);
  padding-top: 26px;
  border-top: 1px solid var(--rule);
}

.legal-back-link {
  display: inline-flex;
  align-items: center;
  gap: 14px;
  color: #5e6461;
  font-family: "Ntbau", Arial, sans-serif;
  font-size: 14px;
  line-height: 1.4;
  transition: color 160ms ease;
}

.legal-back-link span {
  font-family: Arial, Helvetica, sans-serif;
  transition: var(--arrow-transition);
}

.legal-back-link:hover,
.legal-back-link:focus-visible { color: var(--blue); }
.legal-back-link:hover span,
.legal-back-link:focus-visible span { transform: translateX(calc(-1 * var(--arrow-shift))); }

.legal-site-footer {
  width: calc(100% - (2 * var(--page-inset)));
  margin-inline: auto;
  padding-bottom: 13px;
}

.home-page .legal-site-footer { margin-top: 0; }
.home-page .legal-site-footer .footer-meta { margin-top: 0; padding-top: 24px; }

.legal-heading {
  margin: 0;
  color: #b9bab8;
  font-family: "247 Grotesk", Arial, Helvetica, sans-serif;
  font-size: clamp(48px, 5.2vw, 112px);
  font-weight: 400;
  letter-spacing: -0.045em;
  line-height: 1.05;
}

.legal-intro {
  max-width: 900px;
  margin: 32px 0 0;
  font-size: clamp(18px, 1.35vw, 26px);
  line-height: 1.45;
}

.legal-updated {
  margin: 22px 0 0;
  color: #858784;
  font-family: "Ntbau", Arial, sans-serif;
  font-size: 14px;
  letter-spacing: 0.025em;
}

.legal-copy {
  max-width: 780px;
  margin-top: clamp(48px, 5vw, 90px);
  font-size: clamp(15px, 0.86vw, 18px);
  line-height: 1.65;
}

.legal-copy section + section { margin-top: 34px; }
.legal-copy h2 { margin: 0 0 10px; font-size: 1.08em; font-weight: 500; }
.legal-copy p { margin: 0; color: #686d6a; }
.legal-copy p + p { margin-top: 12px; }
.legal-copy ul { margin: 12px 0 0; padding-left: 1.25em; color: #686d6a; }
.legal-copy li + li { margin-top: 5px; }
.legal-copy a { text-decoration: underline; text-underline-offset: 3px; }
.legal-copy a:hover,
.legal-copy a:focus-visible { color: var(--blue); }

.anchor-target { position: absolute; top: 0; left: 0; width: 1px; height: 1px; overflow: hidden; }
.menu-toggle { display: none; }

:focus-visible { outline: 2px solid var(--blue); outline-offset: 5px; }

@media (max-width: 1800px) and (min-width: 761px) {
  .headline-line { white-space: normal; }
  .headline-line:not(:first-child) { display: inline; }
  .headline-line:not(:first-child)::after { content: " "; }
}

@media (min-width: 761px) and (max-width: 1150px) {
  .contact-top { grid-template-columns: minmax(0, 1fr) minmax(0, 0.68fr); }
  .contact-heading { grid-column: 1; font-size: clamp(78px, 10vw, 118px); }
  .contact-social { grid-column: 2; }
  .contact-layout { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .contact-details { grid-column: 2; }
  .contact-prompt-group { grid-column: 1; }
  .contact-layout { margin-top: clamp(120px, 12vw, 150px); }
  .contact-prompt { font-size: clamp(36px, 4.6vw, 54px); }
  .contact-email { gap: 8px; font-size: clamp(14px, 1.5vw, 17px); }
  .footer-meta { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .footer-legal { grid-column: 1; }
  .footer-actions { grid-column: 2; width: 100%; gap: 20px; }
  .footer-copyright,
  .footer-legal-links,
  .footer-top { font-size: 11px; }
}

@media (max-width: 760px) {
  :root {
    --page-inset: 24px;
    --logo-flip-in: -58px;
    --logo-flip-out: 58px;
    --nav-height: 70px;
    --nav-inset-left: 24px;
    --nav-inset-right: 24px;
  }
  .site-header { padding-inline: var(--nav-inset-right); }
  .home-page .menu-toggle { color: #f2f3f1; }
  .home-page .site-nav { color: #f2f3f1; border-color: rgba(242, 243, 241, 0.16); background: rgba(9, 17, 22, 0.97); }
  .reels-page .menu-toggle { color: #f2f3f1; }
  .reels-page .site-nav { color: #f2f3f1; border-color: rgba(242, 243, 241, 0.16); background: #101a20; }
  .brand { gap: 8px; }
  .brand-mark { width: 25px; height: 25px; }
  .brand-word { font-size: 25px; }

  .home-hero { min-height: 0; }
  .home-hero-content { right: 24px; bottom: clamp(126px, 16vh, 150px); left: 24px; }
  .home-hero-intro { margin-bottom: 30px; font-size: 15px; }
  .home-hero-heading {
    width: 100%;
    font-size: clamp(52px, 13.6vw, 96px);
    line-height: 0.9;
    white-space: normal;
    transform: none;
  }
  .home-hero-meta {
    right: 24px;
    bottom: 18px;
    left: 24px;
    min-height: 76px;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 10px 12px;
    padding-top: 12px;
    font-size: 9px;
  }
  .home-location { grid-column: 1; grid-row: 1; gap: 7px; }
  .home-location svg { flex-basis: 14px; width: 14px; height: 14px; }
  .home-now-playing { grid-column: 1 / -1; grid-row: 2; text-align: left; }
  .home-hero-sound { grid-column: 2; grid-row: 1; min-width: 132px; }

  .reel-card { min-height: min(360px, 50svh); }
  .reel-index { top: 94px; left: 24px; font-size: 10px; }
  .reel-title-wrap { bottom: 32px; left: 24px; gap: 16px; }
  .reel-play { width: 64px; height: 64px; }
  .reel-play svg { width: 22px; height: 22px; }
  .reel-heading-group h1,
  .reel-heading-group h2 { font-size: clamp(46px, 12.4vw, 72px); }
  .reel-heading-group p { max-width: 19em; margin-top: 6px; font-size: 12px; }
  .reel-player-close { top: 14px; right: 20px; }
  .reel-player-stage { width: 100vw; }
  .reel-player-message { top: calc(50% + 29vw); font-size: 12px; }
  .reels-site-footer { padding-inline: 24px; }

  .menu-toggle {
    display: flex;
    width: 42px;
    height: 42px;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 6px;
    border: 0;
    background: transparent;
    color: var(--ink);
    cursor: pointer;
  }

  .menu-toggle span { display: block; width: 22px; height: 2px; background: currentColor; transition: transform 160ms ease; }
  .menu-toggle[aria-expanded="true"] span:first-child { transform: translateY(4px) rotate(45deg); }
  .menu-toggle[aria-expanded="true"] span:last-child { transform: translateY(-4px) rotate(-45deg); }

  .site-nav {
    position: absolute;
    top: calc(100% + 1px);
    right: 0;
    left: 0;
    display: none;
    height: auto;
    flex-direction: column;
    gap: 0;
    padding: 8px 24px 16px;
    border-bottom: 1px solid var(--rule);
    background: var(--paper);
  }

  .site-nav.is-open { display: flex; }
  .site-nav a { min-height: 48px; font-size: 16px; }
  .site-nav a.is-current::after { right: auto; width: 38px; height: 2px; }
  .page-content { padding-top: 50px; }
  .headline { font-size: clamp(35px, 7.6vw, 56px); letter-spacing: -0.042em; line-height: 1.12; }
  .headline-line { display: inline; white-space: normal; }
  .headline-line::after { content: " "; }
  .quick-links { grid-template-columns: 1fr; gap: 17px; margin-top: 42px; }
  .quick-links a { font-size: 13px; }
  .brand-statement { margin-top: 96px; font-size: clamp(25px, 6.5vw, 33px); line-height: 1.2; }
  .desktop-break { display: none; }

  .client-section { left: 50%; width: 100%; margin-top: 76px; }
  .client-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 18px; row-gap: 48px; }
  .client-index { margin-bottom: 14px; font-size: 12px; }
  .client-mark { height: 92px; }
  .client-logo { width: 91.2%; height: 58px; max-height: 84%; }
  .client-more { margin-top: 70px; font-size: 12px; }

  .experience-section { margin-top: 110px; padding-bottom: 0; }
  .experience-heading,
  .awards-heading,
  .exhibitions-heading,
  .education-heading { margin-bottom: 32px; font-size: clamp(42px, 9vw, 62px); }
  .experience-table { gap: 0; }
  .experience-row {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    column-gap: 16px;
    row-gap: 5px;
    padding-block: 12px;
    border-bottom: 1px solid var(--rule);
    font-size: 14px;
  }

  .awards-section { margin-top: 110px; padding-bottom: 80px; }
  .awards-table { gap: 10px; }
  .awards-row {
    grid-template-columns: 1.1fr 1.15fr 0.5fr;
    column-gap: 12px;
    font-size: 12px;
    line-height: 1.3;
  }
  .awards-row [role="cell"]:nth-child(2) { grid-column: 2; }
  .awards-row [role="cell"]:nth-child(3) { grid-column: 3; }

  .exhibitions-row {
    grid-template-columns: minmax(0, 1fr) auto;
    column-gap: 12px;
    row-gap: 3px;
    font-size: 12px;
    line-height: 1.3;
  }
  .exhibitions-row [role="cell"]:nth-child(2) { grid-row: 2; grid-column: 1; }
  .exhibitions-row [role="cell"]:nth-child(3) { grid-row: 2; grid-column: 2; }
  .exhibitions-row [role="cell"]:nth-child(4) { grid-row: 1; grid-column: 2; text-align: right; }
  .exhibitions-row [role="cell"]:empty { display: none; }

  .education-section { margin-top: 110px; padding-bottom: 0; }
  .education-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 18px; font-size: 13px; }
  .education-list { grid-column: 1 / -1; gap: 22px; margin-bottom: 34px; }
  .education-column li { line-height: 1.55; }

  .contact-section { width: calc(100% - 48px); margin-top: 110px; padding-bottom: 13px; }
  .contact-top { grid-template-columns: minmax(0, 1fr); row-gap: 44px; }
  .contact-heading { grid-column: 1; font-size: clamp(66px, 14vw, 108px); line-height: 0.98; }
  .contact-social { grid-column: 1; max-width: 320px; }
  .contact-social ul { margin-top: 28px; gap: 11px; }
  .contact-layout { grid-template-columns: minmax(0, 1fr); row-gap: 0; }
  .contact-layout { margin-top: 100px; }
  .contact-prompt-group,
  .contact-details { grid-column: 1; }
  .contact-prompt { margin-top: 44px; font-size: clamp(36px, 8vw, 52px); }
  .contact-details { margin-top: 64px; }
  .contact-copy { max-width: 34em; font-size: 12px; }
  .contact-email { margin-top: 38px; font-size: 17px; }

  .footer-meta { grid-template-columns: minmax(0, 1fr); row-gap: 28px; margin-top: 90px; padding-top: 24px; padding-bottom: 0; }
  .footer-legal,
  .footer-actions { grid-column: 1; }
  .footer-actions { width: 100%; gap: 16px; }
  .footer-copyright,
  .footer-legal-links,
  .footer-top { font-size: 10px; }
  .footer-legal-links { gap: 14px; }
  .footer-sound { min-width: 132px; height: 34px; font-size: 10px; }
  .legal-detail-page { width: calc(100% - 48px); padding-top: 36px; }
  .legal-page-nav { align-items: flex-start; flex-direction: column; gap: 14px; }
  .legal-page-links { gap: 14px; font-size: 13px; }
  .legal-detail-page .legal-heading { margin-top: 48px; font-size: clamp(48px, 12vw, 72px); }
  .legal-detail-page .legal-updated { margin-top: 14px; }
  .legal-detail-page .legal-copy { margin-top: 56px; }
  .credits-page .legal-intro { margin-top: 18px; font-size: 14px; }
  .credits-table { margin-top: 56px; }
  .credits-table thead { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
  .credits-table,
  .credits-table tbody,
  .credits-table tr,
  .credits-table td { display: block; width: 100%; }
  .credits-table tr {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 12px 16px;
    padding-block: 13px;
    border-bottom: 1px solid var(--rule);
  }
  .credits-table td { padding: 0; border: 0; font-size: 12px; }
  .credits-table td:first-child { white-space: normal; }
  .credits-table td::before {
    content: attr(data-label);
    display: block;
    margin-bottom: 4px;
    color: #858784;
    font-family: "Ntbau", "Courier New", monospace;
    font-size: 9px;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
  }
  .credits-table td:nth-child(1) { grid-column: 1; grid-row: 1; }
  .credits-table td:nth-child(2) { grid-column: 1 / -1; grid-row: 2; }
  .credits-table td:nth-child(3) { grid-column: 1; grid-row: 3; }
  .credits-table td:nth-child(4) { grid-column: 2; grid-row: 3; }
  .legal-back { margin-top: 56px; padding-top: 20px; }
  .legal-back-link { font-size: 13px; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { transition-duration: 0.01ms !important; }

  .client-grid,
  .client-tile,
  .client-more {
    opacity: 1;
    transform: none;
  }
}