@font-face {
  font-family: Manrope;
  src: url("assets/font.ttf") format("truetype");
  font-weight: 200 800;
  font-display: swap;
}
body:has(#main-content) {
  --ink: #080808;
  --paper: #f6f5f2;
  --white: #fff;
  --violet: #823de5;
  --rule: rgba(17, 17, 17, .24);
  --gutter: clamp(20px, 2.78vw, 64px);
  --small: clamp(14px, 1.11vw, 19px);
  --lead: clamp(42px, 4.31vw, 86px);
  --vh: 100vh;
  --type-ease-out: cubic-bezier(.16, 1, .3, 1);
  color: var(--ink);
  background: var(--paper);
  font-family: Manrope, Arial, sans-serif;
  font-synthesis: none;
  font-weight: 450;
  text-rendering: optimizeLegibility;
}
@supports (height: 100svh) { body:has(#main-content) { --vh: 100svh; } }
@supports (animation-timing-function: linear(0, 1)) {
  body:has(#main-content) {
    --type-ease-out: linear(
      0, .19475, .35158, .47786, .57955, .66144, .72737, .78047,
      .82322, .85765, .88537, .9077, .92567, .94015, .95181, .96119,
      .96875, .97484, .97974, .98368, .98686, .98942, .99148, .99314,
      .99448, .99555, .99642, .99712, .99768, .99813, .99849, .99879,
      1
    );
  }
}
body:has(#main-content) *, body:has(#main-content) *::before, body:has(#main-content) *::after { box-sizing: border-box; }
body:has(#main-content) { margin: 0; }
body:has(#main-content) [hidden] { display: none !important; }
body:has(#main-content) a { color: inherit; text-decoration: none; }
body:has(#main-content) button, body:has(#main-content) input, body:has(#main-content) select, body:has(#main-content) textarea { font: inherit; }
body:has(#main-content) button { color: inherit; cursor: pointer; }
body:has(#main-content) img { display: block; max-width: 100%; }
body:has(#main-content) h1,body:has(#main-content) h2,body:has(#main-content) h3,body:has(#main-content) p,body:has(#main-content) figure { margin: 0; }
body:has(#main-content) ::selection { color: #fff; background: #6431ae; }
body:has(#main-content) :focus-visible { outline: 2px solid #a766ff; outline-offset: 5px; }
body:has(#main-content) .skip-link { position: fixed; z-index: 1100; left: 16px; top: 12px; transform: translateY(-160%); padding: 12px 18px; background: #fff; color: #111; }
body:has(#main-content) .skip-link:focus { transform: none; }
body:has(#main-content) .padded { padding-inline: var(--gutter); }
body:has(#main-content) .editorial-lead { font-size: var(--lead); line-height: 1.075; font-weight: 450; letter-spacing: -.065em; }
body:has(#main-content) .indent-lead { text-indent: 16%; }
body:has(#main-content) .section-label { font-size: var(--small); line-height: 1.2; }
body:has(#main-content) .text-link { display: inline-flex; align-items: baseline; gap: .25em; text-decoration: underline; text-underline-offset: .23em; text-decoration-thickness: 1px; }
body:has(#main-content) .arrow-icon { display: inline-block; transition: transform .32s cubic-bezier(.2,.65,.3,1); }
body:has(#main-content) a:hover .arrow-icon, body:has(#main-content) a:focus-visible .arrow-icon { transform: translate(.15em,-.15em); }
body:has(#main-content) .mask-link { display: inline-grid; overflow: hidden; line-height: 1.16; vertical-align: top; }
body:has(#main-content) .mask-link > span { grid-area: 1 / 1; transition: transform .53s cubic-bezier(.2,.7,.2,1); }
body:has(#main-content) .mask-link > span + span { transform: translateY(115%); }
body:has(#main-content) .mask-link:focus-visible > span:first-child { transform: translateY(-115%); }
body:has(#main-content) .mask-link:focus-visible > span + span { transform: translateY(0); }
@media (hover: hover) {
  body:has(#main-content) .mask-link:hover > span:first-child, body:has(#main-content) .reel-open:hover .mask-link > span:first-child { transform: translateY(-115%); }
  body:has(#main-content) .mask-link:hover > span + span, body:has(#main-content) .reel-open:hover .mask-link > span + span { transform: translateY(0); }
}
body:has(#main-content) [data-parallax] { translate: 0 var(--parallax-y, 0px); }
body:has(#main-content) .word-mask { display: inline-block; overflow: hidden; vertical-align: bottom; text-indent: 0; padding: .055em 0 .105em; margin: -.055em 0 -.105em; }
body:has(#main-content) .word-mask > span { display: inline-block; }
body:has(#main-content) [data-reveal].prepared:not(.revealed) .word-mask > span { transform: translateY(100%); }
body:has(#main-content) [data-reveal].revealed .word-mask > span {
  transition: transform 1.6s var(--type-ease-out) calc(200ms + var(--word-index) * var(--word-step, 14ms));
}
body:has(#main-content) .editorial-lead[data-reveal] { --word-step: 20ms; }
body:has(#main-content) .entry-word > span {
  animation: word-entry 1.6s var(--type-ease-out) both;
  animation-delay: calc(1s + var(--word-index) * 20ms);
}
@keyframes word-entry { from { transform: translateY(100%); } to { transform: translateY(0); } }
body:has(#main-content) [data-reveal="fade"].prepared:not(.revealed) { opacity: 0; transition: none; }
body:has(#main-content) [data-reveal="fade"].revealed { transition: opacity .8s var(--type-ease-out) 200ms; }

body:has(#main-content) #site { min-height: var(--vh); }
body:has(#main-content) #page-view { min-height: var(--vh); }
body:has(#main-content) #page-view.is-changing { pointer-events: none; }
body:has(#main-content) #main-content { outline: none; }
body:has(#main-content) .redesign-header {
  position: fixed; z-index: 90; top: 0; left: 0; width: 100%;
  background: transparent; color: #fff; mix-blend-mode: difference; pointer-events: none;
}
body:has(#main-content) .header-inner {
  display: grid; grid-template-columns: 1fr 1fr auto; align-items: center;
  padding: 27px var(--gutter); gap: 22px; font-size: 14px; line-height: 1.2; font-weight: 550;
}
body:has(#main-content) .header-inner a, body:has(#main-content) .header-inner button { pointer-events: auto; }
body:has(#main-content) .header-home { width: fit-content; padding-left: 29px; }
body:has(#main-content) .header-mark {
  width: 21px; height: 21px; position: fixed; left: var(--gutter); top: 25px;
  z-index: 91; pointer-events: none; object-fit: contain;
}
body:has(#main-content) .desktop-nav { display: flex; gap: clamp(9px,1.15vw,21px); align-items: center; }
body:has(#main-content) .desktop-nav a, body:has(#main-content) .header-contact, body:has(#main-content) .header-home { position: relative; }
body:has(#main-content) .desktop-nav a[aria-current], body:has(#main-content) .header-contact[aria-current] { opacity: .55; }
body:has(#main-content) .desktop-nav a::after, body:has(#main-content) .header-contact::after {
  content: ""; position: absolute; bottom: -.32em; left: 0; width: 100%; height: 1px;
  background: currentColor; transform: scaleX(0); transform-origin: right; transition: transform .28s ease;
}
body:has(#main-content) .desktop-nav a:hover::after, body:has(#main-content) .desktop-nav a:focus-visible::after, body:has(#main-content) .header-contact:hover::after { transform: scaleX(1); transform-origin: left; }
body:has(#main-content) .mobile-toggle { display: none; }
body:has(#main-content) .menu-veil {
  position: fixed; z-index: 100; inset: 0; border: 0; opacity: 0; pointer-events: none;
  background: rgba(0,0,0,.72); transition: opacity .48s ease;
}
body:has(#main-content) .redesign-menu {
  position: fixed; z-index: 101; inset: 0; display: flex; flex-direction: column;
  padding: 17px var(--gutter) max(24px,env(safe-area-inset-bottom));
  background: #111; color: #fff; overflow-y: auto; visibility: hidden; transform: translateY(-101%);
  transition: transform .57s cubic-bezier(.73,0,.25,1), visibility 0s .57s;
}
body:has(#main-content).menu-open .menu-veil { opacity: 1; pointer-events: auto; }
body:has(#main-content).menu-open .redesign-menu { visibility: visible; transform: translateY(0); transition-delay: 0s; }
body:has(#main-content) .mobile-menu-top { display: flex; align-items: center; justify-content: space-between; }
body:has(#main-content) .mobile-menu-top a { display: flex; gap: 8px; align-items: center; font-size: 14px; }
body:has(#main-content) .mobile-menu-top img { width: 20px; }
body:has(#main-content) .redesign-menu button, body:has(#main-content) .mobile-toggle { border: 0; padding: 11px 13px; }
body:has(#main-content) .redesign-menu button { background: #242424; }
body:has(#main-content) .mobile-menu-nav { margin-block: auto; padding-block: 7vh; display: grid; gap: 3px; }
body:has(#main-content) .mobile-menu-nav a { width: fit-content; font-size: clamp(44px, 12vw, 70px); font-weight: 400; line-height: .99; letter-spacing: -.085em; }
body:has(#main-content) .mobile-menu-nav a[aria-current] { opacity: .42; }
body:has(#main-content) .mobile-menu-bottom { font-size: 15px; }
body:has(#main-content) .redesign-footer {
  position: sticky; bottom: 0; z-index: -1; color: #fff; background: var(--ink);
  min-height: min(72vh,680px); display: grid; grid-template-rows: auto 1fr auto;
  padding: clamp(50px,8vw,120px) var(--gutter) 32px; gap: 36px;
}
body:has(#main-content) .footer-title { font-size: clamp(34px,min(5vw,7.8svh),78px); letter-spacing: -.072em; line-height: 1; width: fit-content; }
body:has(#main-content) .footer-main { align-self: end; display: grid; grid-template-columns: 2fr 1fr 1fr; gap: 20px; }
body:has(#main-content) .footer-main nav { display: grid; justify-items: start; gap: 6px; }
body:has(#main-content) .footer-main a:hover { text-decoration: underline; text-underline-offset: .22em; }
body:has(#main-content) .footer-bottom { display: flex; justify-content: space-between; border-top: 1px solid #383838; padding-top: 18px; color: #aaa; font-size: 13px; }
body:has(#main-content) #page-view { isolation: isolate; }
body:has(#main-content) #main-content { position: relative; }
body:has(#main-content) #main-content:where(:not(.inner-page)) { background: var(--paper); }
body:has(#main-content) .home-page { background: var(--ink); color: var(--white); }
body:has(#main-content) .home-hero { position: relative; height: calc(var(--vh) * .9); min-height: 420px; overflow: hidden; background: var(--ink); z-index: 1; }
body:has(#main-content) .brand-position { position: absolute; top: 80px; left: var(--gutter); right: var(--gutter); }
body:has(#main-content) .brand-title { font-size: clamp(54px, 18.6vw, 355px); font-weight: 490; line-height: .98; letter-spacing: -.047em; }
body:has(#main-content) .brand-mask { display: block; overflow: hidden; height: 1.02em; }
body:has(#main-content) .brand-letters { display: inline-block; white-space: nowrap; width: max-content; transform: scaleX(var(--brand-scale,.69)); transform-origin: left top; padding-right: .085em; }
body:has(#main-content) .brand-letter { display: inline-block; }
body:has(#main-content) .brand-gap { margin-inline: .035em; }
body:has(#main-content) .home-hero .brand-letter {
  animation: letter-entry 2.3s var(--type-ease-out) both;
  animation-delay: calc(200ms + var(--letter-index) * 27.27ms);
}
@keyframes letter-entry { from { transform: translateY(-110%); } to { transform: translateY(0); } }
body:has(#main-content) .hero-notes { position: absolute; left: var(--gutter); right: var(--gutter); bottom: clamp(18px,3vw,46px); display: grid; grid-template-columns: minmax(155px, .16fr) 1fr auto; gap: 12px; align-items: end; font-size: var(--small); line-height: 1.14; }
body:has(#main-content) .hero-caption-mask { display: block; overflow: hidden; }
body:has(#main-content) .hero-caption-mask > span {
  display: block;
  animation: caption-entry 1.6s var(--type-ease-out) both;
  animation-delay: calc(var(--caption-delay, 1s) + var(--caption-line) * 100ms);
}
body:has(#main-content) .hero-notes > .hero-caption + .hero-caption { --caption-delay: 1.1s; }
@keyframes caption-entry { from { transform: translateY(-100%); } to { transform: translateY(0); } }
body:has(#main-content) .hero-down { border: 0; padding: 5px 1px 0 12px; background: transparent; font-size: 23px; line-height: 1; transition: transform .3s ease; }
body:has(#main-content) .hero-down:hover { transform: translateY(4px); }
body:has(#main-content) .reel-section { height: var(--vh); min-height: 380px; position: relative; overflow: hidden; background: #141119; color: #fff; }
body:has(#main-content) .reel-studio { height: min(88svh, 820px); }
body:has(#main-content) .reel-image { position: absolute; inset: 0; }
body:has(#main-content) .reel-image video { display: block; pointer-events: none; }
body:has(#main-content) .reel-section::after { content: ""; position: absolute; inset: 60% 0 0; background: linear-gradient(transparent, #0009); pointer-events: none; }
body:has(#main-content) .reel-info { position: absolute; z-index: 1; left: var(--gutter); bottom: 27px; display: grid; gap: 4px; font-size: 14px; pointer-events: none; }
body:has(#main-content) .reel-info span + span { opacity: .72; font-variant-numeric: tabular-nums; }
body:has(#main-content) .reel-sound, body:has(#main-content) .reel-play { position: absolute; z-index: 2; border: 1px solid #ffffff65; background: #101014d9; color: #fff; line-height: 1.2; }
body:has(#main-content) .reel-sound { right: var(--gutter); bottom: 24px; min-height: 44px; display: flex; align-items: center; justify-content: center; gap: 7px; padding: 9px 14px; border-radius: 100px; font-size: 13px; }
body:has(#main-content) .reel-play { top: 80px; right: var(--gutter); border-radius: 100px; min-height: 40px; padding: 7px 14px; font-size: 13px; }
body:has(#main-content) .reel-sound:hover, body:has(#main-content) .reel-play:hover { background: #fff; color: #0b0b0b; }
@media (hover:hover) and (pointer:fine) and (min-width:761px) {
  body:has(#main-content) .reel-sound { width: 100px; height: 100px; flex-direction: column; gap: 6px; padding: 13px; font-size: 11px; text-align: center; }
  body:has(#main-content) .reel-section.is-following { cursor: none; }
  body:has(#main-content) .reel-section.is-following .reel-sound { left: 0; top: 0; right: auto; bottom: auto; transform: translate3d(var(--follow-x,0px), var(--follow-y,0px), 0); cursor: none; will-change: transform; }
  body:has(#main-content) .reel-section.is-following .reel-sound:hover { background: #101014d9; color: #fff; }
}
body:has(#main-content) .home-intro { padding-top: clamp(72px,10vw,170px); }
body:has(#main-content) .home-intro .editorial-lead, body:has(#main-content) .approach .editorial-lead { max-width: 1330px; }
body:has(#main-content) .editorial-row { display: grid; grid-template-columns: 1fr 1fr; gap: 30px; padding-block: 26px 45px; border-top: 1px solid var(--rule); font-size: clamp(16px,1.38vw,25px); line-height: 1.28; letter-spacing: -.025em; }
body:has(#main-content) .home-intro .editorial-row { border-color: #424242; margin-top: clamp(55px,8vw,126px); }
body:has(#main-content) .editorial-row > :nth-child(2) { max-width: 540px; }
body:has(#main-content) .editorial-row .text-link { margin-top: 24px; }
body:has(#main-content) .highlights { padding: clamp(110px,15vw,250px) 0 clamp(100px,13vw,210px); }
body:has(#main-content) .highlights-head { display: flex; justify-content: space-between; align-items: baseline; gap: 15px; margin-bottom: 13px; font-size: clamp(15px,1.4vw,24px); }
body:has(#main-content) .highlights-head h2 { font: inherit; }
body:has(#main-content) .highlight-grid { margin-inline: var(--gutter); display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
body:has(#main-content) .highlight-card { position: relative; display: block; aspect-ratio: .94; background: #262626; overflow: hidden; isolation: isolate; }
body:has(#main-content) .highlight-card:first-child { grid-column: 1/-1; aspect-ratio: 1.64; }
body:has(#main-content) .highlight-cover, body:has(#main-content) .highlight-shadow { position: absolute; inset: 0; width: 100%; height: 100%; }
body:has(#main-content) .highlight-cover { object-fit: cover; }
body:has(#main-content) .highlight-shadow { background: #0a0a0a; opacity: .12; transition: opacity .55s ease; }
body:has(#main-content) .highlight-name { position: absolute; bottom: 7%; left: 50%; translate: -50% 0; color: #fff; white-space: nowrap; font-size: clamp(19px,2.55vw,48px); font-weight: 550; letter-spacing: -.055em; transition: opacity .35s ease; text-shadow: 0 1px 18px rgba(0,0,0,.8); }
body:has(#main-content) .highlight-hover { position: absolute; left: 50%; top: 50%; width: min(69%, 380px); translate: -50% -50%; color: #fff; pointer-events: none; opacity: 0; visibility: hidden; transition: opacity .25s ease, visibility 0s .25s; z-index: 2; }
body:has(#main-content) .highlight-card:first-child .highlight-hover { width: min(35%, 405px); }
body:has(#main-content) .highlight-hover > span:first-child { display: flex; justify-content: space-between; gap: 12px; padding: 9px 12px; background: #141414; font-size: 13px; text-align: left; }
body:has(#main-content) .highlight-hover video { display: block; width: 100%; aspect-ratio: 16/9; object-fit: contain; background: #151515; }
body:has(#main-content) .highlight-card.preview-active .highlight-shadow { opacity: .55; }
body:has(#main-content) .highlight-card.preview-active .highlight-name { opacity: 0; }
body:has(#main-content) .highlight-card.preview-active .highlight-hover { opacity: 1; visibility: visible; transition-delay: 0s; }
body:has(#main-content) .highlight-card.is-following .highlight-hover { left: 0; top: 0; translate: none; transform: translate3d(var(--follow-x,0px), var(--follow-y,0px), 0); will-change: transform; }
body:has(#main-content) .home-studio { color: var(--ink); background: var(--paper); }
body:has(#main-content) .ledger { display: flex; align-items: center; justify-content: space-between; gap: 28px; min-height: clamp(170px,27vw,420px); border-bottom: 1px solid var(--rule); }
body:has(#main-content) .ledger a { white-space: nowrap; font-size: clamp(18px,2.4vw,38px); font-weight: 600; letter-spacing: -.075em; }
body:has(#main-content) .ledger a:hover { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: .22em; }
body:has(#main-content) .approach { padding-top: clamp(75px,9vw,150px); }
body:has(#main-content) .approach .editorial-lead { margin-block: 34px clamp(60px,9vw,130px); }
body:has(#main-content) .home-end { min-height: calc(var(--vh) * .64); display: grid; place-items: center; text-align: center; padding-inline: var(--gutter); }
body:has(#main-content) .home-end a { text-decoration: underline; text-underline-offset: .15em; text-decoration-thickness: 1px; }

body:has(#main-content) .work-page { background: var(--paper); }
body:has(#main-content) .work-intro { min-height: calc(var(--vh) * .9); padding-top: 140px; padding-bottom: clamp(35px,6vh,80px); display: flex; flex-direction: column; justify-content: end; gap: 26px; }
body:has(#main-content) .work-intro h1 { max-width: min(100%,1250px); }
body:has(#main-content) .work-desktop { height: calc(var(--work-count) * var(--vh)); position: relative; background: #080808; color: #fff; --list-step: clamp(68px,6.4vw,110px); }
body:has(#main-content) .work-desktop[data-work-mode="list"] { height: calc(var(--vh) + (var(--work-count) - 1) * var(--list-step)); }
body:has(#main-content) .work-stage { position: sticky; top: 0; height: var(--vh); overflow: hidden; background: #080808; }
body:has(#main-content) .work-full, body:has(#main-content) .work-list { position: absolute; inset: 0; overflow: hidden; }
body:has(#main-content) .work-slide { display: block; position: absolute; inset: 0; transform: translate3d(0,var(--slide-y,0px),0); overflow: hidden; background: #191919; color: #fff; }
body:has(#main-content) .work-slide:not(:first-child) { --slide-y: var(--vh); }
body:has(#main-content) .work-cover { width: 100%; height: 100%; object-fit: cover; transform: translate3d(0,var(--cover-y,0px),0); opacity: var(--cover-opacity,1); }
body:has(#main-content) .work-shade { position: absolute; inset: 0; background: rgba(0,0,0,.24); pointer-events: none; }
body:has(#main-content) .work-title { position: absolute; left: 50%; top: calc(50% + var(--cover-y,0px)); translate: -50% -50%; white-space: nowrap; font-size: clamp(38px,5vw,94px); line-height: 1.05; letter-spacing: -.07em; text-decoration: underline; text-underline-offset: .12em; text-decoration-thickness: 1px; }
body:has(#main-content) .work-ordinal { position: absolute; right: var(--gutter); bottom: 28px; font-size: 15px; }
body:has(#main-content) .work-toggle { position: absolute; z-index: 8; bottom: 24px; left: var(--gutter); display: flex; align-items: center; gap: 8px; color: #fff; background: #141414b8; border: 1px solid #ffffff70; border-radius: 100px; padding: 9px 14px; font-size: 14px; }
body:has(#main-content) .work-toggle:hover, body:has(#main-content) .work-toggle:focus-visible { background: #fff; color: #080808; }
body:has(#main-content) .work-preview { position: absolute; left: var(--gutter); top: 50%; translate: 0 -50%; width: min(17vw,245px); aspect-ratio: 1.48; overflow: hidden; }
body:has(#main-content) .work-list-preview { position: absolute; inset: 0; opacity: 0; scale: 1.055; transition: opacity .38s ease, scale .55s ease; }
body:has(#main-content) .work-list-preview.is-preview { opacity: 1; scale: 1; z-index: 1; }
body:has(#main-content) .work-preview-cover { width: 100%; height: 100%; object-fit: cover; }
body:has(#main-content) .work-list-number { position: absolute; top: 50%; translate: 0 -50%; right: var(--gutter); font-size: 15px; }
body:has(#main-content) .work-list-center { position: absolute; inset: 0 19%; display: flex; align-items: center; justify-content: center; }
body:has(#main-content) .work-list-track { position: absolute; top: calc(50% - var(--list-step) / 2); display: flex; flex-direction: column; align-items: center; width: 100%; transform: translate3d(0,var(--list-y,0px),0); }
body:has(#main-content) .work-row { height: var(--list-step); display: flex; align-items: center; justify-content: center; font-size: clamp(34px,6.25vw,105px); letter-spacing: -.086em; line-height: 1; color: #fff; opacity: .35; transition: opacity .25s ease; white-space: nowrap; }
body:has(#main-content) .work-row.is-current, body:has(#main-content) .work-row:hover, body:has(#main-content) .work-row:focus-visible { opacity: 1; }
body:has(#main-content) .work-row:hover, body:has(#main-content) .work-row:focus-visible { text-decoration: underline; text-underline-offset: .12em; text-decoration-thickness: 1px; }
body:has(#main-content) .work-mobile { display: none; }

body:has(#main-content).menu-open { overflow: hidden; }

@media (max-width: 760px) {
  body:has(#main-content) { --gutter: 14px; --small: 14px; --lead: clamp(26px, 7vw, 42px); }
  body:has(#main-content) .indent-lead { text-indent: 0; }
  body:has(#main-content) .header-inner { display: flex; justify-content: space-between; padding: 15px var(--gutter); gap: 10px; }
  body:has(#main-content) .header-home { padding-left: 25px; }
  body:has(#main-content) .header-mark { width: 18px; height: 18px; top: 25px; }
  body:has(#main-content) .desktop-nav, body:has(#main-content) .header-contact { display: none; }
  body:has(#main-content) .mobile-toggle { display: block; background: rgb(255 255 255 / 13%); color: inherit; }
  body:has(#main-content) .brand-title { font-size: 17.5vw; }
  body:has(#main-content) .home-hero { min-height: 460px; }
  body:has(#main-content) .hero-notes { grid-template-columns: auto 1fr auto; gap: 15px; font-size: 13px; }
  body:has(#main-content) .home-intro { padding-top: 72px; }
  body:has(#main-content) .editorial-row { grid-template-columns: .83fr 1fr; gap: 13px; padding-block: 18px 28px; font-size: 14px; }
  body:has(#main-content) .editorial-row .text-link { margin-top: 18px; }
  body:has(#main-content) .home-intro .editorial-row { margin-top: 47px; }
  body:has(#main-content) .highlights { padding: 96px 0 86px; }
  body:has(#main-content) .highlight-grid { display: flex; margin: 0; padding-inline: var(--gutter); gap: 9px; overflow-x: auto; scrollbar-width: none; scroll-snap-type: x mandatory; scroll-padding-inline: var(--gutter); overscroll-behavior-inline: contain; }
  body:has(#main-content) .highlight-grid::-webkit-scrollbar { display: none; }
  body:has(#main-content) .highlight-card, body:has(#main-content) .highlight-card:first-child { flex: 0 0 76%; aspect-ratio: .79; scroll-snap-align: start; }
  body:has(#main-content) .highlight-hover { display: none; }
  body:has(#main-content) .highlight-name { font-size: 21px; }
  body:has(#main-content) .ledger { overflow-x: auto; justify-content: flex-start; min-height: 150px; scrollbar-width: none; gap: 32px; }
  body:has(#main-content) .ledger a { font-size: 24px; }
  body:has(#main-content) .approach { padding-top: 65px; }
  body:has(#main-content) .approach .editorial-lead { margin-block: 20px 46px; }
  body:has(#main-content) .home-end { min-height: 52vh; }
  body:has(#main-content) .work-intro { padding-bottom: 32px; gap: 16px; }
  body:has(#main-content) .work-desktop { display: none; }
  body:has(#main-content) .work-mobile { display: block; }
  body:has(#main-content) .mobile-work { display: block; position: relative; aspect-ratio: 1.05; background: #202020; color: #fff; overflow: hidden; }
  body:has(#main-content) .mobile-work img { width: 100%; height: 100%; object-fit: cover; }
  body:has(#main-content) .mobile-work-title { position: absolute; bottom: 18px; left: var(--gutter); font-size: 21px; font-weight: 550; letter-spacing: -.055em; }
  body:has(#main-content) .mobile-work .work-ordinal { bottom: 20px; font-size: 13px; }
  body:has(#main-content) .redesign-footer { position: relative; z-index: 0; padding-top: 56px; min-height: 430px; }
  body:has(#main-content) .footer-main { grid-template-columns: 1fr 1fr; gap: 24px 12px; font-size: 14px; }
  body:has(#main-content) .footer-main > div:last-child { display: none; }
  body:has(#main-content) .footer-title { font-size: clamp(31px,8vw,48px); }
  body:has(#main-content) .footer-bottom { font-size: 12px; }
}
@media (min-width:761px) { body:has(#main-content) .redesign-menu, body:has(#main-content) .menu-veil { display: none; } }
html[data-type-restored] body:has(#main-content) .home-hero .brand-letter,
html[data-type-restored] body:has(#main-content) .hero-caption-mask > span,
html[data-type-restored] body:has(#main-content) .entry-word > span { animation: none; }
@media (prefers-reduced-motion: reduce) {
  body:has(#main-content) *, body:has(#main-content) *::before, body:has(#main-content) *::after { animation-duration: .001ms !important; transition-duration: .001ms !important; transition-delay: 0ms !important; scroll-behavior: auto !important; }
  body:has(#main-content) [data-parallax] { translate: 0 0 !important; }
  body:has(#main-content) .work-desktop { display: none; }
  body:has(#main-content) .work-mobile { display: block; }
  body:has(#main-content) .mobile-work { display: block; position: relative; overflow: hidden; background: #151515; color: #fff; }
  body:has(#main-content) .mobile-work img { width: 100%; max-height: 82vh; object-fit: cover; }
  body:has(#main-content) .mobile-work-title { position: absolute; bottom: 20px; left: var(--gutter); }
  body:has(#main-content) [data-reveal].prepared .word-mask > span { transform: none !important; transition: none !important; }
  body:has(#main-content) [data-reveal="fade"].prepared { opacity: 1 !important; transition: none !important; }
  body:has(#main-content) .home-hero .brand-letter,
  body:has(#main-content) .hero-caption-mask > span,
  body:has(#main-content) .entry-word > span { animation: none; }
}

body:has(#main-content) .privacy-page { background: var(--ink); color: #fff; padding-top: clamp(105px, 17vh, 185px); padding-bottom: clamp(70px, 10vw, 140px); }
body:has(#main-content) .privacy-page h1 { font-size: clamp(46px, 8vw, 126px); max-width: 11em; font-weight: 400; line-height: .99; letter-spacing: -.075em; margin-block: clamp(48px, 8vw, 120px); }
body:has(#main-content) .privacy-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 30px; border-top: 1px solid #494949; padding-top: 25px; font-size: var(--small); }
body:has(#main-content) .privacy-grid > p { color: #bbb; max-width: 26em; }
body:has(#main-content) .privacy-body { white-space: pre-wrap; line-height: 1.55; margin-bottom: 32px; }
@media (max-width: 760px) { body:has(#main-content) .privacy-page h1 { font-size: clamp(34px,8vw,56px); overflow-wrap: anywhere; } body:has(#main-content) .privacy-grid { grid-template-columns: 1fr; gap: 18px; } }

body:has(#main-content) .fact-section { padding-block: clamp(58px,7vw,110px) clamp(46px,7vw,110px); }
body:has(#main-content) .fact-heading { display: flex; justify-content: space-between; align-items: baseline; gap: 16px; margin-bottom: 32px; }
body:has(#main-content) .fact-heading h2 { font-size: var(--small); font-weight: inherit; }
body:has(#main-content) .fact-heading .text-link { white-space: nowrap; }
body:has(#main-content) .fact-scroller { display: flex; overflow: auto hidden; scrollbar-width: none; cursor: grab; }
body:has(#main-content) .fact-scroller::-webkit-scrollbar { display: none; }
body:has(#main-content) .fact-scroller.is-dragging { cursor: grabbing; user-select: none; }
body:has(#main-content) .fact-track { display: flex; flex: 0 0 auto; gap: 10px; padding-right: 10px; }
body:has(#main-content) .fact-panel { width: clamp(260px,34vw,540px); height: clamp(265px,30vw,465px); padding: clamp(18px,2.6vw,42px); display: flex; flex-direction: column; justify-content: space-between; overflow: hidden; position: relative; }
body:has(#main-content) .fact-panel p { font-size: var(--small); }
body:has(#main-content) .fact-panel strong { font-weight: 470; line-height: .95; letter-spacing: -.079em; }
body:has(#main-content) .fact-art { background: #111; color: #fff; justify-content: flex-end; }
body:has(#main-content) .fact-art .fact-cover { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; pointer-events: none; }
body:has(#main-content) .fact-art::after { content: ""; position: absolute; inset: 55% 0 0; background: linear-gradient(transparent,#0009); }
body:has(#main-content) .fact-art p { position: relative; z-index: 1; }
@media (max-width:760px), (prefers-reduced-motion: reduce) {
  body:has(#main-content) .fact-clone { display: none; }
  body:has(#main-content) .fact-track { padding-inline: var(--gutter); }
  body:has(#main-content) .fact-scroller { scroll-snap-type: x proximity; scroll-padding-inline: var(--gutter); }
  body:has(#main-content) .fact-panel { scroll-snap-align: start; }
}


body:has(#main-content) .redesign-footer { grid-template-columns: minmax(0,1fr); grid-template-rows: repeat(4, auto); min-height: 0; padding-block: clamp(22px,4.7svh,46px) clamp(16px,3svh,32px); gap: clamp(13px,2.7svh,26px); }
body:has(#main-content) .footer-brand { display: block; min-width: 0; margin-top: 0; width: 100%; font-size: clamp(45px,min(18.6vw,32svh),355px); }
body:has(#main-content) .footer-brand.is-animated .brand-letter { transform: translateY(-110%); }
body:has(#main-content) .footer-brand.is-visible .brand-letter {
  animation: letter-entry 2s var(--type-ease-out) both;
  animation-delay: calc(var(--footer-entry-delay, 400ms) + var(--letter-index) * var(--footer-letter-step, 31.82ms));
}
@media (max-width: 1023px) {
  body:has(#main-content) .footer-brand { --footer-entry-delay: 200ms; --footer-letter-step: 18.18ms; }
}
body:has(#main-content) .fact-scroller.is-composited { overflow: hidden; touch-action: pan-y; }
body:has(#main-content) .fact-scroller.is-composited .fact-track { transform: translate3d(var(--fact-x,0px),0,0); will-change: transform; }
@media (max-width:760px) {
  body:has(#main-content) .footer-brand { font-size: 17.5vw; }
  body:has(#main-content) .redesign-footer { min-height: 0; padding-block: 30px 16px; }
  body:has(#main-content) .reel-studio { height: min(82svh,720px); }
  body:has(#main-content) .reel-image video { object-fit: contain; object-position: center; }
  body:has(#main-content) .reel-play { top: 62px; }
}
@media (prefers-reduced-motion: reduce) {
  body:has(#main-content) .footer-brand .brand-letter { animation: none !important; transform: none !important; }
}

@media (min-width:761px) {
  body:has(#main-content) .redesign-header, body:has(#main-content) .header-mark { transition: opacity .24s ease, visibility .24s; }
  body:has(#main-content) .redesign-header.footer-is-primary, body:has(#main-content) .header-mark.footer-is-primary { opacity: 0; visibility: hidden; }
}

body:has(#main-content) .project-brand { display: inline-flex; align-items: center; justify-content: center; gap: .38em; vertical-align: middle; max-width: 100%; line-height: 1.06; }
body:has(#main-content) .project-brand-image { width: var(--mark-w,160px); max-width: 100%; height: var(--mark-h,46px); object-fit: contain; filter: drop-shadow(0 2px 12px #0006); }
body:has(#main-content) .project-brand-dark { background: #f7f5f0; color: #141414; padding: .22em .36em; border-radius: 2px; }
body:has(#main-content) .project-brand-dark .project-brand-image { filter: none; }
body:has(#main-content) .project-brand-label { font-weight: 600; }
body:has(#main-content) .project-brand-monochrome .project-brand-image { filter: brightness(0) invert(1) drop-shadow(0 2px 10px #0005); }
body:has(#main-content) .project-brand:has(.project-brand-label) .project-brand-image { width: auto; max-width: var(--mark-h,46px); }
body:has(#main-content) .highlight-name { --mark-w: clamp(120px,15vw,220px); --mark-h: clamp(32px,4.8vw,62px); max-width: calc(100% - 34px); }
body:has(#main-content) .highlight-card:first-child .highlight-name { --mark-w: clamp(138px,17vw,252px); }
body:has(#main-content) .work-title { --mark-w: clamp(166px,22vw,340px); --mark-h: clamp(52px,7vw,112px); max-width: calc(100% - 44px); text-decoration: none; }
body:has(#main-content) .work-preview-mark { position: absolute; bottom: 9%; left: 50%; translate: -50% 0; --mark-w: clamp(66px,8vw,124px); --mark-h: clamp(21px,2.9vw,38px); max-width: 84%; }
body:has(#main-content) .fact-brand { position: relative; z-index: 1; font-size: clamp(19px,2vw,34px); letter-spacing: -.055em; --mark-w: clamp(110px,12vw,183px); --mark-h: clamp(34px,4vw,58px); }
body:has(#main-content) .fact-brand .project-brand { justify-content: start; }
body:has(#main-content) .fact-art { justify-content: space-between; }
body:has(#main-content) .fact-art::after { inset: 0; background: linear-gradient(#0007,transparent 40%,transparent 60%,#0009); }
body:has(#main-content) .fact-identity { color: #fff; justify-content: space-between; }
body:has(#main-content) .fact-identity .fact-brand { margin-block: auto; --mark-w: clamp(145px,17vw,253px); --mark-h: clamp(40px,5vw,72px); }
body:has(#main-content) .fact-ds4cargo { background: #202821; }
body:has(#main-content) .fact-merctruck { background: #0b1b2b; }
body:has(#main-content) .mobile-work-title { --mark-w: min(38vw,170px); --mark-h: clamp(26px,9vw,44px); max-width: 65%; }
@media (max-width:760px) {
  body:has(#main-content) .highlight-name { --mark-w: min(42vw,155px); --mark-h: clamp(30px,10vw,46px); }
}

/* Crossfade the two viewport snapshots, with the fixed header on top. */
body:has(#main-content) .redesign-header { view-transition-name: route-header; }
body:has(#main-content) .header-mark { view-transition-name: route-mark; }
::view-transition { pointer-events: none; }
::view-transition-group(root) { animation-duration: 240ms; }
::view-transition-old(root) { animation: route-out 240ms ease both; mix-blend-mode: normal; }
::view-transition-new(root) { animation: route-in 240ms ease both; mix-blend-mode: normal; }
::view-transition-group(route-header), ::view-transition-group(route-mark) { z-index: 2; animation: none; }
::view-transition-old(route-header), ::view-transition-old(route-mark) { animation: none; opacity: 0; }
::view-transition-new(route-header), ::view-transition-new(route-mark) { animation: none; }
@keyframes route-out { from { opacity: 1; } to { opacity: 0; } }
@keyframes route-in { from { opacity: 0; } to { opacity: 1; } }

body:has(#main-content) .reel-frame { position: absolute; inset: 0; overflow: hidden; }
body:has(#main-content) .reel-image { background: #0b0e11; }
body:has(#main-content) .reel-image .reel-poster, body:has(#main-content) .reel-image video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; background: inherit; }
body:has(#main-content) .reel-image video { opacity: 0; transition: opacity .24s ease; }
body:has(#main-content) .reel-section.is-playing-frame video { opacity: 1; }
body:has(#main-content) .hero-mobile-copy { display: none; }

@media (max-width: 760px) {
  body:has(#main-content) .header-inner { padding-block: 10px; }
  body:has(#main-content) .mobile-toggle, body:has(#main-content) .redesign-menu button { min-height: 44px; }
  body:has(#main-content) .header-mark { top: 23px; }
  body:has(#main-content) .home-hero { min-height: 0; }
  body:has(#main-content) .hero-notes { display: flex; align-items: end; justify-content: space-between; gap: 16px; bottom: 22px; }
  body:has(#main-content) .hero-notes > p { display: none; }
  body:has(#main-content) .hero-mobile-copy { display: block; }
  body:has(#main-content) .hero-mobile-copy p { max-width: 19ch; font-size: clamp(20px,6vw,28px); line-height: 1.12; letter-spacing: -.045em; }
  body:has(#main-content) .hero-mobile-copy .text-link { margin-top: 8px; min-height: 44px; align-items: center; font-size: 13px; }
  body:has(#main-content) .hero-down { min-width: 44px; min-height: 44px; padding: 5px; border: 1px solid #ffffff60; border-radius: 50%; }
  body:has(#main-content) .home-intro { padding-top: 48px; }
  body:has(#main-content) .home-intro .editorial-row { grid-template-columns: 1fr; gap: 12px; margin-top: 32px; }
  body:has(#main-content) .highlights { padding-block: 66px 52px; }
  body:has(#main-content) .highlight-grid .highlight-card { flex-basis: 80%; }
  body:has(#main-content) .ledger { min-height: 88px; }
  body:has(#main-content) .fact-section { padding-top: 46px; }
  body:has(#main-content) .work-intro { min-height: 0; padding-top: 103px; padding-bottom: 32px; gap: 13px; }
  body:has(#main-content) .work-intro .editorial-lead { max-width: 24ch; }
  body:has(#main-content) .reel-section, body:has(#main-content) .reel-studio { height: var(--vh); height: 100dvh; min-height: 0; }
  body:has(#main-content) .reel-info { bottom: calc(24px + env(safe-area-inset-bottom)); font-size: 13px; }
  body:has(#main-content) .reel-sound { bottom: calc(20px + env(safe-area-inset-bottom)); }
  body:has(#main-content) .reel-play { min-height: 44px; }

  body:has(#main-content .home-hero) { --hero-cookie-viewport: var(--vh); }
  @supports (height: 100dvh) {
    body:has(#main-content .home-hero) { --hero-cookie-viewport: 100dvh; }
  }
  body:has(#main-content .home-hero) .cookie-consent-panel {
    max-height: max(64px, calc(var(--hero-cookie-viewport) - var(--hero-cookie-reserve, 0px) - 24px));
    overflow: auto;
    overscroll-behavior: contain;
  }
  body:has(#main-content .home-hero) .cookie-consent-actions button { white-space: normal; }
  body:has(#main-content .home-hero):has(.cookie-consent) .hero-notes {
    bottom: max(22px, calc(100% - var(--hero-cookie-viewport) + var(--hero-cookie-occupied, 0px) + 12px));
  }
}

@media (max-width: 760px) and (max-height: 450px) {
  body:has(#main-content .home-hero) .home-hero .brand-position { top: 60px; }
  body:has(#main-content .home-hero) .home-hero .brand-title { font-size: min(17.5vw, 16vh); }
}

@media (max-width: 760px) {
  ::view-transition-group(root) { animation-duration: 200ms; }
  ::view-transition-old(root) { animation: none; opacity: 1; }
  ::view-transition-new(root) { animation: route-mobile-in 200ms cubic-bezier(.2,.65,.25,1) both; }
}
@keyframes route-mobile-in { from { opacity: .94; transform: translateY(3px); } to { opacity: 1; transform: translateY(0); } }

body:has(#main-content) .case-page {
  --case-edge: var(--gutter, 40px);
  --case-line: rgb(16 16 16 / 22%);
  --case-lead: clamp(31px, 3.7vw, 59px);
  --case-body: clamp(15px, 1.1vw, 18px);
  color: var(--ink, #101010);
  background: var(--paper, #f7f7f3);
}

body:has(#main-content) .case-page :is(h1,h2,p,figure) { margin: 0; }

body:has(#main-content) .case-hero {
  position: relative;
  display: flex;
  min-height: clamp(420px, 68svh, 750px);
  align-items: flex-end;
  isolation: isolate;
  overflow: hidden;
  background: #161618;
  color: #fff;
}

body:has(#main-content) .case-parallax,
body:has(#main-content) .case-hero-gradient {
  position: absolute;
  inset: 0;
  z-index: -1;
}

body:has(#main-content) .case-cover-image,
body:has(#main-content) .case-next-link img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: var(--case-position, center);
}

body:has(#main-content) .case-hero-gradient {
  background: linear-gradient(180deg, rgb(0 0 0 / 22%), transparent 38%, rgb(0 0 0 / 12%) 52%, rgb(0 0 0 / 76%) 100%);
}

body:has(#main-content) .case-hero-copy {
  width: 56%;
  margin-left: 44%;
  padding: 0 var(--case-edge) clamp(25px, 5svh, 56px) 0;
}

body:has(#main-content) .case-hero-copy h1 {
  margin-top: 9px;
  max-width: 100%;
  font-size: clamp(44px, 5.8vw, 94px);
  font-weight: 400;
  letter-spacing: -.065em;
  line-height: .99;
  overflow-wrap: anywhere;
}

body:has(#main-content) .case-kicker {
  font-size: var(--small, 13px);
  line-height: 1.35;
  letter-spacing: -.01em;
}

body:has(#main-content) .case-hero-notes {
  position: absolute;
  bottom: clamp(25px, 5svh, 56px);
  left: var(--case-edge);
  font-size: var(--small, 13px);
}

body:has(#main-content) .case-summary,
body:has(#main-content) .case-ending {
  display: grid;
  grid-template-columns: minmax(0, .52fr) minmax(0, 1.48fr);
  gap: var(--case-edge);
  padding: clamp(26px, 5.2svh, 72px) var(--case-edge);
}

body:has(#main-content) .case-summary-copy h2,
body:has(#main-content) .case-ending h2,
body:has(#main-content) .case-story h2 {
  max-width: 23ch;
  font-size: var(--case-lead);
  font-weight: 400;
  letter-spacing: -.051em;
  line-height: 1.04;
  text-wrap: balance;
}

body:has(#main-content) .case-summary-copy > p,
body:has(#main-content) .case-story-copy > p:last-child {
  max-width: 52ch;
  margin-top: clamp(13px, 1.8vw, 25px);
  font-size: var(--case-body);
  line-height: 1.48;
  letter-spacing: -.015em;
}

body:has(#main-content) .case-scope ul {
  list-style: none;
  margin: 12px 0 0;
  padding: 0;
  font-size: var(--case-body);
  line-height: 1.55;
}

body:has(#main-content) .case-evidence {
  padding: clamp(25px, 5svh, 65px) var(--case-edge) clamp(36px, 6vw, 90px);
}

body:has(#main-content) .case-story {
  display: grid;
  grid-template-columns: minmax(0, 1.65fr) minmax(0, .8fr);
  align-items: center;
  gap: clamp(26px, 6vw, 105px);
}

body:has(#main-content) .case-story + .case-story,
body:has(#main-content) .case-vv-photos + .case-story {
  margin-top: clamp(46px, 7vw, 110px);
  padding-top: clamp(28px, 4vw, 60px);
  border-top: 1px solid currentColor;
  border-color: rgb(150 154 155 / 31%);
}

body:has(#main-content) .case-story h2 {
  margin-top: clamp(10px, 2vw, 23px);
  font-size: clamp(27px, 3.12vw, 50px);
}

body:has(#main-content) .case-photo { min-width: 0; }

body:has(#main-content) .case-photo-image {
  position: relative;
  overflow: hidden;
  background: #1b1d20;
}

body:has(#main-content) .case-photo img {
  display: block;
  width: 100%;
  height: auto;
}

body:has(#main-content) .case-photo figcaption {
  display: flex;
  min-height: 44px;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding-block: 4px;
  font-size: var(--small, 13px);
  line-height: 1.25;
}

body:has(#main-content) .case-inline-link,
body:has(#main-content) .case-photo figcaption button {
  color: inherit;
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: .24em;
}

body:has(#main-content) .case-inline-link:hover,
body:has(#main-content) .case-photo figcaption button:hover { text-decoration-thickness: 2px; }

body:has(#main-content) .case-inline-link:focus-visible,
body:has(#main-content) .case-photo figcaption button:focus-visible,
body:has(#main-content) .case-next-link:focus-visible {
  outline: 2px solid currentColor;
  outline-offset: 4px;
}

body:has(#main-content) .case-photo figcaption button {
  min-height: 44px;
  flex: none;
  border: 0;
  padding: 0 3px;
  background: transparent;
  font: inherit;
  white-space: nowrap;
  cursor: pointer;
}

body:has(#main-content) .case-shop {
  padding-top: 0;
}

body:has(#main-content) .case-shop .case-photo-image { background: #eae8e0; }

body:has(#main-content) .case-shop-pair,
body:has(#main-content) .case-vv-photos {
  display: grid;
  grid-template-columns: repeat(2,minmax(0,1fr));
  gap: var(--case-edge);
  margin-top: clamp(24px, 4vw, 66px);
}

body:has(#main-content) .case-cargo { background: #e8e9e2; color: #111412; }
body:has(#main-content) .case-cargo .case-story { grid-template-columns: minmax(0, 1.9fr) minmax(0, .85fr); }
body:has(#main-content) .case-cargo .case-photo-image { background: #171c1b; }

body:has(#main-content) .case-mer { background: #0a1016; color: #f7f9fa; }
body:has(#main-content) .case-mer .case-story-copy > p:last-child { color: #c6d0d8; }
body:has(#main-content) .case-mer .case-photo img { aspect-ratio: 1.6; object-fit: cover; }

body:has(#main-content) .case-volt { background: #e7ebf3; color: #172336; }
body:has(#main-content) .case-volt .case-photo-image { background: #112136; }

body:has(#main-content) .case-vv { background: #111115; color: #f4f3f2; }
body:has(#main-content) .case-vv .case-story-copy > p:last-child { color: #d0cdd6; }
body:has(#main-content) .case-vv-photos .case-photo img { aspect-ratio: 1.44; object-fit: cover; }

body:has(#main-content) .case-ending {
  border-top: 1px solid var(--case-line);
}

body:has(#main-content) .case-ending .case-inline-link {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  margin-top: 14px;
  gap: 5px;
  font-size: var(--case-body);
}

body:has(#main-content) .case-next { padding: 0 var(--case-edge) var(--case-edge); }

body:has(#main-content) .case-next-label {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 46px;
  border-top: 1px solid var(--case-line);
  font-size: var(--small, 13px);
  line-height: 1.25;
}

body:has(#main-content) .case-next-label .case-inline-link {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  gap: 5px;
}

body:has(#main-content) .case-next-link {
  position: relative;
  display: grid;
  place-items: center;
  isolation: isolate;
  overflow: hidden;
  aspect-ratio: 2.08;
  background: #171719;
  color: #fff;
  text-decoration: none;
}

body:has(#main-content) .case-next-link img {
  position: absolute;
  inset: 0;
  z-index: -2;
  transition: transform 650ms cubic-bezier(.22,.72,.18,1);
}

body:has(#main-content) .case-next-link::after {
  position: absolute;
  z-index: -1;
  inset: 0;
  background: rgb(0 0 0 / 37%);
  content: '';
}

body:has(#main-content) .case-next-title {
  position: relative;
  display: block;
  padding: 0 .05em .09em;
  overflow: hidden;
  font-size: clamp(35px, 5vw, 73px);
  line-height: 1.05;
  letter-spacing: -.055em;
  white-space: nowrap;
}

body:has(#main-content) .case-next-title > span {
  display: block;
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: .17em;
  transition: translate 440ms cubic-bezier(.22,.72,.18,1);
}

body:has(#main-content) .case-next-title i {
  display: inline-block;
  margin-left: .3em;
  font-size: .62em;
  font-style: normal;
  vertical-align: .16em;
}

body:has(#main-content) .case-next-title > span:last-child {
  position: absolute;
  inset: 100% 0 auto;
  text-align: center;
}

@media (hover: hover) and (pointer: fine) {
  body:has(#main-content) .case-next-link:hover img,
  body:has(#main-content) .case-next-link:focus-visible img { transform: scale(1.025); }

  body:has(#main-content) .case-next-link:hover .case-next-title > span,
  body:has(#main-content) .case-next-link:focus-visible .case-next-title > span { translate: 0 -108%; }
}

body:has(#main-content) .case-inspector {
  width: min(1160px, calc(100% - 24px));
  max-width: none;
  max-height: min(88svh, 860px);
  padding: 16px;
  border: 1px solid #7c8582;
  background: #1c2121;
  color: #fff;
}

body:has(#main-content) .case-inspector::backdrop { background: rgb(0 0 0 / 74%); }

body:has(#main-content) .case-inspector-top {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
  margin-bottom: 10px;
}

body:has(#main-content) .case-inspector-top h2 {
  font-size: clamp(17px, 2.1vw, 30px);
  font-weight: 400;
  line-height: 1.13;
  letter-spacing: -.027em;
}

body:has(#main-content) .case-inspector button {
  min-height: 44px;
  border: 1px solid #7c8582;
  padding: 6px 10px;
  background: transparent;
  color: inherit;
  font: inherit;
  white-space: nowrap;
  cursor: pointer;
}

body:has(#main-content) .case-inspector-hint {
  color: #c7cdca;
  font-size: 13px;
  line-height: 1.35;
}

body:has(#main-content) .case-inspector-zoom { margin-top: 12px; }

body:has(#main-content) .case-inspector-scroll {
  overflow: auto;
  overscroll-behavior: contain;
  max-height: calc(80svh - 144px);
  margin-top: 12px;
  border: 1px solid #5b6661;
  touch-action: pan-x pan-y;
}

body:has(#main-content) .case-inspector-scroll img {
  display: block;
  width: 100%;
  max-width: none;
  height: auto;
}

body:has(#main-content) .case-inspector.is-zoomed .case-inspector-scroll img { width: auto; }

html:has(.case-inspector[open]) { overflow: hidden; }

@media (max-width: 760px) {
  body:has(#main-content) .case-page {
    --case-lead: clamp(27px, 7.8vw, 39px);
    --case-body: 15px;
  }

  body:has(#main-content) .case-hero { min-height: clamp(270px, 51svh, 465px); }

  body:has(#main-content) .case-hero-copy {
    width: 100%;
    margin-left: 0;
    padding: 0 var(--case-edge) 22px;
  }

  body:has(#main-content) .case-hero-copy h1 { font-size: clamp(38px, 12vw, 68px); }
  body:has(#main-content) .case-hero-notes { display: none; }

  body:has(#main-content) .case-summary,
  body:has(#main-content) .case-ending {
    display: grid;
    grid-template-columns: minmax(0,1fr);
    gap: 11px;
    padding: 27px var(--case-edge) 31px;
  }

  body:has(#main-content) .case-summary-copy > p { margin-top: 11px; }
  body:has(#main-content) .case-ending { gap: 24px; }

  body:has(#main-content) .case-evidence { padding-block: 18px 34px; }
  body:has(#main-content) .case-shop { padding-top: 0; }

  body:has(#main-content) .case-story,
  body:has(#main-content) .case-cargo .case-story {
    grid-template-columns: minmax(0,1fr);
    gap: 13px;
  }

  body:has(#main-content) .case-story h2 { margin-top: 6px; }
  body:has(#main-content) .case-story-copy > p:last-child { margin-top: 10px; }

  body:has(#main-content) .case-story + .case-story,
  body:has(#main-content) .case-vv-photos + .case-story {
    margin-top: 30px;
    padding-top: 21px;
  }

  body:has(#main-content) .case-photo-focused { aspect-ratio: var(--proof-ratio); }

  body:has(#main-content) .case-photo-focused img {
    position: absolute;
    left: 50%;
    top: 50%;
    width: var(--proof-width);
    max-width: none;
    translate: calc(-1 * var(--proof-x)) calc(-1 * var(--proof-y));
  }

  body:has(#main-content) .case-shop-pair,
  body:has(#main-content) .case-vv-photos {
    grid-template-columns: minmax(0,1fr);
    gap: 14px;
    margin-top: 24px;
  }

  body:has(#main-content) .case-next-link { aspect-ratio: 1.3; }
  body:has(#main-content) .case-next-title { font-size: clamp(28px, 9vw, 56px); }
}

@media (prefers-reduced-motion: reduce) {
  body:has(#main-content) .case-next-title > span,
  body:has(#main-content) .case-next-link img { transition: none; }
}

body:has(#main-content) .inner-page {
  --inner-edge: var(--gutter, 40px);
  --inner-header: 64px;
  --inner-line: rgb(19 19 19 / 0.2);
  background: var(--paper, #f5f4ef);
  color: var(--ink, #121212);
}

body:has(#main-content) .inner-page h1,
body:has(#main-content) .inner-page h2,
body:has(#main-content) .inner-page h3,
body:has(#main-content) .inner-page p,
body:has(#main-content) .inner-page ul {
  margin: 0;
}

body:has(#main-content) .inner-page ul {
  list-style: none;
  padding: 0;
}

body:has(#main-content) .inner-intro {
  min-height: 90svh;
  padding: calc(var(--inner-header) + 3rem) var(--inner-edge) 1.5rem;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  gap: clamp(3rem, 8.5vh, 7rem);
}

body:has(#main-content) .inner-intro h1 {
  max-width: 1240px;
  font-size: clamp(38px, 4.3vw, 72px);
  line-height: 1.08;
  letter-spacing: -.05em;
  font-weight: 400;
  text-indent: clamp(48px, 8.2vw, 118px);
  text-wrap: pretty;
}

body:has(#main-content) .inner-intro-line {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1rem;
  border-top: 1px solid var(--inner-line);
  padding-top: .8rem;
  font-size: var(--small, 13px);
}

body:has(#main-content) .inner-section-marker,
body:has(#main-content) .inner-counter {
  font-size: var(--small, 13px);
  font-weight: 400;
  letter-spacing: -.01em;
  align-self: start;
}

body:has(#main-content) .inner-action {
  color: inherit;
  width: fit-content;
  display: inline-flex;
  align-items: baseline;
  gap: .45em;
  background: none;
  border: 0;
  border-bottom: 1px solid currentColor;
  padding: 0 0 .14em;
  border-radius: 0;
  font: inherit;
  font-size: .9rem;
  line-height: 1.3;
  text-decoration: none;
  cursor: pointer;
  text-align: left;
}

body:has(#main-content) .inner-action > span:last-child:not(:first-child) {
  transition: transform 240ms ease;
}

body:has(#main-content) .inner-action:is(:hover, :focus-visible) > span:last-child:not(:first-child) {
  transform: translate(.2em, -.2em);
}

body:has(#main-content) .inner-capabilities,
body:has(#main-content) .inner-principles {
  display: grid;
  grid-template-columns: minmax(8rem, 1fr) minmax(0, 2fr);
  gap: clamp(1.5rem, 4vw, 5rem);
  margin: 0 var(--inner-edge);
  padding: clamp(4.2rem, 9.4vw, 9rem) 0;
}

body:has(#main-content) .inner-capability,
body:has(#main-content) .inner-principle {
  display: grid;
  grid-template-columns: minmax(2.7rem, .28fr) minmax(0, 1fr) minmax(0, 1.1fr);
  gap: clamp(.65rem, 2vw, 2rem);
  padding: 1.3rem 0 1.45rem;
  border-top: 1px solid var(--inner-line);
}

body:has(#main-content) .inner-capability:last-child,
body:has(#main-content) .inner-principle:last-child {
  border-bottom: 1px solid var(--inner-line);
}

body:has(#main-content) .inner-capability h3,
body:has(#main-content) .inner-principle h3 {
  font-size: clamp(18px, 2vw, 30px);
  line-height: 1.1;
  letter-spacing: -.045em;
  font-weight: 400;
}

body:has(#main-content) .inner-principle p {
  font-size: clamp(14px, 1.18vw, 18px);
  line-height: 1.45;
}

body:has(#main-content) .inner-service-aside h2 {
  max-width: 12ch;
  margin: 1rem 0;
  font-size: clamp(27px, 3.5vw, 55px);
  line-height: 1.04;
  letter-spacing: -.055em;
  font-weight: 400;
}

body:has(#main-content) .inner-service-aside p:last-child {
  max-width: 27ch;
  line-height: 1.4;
}

body:has(#main-content) .inner-service-offers {
  margin: 0;
  padding: 0;
  list-style: none;
}

body:has(#main-content) .inner-service-offers .inner-capability {
  grid-template-columns: 2.4rem minmax(0, .95fr) minmax(0, 1.15fr);
  padding-block: 1.35rem 1.55rem;
}

body:has(#main-content) .inner-service-offers p {
  max-width: 40ch;
  font-size: clamp(14px, 1.12vw, 17px);
  line-height: 1.5;
}

body:has(#main-content) .inner-service-offers .inner-action {
  margin-top: .75rem;
}

body:has(#main-content) .inner-chapters {
  position: relative;
  isolation: isolate;
}

body:has(#main-content) .inner-chapter-index {
  display: grid;
  grid-template-columns: 1fr repeat(3, minmax(0, 1fr));
  gap: 1rem;
  align-items: center;
  margin: 0 var(--inner-edge);
  padding: 1.05rem 0;
  border-block: 1px solid var(--inner-line);
  font-size: var(--small, 13px);
}

body:has(#main-content) .inner-chapter-index button {
  appearance: none;
  border: 0;
  background: transparent;
  color: inherit;
  font: inherit;
  text-align: left;
  padding: .65rem 0;
  cursor: pointer;
  justify-self: start;
}

body:has(#main-content) .inner-chapter-index button > span:first-child {
  opacity: .64;
  margin-inline-end: .5em;
}

body:has(#main-content) .inner-chapter-index button:is(:hover, :focus-visible) {
  text-decoration: underline;
  text-underline-offset: .32em;
}

body:has(#main-content) .inner-chapter-boundary {
  height: 0;
  pointer-events: none;
}

body:has(#main-content) .inner-chapter {
  min-height: calc(100svh - var(--inner-header));
  padding: clamp(2.6rem, 7vh, 6rem) var(--inner-edge) clamp(3rem, 6.5vh, 5rem);
  position: relative;
  display: flex;
  flex-direction: column;
  overflow: hidden;
}

body:has(#main-content) .inner-chapter--overlap {
  position: sticky;
  top: calc(100svh - var(--inner-chapter-height, 100svh) - 26px);
}

body:has(#main-content) .inner-chapter--sites {
  z-index: 1;
  background: #dfdfd6;
  color: #161616;
}

body:has(#main-content) .inner-chapter--systems {
  z-index: 2;
  background: #151419;
  color: #f8f7f3;
}

body:has(#main-content) .inner-chapter--integration {
  z-index: 3;
  background: #e8e6dd;
  color: #161616;
}

body:has(#main-content) .inner-chapter-top {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1rem;
  align-items: baseline;
  font-size: var(--small, 13px);
}

body:has(#main-content) .inner-chapter h2 {
  margin: .14em 0 .27em;
  font-size: clamp(86px, 16.8vw, 250px);
  line-height: .95;
  font-weight: 400;
  letter-spacing: -.082em;
  white-space: nowrap;
}

body:has(#main-content) .inner-chapter--integration h2 {
  font-size: clamp(78px, 12vw, 190px);
}

body:has(#main-content) .inner-chapter-body {
  display: grid;
  grid-template-columns: 1.2fr 1fr .6fr;
  gap: 1.8rem;
  align-items: start;
  margin-top: auto;
  padding-top: 1.15rem;
  border-top: 1px solid currentColor;
  font-size: clamp(14px, 1.22vw, 18px);
  line-height: 1.4;
}

body:has(#main-content) .inner-chapter-body p {
  max-width: 33ch;
}

body:has(#main-content) .inner-chapter-shade {
  position: absolute;
  inset: 0;
  background: #050408;
  opacity: 0;
  z-index: 2;
  pointer-events: none;
}

body:has(#main-content) .inner-note {
  display: grid;
  grid-template-columns: 1fr 2fr;
  gap: 2rem;
  padding: clamp(5rem, 11vw, 12rem) var(--inner-edge);
}

body:has(#main-content) .inner-note h2,
body:has(#main-content) .inner-contact-explain h2,
body:has(#main-content) .inner-studio-dark h2 {
  font-size: clamp(35px, 5.15vw, 78px);
  line-height: 1.05;
  letter-spacing: -.058em;
  font-weight: 400;
  text-wrap: balance;
}

body:has(#main-content) .inner-note p:not(.inner-section-marker),
body:has(#main-content) .inner-contact-explain p {
  max-width: 43ch;
  margin-top: 1.1rem;
  line-height: 1.45;
}

body:has(#main-content) .inner-note .inner-action {
  margin-top: 1.25rem;
}

body:has(#main-content) .inner-studio-practice {
  padding: 0 var(--inner-edge) clamp(5rem, 10vw, 10rem);
}

body:has(#main-content) .inner-studio-practice > h2 {
  font-size: clamp(100px, 19.5vw, 280px);
  line-height: .93;
  letter-spacing: -.088em;
  font-weight: 400;
  margin: 0 0 .22em;
}

body:has(#main-content) .inner-studio-feature {
  display: grid;
  grid-template-columns: .65fr 2fr 1fr;
  gap: clamp(1rem, 3vw, 3rem);
  align-items: start;
}

body:has(#main-content) .inner-studio-feature > p {
  position: sticky;
  top: calc(var(--inner-header) + 1rem);
}

body:has(#main-content) .inner-studio-figure {
  color: inherit;
  text-decoration: none;
  display: block;
  min-width: 0;
}

body:has(#main-content) .inner-studio-brand {
  position: relative;
  isolation: isolate;
  display: grid;
  grid-template-rows: auto 1fr auto;
  min-height: 19rem;
  aspect-ratio: 4 / 3;
  overflow: hidden;
  padding: clamp(1.1rem, 2.6vw, 2.5rem);
  background: radial-gradient(ellipse at 50% 45%, #23182e 0, #17131d 39%, #111015 72%);
  color: #f2eef5;
}

body:has(#main-content) .inner-studio-brand-index {
  display: flex;
  justify-content: space-between;
  gap: .75rem;
  border-top: 1px solid #ffffff33;
  padding-top: .7rem;
  font-size: clamp(10px, .85vw, 13px);
  line-height: 1.2;
  color: #d6cddd;
}

body:has(#main-content) .inner-studio-brand-sign {
  place-self: center;
  width: clamp(108px, 10.5vw, 144px);
}

body:has(#main-content) .inner-studio-brand-sign img {
  display: block;
  width: 100%;
  height: auto;
  filter: drop-shadow(0 0 17px #7a3ca455);
  transition: transform 620ms cubic-bezier(.22,.68,.25,1);
}

body:has(#main-content) .inner-studio-figure:is(:hover, :focus-visible) .inner-studio-brand-sign img {
  transform: scale(1.06);
}

body:has(#main-content) .inner-studio-brand-type {
  border-bottom: 1px solid #ffffff33;
  padding-bottom: .13em;
  font-size: clamp(29px, 5vw, 78px);
  font-weight: 400;
  letter-spacing: -.075em;
  line-height: 1;
  white-space: nowrap;
}

@media (max-width: 760px) {
  body:has(#main-content) .inner-studio-brand { width: 100%; min-height: 0; }
  body:has(#main-content) .inner-studio-brand-type { font-size: clamp(30px, 10vw, 62px); }
}

@media (prefers-reduced-motion: reduce) {
  body:has(#main-content) .inner-studio-brand-sign img { transition: none; }
  body:has(#main-content) .inner-studio-figure:is(:hover, :focus-visible) .inner-studio-brand-sign img { transform: none; }
}

body:has(#main-content) .inner-studio-figure > span {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  margin-top: .6rem;
  font-size: var(--small, 13px);
}

body:has(#main-content) .inner-studio-aside {
  font-size: clamp(14px, 1.25vw, 18px);
  line-height: 1.5;
}

body:has(#main-content) .inner-studio-aside .inner-action {
  margin-top: 1rem;
}

body:has(#main-content) .inner-studio-dark {
  padding: clamp(5rem, 10vw, 10rem) var(--inner-edge);
  background: #131316;
  color: #f8f7f3;
}

body:has(#main-content) .inner-studio-dark h2 {
  margin: 1rem 0 clamp(2.5rem, 7vw, 7rem);
  max-width: 15ch;
  text-wrap: initial;
}

body:has(#main-content) .inner-studio-stories {
  display: grid;
  grid-template-columns: 1fr 1fr;
  border-block: 1px solid rgb(255 255 255 / .26);
}

body:has(#main-content) .inner-studio-stories > a {
  position: relative;
  display: grid;
  align-content: start;
  gap: 1.35rem;
  min-width: 0;
  padding: clamp(1.6rem, 3.25vw, 3.5rem) clamp(3rem, 5vw, 5rem) clamp(1.6rem, 3.25vw, 3.5rem) 0;
  color: inherit;
  text-decoration: none;
}

body:has(#main-content) .inner-studio-stories > a + a {
  border-inline-start: 1px solid rgb(255 255 255 / .26);
  padding-inline-start: clamp(1.6rem, 3.25vw, 3.5rem);
}

body:has(#main-content) .inner-studio-stories strong {
  max-width: 15ch;
  font-size: clamp(26px, 3vw, 45px);
  line-height: 1.02;
  letter-spacing: -.055em;
  font-weight: 400;
}

body:has(#main-content) .inner-studio-stories span:not(.inner-story-arrow) {
  max-width: 32ch;
  color: #c6c4bf;
  font-size: clamp(13px, 1.1vw, 17px);
  line-height: 1.4;
}

body:has(#main-content) .inner-story-arrow {
  position: absolute;
  right: 1.35rem;
  top: 50%;
  font-size: clamp(22px, 2.4vw, 38px);
  line-height: 1;
  transition: transform 380ms cubic-bezier(.22,.68,.25,1);
}

body:has(#main-content) .inner-studio-stories a:is(:hover, :focus-visible) .inner-story-arrow {
  transform: translate(.18em, -.18em);
}

body:has(#main-content) .inner-studio-dark .inner-action {
  margin-top: 3.2rem;
}

body:has(#main-content) .inner-contact {
  background: #101012;
  color: #f7f7f3;
  --inner-line: rgb(255 255 255 / .23);
}

body:has(#main-content) .inner-brief-note {
  font-size: var(--small, 13px);
  color: #b6b4bb;
}

body:has(#main-content) .inner-contact-brief {
  display: grid;
  grid-template-columns: 1fr .92fr;
  gap: clamp(2rem, 7.2vw, 8rem);
  padding: clamp(4rem, 9vw, 9rem) var(--inner-edge) clamp(5rem, 9vw, 10rem);
}

body:has(#main-content) .inner-brief-form {
  display: grid;
  gap: 1.45rem;
}

body:has(#main-content) .inner-brief-form[hidden],
body:has(#main-content) .inner-brief-result[hidden] {
  display: none;
}

body:has(#main-content) .inner-brief-form label {
  display: grid;
  gap: .4rem;
  font-size: var(--small, 13px);
  line-height: 1.35;
}

body:has(#main-content) .inner-brief-form :is(input, textarea, select), body:has(#main-content) .inner-draft-text {
  width: 100%;
  display: block;
  border: none;
  border-bottom: 1px solid var(--inner-line);
  border-radius: 0;
  background: #19191d;
  color: inherit;
  font: inherit;
  font-size: 1rem;
  line-height: 1.35;
  padding: .7em .75em;
  min-height: 44px;
  color-scheme: dark;
}

body:has(#main-content) .inner-brief-form textarea {
  resize: vertical;
}

body:has(#main-content) .inner-brief-form button[type=submit] {
  margin-top: .45rem;
}

body:has(#main-content) .inner-brief-result h3 {
  font-weight: 400;
  font-size: clamp(26px, 3vw, 46px);
  line-height: 1.08;
  letter-spacing: -.045em;
}

body:has(#main-content) .inner-brief-result p {
  margin-block: .7rem;
  line-height: 1.4;
}

body:has(#main-content) .inner-draft-actions {
  display: flex;
  flex-wrap: wrap;
  gap: .85rem 1.2rem;
  margin-top: 1rem;
}

body:has(#main-content) .inner-draft-status {
  font-size: var(--small, 13px);
}

body:has(#main-content) .inner-contact-work {
  min-height: clamp(25rem, 69svh, 56rem);
  display: grid;
  align-content: space-between;
  gap: 1.8rem;
  padding: clamp(1.4rem, 3vw, 3.2rem) var(--inner-edge);
  overflow: hidden;
  color: #1a1820;
  background: #e8e6df;
  text-decoration: none;
}

body:has(#main-content) .inner-contact-work-index {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  padding-bottom: .8rem;
  border-bottom: 1px solid rgb(26 24 32 / .22);
  font-size: var(--small, 13px);
}

body:has(#main-content) .inner-contact-work-title {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: .25em;
  font-size: clamp(62px, 11.7vw, 198px);
  line-height: .98;
  letter-spacing: -.08em;
}

body:has(#main-content) .inner-contact-work-arrow {
  flex: none;
  font-size: .63em;
  color: #403553;
  transition: transform 520ms cubic-bezier(.22,.68,.25,1);
}

body:has(#main-content) .inner-contact-work:is(:hover, :focus-visible) .inner-contact-work-arrow {
  transform: translate(.1em, -.1em);
}

body:has(#main-content) .inner-contact-work-signature {
  font-size: var(--small, 13px);
}

body:has(#main-content) .inner-contact-mask {
  --line: 1.18em;
  display: inline-grid;
  height: var(--line);
  min-width: 0;
  overflow: hidden;
  line-height: var(--line);
}

body:has(#main-content) .inner-contact-line {
  grid-area: 1 / 1;
  display: block;
  height: var(--line);
  white-space: pre;
}

body:has(#main-content) .inner-contact-line > span {
  display: inline-block;
  vertical-align: top;
  transition: transform 460ms cubic-bezier(.22,.68,.25,1);
  transition-delay: calc(var(--letter) * 9ms);
}

body:has(#main-content) .inner-contact-line:nth-child(2) > span { transform: translateY(120%); }
body:has(#main-content) .inner-contact-work:focus-visible .inner-contact-line:first-child > span { transform: translateY(-120%); }
body:has(#main-content) .inner-contact-work:focus-visible .inner-contact-line:nth-child(2) > span { transform: translateY(0); }
@media (hover: hover) {
  body:has(#main-content) .inner-contact-work:hover .inner-contact-line:first-child > span { transform: translateY(-120%); }
  body:has(#main-content) .inner-contact-work:hover .inner-contact-line:nth-child(2) > span { transform: translateY(0); }
}

@media (max-width: 760px) {
  body:has(#main-content) .inner-page {
    --inner-header: 58px;
  }

  body:has(#main-content) .inner-intro {
    min-height: 88svh;
    gap: 2.5rem;
    padding-bottom: 1.15rem;
  }

  body:has(#main-content) .inner-intro h1 {
    font-size: clamp(27px, 7.35vw, 42px);
    line-height: 1.075;
    letter-spacing: -.045em;
    text-indent: 0;
  }

  body:has(#main-content) .inner-intro-line {
    font-size: 11px;
    line-height: 1.35;
  }

  body:has(#main-content) .inner-capabilities,
  body:has(#main-content) .inner-principles,
  body:has(#main-content) .inner-note,
  body:has(#main-content) .inner-studio-feature,
  body:has(#main-content) .inner-contact-brief {
    grid-template-columns: 1fr;
    gap: 1.6rem;
  }

  body:has(#main-content) .inner-capabilities,
  body:has(#main-content) .inner-principles {
    padding-block: 4.8rem;
  }

  body:has(#main-content) .inner-capability,
  body:has(#main-content) .inner-principle {
    grid-template-columns: 2rem minmax(0, 1fr);
    row-gap: .6rem;
    padding-block: 1.05rem;
  }

  body:has(#main-content) .inner-principle p {
    grid-column: 2;
  }

  body:has(#main-content) .inner-service-offers .inner-capability {
    grid-template-columns: 2rem minmax(0, 1fr);
    gap: .6rem;
    padding-block: 1.15rem;
  }

  body:has(#main-content) .inner-service-offers .inner-capability > div {
    grid-column: 2;
  }

  body:has(#main-content) .inner-chapter-index {
    grid-template-columns: 1fr;
    gap: 0;
    padding-block: .8rem;
  }

  body:has(#main-content) .inner-chapter-index > span {
    margin-bottom: .35rem;
  }

  body:has(#main-content) .inner-chapter-index button {
    width: 100%;
    min-height: 44px;
    border-top: 1px solid var(--inner-line);
  }

  body:has(#main-content) .inner-chapter {
    min-height: 0;
    padding-block: 3.2rem 3.7rem;
  }

  body:has(#main-content) .inner-chapter--overlap {
    position: relative;
    top: auto;
  }

  body:has(#main-content) .inner-chapter h2 {
    font-size: clamp(51px, 17.4vw, 108px);
    margin-block: .28em .4em;
  }

  body:has(#main-content) .inner-chapter--integration h2 {
    font-size: clamp(41px, 13vw, 87px);
  }

  body:has(#main-content) .inner-chapter-body {
    grid-template-columns: 1fr;
    gap: 1.05rem;
  }

  body:has(#main-content) .inner-chapter-shade {
    display: none;
  }

  body:has(#main-content) .inner-studio-practice > h2 {
    font-size: clamp(66px, 18vw, 130px);
  }

  body:has(#main-content) .inner-studio-feature > p {
    position: static;
  }

  body:has(#main-content) .inner-studio-stories {
    grid-template-columns: 1fr;
  }

  body:has(#main-content) .inner-studio-stories > a {
    padding: 1.4rem 3rem 1.4rem 0;
    gap: .8rem;
  }

  body:has(#main-content) .inner-studio-stories > a + a {
    border-inline-start: 0;
    border-top: 1px solid rgb(255 255 255 / .26);
    padding-inline-start: 0;
  }

  body:has(#main-content) .inner-contact-brief {
    gap: 2rem;
  }

  body:has(#main-content) .inner-contact-work {
    min-height: 58svh;
  }

  body:has(#main-content) .inner-contact-work-title {
    font-size: clamp(44px, 11.7vw, 75px);
  }
}

@media (prefers-reduced-motion: reduce) {
  body:has(#main-content) .inner-chapter--overlap {
    position: relative;
    top: auto;
  }

  body:has(#main-content) .inner-page *,
  body:has(#main-content) .inner-page *::before,
  body:has(#main-content) .inner-page *::after {
    transition-duration: .001ms !important;
    transition-delay: 0ms !important;
  }
}

/* Compact editorials and a direct entry into the contact brief. */
body:has(#main-content) .inner-editorial-head {
  display: grid;
  gap: clamp(1.25rem, 3.6svh, 2.6rem);
  padding: clamp(104px, 16.2svh, 174px) var(--inner-edge) clamp(26px, 5.5svh, 52px);
}
body:has(#main-content) .inner-editorial-kicker {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  padding-top: .7rem;
  border-top: 1px solid var(--inner-line);
}
body:has(#main-content) .inner-editorial-head h1 {
  max-width: 17ch;
  font-size: clamp(45px, 7.9vw, 124px);
  line-height: .97;
  letter-spacing: -.077em;
  font-weight: 400;
  text-wrap: balance;
}
body:has(#main-content) .inner-editorial-end {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  align-items: end;
  gap: 1.35rem;
}
body:has(#main-content) .inner-editorial-end > p {
  max-width: 37ch;
  font-size: clamp(15px, 1.4vw, 21px);
  line-height: 1.42;
}
body:has(#main-content) .inner-editorial-links {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  flex-wrap: wrap;
  gap: .75rem clamp(.85rem, 2.5vw, 2.4rem);
}
body:has(#main-content) .inner-editorial-links .inner-action {
  align-items: center;
  min-height: 44px;
  padding-block: .5rem;
}
body:has(#main-content) .inner-brief-jump {
  min-height: 44px;
  padding: .5rem .85rem;
  border: 1px solid rgb(255 255 255 / .4);
  background: transparent;
  color: inherit;
  font: inherit;
  font-size: .9rem;
  cursor: pointer;
}
body:has(#main-content) .inner-brief-jump:hover {
  background: #f0eaf4;
  color: #171219;
}
body:has(#main-content) .inner-contact-brief {
  min-width: 0;
  align-items: start;
  padding-block: clamp(25px, 5svh, 56px) clamp(52px, 10svh, 112px);
  border-top: 1px solid var(--inner-line);
  scroll-margin-top: calc(var(--inner-header) + 9px);
}
body:has(#main-content) .inner-contact-fields {
  min-width: 0;
}
body:has(#main-content) .inner-contact-explain #inner-brief-title {
  font-size: clamp(32px, 4.5vw, 70px);
}
body:has(#main-content) .inner-contact-explain #inner-brief-title:focus {
  outline: none;
}
body:has(#main-content) .inner-contact-explain .inner-brief-topic {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: baseline;
  gap: .55rem;
  margin: .8rem 0 0;
  padding: .56rem .72rem;
  border-left: 2px solid #ad8ac9;
  background: #211a27;
  font-size: .875rem;
  line-height: 1.35;
}
body:has(#main-content) .inner-contact-explain .inner-brief-topic[hidden] {
  display: none;
}
body:has(#main-content) .inner-brief-topic > span {
  color: #cfbbdc;
}
body:has(#main-content) .inner-brief-topic > strong {
  font-weight: 500;
}
body:has(#main-content) .inner-brief-identity {
  min-width: 0;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .85rem;
}
body:has(#main-content) .inner-brief-form {
  gap: clamp(.85rem, 1.7svh, 1.3rem);
}
body:has(#main-content) .inner-brief-form button[type=submit],
body:has(#main-content) .inner-draft-actions .inner-action {
  min-height: 44px;
  align-items: center;
}
body:has(#main-content) .inner-studio-practice {
  padding-bottom: clamp(2.7rem, 6.6svh, 6.7rem);
}
body:has(#main-content) .inner-studio-practice > h2 {
  font-size: clamp(60px, 12vw, 164px);
  margin-bottom: .25em;
}
body:has(#main-content) .inner-studio .inner-principles {
  padding-block: clamp(3.3rem, 8.5svh, 7rem);
}
@media (max-width: 760px) {
  body:has(#main-content) .inner-editorial-head {
    padding: 77px var(--inner-edge) 1.3rem;
    gap: .85rem;
  }
  body:has(#main-content) .inner-editorial-kicker {
    padding-top: .52rem;
  }
  body:has(#main-content) .inner-editorial-head h1 {
    font-size: clamp(39px, 11.8vw, 61px);
    line-height: .98;
    letter-spacing: -.057em;
    text-wrap: pretty;
  }
  body:has(#main-content) .inner-editorial-end {
    grid-template-columns: minmax(0, 1fr);
    gap: .55rem;
  }
  body:has(#main-content) .inner-editorial-links {
    justify-content: flex-start;
    gap: .45rem 1rem;
  }
  body:has(#main-content) .inner-contact-head .inner-editorial-end > p {
    line-height: 1.38;
  }
  body:has(#main-content) .inner-contact-brief {
    gap: 1rem;
    padding-top: 1rem;
  }
  body:has(#main-content) .inner-contact-explain .inner-brief-note {
    margin-top: .62rem;
    line-height: 1.34;
  }
  body:has(#main-content) .inner-contact-explain .inner-brief-topic {
    margin-top: .56rem;
  }
  body:has(#main-content) .inner-brief-identity {
    gap: .55rem;
  }
  body:has(#main-content) .inner-studio-practice > h2 {
    font-size: clamp(44px, 14vw, 76px);
  }
  body:has(#main-content) .inner-studio-practice {
    padding-bottom: 1.8rem;
  }
  body:has(#main-content) .inner-studio-feature {
    gap: .74rem;
  }
  body:has(#main-content) .inner-studio-brand {
    aspect-ratio: 1.5;
  }
  body:has(#main-content) .inner-studio-brand-sign {
    width: clamp(82px, 30vw, 112px);
  }
  body:has(#main-content) .inner-studio-dark {
    padding-block: clamp(2.65rem, 8svh, 5rem);
  }
}


body:has(#main-content) .service-detail {
  --service-line: rgb(19 19 19 / .2);
  --service-edge: var(--gutter, 40px);
  color: var(--ink, #141414);
  background: var(--paper, #f6f5f2);
}

body:has(#main-content) .service-detail-hero {
  min-height: min(85svh, 40rem);
  padding: clamp(5rem, 12vh, 7.2rem) var(--service-edge) clamp(2rem, 5vh, 3rem);
  display: grid;
  align-content: space-between;
  gap: clamp(1.4rem, 4vh, 2.6rem);
}

body:has(#main-content) .service-detail-hero--mauve { background: #e7e3ee; }

body:has(#main-content) .service-detail-hero--night {
  color: #f5f2fa;
  background: #16131b;
  --service-line: rgb(255 255 255 / .24);
}

body:has(#main-content) .service-detail-kicker,
body:has(#main-content) .service-detail-intro {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 1.3rem;
}

body:has(#main-content) .service-detail-kicker {
  align-items: center;
  padding-bottom: .45rem;
  border-bottom: 1px solid var(--service-line);
  font-size: var(--small, 14px);
}

body:has(#main-content) .service-detail-kicker > span { text-align: right; }

body:has(#main-content) .service-detail-title > p,
body:has(#main-content) .service-detail-label {
  margin-bottom: .75rem;
  font-size: var(--small, 14px);
}

body:has(#main-content) .service-detail-title h1 {
  max-width: 19ch;
  font-size: clamp(3.4rem, 6.5vw, 7.2rem);
  line-height: .98;
  letter-spacing: -.07em;
  font-weight: 400;
  text-wrap: balance;
}

body:has(#main-content) .service-detail-intro > p {
  max-width: 57ch;
  font-size: clamp(1rem, 1.32vw, 1.28rem);
  line-height: 1.4;
}

body:has(#main-content) .service-detail-action {
  min-height: 44px;
  align-items: center;
  border: 0;
  padding: .4rem 0;
  text-decoration: underline;
  text-underline-offset: .22em;
}

body:has(#main-content) .service-detail-primary {
  flex: 0 0 auto;
  justify-content: space-between;
  gap: 1.4rem;
  min-height: 46px;
  padding: .58rem .9rem .6rem;
  background: #16131b;
  color: #faf8fc;
  text-decoration: none;
}

body:has(#main-content) .service-detail-hero--night .service-detail-primary,
body:has(#main-content) .service-detail-brief .service-detail-primary {
  background: #f0ebf6;
  color: #16131b;
}

body:has(#main-content) .service-proof {
  display: grid;
  grid-template-columns: minmax(0, .86fr) minmax(0, 1.15fr);
  align-items: center;
  gap: clamp(1.6rem, 6vw, 6rem);
  padding: clamp(2.8rem, 6.6vw, 6.4rem) var(--service-edge);
  background: #ebe8e1;
}

body:has(#main-content) .service-proof--flow { background: #e8e3ed; }
body:has(#main-content) .service-proof--image { background: #1a1720; color: #f6f1fa; }

body:has(#main-content) .service-proof h2,
body:has(#main-content) .service-detail-aside h2,
body:has(#main-content) .service-detail-brief h2 {
  font-size: clamp(2rem, 4vw, 4.6rem);
  font-weight: 400;
  letter-spacing: -.052em;
  line-height: 1.04;
  text-wrap: balance;
}

body:has(#main-content) .service-proof-copy > p:not(.service-detail-label) {
  margin-top: .9rem;
  max-width: 53ch;
  line-height: 1.5;
}

body:has(#main-content) .service-proof-copy .inner-action { margin-top: .45rem; }

body:has(#main-content) .service-proof-figure { margin: 0; }
body:has(#main-content) .service-proof-figure img { display: block; width: 100%; height: auto; aspect-ratio: 1600 / 902; object-fit: cover; }
body:has(#main-content) .service-proof-figure figcaption { font-size: 12px; margin-top: .55rem; }

body:has(#main-content) .service-proof-path,
body:has(#main-content) .service-detail-results,
body:has(#main-content) .service-detail-steps {
  list-style: none;
  margin: 0;
  padding: 0;
}

body:has(#main-content) .service-proof-path {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1rem;
}

body:has(#main-content) .service-proof-path li {
  border-top: 1px solid var(--service-line);
  min-height: 7rem;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: .9rem;
  padding-block: .8rem;
}

body:has(#main-content) .service-proof-path li span { font-size: var(--small, 14px); }
body:has(#main-content) .service-proof-path li strong { font-size: clamp(1rem, 2vw, 2rem); letter-spacing: -.04em; line-height: 1.1; font-weight: 450; }

body:has(#main-content) .service-detail-section,
body:has(#main-content) .service-detail-brief {
  display: grid;
  grid-template-columns: minmax(0, .95fr) minmax(0, 1.7fr);
  gap: clamp(1.8rem, 6vw, 6rem);
  padding: clamp(3.25rem, 8vw, 8rem) var(--service-edge);
}

body:has(#main-content) .service-detail-results {
  display: grid;
  grid-template-columns: repeat(2,minmax(0,1fr));
  gap: 1.5rem clamp(1.4rem, 3.6vw, 3.6rem);
}

body:has(#main-content) .service-detail-results li {
  border-top: 1px solid var(--service-line);
  padding-top: .85rem;
}

body:has(#main-content) .service-detail-results h3,
body:has(#main-content) .service-detail-steps h3 {
  font-size: clamp(1.06rem, 2vw, 1.8rem);
  letter-spacing: -.04em;
  line-height: 1.18;
  font-weight: 450;
}

body:has(#main-content) .service-detail-results p,
body:has(#main-content) .service-detail-steps p {
  margin-top: .42rem;
  font-size: var(--small, 14px);
  line-height: 1.48;
}

body:has(#main-content) .service-detail-process {
  background: #efebe5;
  grid-template-columns: minmax(0, 1fr);
  gap: 2rem;
}

body:has(#main-content) .service-detail-steps {
  display: grid;
  grid-template-columns: repeat(var(--step-count, 4), minmax(0, 1fr));
  border-top: 1px solid var(--service-line);
}

body:has(#main-content) .service-detail-steps:has(> li:nth-child(3):last-child) { --step-count: 3; }

body:has(#main-content) .service-detail-steps li {
  padding: .95rem 1.25rem 0 0;
  display: grid;
  gap: .85rem;
}

body:has(#main-content) .service-detail-steps li:not(:first-child) {
  border-left: 1px solid var(--service-line);
  padding-left: 1.25rem;
}

body:has(#main-content) .service-detail-number { font-size: 13px; letter-spacing: .035em; }
body:has(#main-content) .service-detail-brief { background: #16131b; color: #f5f2fa; }
body:has(#main-content) .service-detail-brief h2 { max-width: 15ch; }
body:has(#main-content) .service-detail-brief > div > p { max-width: 52ch; margin: 1.05rem 0 1.45rem; line-height: 1.5; }
body:has(#main-content) .service-detail-links { display: flex; flex-wrap: wrap; gap: .6rem 2.5rem; padding: 1rem var(--service-edge) 1.25rem; }

body:has(#main-content) .service-catalogue-intro {
  min-height: min(70svh, 34rem);
  padding: clamp(5.1rem, 13vh, 7.6rem) var(--inner-edge) clamp(2rem, 5vh, 3rem);
  display: grid;
  align-content: end;
  gap: .9rem;
}

body:has(#main-content) .service-catalogue-intro h1 {
  max-width: 19ch;
  font-size: clamp(2.7rem, 6.6vw, 7rem);
  font-weight: 400;
  letter-spacing: -.067em;
  line-height: .98;
  text-wrap: balance;
}

body:has(#main-content) .service-catalogue-intro > p:last-of-type { max-width: 46ch; line-height: 1.48; }
body:has(#main-content) .service-catalogue-intro .service-detail-primary { margin-top: .25rem; }

body:has(#main-content) .inner-services .inner-service-catalogue { padding-block: clamp(2.5rem, 6vw, 6rem); }

body:has(#main-content) .service-offer {
  border-top: 1px solid var(--inner-line);
}

body:has(#main-content) .service-offer:last-child { border-bottom: 1px solid var(--inner-line); }

body:has(#main-content) .service-offer-link {
  display: grid;
  grid-template-columns: 2.4rem minmax(0, .95fr) minmax(0, 1.15fr) auto;
  gap: clamp(.65rem, 2vw, 2rem);
  align-items: baseline;
  padding: 1.15rem 0;
  color: inherit;
  text-decoration: none;
}

body:has(#main-content) .service-offer-link h3 {
  font-size: clamp(18px, 2vw, 30px);
  line-height: 1.12;
  letter-spacing: -.045em;
  font-weight: 400;
}

body:has(#main-content) .service-offer-link .service-offer-arrow { font-size: 1.22rem; transition: transform .2s ease; }
body:has(#main-content) .service-offer-link:is(:hover,:focus-visible) h3 { text-decoration: underline; text-underline-offset: .2em; }
body:has(#main-content) .service-offer-link:is(:hover,:focus-visible) .service-offer-arrow { transform: translate(.14rem,-.14rem); }
body:has(#main-content) .service-offer-link:focus-visible { outline-offset: .2rem; }

@media (max-width: 760px) {
  body:has(#main-content) .service-detail-hero {
    min-height: 0;
    padding: 4.35rem var(--service-edge) 1.6rem;
    gap: .78rem;
  }

  body:has(#main-content) .service-detail-kicker { gap: .7rem; font-size: 11px; padding-bottom: .27rem; }
  body:has(#main-content) .service-detail-kicker .inner-action { font-size: 12px; white-space: nowrap; }
  body:has(#main-content) .service-detail-title > p { margin-bottom: .45rem; font-size: 13px; }

  body:has(#main-content) .service-detail-title h1 {
    font-size: clamp(1.95rem, 9.6vw, 3.6rem);
    line-height: 1.01;
    letter-spacing: -.055em;
    text-wrap: pretty;
  }

  body:has(#main-content) .service-detail-intro {
    align-items: flex-start;
    flex-direction: column;
    gap: .85rem;
  }

  body:has(#main-content) .service-detail-intro > p { font-size: clamp(.91rem, 3.9vw, 1.04rem); line-height: 1.42; }
  body:has(#main-content) .service-detail-primary { min-height: 46px; }

  body:has(#main-content) .service-detail-section,
  body:has(#main-content) .service-detail-brief,
  body:has(#main-content) .service-proof {
    grid-template-columns: minmax(0, 1fr);
    gap: 1.2rem;
    padding-block: 2.35rem;
  }

  body:has(#main-content) .service-detail-results { gap: 1rem; grid-template-columns: minmax(0, 1fr); }
  body:has(#main-content) .service-detail-results li { padding-top: .72rem; }
  body:has(#main-content) .service-detail-results h3, body:has(#main-content) .service-detail-steps h3 { font-size: 1.12rem; }

  body:has(#main-content) .service-detail-steps { grid-template-columns: minmax(0, 1fr); }
  body:has(#main-content) .service-detail-steps li,
  body:has(#main-content) .service-detail-steps li:not(:first-child) {
    grid-template-columns: 1.8rem minmax(0, 1fr);
    border-left: 0;
    border-bottom: 1px solid var(--service-line);
    padding: .8rem 0;
    gap: .5rem;
  }

  body:has(#main-content) .service-proof-path { gap: .55rem; }
  body:has(#main-content) .service-proof-path li { min-height: 4.5rem; padding-top: .55rem; gap: .55rem; }
  body:has(#main-content) .service-proof-path li strong { font-size: .93rem; }

  body:has(#main-content) .service-catalogue-intro { min-height: 0; padding: 5rem var(--inner-edge) 1.8rem; gap: .65rem; }
  body:has(#main-content) .service-catalogue-intro h1 { font-size: clamp(2rem, 10.2vw, 3.75rem); line-height: 1.02; }
  body:has(#main-content) .inner-services .inner-service-catalogue { gap: 1.3rem; padding-block: 1.8rem 2.7rem; }
  body:has(#main-content) .inner-service-aside h2 { margin: .5rem 0; max-width: none; }
  body:has(#main-content) .inner-service-aside p:last-child { max-width: 35ch; }

  body:has(#main-content) .service-offer-link {
    grid-template-columns: 1.65rem minmax(0, 1fr) auto;
    gap: .42rem .6rem;
    padding-block: .9rem 1rem;
  }

  body:has(#main-content) .service-offer-link p { grid-column: 2 / -1; grid-row: 2; font-size: .9rem; }
  body:has(#main-content) .service-offer-arrow { grid-column: 3; grid-row: 1; }
}

@media (prefers-reduced-motion: reduce) {
  body:has(#main-content) .service-detail .inner-action > span,
  body:has(#main-content) .service-offer-link .service-offer-arrow { transition: none; }
}

.redesign-chrome, .redesign-footer { display: none; }
html:has(#main-content) { background: #080808; scroll-behavior: auto; }
html body:has(#main-content) {
  background: #f6f5f2;
  color: #080808;
  line-height: 1.35;
  letter-spacing: normal;
}
body:has(#main-content) :is(.legacy-chrome, .floating-top-button) { display: none; }
body:has(#main-content) .redesign-chrome { display: contents; }
body:has(#main-content) .redesign-footer { display: grid; }
body:has(#main-content) .footer-policies { display: flex; flex-wrap: wrap; gap: 5px 14px; }
body:has(#main-content) .footer-policies button { padding: 0; border: 0; background: none; color: inherit; }
body:has(#main-content) :is(#brief, #inner-brief-title, #service-brief) { scroll-margin-top: 75px; }
body:has(#main-content) .cookie-consent { z-index: 1000; }
body:has(#main-content) .cookie-consent-panel {
  background: #141417;
  border-color: #454549;
  color: #f7f7f3;
}
body:has(#main-content) .cookie-consent-content p { color: #c9c9cd; }
body:has(#main-content) .cookie-consent-secondary {
  background: #232327;
  color: #f7f7f3;
  border-color: #535358;
}
body:has(#main-content) .cookie-consent-primary { background: #f7f7f3; color: #101012; border-color: #f7f7f3; }
@view-transition { navigation: auto; }
@media (max-width: 760px) {
  body:has(#main-content) .footer-policies { display: grid; }
  body:has(#main-content) .footer-policies button { text-align: left; }
}
@media (prefers-reduced-motion: reduce) {
  @view-transition { navigation: none; }
}