:root {
  --black: #101010;
  --black-2: #171717;
  --white: #f4f2eb;
  --paper: #ece9e0;
  --yellow: #ffc82a;
  --yellow-soft: #ffc82a;
  --grey: #a7a7a1;
  --line-dark: rgba(255,255,255,.16);
  --line-light: rgba(16,16,16,.16);
  --max: 1380px;
  --gutter: clamp(20px, 4vw, 64px);
  --header-height: 84px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  color: var(--black);
  background: var(--white);
  font-family: "Manrope", Arial, sans-serif;
  font-size: 16px;
  line-height: 1.55;
  overflow-x: hidden;
}

body.menu-open { overflow: hidden; }
a { color: inherit; text-decoration: none; }
button, input, textarea, select { font: inherit; }
button { color: inherit; }
img { max-width: 100%; display: block; }

.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.skip-link {
  position: fixed;
  left: 16px;
  top: 12px;
  z-index: 1000;
  transform: translateY(-150%);
  background: var(--yellow);
  padding: 10px 14px;
  font-weight: 800;
}
.skip-link:focus { transform: translateY(0); }

.page-shell {
  width: min(100%, var(--max));
  margin-inline: auto;
  padding-inline: var(--gutter);
}
.section-pad { padding-block: clamp(92px, 11vw, 180px); }
.section-dark { background: var(--black); color: var(--white); }

