:root {
  --black: #050505;
  --charcoal: #111111;
  --ivory: #f2eee7;
  --muted: #aaa49b;
  --gold: #d2a74c;
  --line: rgba(210, 167, 76, .38);
  --side: clamp(24px, 6vw, 96px);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; background: var(--black); }
body {
  margin: 0;
  color: var(--ivory);
  background: var(--black);
  font-family: "Avenir Next", Avenir, "Helvetica Neue", sans-serif;
  -webkit-font-smoothing: antialiased;
}

a { color: inherit; text-decoration: none; }
img { max-width: 100%; height: auto; }
.screen-reader-text {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}
.screen-reader-text:focus {
  z-index: 100000;
  top: 12px;
  left: 12px;
  width: auto;
  height: auto;
  padding: 12px 16px;
  clip: auto;
  color: #050505;
  background: #f2eee7;
}

.site-header {
  position: fixed;
  z-index: 20;
  inset: 0 0 auto;
  height: 88px;
  padding: 0 var(--side);
  display: flex;
  align-items: center;
  justify-content: space-between;
  mix-blend-mode: difference;
  color: #fff;
}

.wordmark {
  display: flex;
  align-items: center;
  gap: 13px;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: .24em;
}

.wordmark-mark {
  width: 34px;
  height: 34px;
  position: relative;
  display: block;
  overflow: hidden;
  border: 1px solid rgba(255,255,255,.6);
  background: #050505;
}
.wordmark-mark img {
  position: absolute;
  width: 51px;
  max-width: none;
  left: 50%;
  top: -2px;
  transform: translateX(-50%);
}

.primary-nav .menu { margin: 0; padding: 0; display: flex; align-items: center; gap: clamp(20px, 3vw, 48px); list-style: none; }
.primary-nav a {
  font-size: 11px;
  font-weight: 600;
  letter-spacing: .16em;
  text-transform: uppercase;
}
.primary-nav .menu > li:last-child a {
  border: 1px solid rgba(255,255,255,.52);
  padding: 13px 18px;
}
.nav-cta {
  border: 1px solid rgba(255,255,255,.52);
  padding: 13px 18px;
}

.site-header:not(.site-header--transparent) {
  mix-blend-mode: normal;
  background: rgba(5,5,5,.88);
  backdrop-filter: blur(14px);
}

.scrub { height: 500vh; position: relative; background: #000; }
.scrub-sticky {
  position: sticky;
  top: 0;
  height: 100svh;
  overflow: hidden;
  background: #000;
}

#hero-canvas {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  display: block;
}

.canvas-shade {
  position: absolute;
  inset: 0;
  background:
    radial-gradient(circle at 50% 48%, transparent 20%, rgba(0,0,0,.07) 64%, rgba(0,0,0,.55) 125%),
    linear-gradient(180deg, rgba(0,0,0,.25), transparent 25%, transparent 76%, rgba(0,0,0,.35));
  pointer-events: none;
}

.loading {
  position: absolute;
  z-index: 5;
  inset: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 14px;
  background: #050505;
  transition: opacity .7s ease, visibility .7s ease;
}
.loading.is-ready { opacity: 0; visibility: hidden; }
.loading-line {
  width: min(240px, 58vw);
  height: 1px;
  background: rgba(255,255,255,.16);
}
#loading-progress {
  display: block;
  width: 0;
  height: 100%;
  background: var(--gold);
  transition: width .2s ease;
}
.loading-label {
  color: var(--muted);
  font-size: 9px;
  letter-spacing: .3em;
  text-transform: uppercase;
}

.hero-copy {
  position: absolute;
  z-index: 2;
  left: 50%;
  top: 54%;
  width: min(900px, calc(100% - 48px));
  transform: translate(-50%, -50%);
  text-align: center;
  filter: drop-shadow(0 4px 22px rgba(0,0,0,.95));
  will-change: opacity, transform, filter;
}
.hero-copy::before {
  content: "";
  position: absolute;
  z-index: -1;
  inset: -80px -9vw;
  background: radial-gradient(ellipse, rgba(0,0,0,.68) 0%, rgba(0,0,0,.34) 38%, transparent 72%);
  pointer-events: none;
}

.eyebrow {
  margin: 0 0 24px;
  color: var(--gold);
  font-size: 10px;
  font-weight: 600;
  letter-spacing: .34em;
  text-transform: uppercase;
}