.site-header {
  position: fixed;
  inset: 0 0 auto;
  height: var(--header-height);
  z-index: 100;
  color: var(--white);
  transition: background .3s ease, color .3s ease, border .3s ease;
}
.site-header.scrolled,
.site-header.menu-open {
  background: rgba(16,16,16,.94);
  border-bottom: 1px solid rgba(255,255,255,.12);
  backdrop-filter: blur(16px);
}
.nav-shell {
  width: min(100%, var(--max));
  height: 100%;
  margin-inline: auto;
  padding-inline: var(--gutter);
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.brand { display: inline-flex; align-items: center; gap: 12px; font-weight: 700; letter-spacing: .04em; }
.brand-wordmark { font-size: .95rem; }
.brand-wordmark b { font-weight: 400; color: #b5b5b0; }
.brand-mark {
  width: 34px;
  height: 34px;
  border: 3px solid var(--yellow);
  border-radius: 50%;
  display: grid;
  place-items: center;
  transform: rotate(-22deg);
}
.brand-mark span {
  width: 2px;
  height: 22px;
  background: var(--yellow);
  display: block;
}
.primary-nav { display: flex; align-items: center; gap: clamp(18px, 2vw, 34px); font-size: .9rem; font-weight: 600; }
.primary-nav > a,
.nav-dropdown-trigger { transition: color .2s ease; }
.primary-nav > a:hover,
.nav-dropdown-trigger:hover { color: var(--yellow); }
.nav-dropdown { position: static; }
.nav-dropdown-trigger {
  border: 0;
  background: transparent;
  cursor: pointer;
  padding: 30px 0;
  display: inline-flex;
  gap: 8px;
  align-items: center;
}
.nav-dropdown-trigger span { font-size: 1.1rem; transition: transform .2s ease; }
.nav-dropdown.open .nav-dropdown-trigger span { transform: rotate(45deg); }
.nav-cta {
  padding: 11px 16px;
  border: 1px solid rgba(255,255,255,.34);
}
.nav-cta span { margin-left: 10px; }
.nav-cta:hover { background: var(--yellow); color: var(--black) !important; border-color: var(--yellow); }

.mega-menu {
  position: absolute;
  top: var(--header-height);
  left: 0;
  right: 0;
  background: var(--yellow);
  color: var(--black);
  padding: 48px max(var(--gutter), calc((100vw - var(--max)) / 2 + var(--gutter)));
  display: grid;
  grid-template-columns: 1.25fr repeat(4, 1fr);
  gap: clamp(24px, 3vw, 54px);
  border-top: 1px solid rgba(16,16,16,.18);
  box-shadow: 0 28px 60px rgba(0,0,0,.25);
  visibility: hidden;
  opacity: 0;
  transform: translateY(-10px);
  pointer-events: none;
  transition: opacity .22s ease, transform .22s ease, visibility .22s;
}
.nav-dropdown.open .mega-menu {
  visibility: visible;
  opacity: 1;
  transform: translateY(0);
  pointer-events: auto;
}
.mega-menu-intro { padding-right: 22px; border-right: 1px solid rgba(16,16,16,.25); }
.mega-menu-intro h2 { margin: 10px 0 16px; font-size: clamp(2rem, 3vw, 3.25rem); line-height: .96; letter-spacing: -.05em; }
.mega-menu-intro > p:not(.eyebrow) { max-width: 34ch; font-size: .9rem; }
.mega-menu-column { padding-top: 3px; }
.mega-menu-column h3 { margin: 8px 0 20px; font-size: 1.15rem; }
.mega-menu-column a { display: block; margin: 12px 0; font-size: .85rem; line-height: 1.35; }
.mega-menu-column a:hover { text-decoration: underline; text-underline-offset: 4px; }
.mega-number { font-family: "IBM Plex Mono", monospace; font-size: .7rem; opacity: .65; margin: 0; }

.menu-toggle { display: none; width: 44px; height: 44px; border: 0; background: none; cursor: pointer; }
.menu-toggle span:not(.sr-only) { display: block; width: 24px; height: 2px; margin: 6px auto; background: currentColor; transition: .25s ease; }
.menu-toggle[aria-expanded="true"] span:nth-of-type(2) { transform: translateY(4px) rotate(45deg); }
.menu-toggle[aria-expanded="true"] span:nth-of-type(3) { transform: translateY(-4px) rotate(-45deg); }

.hero {
  min-height: 100svh;
  position: relative;
  overflow: hidden;
  display: grid;
  align-items: end;
  padding-top: var(--header-height);
}
.hero-grid {
  position: absolute;
  inset: 0;
  opacity: .28;
  background-image:
    linear-gradient(rgba(255,255,255,.10) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.10) 1px, transparent 1px);
  background-size: clamp(48px, 6vw, 96px) clamp(48px, 6vw, 96px);
  mask-image: linear-gradient(to bottom, black, transparent 85%);
}
.hero-ring {
  position: absolute;
  width: min(58vw, 790px);
  aspect-ratio: 1;
  border: clamp(34px, 5vw, 80px) solid var(--yellow);
  border-radius: 50%;
  right: -8vw;
  top: 8vh;
  opacity: .95;
  animation: ringFloat 9s ease-in-out infinite;
}
.hero-ring::after {
  content: "";
  position: absolute;
  width: 16%;
  height: 110%;
  background: var(--black);
  left: 11%;
  top: -5%;
  transform: rotate(-21deg);
}
.hero-ring-core {
  position: absolute;
  width: 6px;
  height: 100%;
  background: var(--yellow);
  left: 20%;
  top: 0;
  transform: rotate(-21deg);
  transform-origin: center;
}
@keyframes ringFloat {
  0%, 100% { transform: translateY(0) rotate(0); }
  50% { transform: translateY(18px) rotate(3deg); }
}
.hero-content { position: relative; z-index: 2; padding-bottom: clamp(110px, 13vh, 150px); }
.hero-eyebrow { margin-bottom: clamp(26px, 4vw, 56px); }
.eyebrow,
.section-number {
  font-family: "IBM Plex Mono", monospace;
  font-size: .7rem;
  line-height: 1.4;
  letter-spacing: .13em;
  text-transform: uppercase;
}
.hero h1 {
  margin: 0;
  max-width: 980px;
  font-size: clamp(4rem, 10.5vw, 10.8rem);
  line-height: .80;
  letter-spacing: -.075em;
  font-weight: 700;
}
.hero h1 span { color: var(--yellow); }
.hero-bottom {
  margin-top: clamp(48px, 7vw, 86px);
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 40px;
  align-items: end;
}
.hero-bottom > p { max-width: 660px; font-size: clamp(1rem, 1.45vw, 1.35rem); color: #c7c7c1; margin: 0; }
.hero-actions { display: flex; gap: 12px; flex-wrap: wrap; }
.hero-index {
  position: absolute;
  left: var(--gutter);
  bottom: 24px;
  display: flex;
  gap: 26px;
  z-index: 2;
  font-family: "IBM Plex Mono", monospace;
  font-size: .62rem;
  letter-spacing: .11em;
  color: #7f7f7a;
}
.button {
  display: inline-flex;
  min-height: 50px;
  padding: 0 20px;
  align-items: center;
  justify-content: center;
  gap: 22px;
  font-size: .84rem;
  font-weight: 700;
  border: 1px solid transparent;
  transition: transform .2s ease, background .2s ease, color .2s ease, border .2s ease;
}
.button:hover { transform: translateY(-2px); }
.button-yellow { background: var(--yellow); color: var(--black); }
.button-yellow:hover { background: var(--white); }
.button-ghost { border-color: rgba(255,255,255,.35); color: var(--white); }
.button-ghost:hover { border-color: var(--white); }
.button-dark { background: var(--black); color: var(--white); }
.button-dark:hover { background: #2a2a2a; }

.capability-strip { overflow: hidden; border-bottom: 1px solid var(--line-light); background: var(--yellow); }
.ticker-track { width: max-content; display: flex; align-items: center; gap: 24px; padding: 16px 0; animation: ticker 36s linear infinite; }
.ticker-track span { font-family: "IBM Plex Mono", monospace; font-size: .7rem; letter-spacing: .12em; white-space: nowrap; }
.ticker-track i { width: 6px; height: 6px; border-radius: 50%; background: var(--black); }
@keyframes ticker { to { transform: translateX(-50%); } }

.intro-section { display: grid; grid-template-columns: 1fr 2.1fr; gap: 48px; border-bottom: 1px solid var(--line-light); }
.intro-copy { max-width: 950px; }
.large-copy { font-size: clamp(2rem, 4vw, 4.8rem); line-height: 1.05; letter-spacing: -.055em; margin: 0 0 34px; }
.intro-copy > p:not(.large-copy) { max-width: 660px; font-size: 1.08rem; color: #4e4e49; }
.text-link { display: inline-flex; gap: 20px; align-items: center; margin-top: 22px; font-size: .85rem; font-weight: 800; border-bottom: 1px solid currentColor; padding-bottom: 4px; }
.text-link span { transition: transform .2s ease; }
.text-link:hover span { transform: translate(3px, -3px); }
.text-link-light { color: var(--white); }

.section-heading { display: flex; justify-content: space-between; gap: 42px; align-items: end; margin-bottom: clamp(54px, 7vw, 92px); }
.section-heading h2,
.method-copy h2,
.contact-cta h2,
.page-hero h1 {
  margin: 16px 0 0;
  font-size: clamp(3rem, 6.5vw, 7.2rem);
  line-height: .9;
  letter-spacing: -.065em;
}
.section-side-copy { max-width: 470px; color: #a9a9a3; font-size: 1rem; }
.dark-copy { color: #575751; }

.work-grid { display: grid; grid-template-columns: 1.18fr .82fr; gap: clamp(48px, 7vw, 100px) clamp(24px, 3vw, 44px); }
.project-card { display: block; }
.project-card-large { grid-row: span 2; }
.project-visual { aspect-ratio: 4 / 3; position: relative; overflow: hidden; background-color: #d5d0c4; transition: transform .35s ease; }
.project-card-large .project-visual { aspect-ratio: 4 / 5.1; }
.project-card:hover .project-visual { transform: scale(.985); }
.visual-label { position: absolute; left: 16px; top: 14px; font-family: "IBM Plex Mono", monospace; font-size: .65rem; letter-spacing: .1em; z-index: 2; }
.visual-industrial {
  background:
    linear-gradient(125deg, transparent 0 36%, rgba(16,16,16,.97) 36% 40%, transparent 40% 48%, rgba(16,16,16,.97) 48% 51%, transparent 51%),
    linear-gradient(90deg, transparent 0 14%, var(--yellow) 14% 19%, transparent 19% 71%, rgba(16,16,16,.95) 71% 77%, transparent 77%),
    linear-gradient(#dad6cc 0 68%, #a5a198 68%);
}
.visual-industrial::before,
.visual-industrial::after { content: ""; position: absolute; background: var(--black); }
.visual-industrial::before { width: 2px; height: 76%; left: 28%; top: 12%; box-shadow: 150px 0 var(--black), 300px 0 var(--black); }
.visual-industrial::after { height: 2px; width: 84%; left: 8%; top: 23%; box-shadow: 0 82px var(--black), 0 164px var(--black), 0 246px var(--black); }
.visual-carbon {
  background:
    radial-gradient(circle at 72% 33%, transparent 0 17%, var(--yellow) 17% 25%, transparent 25%),
    linear-gradient(130deg, transparent 0 52%, rgba(16,16,16,.92) 52% 55%, transparent 55%),
    linear-gradient(#dedad0, #aaa69d);
}
.visual-carbon::before { content: ""; position: absolute; inset: 14% 12%; background: repeating-linear-gradient(0deg, transparent 0 42px, rgba(16,16,16,.35) 43px 44px), repeating-linear-gradient(90deg, transparent 0 62px, rgba(16,16,16,.35) 63px 64px); }
.visual-workplace {
  background:
    linear-gradient(90deg, var(--yellow) 0 26%, transparent 26%),
    repeating-linear-gradient(0deg, transparent 0 62px, rgba(16,16,16,.35) 63px 64px),
    repeating-linear-gradient(90deg, transparent 0 82px, rgba(16,16,16,.35) 83px 84px),
    #c9c5bb;
}
.visual-workplace::before { content: ""; position: absolute; width: 31%; height: 44%; right: 14%; top: 26%; border: 5px solid var(--black); box-shadow: -86px 52px 0 -1px #c9c5bb, -86px 52px 0 4px var(--black); }
.project-meta { display: flex; justify-content: space-between; gap: 20px; margin-top: 20px; }
.project-meta p { margin: 0 0 9px; color: #65655f; font-size: .75rem; font-family: "IBM Plex Mono", monospace; text-transform: uppercase; letter-spacing: .04em; }
.project-meta h3 { margin: 0; font-size: clamp(1.4rem, 2vw, 2.3rem); line-height: 1.08; letter-spacing: -.035em; }
.project-arrow { font-size: 1.5rem; transition: transform .2s ease; }
.project-card:hover .project-arrow { transform: translate(4px, -4px); }
.project-summary { color: #595953; max-width: 52ch; font-size: .92rem; }

.expertise-accordion { border-top: 1px solid var(--line-dark); }
.expertise-row { border-bottom: 1px solid var(--line-dark); }
.expertise-row > button { width: 100%; border: 0; background: transparent; display: grid; grid-template-columns: 80px 1fr auto; align-items: center; padding: 30px 0; text-align: left; cursor: pointer; }
.expertise-no { color: var(--yellow); font-family: "IBM Plex Mono", monospace; font-size: .72rem; }
.expertise-title { font-size: clamp(2.3rem, 5vw, 6rem); line-height: 1; letter-spacing: -.055em; }
.expertise-toggle { font-size: 2rem; font-weight: 300; }
.expertise-detail { display: grid; grid-template-columns: 1.25fr 1fr auto; gap: 46px; padding: 0 0 42px 80px; color: #bcbcb6; align-items: start; }
.expertise-detail p { margin: 0; max-width: 540px; font-size: 1.04rem; }
.expertise-detail ul { list-style: none; margin: 0; padding: 0; columns: 2; column-gap: 26px; }
.expertise-detail li { break-inside: avoid; margin: 0 0 10px; font-size: .82rem; color: #e3e3dc; }

.metrics-grid { display: grid; grid-template-columns: repeat(4, 1fr); border-top: 1px solid var(--line-light); border-left: 1px solid var(--line-light); }
.metric-card { min-height: 320px; padding: 32px; border-right: 1px solid var(--line-light); border-bottom: 1px solid var(--line-light); position: relative; }
.metric-value { display: inline; margin: 0; font-size: clamp(4rem, 7vw, 7.4rem); line-height: .9; letter-spacing: -.08em; }
.metric-suffix { margin-left: 8px; font-family: "IBM Plex Mono", monospace; font-size: .72rem; }
.metric-card h3 { margin: 64px 0 12px; font-size: 1.1rem; }
.metric-card p:last-child { color: #5d5d57; font-size: .86rem; }

.method-section { background: var(--yellow); }
.method-grid { display: grid; grid-template-columns: .85fr 1.15fr; gap: clamp(60px, 9vw, 150px); align-items: start; }
.method-copy h2 { max-width: 650px; }
.method-copy > p:not(.section-number) { max-width: 580px; }
.method-copy .button { margin-top: 24px; }
.method-steps { list-style: none; margin: 0; padding: 0; border-top: 1px solid rgba(16,16,16,.3); }
.method-steps li { display: grid; grid-template-columns: 55px 1fr auto; gap: 20px; align-items: center; border-bottom: 1px solid rgba(16,16,16,.3); padding: 22px 0; }
.method-steps span { font-family: "IBM Plex Mono", monospace; font-size: .7rem; }
.method-steps b { font-size: 1.45rem; }
.method-steps small { color: #4f4a00; }

.insight-grid { display: grid; grid-template-columns: repeat(3, 1fr); border-top: 1px solid var(--line-dark); border-left: 1px solid var(--line-dark); }
.insight-card { padding: 34px; min-height: 370px; border-right: 1px solid var(--line-dark); border-bottom: 1px solid var(--line-dark); display: flex; flex-direction: column; transition: background .25s ease, color .25s ease; }
.insight-card:hover { background: var(--yellow); color: var(--black); }
.insight-category { font-family: "IBM Plex Mono", monospace; text-transform: uppercase; letter-spacing: .08em; font-size: .66rem; color: var(--yellow); }
.insight-card:hover .insight-category { color: var(--black); }
.insight-card h3 { margin: 62px 0 18px; font-size: clamp(1.5rem, 2.2vw, 2.3rem); line-height: 1.09; letter-spacing: -.035em; }
.insight-card > p:not(.insight-category) { color: #a8a8a2; font-size: .9rem; }
.insight-card:hover > p:not(.insight-category) { color: #393900; }
.insight-card span { margin-top: auto; font-size: .8rem; font-weight: 800; }

.contact-cta { background: var(--yellow); min-height: 82vh; display: grid; align-items: center; }
.contact-cta-inner { padding-block: 100px; }
.contact-cta h2 { font-size: clamp(4rem, 9vw, 10rem); }
.contact-cta-inner > p:not(.section-number) { font-size: clamp(1.5rem, 3vw, 3rem); margin: 28px 0; }

.site-footer { padding-top: 78px; }
.footer-grid { display: grid; grid-template-columns: 2fr repeat(3, 1fr); gap: 50px; padding-bottom: 78px; }
.footer-grid > div:not(.footer-brand) { display: flex; flex-direction: column; align-items: flex-start; gap: 10px; font-size: .84rem; }
.footer-grid a:hover { color: var(--yellow); }
.footer-brand p { color: #8f8f89; }
.brand-footer { margin-bottom: 18px; }
.footer-label { font-family: "IBM Plex Mono", monospace; color: #80807a; text-transform: uppercase; font-size: .65rem; letter-spacing: .1em; }
.footer-grid p { margin: 0; }
.footer-bottom { border-top: 1px solid var(--line-dark); padding-block: 24px; display: flex; justify-content: space-between; gap: 22px; color: #777772; font-size: .68rem; font-family: "IBM Plex Mono", monospace; }

.reveal { opacity: 0; transform: translateY(24px); transition: opacity .75s ease, transform .75s ease; }
.reveal.in-view { opacity: 1; transform: translateY(0); }

/* Interior pages */
.page-hero { min-height: 72vh; display: grid; align-items: end; padding: calc(var(--header-height) + 80px) 0 90px; position: relative; overflow: hidden; }
.page-hero .eyebrow { color: var(--yellow); }
.page-hero p:last-child { max-width: 670px; color: #b5b5af; font-size: 1.1rem; }
.page-hero::after { content: ""; position: absolute; width: 44vw; aspect-ratio: 1; border: 44px solid var(--yellow); border-radius: 50%; right: -12vw; top: 6vh; opacity: .8; }
.page-section { padding-block: clamp(80px, 10vw, 150px); }
.expertise-page-grid { display: grid; grid-template-columns: 280px 1fr; gap: clamp(50px, 8vw, 120px); }
.sticky-index { position: sticky; top: 120px; align-self: start; }
.sticky-index a { display: block; margin: 12px 0; color: #66665f; font-size: .82rem; }
.sticky-index a:hover { color: var(--black); }
.service-group { padding-bottom: 100px; border-bottom: 1px solid var(--line-light); margin-bottom: 100px; }
.service-group:last-child { border: 0; margin-bottom: 0; }
.service-group > header { display: grid; grid-template-columns: 90px 1fr; margin-bottom: 55px; }
.service-group .service-number { font-family: "IBM Plex Mono", monospace; color: #76766f; font-size: .72rem; }
.service-group h2 { font-size: clamp(3rem, 6vw, 6.8rem); line-height: .9; letter-spacing: -.065em; margin: 0; }
.service-intro { font-size: 1.2rem; max-width: 720px; margin: 25px 0 0 90px; }
.service-list { margin-left: 90px; display: grid; grid-template-columns: repeat(2, 1fr); border-top: 1px solid var(--line-light); border-left: 1px solid var(--line-light); }
.service-item { padding: 28px; border-right: 1px solid var(--line-light); border-bottom: 1px solid var(--line-light); min-height: 230px; }
.service-item h3 { margin: 0 0 18px; font-size: 1.25rem; }
.service-item p { margin: 0; color: #5f5f59; font-size: .88rem; }

.work-page-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 72px 32px; }
.work-page-grid .project-card:nth-child(3n+1) { grid-column: span 2; }
.work-page-grid .project-card:nth-child(3n+1) .project-visual { aspect-ratio: 2 / 1; }

.article-grid { display: grid; grid-template-columns: repeat(3, 1fr); border-top: 1px solid var(--line-light); border-left: 1px solid var(--line-light); }
.article-card { min-height: 420px; padding: 34px; border-right: 1px solid var(--line-light); border-bottom: 1px solid var(--line-light); display: flex; flex-direction: column; }
.article-card:hover { background: var(--yellow); }
.article-card .insight-category { color: #6b6500; }
.article-card h2 { font-size: 2rem; line-height: 1.08; letter-spacing: -.04em; margin: 70px 0 20px; }
.article-card > p:not(.insight-category) { color: #62625c; font-size: .9rem; }
.article-card span { margin-top: auto; font-weight: 800; font-size: .8rem; }

.studio-intro { display: grid; grid-template-columns: 1fr 1fr; gap: 60px; }
.studio-intro .large-copy { max-width: 740px; }
.studio-copy { max-width: 610px; padding-top: 10px; }
.studio-copy p { font-size: 1.05rem; color: #55554f; }
.principles-grid { display: grid; grid-template-columns: repeat(4, 1fr); border-top: 1px solid var(--line-light); border-left: 1px solid var(--line-light); }
.principle { min-height: 290px; padding: 28px; border-right: 1px solid var(--line-light); border-bottom: 1px solid var(--line-light); }
.principle span { font-family: "IBM Plex Mono", monospace; font-size: .68rem; }
.principle h3 { margin: 78px 0 18px; font-size: 1.45rem; }
.principle p { color: #5b5b55; font-size: .88rem; }
.directors-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 34px; }
.director-card { background: #d8d4ca; min-height: 560px; display: flex; align-items: end; padding: 34px; position: relative; overflow: hidden; }
.director-card::before { content: ""; position: absolute; width: 70%; aspect-ratio: 1; border-radius: 50%; border: 35px solid var(--yellow); right: -18%; top: 7%; }
.director-card::after { content: "PORTRAIT PLACEHOLDER"; position: absolute; top: 24px; left: 26px; font-family: "IBM Plex Mono", monospace; font-size: .62rem; letter-spacing: .1em; }
.director-info { position: relative; z-index: 2; background: var(--black); color: var(--white); padding: 22px; width: 100%; }
.director-info p { color: #a8a8a2; margin: 5px 0; font-size: .82rem; }
.director-info h3 { margin: 0; font-size: 1.5rem; }

.contact-layout { display: grid; grid-template-columns: .8fr 1.2fr; gap: clamp(60px, 9vw, 140px); }
.contact-copy h2 { font-size: clamp(3rem, 6vw, 6rem); line-height: .9; letter-spacing: -.06em; margin-top: 0; }
.contact-copy p { max-width: 520px; color: #5a5a54; }
.contact-details { margin-top: 48px; }
.contact-details a, .contact-details p { display: block; margin: 10px 0; color: var(--black); }
.contact-form { display: grid; gap: 24px; }
.form-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 20px; }
.field { display: grid; gap: 8px; }
.field-full { grid-column: 1 / -1; }
.field label { font-size: .72rem; font-family: "IBM Plex Mono", monospace; text-transform: uppercase; letter-spacing: .06em; }
.field input,
.field textarea,
.field select { width: 100%; border: 0; border-bottom: 1px solid #797970; background: transparent; padding: 13px 0; border-radius: 0; outline: none; }
.field input:focus,
.field textarea:focus,
.field select:focus { border-color: var(--black); box-shadow: 0 2px 0 var(--yellow); }
.field textarea { min-height: 140px; resize: vertical; }
.form-note { font-size: .76rem; color: #676760; }

@media (max-width: 1050px) {
  :root { --header-height: 74px; }
  .menu-toggle { display: block; position: relative; z-index: 2; }
  .primary-nav {
    position: fixed;
    top: var(--header-height);
    left: 0;
    right: 0;
    bottom: 0;
    background: var(--black);
    padding: 34px var(--gutter) 80px;
    display: block;
    transform: translateX(100%);
    transition: transform .3s ease;
    overflow-y: auto;
  }
  .primary-nav.open { transform: translateX(0); }
  .primary-nav > a,
  .nav-dropdown-trigger { display: flex; width: 100%; justify-content: space-between; align-items: center; padding: 20px 0; border-bottom: 1px solid var(--line-dark); font-size: 1.2rem; }
  .nav-cta { border: 0; }
  .mega-menu {
    position: static;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 32px 22px;
    background: transparent;
    color: var(--white);
    padding: 20px 0 28px;
    box-shadow: none;
    border: 0;
    max-height: 0;
    overflow: hidden;
    visibility: visible;
    opacity: 1;
    transform: none;
    transition: max-height .35s ease, padding .35s ease;
  }
  .nav-dropdown.open .mega-menu { max-height: 1400px; }
  .mega-menu-intro { grid-column: 1 / -1; border-right: 0; border-bottom: 1px solid var(--line-dark); padding: 0 0 22px; }
  .mega-menu-intro h2 { font-size: 2.3rem; }
  .mega-menu-column h3 { color: var(--yellow); }
  .mega-menu-column a { color: #bcbcb5; }
  .mega-number { color: #70706b; }
  .hero-ring { width: 70vw; right: -25vw; top: 15vh; opacity: .65; }
  .hero-bottom { grid-template-columns: 1fr; }
  .hero-actions { justify-self: start; }
  .expertise-detail { grid-template-columns: 1fr; padding-left: 80px; }
  .metrics-grid { grid-template-columns: repeat(2, 1fr); }
  .method-grid { grid-template-columns: 1fr; }
  .footer-grid { grid-template-columns: 1.5fr 1fr 1fr; }
  .footer-grid > div:last-child { grid-column: 1 / -1; }
  .expertise-page-grid { grid-template-columns: 1fr; }
  .sticky-index { display: none; }
  .article-grid { grid-template-columns: repeat(2, 1fr); }
  .principles-grid { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 760px) {
  .section-pad { padding-block: 88px; }
  .hero { min-height: 92svh; }
  .hero-content { padding-bottom: 100px; }
  .hero h1 { font-size: clamp(4rem, 19vw, 6.7rem); }
  .hero-index { display: none; }
  .hero-ring { width: 88vw; border-width: 42px; top: 20vh; right: -40vw; }
  .hero-actions { display: grid; width: 100%; }
  .hero-actions .button { width: 100%; }
  .intro-section { grid-template-columns: 1fr; }
  .section-heading { display: block; }
  .section-heading .text-link,
  .section-side-copy { margin-top: 28px; }
  .section-heading h2,
  .method-copy h2,
  .contact-cta h2,
  .page-hero h1 { font-size: clamp(3.3rem, 16vw, 5.6rem); }
  .work-grid { grid-template-columns: 1fr; }
  .project-card-large { grid-row: auto; }
  .project-card-large .project-visual { aspect-ratio: 4 / 3; }
  .expertise-row > button { grid-template-columns: 42px 1fr auto; padding: 24px 0; }
  .expertise-detail { padding-left: 42px; gap: 25px; }
  .expertise-detail ul { columns: 1; }
  .metrics-grid { grid-template-columns: 1fr; }
  .metric-card { min-height: 260px; }
  .metric-card h3 { margin-top: 48px; }
  .method-steps li { grid-template-columns: 45px 1fr; }
  .method-steps small { grid-column: 2; }
  .insight-grid { grid-template-columns: 1fr; }
  .insight-card { min-height: 315px; }
  .contact-cta { min-height: 72vh; }
  .footer-grid { grid-template-columns: 1fr 1fr; }
  .footer-brand { grid-column: 1 / -1; }
  .footer-grid > div:last-child { grid-column: 1 / -1; }
  .footer-bottom { display: block; }
  .mega-menu { grid-template-columns: 1fr; }
  .mega-menu-intro { grid-column: auto; }
  .service-group > header { grid-template-columns: 1fr; }
  .service-group .service-number { margin-bottom: 16px; }
  .service-intro,
  .service-list { margin-left: 0; }
  .service-list { grid-template-columns: 1fr; }
  .work-page-grid { grid-template-columns: 1fr; }
  .work-page-grid .project-card:nth-child(3n+1) { grid-column: auto; }
  .work-page-grid .project-card:nth-child(3n+1) .project-visual { aspect-ratio: 4/3; }
  .article-grid { grid-template-columns: 1fr; }
  .studio-intro { grid-template-columns: 1fr; }
  .principles-grid { grid-template-columns: 1fr; }
  .directors-grid { grid-template-columns: 1fr; }
  .contact-layout { grid-template-columns: 1fr; }
  .form-grid { grid-template-columns: 1fr; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; scroll-behavior: auto !important; transition-duration: .01ms !important; }
  .reveal { opacity: 1; transform: none; }
}


/* ENSO brand assets */
.brand-logo { width: clamp(190px, 16vw, 250px); height: 48px; display:flex; align-items:center; }
.brand-logo img { width:100%; height:100%; object-fit:contain; object-position:left center; }
.footer-logo { display:block; width:min(230px, 100%); margin-bottom:22px; }
.footer-logo img { width:100%; height:auto; }
.footer-brand { align-self:start; }

/* White papers */
.whitepaper-preview { background:var(--paper); border-top:1px solid var(--line-light); }
.featured-paper { display:grid; grid-template-columns:minmax(280px,.72fr) 1.28fr; gap:clamp(42px,8vw,120px); align-items:center; }
.paper-cover { aspect-ratio: .76; background:var(--black); color:var(--white); padding:clamp(24px,3vw,42px); position:relative; overflow:hidden; display:flex; flex-direction:column; border:1px solid rgba(16,16,16,.16); box-shadow:0 20px 55px rgba(16,16,16,.12); }
.paper-cover::after { content:""; position:absolute; width:70%; aspect-ratio:1; border:2px solid var(--yellow); border-radius:50%; right:-32%; bottom:-10%; opacity:.8; }
.paper-cover img { width:68px; height:68px; margin-bottom:auto; position:relative; z-index:2; }
.paper-cover span,.paper-cover small { font-family:"IBM Plex Mono",monospace; font-size:.64rem; letter-spacing:.1em; text-transform:uppercase; position:relative; z-index:2; }
.paper-cover strong { font-size:clamp(1.65rem,3vw,3.35rem); line-height:1.02; letter-spacing:-.05em; margin:36px 0 26px; max-width:12ch; position:relative; z-index:2; }
.paper-cover small { color:var(--yellow); margin-top:auto; }
.paper-cover-featured { max-width:520px; }
.featured-paper-copy h3 { font-size:clamp(2.2rem,5vw,5.8rem); line-height:.95; letter-spacing:-.06em; margin:16px 0 28px; }
.featured-paper-copy > p:not(.eyebrow) { max-width:650px; color:#55554f; font-size:1.02rem; }
.featured-paper-copy .button { margin-top:20px; }
.publication-intro { display:grid; grid-template-columns:1fr 2.1fr; gap:48px; border-bottom:1px solid var(--line-light); padding-bottom:clamp(70px,9vw,130px); }
.publication-intro > div > p:not(.large-copy) { max-width:720px; color:#55554f; font-size:1.04rem; }
.publication-library { padding-top:0; }
.publication-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:clamp(70px,8vw,120px) clamp(28px,4vw,60px); }
.publication-card { display:grid; grid-template-columns:minmax(220px,.8fr) 1.2fr; gap:32px; align-items:end; }
.publication-card .paper-cover { width:100%; box-shadow:none; }
.publication-copy { padding-bottom:8px; }
.publication-status { font-family:"IBM Plex Mono",monospace; color:#6a6200; text-transform:uppercase; letter-spacing:.1em; font-size:.66rem; }
.publication-copy h2 { font-size:clamp(1.6rem,2.6vw,2.7rem); line-height:1.07; letter-spacing:-.04em; margin:22px 0 18px; }
.publication-copy > p:not(.publication-status) { color:#5b5b55; font-size:.9rem; }
.publication-action { display:inline-flex; margin-top:22px; border-bottom:1px solid currentColor; padding-bottom:4px; font-size:.78rem; font-weight:800; }
.publication-action.is-disabled { color:#8a8a83; cursor:not-allowed; border-bottom-style:dashed; }
.cover-carbon { background:linear-gradient(145deg,#101010 0 63%,#262626 63%); }
.cover-timber { background:linear-gradient(135deg,#101010 0 54%,#4e3520 54% 70%,#101010 70%); }
.cover-industrial { background:repeating-linear-gradient(90deg,#101010 0 18%,#1b1b1b 18% 19%); }
.cover-ports { background:linear-gradient(160deg,#101010 0 58%,#183343 58% 73%,#101010 73%); }
.publication-callout { min-height:75vh; display:grid; align-items:center; }
.publication-callout-inner { padding-block:clamp(100px,12vw,180px); }
.publication-callout h2 { font-size:clamp(3.5rem,8vw,9rem); line-height:.88; letter-spacing:-.07em; margin:18px 0 34px; }
.publication-callout p:not(.section-number) { max-width:700px; color:#b6b6b0; font-size:1.05rem; }
.publication-callout .button { margin-top:22px; }

@media (max-width:1050px){ .brand-logo{width:210px}.featured-paper{grid-template-columns:.85fr 1.15fr}.publication-grid{grid-template-columns:1fr}.publication-card{grid-template-columns:280px 1fr}.footer-logo{width:190px} }
@media (max-width:760px){ .brand-logo{width:178px;height:42px}.featured-paper,.publication-intro,.publication-card{grid-template-columns:1fr}.paper-cover-featured{max-width:100%}.publication-card .paper-cover{max-width:420px}.publication-grid{gap:80px}.footer-logo{width:170px}.publication-callout h2{font-size:clamp(3.4rem,15vw,5.8rem)} }