.hero-copy h1 {
  margin: 0;
  display: flex;
  justify-content: center;
  gap: .18em;
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(62px, 9.8vw, 158px);
  font-weight: 400;
  line-height: .78;
  letter-spacing: -.055em;
  text-shadow:
    0 3px 2px rgba(0,0,0,.9),
    0 8px 26px rgba(0,0,0,.95),
    0 0 58px rgba(0,0,0,.8);
}
.hero-copy .gold {
  color: var(--gold);
  font-style: italic;
  text-shadow:
    0 3px 2px rgba(0,0,0,.95),
    0 8px 28px rgba(0,0,0,1),
    0 0 34px rgba(210,167,76,.2);
}
.disciplines {
  margin: clamp(28px, 4vw, 48px) 0 0;
  font-size: clamp(10px, 1vw, 14px);
  font-weight: 500;
  letter-spacing: .38em;
  text-transform: uppercase;
}
.disciplines i { color: var(--gold); font-style: normal; padding: 0 .55em; }
.hero-intro {
  margin: 17px auto 0;
  color: rgba(242,238,231,.7);
  font-family: Georgia, serif;
  font-size: clamp(15px, 1.5vw, 22px);
  font-style: italic;
}

.scroll-cue {
  position: absolute;
  z-index: 2;
  left: 50%;
  bottom: 30px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 12px;
  transform: translateX(-50%);
  color: rgba(255,255,255,.62);
  font-size: 8px;
  font-weight: 600;
  letter-spacing: .3em;
  text-transform: uppercase;
}
.scroll-cue i {
  display: block;
  width: 1px;
  height: 38px;
  background: linear-gradient(var(--gold), transparent);
  animation: pulse 1.8s ease-in-out infinite;
}
@keyframes pulse {
  0%,100% { opacity: .35; transform: scaleY(.65); transform-origin: top; }
  50% { opacity: 1; transform: scaleY(1); transform-origin: top; }
}

.chapter-copy {
  position: absolute;
  z-index: 2;
  left: var(--side);
  bottom: clamp(60px, 9vh, 120px);
  opacity: 0;
  transform: translateY(30px);
  will-change: opacity, transform;
}
.chapter-copy p {
  margin: 0 0 12px;
  color: var(--gold);
  font-size: 10px;
  letter-spacing: .3em;
  text-transform: uppercase;
}
.chapter-copy strong {
  font-family: Georgia, serif;
  font-size: clamp(38px, 5.2vw, 80px);
  font-weight: 400;
  line-height: .97;
}

.reveal {
  position: relative;
  padding: clamp(110px, 14vw, 220px) var(--side);
  background:
    radial-gradient(circle at 76% 0%, rgba(118,78,25,.18), transparent 30%),
    #090909;
  border-top: 1px solid rgba(210,167,76,.2);
}
.reveal-inner { max-width: 1440px; margin: 0 auto; }
.reveal h2, .about h2, .contact h2 {
  margin: 0;
  max-width: 1100px;
  font-family: Georgia, serif;
  font-size: clamp(48px, 7.4vw, 118px);
  font-weight: 400;
  line-height: .95;
  letter-spacing: -.045em;
}
.reveal h2 em, .contact h2 em { color: var(--gold); font-weight: 400; }
.lead {
  width: min(620px, 100%);
  margin: 48px 0 100px auto;
  color: #b7b1a7;
  font-family: Georgia, serif;
  font-size: clamp(20px, 2vw, 30px);
  line-height: 1.55;
}

.service-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  border-top: 1px solid var(--line);
}
.service-grid article {
  min-height: 410px;
  padding: 38px 32px 34px;
  display: flex;
  flex-direction: column;
  border-right: 1px solid var(--line);
  transition: background .4s ease;
}
.service-grid article:last-child { border-right: 0; }
.service-grid article:hover { background: rgba(210,167,76,.06); }
.service-grid article > span {
  color: var(--gold);
  font-size: 10px;
  letter-spacing: .2em;
}
.service-grid h3 {
  margin: 70px 0 20px;
  font-family: Georgia, serif;
  font-size: clamp(34px, 3.2vw, 52px);
  font-weight: 400;
}
.service-grid p { color: #9f9a92; font-size: 15px; line-height: 1.8; }
.service-grid a {
  margin-top: auto;
  color: #ded8ce;
  font-size: 10px;
  font-weight: 600;
  letter-spacing: .18em;
  text-transform: uppercase;
}
.service-grid b { margin-left: 8px; color: var(--gold); font-size: 15px; }

.experience {
  padding: clamp(110px, 14vw, 210px) var(--side);
  background: #111;
}
.experience-heading {
  max-width: 1440px;
  margin: 0 auto clamp(70px, 9vw, 130px);
}
.experience-heading h2 {
  margin: 0;
  font-family: Georgia, serif;
  font-size: clamp(48px, 7vw, 108px);
  font-weight: 400;
  line-height: .95;
  letter-spacing: -.045em;
}
.experience-heading h2 em { color: var(--gold); font-weight: 400; }
.experience-steps {
  max-width: 1440px;
  margin: 0 auto;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  list-style: none;
  border-top: 1px solid var(--line);
}
.experience-steps li {
  min-height: 275px;
  padding: 28px;
  border-right: 1px solid var(--line);
}
.experience-steps li:last-child { border-right: 0; }
.experience-steps span { color: var(--gold); font-size: 10px; letter-spacing: .22em; }
.experience-steps strong { display: block; margin-top: 65px; font: 400 clamp(28px, 3vw, 44px)/1 Georgia, serif; }
.experience-steps p { color: #9f9a92; line-height: 1.7; }

.portfolio {
  padding: clamp(110px, 14vw, 210px) var(--side);
  background: #efebe4;
  color: #111;
}
.portfolio-heading {
  max-width: 1440px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: minmax(0, 1.7fr) minmax(280px, .7fr);
  align-items: end;
  gap: clamp(40px, 8vw, 130px);
}
.portfolio-heading h2 {
  margin: 0;
  font-family: Georgia, serif;
  font-size: clamp(50px, 7.2vw, 112px);
  font-weight: 400;
  line-height: .94;
  letter-spacing: -.05em;
}
.portfolio-heading h2 em { color: #9c711d; font-weight: 400; }
.portfolio-heading > p {
  margin: 0 0 8px;
  color: #66615a;
  font-family: Georgia, serif;
  font-size: clamp(17px, 1.5vw, 22px);
  line-height: 1.6;
}
.portfolio-filters {
  max-width: 1440px;
  margin: clamp(60px, 8vw, 110px) auto 28px;
  padding: 0 0 18px;
  display: flex;
  gap: 28px;
  overflow-x: auto;
  border-bottom: 1px solid rgba(17,17,17,.2);
  scrollbar-width: none;
}
.portfolio-filters::-webkit-scrollbar { display: none; }
.portfolio-filters button {
  flex: 0 0 auto;
  padding: 0 0 7px;
  border: 0;
  border-bottom: 1px solid transparent;
  color: #77716a;
  background: transparent;
  font: inherit;
  font-size: 10px;
  font-weight: 600;
  letter-spacing: .17em;
  text-transform: uppercase;
  cursor: pointer;
  transition: color .25s ease, border-color .25s ease;
}
.portfolio-filters button:hover,
.portfolio-filters button:focus-visible,
.portfolio-filters button.is-active {
  color: #8e6518;
  border-color: #9c711d;
}

.portfolio-grid {
  max-width: 1440px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  grid-auto-flow: dense;
  gap: clamp(12px, 1.5vw, 24px);
}
.portfolio-card {
  position: relative;
  grid-column: span 4;
  min-height: 420px;
  padding: 0;
  overflow: hidden;
  border: 0;
  background: #171717;
  color: #fff;
  text-align: left;
  cursor: zoom-in;
  isolation: isolate;
  transition: opacity .35s ease, transform .35s ease;
}
.portfolio-card--feature { grid-column: span 8; min-height: 620px; }
.portfolio-card--landscape { grid-column: span 7; min-height: 460px; }
.portfolio-card--wide { grid-column: span 5; min-height: 460px; }
.portfolio-card--portrait { min-height: 620px; }
.portfolio-card--square { min-height: 420px; }
.portfolio-card--cinema {
  grid-column: span 6;
  min-height: 0;
  aspect-ratio: 16 / 10;
}
.portfolio-card--cast img { object-position: center 43%; }
.portfolio-card--pittsburgh img { object-position: center center; }
.portfolio-card.is-hidden { display: none; }
.portfolio-card img {
  position: absolute;
  inset: 0;
  z-index: -2;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .8s cubic-bezier(.2,.65,.3,1), filter .5s ease;
}
.portfolio-card::after {
  content: "";
  position: absolute;
  z-index: -1;
  inset: 0;
  background: linear-gradient(180deg, transparent 40%, rgba(0,0,0,.78));
  transition: background .4s ease;
}
.portfolio-card:hover img,
.portfolio-card:focus-visible img { transform: scale(1.035); }
.portfolio-card:hover::after,
.portfolio-card:focus-visible::after {
  background: linear-gradient(180deg, rgba(0,0,0,.05) 30%, rgba(0,0,0,.86));
}
.portfolio-card:focus-visible { outline: 3px solid var(--gold); outline-offset: 3px; }
.portfolio-meta {
  position: absolute;
  inset: auto 0 0;
  padding: clamp(22px, 3vw, 40px);
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.portfolio-meta small {
  color: #d5a84e;
  font-size: 9px;
  font-weight: 600;
  letter-spacing: .23em;
  text-transform: uppercase;
}
.portfolio-meta strong {
  font-family: Georgia, serif;
  font-size: clamp(28px, 3vw, 48px);
  font-weight: 400;
}
.portfolio-footer {
  max-width: 1440px;
  margin: 54px auto 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 30px;
  color: #716c64;
  font-size: 13px;
}
.portfolio-footer a {
  padding-bottom: 8px;
  border-bottom: 1px solid #9c711d;
  color: #795411;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .16em;
  text-transform: uppercase;
}
.portfolio-footer a span { margin-left: 8px; font-size: 14px; }

.lightbox {
  width: 100vw;
  max-width: none;
  height: 100svh;
  max-height: none;
  margin: 0;
  padding: 0;
  overflow: hidden;
  border: 0;
  background: #050505;
  color: #fff;
}
.lightbox::backdrop { background: rgba(0,0,0,.92); }
.lightbox[open] {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(250px, 360px);
}
.lightbox-image-wrap {
  min-width: 0;
  min-height: 0;
  display: grid;
  place-items: center;
  padding: clamp(20px, 4vw, 60px);
}
.lightbox-image-wrap img {
  display: block;
  max-width: 100%;
  max-height: calc(100svh - 80px);
  object-fit: contain;
}
.lightbox-caption {
  padding: 90px 45px 55px;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  border-left: 1px solid rgba(210,167,76,.25);
}
.lightbox-caption small {
  color: var(--gold);
  font-size: 9px;
  letter-spacing: .22em;
  text-transform: uppercase;
}
.lightbox-caption h3 {
  margin: 13px 0 0;
  font-family: Georgia, serif;
  font-size: clamp(34px, 4vw, 60px);
  font-weight: 400;
  line-height: 1;
}
.lightbox-project-link {
  align-self: flex-start;
  margin-top: 26px;
  padding-bottom: 8px;
  border-bottom: 1px solid var(--gold);
  color: var(--gold);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .16em;
  text-transform: uppercase;
}
.lightbox-close {
  position: fixed;
  z-index: 2;
  top: 20px;
  right: 24px;
  width: 44px;
  height: 44px;
  border: 1px solid rgba(255,255,255,.4);
  border-radius: 50%;
  color: #fff;
  background: rgba(0,0,0,.55);
  font: 300 28px/1 Arial, sans-serif;
  cursor: pointer;
}

.manifesto {
  min-height: 90svh;
  padding: 120px var(--side);
  display: flex;
  flex-direction: column;
  justify-content: center;
  background:
    linear-gradient(90deg, rgba(0,0,0,.84), rgba(0,0,0,.2)),
    radial-gradient(circle at 80% 50%, #3a2a14, #080808 55%);
}
.manifesto p { color: var(--gold); letter-spacing: .32em; text-transform: uppercase; }
.manifesto h2 {
  margin: 18px 0 0;
  font-family: Georgia, serif;
  font-size: clamp(68px, 12vw, 180px);
  font-weight: 400;
  line-height: .76;
  letter-spacing: -.06em;
}
.manifesto h2 span { color: transparent; -webkit-text-stroke: 1px var(--gold); }

.about {
  padding: clamp(120px, 16vw, 240px) var(--side);
  background: var(--ivory);
  color: #121212;
}
.about h2 { max-width: 900px; }
.about > p:last-child {
  width: min(650px, 100%);
  margin: 55px 0 0 auto;
  color: #5d5a55;
  font-family: Georgia, serif;
  font-size: clamp(21px, 2.2vw, 32px);
  line-height: 1.55;
}
.about .text-link {
  display: table;
  margin: 40px 0 0 auto;
  padding-bottom: 8px;
  border-bottom: 1px solid #9c711d;
  color: #795411;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .16em;
  text-transform: uppercase;
}

.testimonials {
  padding: clamp(110px, 14vw, 210px) var(--side);
  background: #0c0c0c;
}
.testimonials > h2 {
  max-width: 1100px;
  margin: 0;
  font: 400 clamp(48px, 7vw, 108px)/.95 Georgia, serif;
  letter-spacing: -.045em;
}
.testimonial-grid {
  max-width: 1440px;
  margin: clamp(70px, 8vw, 120px) auto 0;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  border-top: 1px solid var(--line);
}
.testimonial-grid blockquote {
  margin: 0;
  min-height: 350px;
  padding: 35px;
  display: flex;
  flex-direction: column;
  border-right: 1px solid var(--line);
  color: #c2bcb3;
  font: 400 clamp(18px, 1.8vw, 26px)/1.6 Georgia, serif;
}
.testimonial-grid blockquote:last-child { border-right: 0; }
.testimonial-grid blockquote footer { margin-top: auto; display: flex; flex-direction: column; gap: 4px; font: 600 10px/1.5 "Avenir Next", sans-serif; letter-spacing: .12em; text-transform: uppercase; }
.testimonial-grid blockquote footer span { color: var(--gold); }

.contact {
  min-height: 94svh;
  padding: 140px var(--side) 90px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  background: #070707;
}
.contact h2 { font-size: clamp(70px, 11vw, 170px); }
.contact-actions {
  align-self: flex-end;
  margin-top: 80px;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 22px;
}
.contact-actions a {
  padding-bottom: 8px;
  border-bottom: 1px solid rgba(210,167,76,.35);
  color: #bdb6ac;
  font-size: clamp(15px, 1.5vw, 21px);
}
.contact-actions .contact-primary {
  padding-bottom: 12px;
  border-bottom: 1px solid var(--gold);
  color: var(--gold);
  font-size: clamp(17px, 2vw, 28px);
}
.contact > a {
  align-self: flex-end;
  margin-top: 80px;
  padding-bottom: 12px;
  border-bottom: 1px solid var(--gold);
  color: var(--gold);
  font-size: clamp(17px, 2vw, 28px);
}
.contact > a span { margin-left: 22px; }

.site-footer {
  padding: 60px var(--side);
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 24px 60px;
  border-top: 1px solid rgba(210,167,76,.22);
  color: #8f8a82;
  background: #050505;
  font-size: 11px;
  letter-spacing: .12em;
  text-transform: uppercase;
}
.site-footer > div:first-child { display: flex; flex-direction: column; gap: 8px; }
.site-footer strong { color: var(--ivory); }
.footer-links { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 20px; }
.site-footer > small { grid-column: 1 / -1; }

.interior {
  min-height: 80vh;
  padding: 160px var(--side) 120px;
  color: #171717;
  background: var(--ivory);
}
.interior-hero {
  max-width: 1200px;
  margin: 0 auto 100px;
}
.interior-hero h1 {
  max-width: 1100px;
  margin: 0;
  font: 400 clamp(58px, 9vw, 150px)/.88 Georgia, serif;
  letter-spacing: -.055em;
}
.interior-hero > p:last-child {
  max-width: 650px;
  margin: 45px 0 0 auto;
  color: #625e58;
  font: 400 clamp(18px, 2vw, 28px)/1.55 Georgia, serif;
}
.entry-content {
  max-width: 760px;
  margin: 0 auto;
  font-size: clamp(17px, 1.3vw, 20px);
  line-height: 1.8;
}
.entry-content > * + * { margin-top: 1.6em; }
.entry-content h2,.entry-content h3 { margin-top: 2em; font-family: Georgia, serif; font-weight: 400; line-height: 1.1; }
.entry-content h2 { font-size: clamp(36px, 5vw, 66px); }
.entry-content a { color: #795411; text-decoration: underline; text-underline-offset: 4px; }
.entry-content .wp-block-button__link,.button {
  display: inline-block;
  padding: 14px 20px;
  color: #050505;
  background: var(--gold);
  text-decoration: none;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .14em;
  text-transform: uppercase;
}
.portfolio-archive .portfolio-grid,.portfolio-archive .portfolio-filters { max-width: 1440px; }
.portfolio-archive .portfolio-filters { margin-top: 0; }

.project-single { color: #171717; background: var(--ivory); }
.project-hero { min-height: 100svh; padding: 150px var(--side) 80px; display: grid; grid-template-columns: .85fr 1.35fr; align-items: center; gap: clamp(40px, 7vw, 120px); }
.project-hero h1 { margin: 0; font: 400 clamp(58px, 8vw, 130px)/.88 Georgia, serif; letter-spacing: -.055em; }
.project-hero > div > p:last-child { color: #625e58; font: 400 clamp(18px, 1.7vw, 26px)/1.55 Georgia, serif; }
.project-hero img { width: 100%; max-height: 75svh; object-fit: contain; }
.project-body { padding: clamp(90px, 12vw, 170px) var(--side); display: grid; grid-template-columns: minmax(180px,.4fr) minmax(0,1fr); gap: clamp(50px, 10vw, 160px); background: #fff; }
.project-body aside p { display: flex; flex-direction: column; gap: 7px; margin: 0 0 28px; }
.project-body aside small { color: #8c681e; font-size: 9px; font-weight: 700; letter-spacing: .18em; text-transform: uppercase; }
.project-body aside strong { font: 400 18px/1.4 Georgia, serif; }
.project-body .entry-content { margin: 0; }
.project-video,.project-gallery { padding: clamp(40px, 6vw, 90px) var(--side); background: #090909; }
.project-video iframe,.project-video video { width: 100%; aspect-ratio: 16/9; border: 0; }
.project-gallery { display: grid; grid-template-columns: repeat(2, 1fr); gap: 20px; }
.project-gallery img { width: 100%; height: 100%; object-fit: cover; }
.project-cta { padding: clamp(110px, 14vw, 200px) var(--side); color: var(--ivory); background: #090909; }
.project-cta h2 { max-width: 1050px; margin: 0; font: 400 clamp(52px, 8vw, 120px)/.94 Georgia, serif; letter-spacing: -.05em; }
.project-cta a { display: table; margin: 60px 0 0 auto; padding-bottom: 10px; border-bottom: 1px solid var(--gold); color: var(--gold); letter-spacing: .15em; text-transform: uppercase; }

.journal-grid { max-width: 1440px; margin: 0 auto; display: grid; grid-template-columns: repeat(3, 1fr); gap: 40px 24px; }
.journal-grid article img { aspect-ratio: 4/3; width: 100%; object-fit: cover; }
.journal-grid article small { display: block; margin-top: 18px; color: #8c681e; letter-spacing: .14em; text-transform: uppercase; }
.journal-grid article h2 { margin: 10px 0; font: 400 clamp(28px, 3vw, 44px)/1 Georgia, serif; }
.journal-grid article p { color: #625e58; line-height: 1.6; }
.post-hero-image { max-width: 1440px; margin: -40px auto 100px; }
.post-hero-image img { width: 100%; }
.booking-embed {
  max-width: 1180px;
  min-height: 760px;
  margin: 0 auto 100px;
  overflow: hidden;
  border: 1px solid rgba(156,113,29,.3);
  background: #fff;
}
.booking-embed iframe { display: block; width: 100%; min-height: 760px; border: 0; }
.booking-notice { max-width: 760px; margin: 0 auto 80px; padding: 24px; border: 1px solid rgba(156,113,29,.3); background: #fff; }

.service-page {
  color: var(--ivory);
  background: #090909;
}
.service-hero {
  position: relative;
  min-height: 100svh;
  padding: 140px var(--side) 80px;
  display: flex;
  align-items: flex-end;
  overflow: hidden;
  background:
    var(--service-image, none) center / cover no-repeat,
    radial-gradient(circle at 72% 32%, #49351c, #0a0a0a 48%, #050505 78%);
}
.service-hero-shade {
  position: absolute;
  inset: 0;
  background:
    linear-gradient(90deg, rgba(0,0,0,.92), rgba(0,0,0,.26) 68%, rgba(0,0,0,.55)),
    linear-gradient(180deg, rgba(0,0,0,.18), transparent 40%, rgba(0,0,0,.72));
}
.service-hero-copy {
  position: relative;
  z-index: 1;
  width: 100%;
  max-width: 1440px;
  margin: 0 auto;
}
.service-hero-copy h1 {
  margin: 0;
  font: 400 clamp(84px, 15vw, 230px)/.7 Georgia, serif;
  letter-spacing: -.065em;
}
.service-hero-copy strong {
  display: block;
  max-width: 700px;
  margin: clamp(38px, 6vw, 78px) 0 0 auto;
  color: rgba(242,238,231,.82);
  font: italic 400 clamp(25px, 3vw, 46px)/1.2 Georgia, serif;
}
.service-intro {
  padding: clamp(110px, 15vw, 220px) var(--side);
  color: #141414;
  background: var(--ivory);
}
.service-intro > * {
  max-width: 1440px;
  margin-left: auto;
  margin-right: auto;
}
.service-intro-lead {
  max-width: 1120px;
  margin-top: 0;
  margin-bottom: 0;
  font: 400 clamp(35px, 5.6vw, 88px)/1.06 Georgia, serif;
  letter-spacing: -.04em;
}
.service-editor-content {
  margin-top: 75px;
}
.service-capabilities,
.service-process,
.service-faq {
  padding: clamp(110px, 14vw, 210px) var(--side);
}
.service-capabilities {
  background:
    radial-gradient(circle at 86% 8%, rgba(118,78,25,.2), transparent 30%),
    #0a0a0a;
}
.service-section-heading {
  max-width: 1440px;
  margin: 0 auto clamp(70px, 9vw, 130px);
}
.service-section-heading h2,
.service-work-heading h2 {
  max-width: 1100px;
  margin: 0;
  font: 400 clamp(50px, 7.4vw, 112px)/.94 Georgia, serif;
  letter-spacing: -.05em;
}
.capability-grid {
  max-width: 1440px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  border-top: 1px solid var(--line);
}
.capability-grid article {
  min-height: 360px;
  padding: 34px;
  border-right: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
}
.capability-grid article:nth-child(3n) { border-right: 0; }
.capability-grid span {
  color: var(--gold);
  font-size: 10px;
  letter-spacing: .2em;
}
.capability-grid h3 {
  margin: 72px 0 18px;
  font: 400 clamp(28px, 2.8vw, 44px)/1.05 Georgia, serif;
}
.capability-grid p {
  color: #9f9a92;
  font-size: 14px;
  line-height: 1.8;
}
.service-work {
  padding: clamp(110px, 14vw, 210px) var(--side);
  color: #111;
  background: #efebe4;
}
.service-work-heading {
  max-width: 1440px;
  margin: 0 auto clamp(70px, 9vw, 120px);
}
.service-work .portfolio-grid {
  max-width: 1440px;
}
.service-work-link {
  display: table;
  margin: 55px max(0px, calc((100% - 1440px) / 2)) 0 auto;
  padding-bottom: 8px;
  border-bottom: 1px solid #9c711d;
  color: #795411;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .16em;
  text-transform: uppercase;
}
.service-empty {
  max-width: 1440px;
  margin: 0 auto;
  padding: 55px;
  border: 1px solid rgba(17,17,17,.2);
  color: #716c64;
  font: italic 400 23px/1.5 Georgia, serif;
}
.service-process {
  background: #111;
}
.service-process ol {
  max-width: 1440px;
  margin: 0 auto;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  border-top: 1px solid var(--line);
  list-style: none;
}
.service-process li {
  min-height: 320px;
  padding: 30px;
  border-right: 1px solid var(--line);
}
.service-process li:last-child { border-right: 0; }
.service-process li > span {
  color: var(--gold);
  font-size: 10px;
  letter-spacing: .2em;
}
.service-process strong {
  display: block;
  margin: 72px 0 18px;
  font: 400 clamp(28px, 3vw, 46px)/1 Georgia, serif;
}
.service-process li p {
  color: #9f9a92;
  line-height: 1.75;
}
.service-faq {
  color: #171717;
  background: var(--ivory);
}
.faq-list {
  max-width: 1100px;
  margin: 0 0 0 auto;
  border-top: 1px solid rgba(17,17,17,.22);
}
.faq-list details {
  border-bottom: 1px solid rgba(17,17,17,.22);
}
.faq-list summary {
  padding: 28px 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 30px;
  cursor: pointer;
  font: 400 clamp(22px, 2.4vw, 35px)/1.2 Georgia, serif;
  list-style: none;
}
.faq-list summary::-webkit-details-marker { display: none; }
.faq-list summary span {
  color: #9c711d;
  font: 300 28px/1 Arial, sans-serif;
  transition: transform .25s ease;
}
.faq-list details[open] summary span { transform: rotate(45deg); }
.faq-list details > p {
  max-width: 740px;
  margin: 0 0 32px;
  color: #625e58;
  font-size: 16px;
  line-height: 1.8;
}
.service-cta {
  border-top: 1px solid rgba(210,167,76,.2);
}

@media (max-width: 820px) {
  .site-header { height: 70px; }
  .primary-nav li:not(:last-child) { display: none; }
  .nav-cta { padding: 10px 12px; font-size: 9px; }
  .wordmark > span:last-child { display: none; }
  .hero-copy { top: 50%; }
  .hero-copy h1 { flex-direction: column; gap: .08em; line-height: .72; }
  .disciplines { letter-spacing: .22em; }
  .service-grid { grid-template-columns: 1fr; }
  .service-grid article {
    min-height: 330px;
    border-right: 0;
    border-bottom: 1px solid var(--line);
  }
  .experience-steps { grid-template-columns: 1fr 1fr; }
  .experience-steps li:nth-child(2) { border-right: 0; }
  .experience-steps li { border-bottom: 1px solid var(--line); }
  .lead { margin: 38px 0 70px; }
  .chapter-copy { left: 24px; }
  .portfolio-heading { grid-template-columns: 1fr; }
  .portfolio-heading > p { max-width: 580px; }
  .portfolio-grid { grid-template-columns: 1fr; }
  .portfolio-card,
  .portfolio-card--feature,
  .portfolio-card--landscape,
  .portfolio-card--wide,
  .portfolio-card--portrait,
  .portfolio-card--square {
    grid-column: 1;
    min-height: clamp(360px, 78vw, 560px);
  }
  .portfolio-card--cinema {
    grid-column: 1;
    min-height: 0;
    aspect-ratio: 16 / 10;
  }
  .portfolio-footer { align-items: flex-start; flex-direction: column; }
  .lightbox[open] { grid-template-columns: 1fr; grid-template-rows: minmax(0, 1fr) auto; }
  .lightbox-image-wrap { padding: 64px 18px 18px; }
  .lightbox-image-wrap img { max-height: calc(100svh - 190px); }
  .lightbox-caption {
    padding: 22px 24px 28px;
    border-top: 1px solid rgba(210,167,76,.25);
    border-left: 0;
  }
  .testimonial-grid { grid-template-columns: 1fr; }
  .testimonial-grid blockquote { min-height: 280px; border-right: 0; border-bottom: 1px solid var(--line); }
  .site-footer { grid-template-columns: 1fr; }
  .footer-links { justify-content: flex-start; }
  .site-footer > small { grid-column: auto; }
  .project-hero,.project-body { grid-template-columns: 1fr; }
  .project-hero { padding-top: 120px; }
  .project-gallery,.journal-grid { grid-template-columns: 1fr; }
  .service-hero { min-height: 86svh; }
  .service-hero-copy h1 { font-size: clamp(68px, 20vw, 130px); }
  .service-hero-copy strong { margin-left: 0; }
  .capability-grid { grid-template-columns: 1fr 1fr; }
  .capability-grid article:nth-child(3n) { border-right: 1px solid var(--line); }
  .capability-grid article:nth-child(2n) { border-right: 0; }
  .service-process ol { grid-template-columns: 1fr 1fr; }
  .service-process li:nth-child(2) { border-right: 0; }
  .service-process li { border-bottom: 1px solid var(--line); }
}

@media (max-width: 520px) {
  .experience-steps { grid-template-columns: 1fr; }
  .experience-steps li { border-right: 0; }
  .contact-actions { align-self: flex-start; align-items: flex-start; }
  .capability-grid,
  .service-process ol { grid-template-columns: 1fr; }
  .capability-grid article,
  .capability-grid article:nth-child(3n),
  .service-process li { border-right: 0; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .scrub { height: 100svh; }
  .scroll-cue { display: none; }
  .hero-copy { opacity: 1 !important; transform: translate(-50%, -50%) !important; }
  .chapter-copy { display: none; }
  .scroll-cue i { animation: none; }
}
