/* Alder & Wolf — site styles
   tokens → base type → layout → components → page bits → motion
   One file on purpose: the site is small and this loads in a single request. */

:root {
  --ink: #0e1112;
  --ink-2: #171b1d;
  --ink-soft: #33393c;
  --grey: #6f7376;
  --grey-light: #a9aeb0;
  --line: #dfe0df;
  --line-soft: #e9eae8;
  --paper: #f3f3f1;
  --paper-alt: #fafaf8;
  --white: #fff;
  --bronze: #6a5936;
  --measure: 60ch;
  --gap-col: 34px;
  --gap-card: 22px;
  --indent: 7%;
  --font-head: "Epunda Slab", Georgia, serif;
  --font-body: "Epunda Sans", -apple-system, "Segoe UI", sans-serif;
}

*, *::before, *::after { box-sizing: border-box; }
body, h1, h2, h3, h4, p, ul, ol, dl, dd, figure { margin: 0; }
ul { padding: 0; list-style: none; }
html { -webkit-text-size-adjust: 100%; }

body {
  background: var(--paper);
  color: var(--ink);
  font: 400 1.0625rem/1.65 var(--font-body);
  font-optical-sizing: auto; text-wrap: pretty;
  -webkit-font-smoothing: antialiased;
}

h1, h2, h3, h4, h5, h6 {
  font-family: var(--font-head);
  font-weight: 600;
  letter-spacing: -0.012em;
  line-height: 1.14;
  text-wrap: balance;
}
h1 { font-size: 2.25rem; letter-spacing: -0.02em; line-height: 1.08; }
h2 { font-size: 1.6875rem; letter-spacing: -0.016em; }
h3 { font-size: 1.0625rem; }
h4, h5, h6 { font-size: 1rem; }

a { color: inherit; }
p + p { margin-top: 1.05em; }

.wrap { width: 100%; max-width: 1440px; margin: 0 auto; padding: 0 20px; }

.skip {
  position: absolute; left: 16px; top: 12px; z-index: 60;
  padding: 10px 16px; background: var(--white); color: var(--ink);
  text-decoration: none; transform: translateY(-200%); transition: transform .15s ease-out;
}
.skip:focus { transform: none; }
:focus-visible { outline: 2px solid currentColor; outline-offset: 3px; }

.mark {
  font-family: var(--font-head);
  font-weight: 600; font-size: 1.125rem; letter-spacing: -0.012em; text-decoration: none;
  display: inline-flex; align-items: center; gap: 11px;
}
.mark-glyph { display: block; width: auto; height: 26px; }
.site-foot .mark-glyph { height: 34px; }
@media (min-width: 960px) { .mark-glyph { height: 28px; } .site-foot .mark-glyph { height: 40px; } }

.site-head { position: relative; z-index: 40; background: var(--ink); color: #f0f1f1; }
.head-inner { min-height: 60px; display: flex; align-items: center; justify-content: space-between; gap: 16px; }

.nav-toggle {
  border: 1px solid rgba(255,255,255,.28); background: transparent; color: inherit;
  font: 600 .75rem/1 var(--font-head); letter-spacing: .1em; text-transform: uppercase;
  padding: 9px 14px; cursor: pointer;
}
.nav-toggle:hover { border-color: rgba(255,255,255,.6); }

.site-nav { display: none; }
.site-nav.is-open {
  display: block; position: absolute; left: 0; right: 0; top: 100%;
  background: var(--ink-2); padding: 4px 20px 18px;
}
.site-nav li + li { border-top: 1px solid rgba(255,255,255,.08); }
.site-nav a { display: block; padding: 12px 0; font-family: var(--font-head); font-weight: 500; font-size: .9375rem; letter-spacing: .005em; text-decoration: none; color: var(--grey-light); }
.site-nav a[aria-current="page"], .site-nav a:hover { color: #fff; }

.hero { position: relative; background: var(--ink); color: #f2f3f3; overflow: hidden; }
.hero-media img {
  position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 50% 36%;
  filter: saturate(.9) contrast(1.02) brightness(1.08);
}
.hero-media::before {
  content: ""; position: absolute; inset: 0; z-index: 1;
  background: linear-gradient(96deg, rgba(10,13,14,.74) 0%, rgba(10,13,14,.42) 50%, rgba(10,13,14,.1) 100%);
}
.hero-media {
  position: absolute; inset: 0; z-index: 0; isolation: isolate; background: #14181a;
}
.hero-media::after {
  content: ""; position: absolute; inset: 0; z-index: 2;
  background: linear-gradient(to top, rgba(10,13,14,.4), rgba(10,13,14,0) 40%);
}

.hero-slides img { opacity: 0; animation: heroFade 28s linear infinite both, heroDrift 28s linear infinite both; will-change: opacity, transform; transform-origin: 60% 45%; }
.hero-slides img:nth-child(1) { animation-delay: 0s; }
.hero-slides img:nth-child(2) { animation-delay: 7s; }
.hero-slides img:nth-child(3) { animation-delay: 14s; }
.hero-slides img:nth-child(4) { animation-delay: 21s; }
@keyframes heroFade {
  0% { opacity: 0; }
  3% { opacity: .82; }
  25% { opacity: .82; }
  28% { opacity: 0; }
  100% { opacity: 0; }
}
@keyframes heroDrift {
  0% { transform: scale(1.02); }
  100% { transform: scale(1.13); }
}
@media (prefers-reduced-motion: reduce) {
  .hero-slides img { animation: none; opacity: 0; transform: none; }
  .hero-slides img:nth-child(1) { opacity: .82; }
}

.hero-panel { display: none; }

.hero-inner > * { animation: rise .7s cubic-bezier(.16,1,.3,1) both; }
.hero-inner > .kicker { animation-delay: .05s; }
.hero-inner > h1 { animation-delay: .14s; }
.hero-inner > .hero-body { animation-delay: .26s; }

@keyframes rise {
  from { opacity: 0; transform: translateY(14px); }
  to { opacity: 1; transform: none; }
}

@media (prefers-reduced-motion: reduce) {
  .hero-inner > * { animation: none; }
}
.hero-inner { position: relative; z-index: 2; padding: 60px 20px 66px; }
.hero h1 { max-width: 19ch; text-wrap: balance; color: #fff; line-height: 1.07; }
.hero .actions { margin-top: 32px; }
.hero-body { margin-top: 32px; max-width: 40rem; }
.hero .lead { color: #e2e5e6; }
.hero p { color: #c8cdce; }

.kicker {
  font-family: var(--font-head); font-size: .6875rem; font-weight: 600; letter-spacing: .16em; text-transform: uppercase;
  color: var(--grey); margin-bottom: 26px;
}
.hero .kicker, .page-head .kicker { display: flex; align-items: center; }
.hero .kicker, .page-head .kicker { color: #8f9699; }

.page-head { background: var(--ink); color: #f2f3f3; padding: 46px 0 52px; }
.page-head h1 { max-width: 24ch; }
.head-body { margin-top: 30px; max-width: 42rem; }
.page-head .lead { color: #ccd1d2; }
.page-head p, .page-head .sub { color: #b9bfc1; }

.lead { font-size: 1.0625rem; color: var(--ink-soft); }
.note { color: var(--grey); }
.measure { max-width: var(--measure); }
.measure-wide { max-width: 46rem; }

.actions { margin-top: 26px; display: flex; flex-wrap: wrap; gap: 10px; }
.split-body .actions { margin-top: 44px; }
@media (min-width: 960px) { .split-body .actions { margin-top: 56px; } }

.btn {
  display: inline-block; padding: 12px 20px; background: var(--white); color: var(--ink);
  font-family: var(--font-head); font-size: .875rem; font-weight: 600; letter-spacing: .012em;
  text-decoration: none; border: 1px solid var(--white);
  cursor: pointer; transition: background .16s ease-out, border-color .16s ease-out, color .16s ease-out;
}
.btn:hover { background: #e6e7e5; border-color: #e6e7e5; }
.btn-quiet { background: transparent; color: inherit; border-color: rgba(255,255,255,.34); }
.btn-quiet:hover { background: rgba(255,255,255,.08); border-color: rgba(255,255,255,.6); }

.section .btn, .section-alt .btn { background: var(--ink); color: var(--paper); border-color: var(--ink); }
.section .btn:hover, .section-alt .btn:hover { background: var(--ink-soft); border-color: var(--ink-soft); }
.section .btn-quiet, .section-alt .btn-quiet { background: transparent; color: var(--ink); border-color: var(--line); }
.section .btn-quiet:hover, .section-alt .btn-quiet:hover { background: transparent; border-color: var(--ink); }
.section-dark .btn-invert { background: var(--white); color: var(--ink); border-color: var(--white); }

.band { padding: 48px 0; border-bottom: 1px solid var(--line); color: var(--ink-soft); }

.section { padding: 92px 0; }
.section-alt { background: var(--paper-alt); border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.section-dark { background: var(--ink); color: #f2f3f3; }
.section-dark p, .section-dark .lead { color: #b9bfc1; }
.section-dark h2, .section-dark h3 { color: #fff; }

.split-head { margin-bottom: 40px; }
.split-head h2 { max-width: 20ch; }
.split-head .note { margin-top: 14px; }

.shot { position: relative; overflow: hidden; background: #dcdedf; margin: 0; }
.shot img {
  display: block; width: 100%; height: 100%; object-fit: cover;
  filter: saturate(.78) contrast(1.03);
  transition: transform .8s cubic-bezier(.16,1,.3,1);
}
.shot:hover img { transform: scale(1.028); }
.shot-4x5 { aspect-ratio: 4 / 5; }
.shot-3x2 { aspect-ratio: 3 / 2; }
.shot-16x9 { aspect-ratio: 16 / 9; }
.shot-21x9 { aspect-ratio: 2 / 1; }
.shot-notch { position: absolute; left: 0; bottom: 0; width: 44%; height: 20%; background: var(--paper); }
.shot-band { margin-top: 48px; }
.section-alt .shot-notch { background: var(--paper-alt); }
@media (prefers-reduced-motion: reduce) { .shot img { transition: none; } .shot:hover img { transform: none; } }
@media (min-width: 960px) {
  .shot-band { margin-top: 72px; }
  .shot-21x9 { aspect-ratio: 21 / 9; }
}

.frame {
  position: relative; aspect-ratio: 4 / 5; overflow: hidden;
  background: linear-gradient(168deg, #cfd3d4 0%, #9ba1a4 44%, #4b5255 100%);
}
.frame-wide { aspect-ratio: 16 / 9; background: linear-gradient(150deg, #d4d7d8, #8f9598 52%, #3f4649); }
.frame-notch { position: absolute; left: 0; bottom: 0; width: 44%; height: 22%; background: var(--paper-alt); }

.ord { display: none !important; }
.stack-list article { padding: 20px 0; border-top: 1px solid var(--line); }
.stack-list article:first-child { border-top: 0; }
.stack-list h3 { display: flex; gap: 12px; }
.stack-list .ord { font: 600 .75rem/1.7 var(--font-head); color: var(--bronze); }
.stack-list article p { margin-top: 8px; color: var(--ink-soft); font-size: .9375rem; }

.indent { margin-bottom: 44px; }

.numbered { margin-top: 34px; display: grid; gap: 34px; }
.numbered article { max-width: 62ch; }
.numbered h4 { margin-bottom: 10px; }
.numbered p { color: var(--ink-soft); font-size: .9375rem; }
@media (min-width: 960px) {
  .numbered { margin-left: 7%; margin-top: 48px; gap: 44px; }
}

.grid-items { display: grid; gap: 20px; align-items: stretch; }
.grid-items article { display: grid; grid-template-rows: auto auto 1fr; align-content: start; padding: 30px 26px 32px; background: var(--white); border: 1px solid var(--line-soft); }
.grid-items article h3 { min-height: 2.6em; }
.grid-items .ico { display: block; color: var(--bronze); margin-bottom: 18px; }
.grid-items .ico svg { display: block; width: 26px; height: 26px; }
.grid-items .ord { display: block; font: 600 .75rem/1 var(--font-head); color: var(--bronze); margin-bottom: 12px; }
.grid-items p { margin-top: 8px; color: var(--ink-soft); font-size: .9375rem; }


.rule-list li { padding: 11px 0; border-top: 1px solid var(--line-soft); color: var(--ink-soft); font-size: .9375rem; }

.pull {
  font-family: var(--font-head); font-size: 1.25rem; line-height: 1.4;
  letter-spacing: -0.012em; font-weight: 500; color: var(--ink);
  margin-top: 1.2em;
}
.section-dark .pull { color: #fff; }

.triple { margin-top: 42px; }
.triple article { padding: 20px 0; }
.triple p { margin-top: 8px; font-size: .9375rem; }

.service { padding: 72px 0; border-top: 1px solid var(--line); }
.service .ord { font: 600 .75rem/1 var(--font-head); color: var(--bronze); margin-bottom: 12px; }
.service-main h2 { max-width: 24ch; margin-bottom: 20px; }
.service-main p { color: var(--ink-soft); }
.service-caps { margin-top: 22px; }
.service-caps h3, .role h3, .form h3 {
  font-family: var(--font-head); font-size: .6875rem; font-weight: 600;
  letter-spacing: .14em; text-transform: uppercase; color: var(--grey);
}
.service-caps h3 { margin-bottom: 6px; }
.service-caps li { padding: 13px 0; border-top: 1px solid var(--line-soft); font-size: .9375rem; }

.approach { padding: 26px 0; border-top: 1px solid var(--line); }
.approach h2 { margin-bottom: 20px; }
.approach .ord { display: block; font: 600 .75rem/1 var(--font-head); letter-spacing: .06em; color: var(--bronze); margin-bottom: 10px; }
.approach p { color: var(--ink-soft); }
.approach div { max-width: var(--measure); }

.sub { font-size: 1.0625rem; color: var(--ink-soft); margin-bottom: 20px; }
.shot-band + .sub { margin-top: 56px; }
@media (min-width: 960px) { .shot-band + .sub { margin-top: 88px; } }

.insight { padding: 28px 0; border-top: 1px solid var(--line); }
.insight .date { font-family: var(--font-head); font-weight: 500; letter-spacing: .04em; font-size: .8125rem; color: var(--grey); margin-bottom: 10px; }
.insight h2 { max-width: 28ch; }
.insight .tags { margin-top: 12px; font-size: .8125rem; color: var(--bronze); }
.insight .summary { margin-top: 18px; max-width: var(--measure); color: var(--ink-soft); }
.insight .reveal { margin-top: 18px; }
.insight-body { margin-top: 20px; max-width: var(--measure); border-top: 1px solid var(--line-soft); }
.insight-body p { margin-top: 1.05em; color: var(--ink-soft); }

.role { padding: 0 0 8px; }
.role-head { padding-bottom: 40px; }
.role h2 { margin-bottom: 12px; }
.role .note { color: var(--grey); }
.role-row { padding: 40px 0; border-top: 1px solid var(--line); }
.role-row h3 { margin: 0 0 16px; }
.role p { color: var(--ink-soft); max-width: var(--measure); }
.role-copy > * + * { margin-top: 1.05em; }
.role-toggle { margin: 36px 0 4px; }
.role-more { border-top: 1px solid var(--line); margin-top: 36px; }
.role-more > .role-row:first-child { border-top: 0; }

.form-layout > * + * { margin-top: 32px; }
.form-intro h2 { max-width: 22ch; }
.form-intro p { margin-top: 18px; color: var(--ink-soft); max-width: var(--measure); }
.form-intro .note { font-size: .8125rem; }

.office { margin-top: 24px; border-top: 1px solid var(--line); }
.office dt {
  font-family: var(--font-head); font-size: .6875rem; font-weight: 600;
  letter-spacing: .14em; text-transform: uppercase; color: var(--grey);
  padding-top: 18px;
}
.office dd {
  margin: 6px 0 0; padding-bottom: 20px; border-bottom: 1px solid var(--line);
  font-family: var(--font-head); font-size: 1.0625rem; line-height: 1.45; color: var(--ink);
}

.form { background: var(--white); border: 1px solid var(--line); padding: 24px 20px; }
.form h3 { margin-bottom: 18px; }
.field { display: block; margin: 0 0 16px; }
.field label { display: block; font-family: var(--font-head); font-size: .8125rem; font-weight: 600; letter-spacing: .04em; text-transform: uppercase; margin-bottom: 6px; }
.field .hint { display: block; font-size: .8125rem; color: var(--grey); margin-bottom: 6px; }
.form input, .form select, .form textarea {
  width: 100%; font: inherit; color: inherit; padding: 11px 12px;
  background: var(--white); border: 1px solid var(--line); border-radius: 0;
}
.form input[type="file"] { padding: 9px 10px; font-size: .875rem; }
.form select { appearance: none; }
.form textarea { line-height: 1.6; resize: vertical; }
.form input:hover, .form select:hover, .form textarea:hover { border-color: var(--grey); }
.form input:focus, .form select:focus, .form textarea:focus { outline: 2px solid var(--ink); outline-offset: 0; border-color: var(--ink); }

.site-foot { background: var(--ink); color: var(--grey-light); padding: 44px 0 28px; }
.site-foot .mark { color: #fff; }
.site-foot .ft-head { font-family: var(--font-head); }
.foot-brand { display: grid; align-content: start; }
.foot-contact { font-style: normal; display: grid; gap: 7px; margin-top: 20px; font-size: .875rem; color: var(--grey-light); }
.foot-contact a { text-decoration: none; }
.foot-contact a:hover { color: #fff; }
.office a { text-decoration: none; box-shadow: inset 0 -1px 0 var(--line); }
.office a:hover { box-shadow: inset 0 -1px 0 currentColor; }
.role a { color: inherit; text-decoration: none; box-shadow: inset 0 -1px 0 var(--line); }
.role a:hover { box-shadow: inset 0 -1px 0 currentColor; }
.site-foot nav { margin-top: 22px; }
.site-foot li { padding: 7px 0; }
.site-foot a { font-size: .9375rem; text-decoration: none; color: var(--grey-light); }
.site-foot a:hover { color: #fff; }
.copyright { margin-top: 26px; padding-top: 18px; border-top: 1px solid rgba(255,255,255,.12); font-size: .75rem; color: #7d8386; }

@media (min-width: 700px) {
  h1 { font-size: 3rem; letter-spacing: -0.022em; }
  h2 { font-size: 2.0625rem; }
  h3 { font-size: 1.125rem; }
  .hero-inner { padding: 108px 20px 124px; }
  .hero { min-height: 78vh; display: flex; align-items: flex-end; }
  .hero-body { margin-top: 40px; }
  .page-head { padding: 84px 0 100px; }
  .section { padding: 132px 0; }
  .band { padding: 64px 0; }
  .band .measure-wide { column-count: 2; column-gap: 44px; }
  .band p + p { margin-top: 0; }
  .lead { font-size: 1.125rem; }
  .grid-items { grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 28px; row-gap: 28px; }
  .media-split { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr); gap: 44px; align-items: start; }
  .role-grid { display: grid; grid-template-columns: 1fr 1.3fr; gap: 36px; }
  .role-row { display: grid; grid-template-columns: 12rem minmax(0, 1fr); gap: 44px; padding: 52px 0; }
  .role-row h3 { margin: 0; padding-top: .35em; }
  .role-head { display: grid; grid-template-columns: 12rem minmax(0, 1fr); column-gap: 44px; row-gap: 10px; padding-bottom: 56px; }
  .role-head h2 { grid-column: 2; }
  .role-head .note { grid-column: 2; }
  .service { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(0, .9fr); gap: 28px; padding: 112px 0; grid-template-areas: "main caps" "media caps"; align-items: start; }
  .service-media { grid-area: media; }
  .service-main { grid-area: main; }
  .service-caps { grid-area: caps; }
  .service .ord { margin: 0; padding-top: 5px; }
  .service-caps { margin-top: 0; }
  .form-layout { display: grid; grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr); gap: 48px; align-items: start; }
  .form-layout > * + * { margin-top: 0; }
  .form { padding: 30px 28px; }
  .site-foot { padding: 60px 0 32px; }
  .foot-inner { display: grid; grid-template-columns: 1fr 1fr; gap: 30px; }
  .site-foot nav { margin-top: 0; }
  .site-foot ul { columns: 2; }
  .copyright { grid-column: 1 / -1; margin-top: 36px; }
}

@media (min-width: 960px) {
  .wrap { padding: 0 56px; }
  h1 { font-size: 3.625rem; letter-spacing: -0.024em; }
  h2 { font-size: 2.375rem; }
  .nav-toggle { display: none; }
  .site-nav { display: block; }
  .site-nav ul { display: flex; gap: 28px; }
  .site-nav li + li { border: 0; }
  .site-nav a { padding: 0; font-size: .875rem; }
  .site-nav a[aria-current="page"] { box-shadow: inset 0 -1px 0 currentColor; }
  .head-inner { min-height: 70px; }
  .hero-inner { padding: 168px 56px 116px; }
  .hero { min-height: 90vh; }
  .hero h1 { font-size: 4.5rem; letter-spacing: -0.028em; max-width: 17ch; line-height: 1.04; }
  .hero-body {
    margin-left: 0;
    margin-top: 52px;
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 24px 56px;
    max-width: none;
    align-items: start;
    padding-top: 34px;
  }
  .hero-body .lead { grid-row: 1; margin: 0; max-width: 34rem; }
  .hero-body p:not(.lead):not(.actions) { grid-row: 2; grid-column: 1; margin: 0; max-width: 34rem; }
  .hero-body .actions { grid-column: 1; grid-row: 3; margin-top: 40px; }
  .head-body { margin-left: 7%; }
  .page-head { padding: 126px 0 158px; }
  .section { padding: 184px 0; }
  .split { display: grid; grid-template-columns: minmax(0, .78fr) minmax(0, 1.22fr); gap: 60px; align-items: end; }
  .split-head { margin-bottom: 0; }
  .indent { margin-left: 7%; }
  .grid-items { grid-template-columns: repeat(4, minmax(0, 1fr)); column-gap: 28px; row-gap: 28px; }
  .grid-items article { padding: 34px 30px 36px; }
  .triple { display: grid; grid-template-columns: repeat(3, 1fr); gap: 34px; margin-top: 62px; }
  .approach { display: grid; grid-template-columns: minmax(0, .68fr) minmax(0, 1.32fr); gap: 48px; padding: 38px 0; }
  .approach h2 { margin-bottom: 0; }
  .insight { display: grid; grid-template-columns: 8rem minmax(0, 1fr); gap: 44px; padding: 44px 0; }
  .insight .date { margin: 0; }
  .role-grid { grid-template-columns: 1fr 1.45fr; gap: 60px; }
  .role-row { grid-template-columns: 14rem minmax(0, 1fr); gap: 72px; padding: 64px 0; }
  .role-head { grid-template-columns: 14rem minmax(0, 1fr); column-gap: 72px; }
  .role-row-wide .rule-list { columns: 2; column-gap: 56px; }
  .role-row-wide .rule-list li { break-inside: avoid; }
  .media-split { gap: 64px; }
  .pull { font-size: 1.3125rem; }
}

@media (min-width: 1300px) {
  .wrap { padding: 0 72px; }
  .hero-inner { padding: 196px 72px 128px; }
  .section { padding: 208px 0; }
  .split { grid-template-columns: minmax(0, .72fr) minmax(0, 1.28fr); gap: 84px; }
  .grid-items { column-gap: 34px; row-gap: 34px; }
  .service { grid-template-columns: minmax(0, 1.4fr) minmax(0, .8fr); gap: 44px; }
  .approach { gap: 72px; }
  .insight { grid-template-columns: 10rem minmax(0, 1fr); gap: 64px; }
  .form-layout { gap: 72px; }
  .hero h1 { font-size: 5.125rem; }
  .head-body { margin-left: 9%; }
}

.shot-lead { margin-bottom: 56px; }
.shot-caption { margin-top: 26px; color: var(--ink-soft); }
.shot-heading { margin-top: 30px; }
@media (min-width: 960px) {
  .shot-lead { margin-bottom: 88px; }
}

.section-editorial { padding: 104px 0; }
.editorial { display: grid; gap: 40px; }
.editorial-media { aspect-ratio: 4 / 5; }
.editorial-body > .split-head { margin-bottom: 0; }
.editorial-body > .split-head h2 { max-width: 22ch; }
.editorial-body .stack-list { margin-top: 30px; }
.editorial-body .stack-list article { padding: 22px 0; }
@media (min-width: 700px) {
  .section-editorial { padding: 148px 0; }
  .editorial { grid-template-columns: minmax(0, 1.12fr) minmax(0, 1fr); gap: 56px; align-items: center; }
  .editorial-media { aspect-ratio: 4 / 5; }
  .editorial-body .stack-list { margin-top: 34px; }
}
@media (min-width: 960px) {
  .section-editorial { padding: 200px 0; }
  .editorial { grid-template-columns: minmax(0, 1.38fr) minmax(0, 1fr); gap: 88px; }
  .editorial-body { max-width: 34rem; }
  .editorial-body .stack-list { margin-top: 40px; }
  .editorial-body .stack-list article { padding: 26px 0; }
}
@media (min-width: 1300px) {
  .section-editorial { padding: 224px 0; }
  .editorial { grid-template-columns: minmax(0, 1.45fr) minmax(0, 1fr); gap: 120px; }
  .editorial-body { max-width: 36rem; }
}

.sectors { display: grid; gap: 30px; margin-top: 40px; }
.sector figure { margin-bottom: 18px; }
.sector h3 { font-size: 1.125rem; }
.sector p { margin-top: 8px; color: var(--ink-soft); }
@media (min-width: 700px) { .sectors { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 34px; margin-top: 52px; } }
@media (min-width: 1300px) { .sectors { gap: 44px; margin-top: 64px; } }

.service-media { margin-top: 56px; }
.service-main h4 { margin-top: 22px; font-size: .9375rem; letter-spacing: .04em; text-transform: uppercase; }
.service-main h4 + p { margin-top: 6px; }
.partners { display: flex; flex-wrap: wrap; gap: 8px 24px; margin-top: 20px; list-style: none; padding: 0; }
.partners a { font-size: .9375rem; }
@media (min-width: 960px) {
  .service { grid-template-areas: "main caps" "media caps"; align-items: start; }
  .service-media { margin-top: 72px; }
  .service-media { grid-area: media; }
  .service-main { grid-area: main; }
  .service-caps { grid-area: caps; }
}

.contact-layout { display: grid; gap: 32px; }
.contact-details h2 { font-size: 1.5rem; }
.contact-details .office { margin-top: 26px; }
@media (min-width: 1200px) { .office dd { font-size: 1.1875rem; } }
@media (min-width: 960px) {
  .contact-layout { grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr); gap: 72px; align-items: center; }
}

@media (min-width: 960px) {
  .grid-items { grid-template-columns: repeat(8, minmax(0, 1fr)); }
  .grid-items article { grid-column: span 2; }
  .grid-items article:nth-child(5) { grid-column: 2 / span 2; }
}

.hero { position: sticky; top: 0; z-index: 0; }
.hero ~ * { position: relative; z-index: 1; }
section.section:not(.section-alt):not(.section-dark), .band { background-color: var(--paper); }
@media (min-width: 760px) { .hero { height: 100svh; display: flex; align-items: center; } .hero-inner { width: 100%; } }
@media (max-height: 620px) and (min-width: 760px) { .hero { height: auto; } }
.hero-media video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; filter: saturate(.82) contrast(1.05) brightness(1.02); opacity: .82; }
.hero-slides { position: absolute; inset: 0; display: block; }
.hero-slides img { animation: none; opacity: 1; transform: none; will-change: auto; }
@media (prefers-reduced-motion: reduce) { .hero-slides img { animation: none; transform: none; } }

.video-shot { position: relative; background: var(--ink); }
.video-shot video { width: 100%; height: 100%; object-fit: cover; display: block; }

.legal { display: grid; gap: 40px; }
.legal-nav-label { font-family: var(--font-head); font-size: .6875rem; font-weight: 600; letter-spacing: .16em; text-transform: uppercase; color: var(--grey); margin-bottom: 14px; }
.legal-nav ul { display: grid; gap: 2px; }
.legal-nav a { display: block; padding: 7px 0; font-size: .875rem; color: var(--ink-soft); text-decoration: none; box-shadow: inset 0 -1px 0 transparent; transition: color .2s ease, box-shadow .2s ease; }
.legal-nav a:hover { color: var(--ink); box-shadow: inset 0 -1px 0 currentColor; }
.legal-body { max-width: 68ch; }
.legal-body h2 { font-size: 1.375rem; margin: 52px 0 14px; }
.legal-body h3 { margin: 30px 0 10px; }
.legal-body p { color: var(--ink-soft); }
.legal-list { margin: 16px 0 0; }
.legal-list li { padding: 12px 0; border-top: 1px solid var(--line-soft); color: var(--ink-soft); font-size: .9375rem; }
.legal-rights { margin: 20px 0 0; }
.legal-rights dt { font-family: var(--font-head); font-weight: 600; margin-top: 24px; }
.legal-rights dd { margin: 6px 0 0; color: var(--ink-soft); font-size: .9375rem; }
.legal-body .actions { margin-top: 52px; }
@media (min-width: 960px) {
  .legal { grid-template-columns: minmax(0, 15rem) minmax(0, 1fr); gap: 88px; align-items: start; }
  .legal-nav { position: sticky; top: 104px; }
  .legal-body h2 { margin-top: 68px; }
  .legal-body > h2:first-of-type { margin-top: 56px; }
  .legal-rights { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: 0 44px; }
  .legal-rights dt { grid-column: 1; margin-top: 26px; }
  .legal-rights dd { grid-column: 2; margin-top: 26px; }
}

.closer { position: relative; overflow: hidden; padding: 104px 0 112px; }
.section-dark.has-media { position: relative; overflow: hidden; }
.closer-media { position: absolute; inset: 0; z-index: 0; }
.closer-media img { width: 100%; height: 100%; object-fit: cover; opacity: .3; filter: grayscale(.5) contrast(1.06); }
.closer-media::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(10,13,14,.92) 0%, rgba(10,13,14,.62) 44%, rgba(10,13,14,.95) 100%); }
.closer-inner { position: relative; z-index: 1; }
.closer-head h2 { max-width: 14ch; }
.principles { list-style: none; margin: 56px 0 0; padding: 0; display: grid; gap: 0; border-top: 1px solid rgba(255,255,255,.18); }
.principles li { padding: 26px 0 24px; border-bottom: 1px solid rgba(255,255,255,.12); display: grid; gap: 8px; }
.principles .num { font-family: var(--slab, inherit); font-size: 12px; letter-spacing: .18em; color: #7e878a; }
.principles h3 { color: #fff; margin: 0; }
.principles p { margin: 0; color: #b9bfc1; max-width: 42ch; }
.closer-cta { margin-top: 56px; display: grid; gap: 30px; }
.closer-statement { font-family: "Epunda Slab", Georgia, serif; font-weight: 300; color: #fff; font-size: clamp(24px, 3.2vw, 36px); line-height: 1.26; max-width: 34ch; text-wrap: pretty; }
@media (min-width: 860px) {
  .closer { padding: 128px 0 136px; }
  .principles { grid-template-columns: repeat(3, 1fr); gap: 0 40px; }
  .principles li { padding: 30px 0 0; border-bottom: 0; }
  .closer-cta { grid-template-columns: 1.4fr auto; align-items: end; gap: 48px; margin-top: 92px; padding-top: 40px; border-top: 1px solid rgba(255,255,255,.18); }
  .closer-cta .actions { margin: 0 0 6px; }
}

.partners { margin-top: 34px; }
.partners-label { font-family: "Epunda Sans", system-ui, sans-serif; font-size: 11px; letter-spacing: .18em; text-transform: uppercase; color: var(--grey); margin: 0 0 14px; }
.partner-strip { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 12px; }
.partner-strip a { display: flex; align-items: center; justify-content: center; min-height: 62px; padding: 0 24px; border: 1px solid var(--line); background: var(--white); font-family: "Epunda Slab", Georgia, serif; font-size: 15px; letter-spacing: .04em; color: var(--ink); text-decoration: none; transition: border-color .2s ease, background .2s ease; }
.partner-strip a:hover { border-color: var(--ink); background: var(--paper-alt); }

.band { padding: 64px 0 60px; }
.band-inner { display: grid; gap: 26px; }
.band-lead, .band-body { font-family: "Epunda Slab", Georgia, serif; font-weight: 300; font-size: clamp(21px, 2.5vw, 27px); line-height: 1.3; letter-spacing: -.012em; color: var(--ink); max-width: none; text-wrap: pretty; }
@media (min-width: 860px) {
  .band { padding: 104px 0 96px; }
  .band-inner { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 72px; align-items: start; }
  .band-body { padding-left: 0; }
}
@media (min-width: 1300px) {
  .band { padding: 128px 0 118px; }
  .band-inner { gap: 0 110px; }
  .band-body { padding-left: 0; }
}

.partner-strip { align-items: stretch; gap: 14px; }.partner-strip a { min-height: 78px; padding: 14px 20px; }
.partner-strip img { display: block; width: auto; height: 42px; max-width: 190px; object-fit: contain; }
@media (min-width: 700px) { .partner-strip img { height: 46px; max-width: 210px; } }

.foot-legal { margin-top: 26px; padding-top: 18px; border-top: 1px solid rgba(255,255,255,.12); display: grid; gap: 10px; }
.foot-legal .copyright { margin: 0; padding: 0; border: 0; }
.foot-legal-links { margin: 0; font-size: .75rem; }
.foot-legal-links a { color: #7d8386; text-decoration: none; }
.foot-legal-links a:hover { color: #fff; }
@media (min-width: 700px) {
  .foot-legal { grid-column: 1 / -1; grid-template-columns: 1fr auto; align-items: baseline; gap: 24px; margin-top: 36px; }
  .foot-legal .copyright { grid-column: 1; margin: 0; }
  .foot-legal-links { text-align: right; grid-column: 2; }
}

/* ---------- motion ---------- */

:root { --m-ease: cubic-bezier(.16,1,.3,1); --m-ease-out: cubic-bezier(.22,.61,.36,1); }

/* --- reveals ------------------------------------------------------------ */
.m-rise { opacity: 0; transform: translateY(18px); transition: opacity .82s var(--m-ease), transform .82s var(--m-ease); transition-delay: calc(var(--m-i, 0) * 90ms); }
.m-rise.is-in { opacity: 1; transform: none; }

.m-fade { opacity: 0; transition: opacity .9s var(--m-ease); transition-delay: calc(var(--m-i, 0) * 90ms); }
.m-fade.is-in { opacity: 1; }

/* vertical curtain — portrait and editorial media */
.m-mask img { clip-path: inset(0 0 100% 0); transform: scale(1.07); transition: clip-path 1.15s var(--m-ease), transform 1.5s var(--m-ease); transition-delay: calc(var(--m-i, 0) * 90ms); }
.m-mask.is-in img { clip-path: inset(0 0 0 0); transform: scale(1); }
.m-mask:hover img { transform: scale(1); }

/* horizontal curtain — wide bands */
.m-wide img { clip-path: inset(0 14% 0 14%); opacity: .001; transition: clip-path 1.25s var(--m-ease), opacity .5s ease-out; }
.m-wide.is-in img { clip-path: inset(0 0 0 0); opacity: 1; }

/* soft scale-in — grid figures */
.m-grow { opacity: 0; transform: scale(.985) translateY(14px); transition: opacity .9s var(--m-ease), transform 1s var(--m-ease); transition-delay: calc(var(--m-i, 0) * 90ms); }
.m-grow.is-in { opacity: 1; transform: none; }

/* hairline that draws itself across a section head */
.m-rule { position: relative; }
.m-rule::before { content: ""; position: absolute; left: 0; top: -20px; width: 100%; height: 1px; background: var(--line, rgba(0,0,0,.14)); transform: scaleX(0); transform-origin: left; transition: transform 1.1s var(--m-ease); }
.m-rule.is-in::before { transform: scaleX(1); }
.section-dark .m-rule::before { background: rgba(255,255,255,.2); }

/* --- scroll-linked ----------------------------------------------------- */
[data-parallax] { will-change: transform; transition: clip-path 1.2s var(--m-ease), opacity .5s ease-out !important; }
[data-parallax-figure]:hover img { transform: none; }

/* --- cards -------------------------------------------------------------- */
.grid-items article { transition: transform .45s var(--m-ease), border-color .45s ease, background-color .45s ease, box-shadow .45s var(--m-ease); }
.grid-items article:hover { transform: translateY(-5px); border-color: var(--line, #d7d9d9); box-shadow: 0 18px 44px -30px rgba(10,13,14,.5); }
.grid-items .ico { transition: transform .45s var(--m-ease), opacity .45s ease; }
.grid-items article:hover .ico { transform: translateY(-2px); }
.grid-items article h3 { position: relative; }
.grid-items article h3::after { content: ""; position: absolute; left: 0; bottom: -6px; width: 26px; height: 1px; background: var(--bronze, #8a7a63); transform: scaleX(0); transform-origin: left; transition: transform .5s var(--m-ease); }
.grid-items article:hover h3::after { transform: scaleX(1); }
.grid-items article p { transition: color .45s ease; }

.sector { transition: transform .5s var(--m-ease); }
.sector figure { transition: box-shadow .5s var(--m-ease); }
.sector:hover figure { box-shadow: 0 22px 50px -34px rgba(10,13,14,.55); }
.sector:hover img { transform: scale(1.045); }
.sector h3 { transition: transform .5s var(--m-ease); }
.sector:hover h3 { transform: translateX(4px); }

.role, .service, .approach { transition: background-color .5s ease; }

/* --- buttons ------------------------------------------------------------ */
.btn { position: relative; transition: background .18s var(--m-ease-out), border-color .18s var(--m-ease-out), color .18s var(--m-ease-out), transform .18s var(--m-ease-out); }
.btn:hover, .btn:focus-visible { transform: translateY(-1px); }
.btn:active { transform: translateY(0); }

.partner-strip a { transition: border-color .3s ease, background .3s ease, transform .4s var(--m-ease); }
.partner-strip a:hover { transform: translateY(-3px); }
.site-nav a, .site-foot a { transition: color .2s ease-out; }

/* --- section-level ------------------------------------------------------ */
@media (min-width: 960px) {
  .service-caps { position: sticky; top: 104px; }
}

@media (prefers-reduced-motion: reduce) {
  .m-rise, .m-fade, .m-grow { opacity: 1 !important; transform: none !important; transition: none !important; }
  .m-mask img, .m-wide img { clip-path: none !important; opacity: 1 !important; transition: none !important; }
  .m-rule::before { transform: scaleX(1) !important; transition: none !important; }
  .grid-items article, .sector, .btn, .partner-strip a { transition: none !important; }
  .grid-items article:hover, .sector:hover h3, .btn:hover, .partner-strip a:hover { transform: none !important; }
  [data-parallax] { transform: none !important; }
  .service-caps { position: static; }
}

/* ---------- cookie consent ---------- */
.consent {
  position: fixed; left: 0; right: 0; bottom: 0; z-index: 90;
  transform: translateY(101%); transition: transform .46s cubic-bezier(.16,1,.3,1);
}
.consent.is-in { transform: none; }
.consent-panel {
  background: var(--white); color: var(--ink);
  border-top: 1px solid var(--line);
  padding: 24px 20px 26px; max-height: 86vh; overflow-y: auto;
}
.consent-eyebrow {
  font-family: var(--font-head); font-size: .6875rem; font-weight: 600;
  letter-spacing: .16em; text-transform: uppercase; color: var(--grey); margin-bottom: 12px;
}
.consent-note { font-size: .9375rem; line-height: 1.62; color: var(--ink-soft); max-width: 62ch; }
.consent-more {
  margin-top: 14px; padding: 0; border: 0; background: none; cursor: pointer;
  font-family: var(--font-body); font-size: .8125rem; color: var(--ink);
  box-shadow: inset 0 -1px 0 var(--line); transition: box-shadow .2s ease;
}
.consent-more:hover { box-shadow: inset 0 -1px 0 currentColor; }
.consent-cats { margin-top: 20px; border-top: 1px solid var(--line-soft); }
.consent-cat { padding: 16px 0; border-bottom: 1px solid var(--line-soft); }
.consent-switch { display: flex; align-items: center; gap: 12px; cursor: pointer; }
.consent-switch input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.consent-track {
  flex: 0 0 auto; width: 34px; height: 18px; border: 1px solid var(--grey);
  position: relative; transition: background .2s ease, border-color .2s ease;
}
.consent-track::after {
  content: ""; position: absolute; top: 2px; left: 2px; width: 12px; height: 12px;
  background: var(--grey); transition: transform .22s cubic-bezier(.16,1,.3,1), background .2s ease;
}
.consent-switch input:checked + .consent-track { background: var(--ink); border-color: var(--ink); }
.consent-switch input:checked + .consent-track::after { transform: translateX(16px); background: var(--white); }
.consent-switch input:disabled + .consent-track { opacity: .5; }
.consent-switch input:focus-visible + .consent-track { outline: 2px solid var(--ink); outline-offset: 3px; }
.consent-cat-name { font-family: var(--font-head); font-weight: 600; font-size: .9375rem; }
.consent-cat-name em { font-style: normal; font-family: var(--font-body); font-weight: 400; font-size: .75rem; color: var(--grey); margin-left: 8px; }
.consent-cat-note { margin-top: 8px; font-size: .8125rem; line-height: 1.6; color: var(--grey); max-width: 68ch; }
.consent-actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 22px; }
.consent-panel .btn { background: var(--ink); color: var(--paper); border-color: var(--ink); padding: 11px 22px; }
.consent-panel .btn:hover { background: var(--ink-soft); border-color: var(--ink-soft); }
.consent-panel .btn-quiet { background: transparent; color: var(--ink); border-color: var(--line); }
.consent-panel .btn-quiet:hover { background: transparent; border-color: var(--ink); }
.consent-legal { margin-top: 16px; font-size: .75rem; color: var(--grey); }
.consent-legal a { color: inherit; text-decoration: none; box-shadow: inset 0 -1px 0 var(--line); }
.consent-legal a:hover { color: var(--ink); box-shadow: inset 0 -1px 0 currentColor; }
@media (min-width: 860px) {
  .consent { left: 56px; right: auto; bottom: 32px; max-width: 33rem; transform: translateY(calc(100% + 32px)); }
  .consent-panel { border: 1px solid var(--line); padding: 30px 32px 32px; }
}
@media (min-width: 1300px) { .consent { left: 72px; } }
@media (prefers-reduced-motion: reduce) {
  .consent { transition: none; }
  .consent-track::after { transition: none; }
}

/* ---------- 404 ---------- */
.error-head { padding-bottom: 68px; }
.error-index a { text-decoration: none; box-shadow: inset 0 -1px 0 transparent; transition: box-shadow .2s ease, color .2s ease; }
.error-index a:hover { color: var(--ink); box-shadow: inset 0 -1px 0 currentColor; }

/* ---------- feature section (image-led, editorial proportions) ---------- */
.section-feature { padding: 104px 0 112px; }
.feature { display: grid; gap: 40px; }
.feature-media { aspect-ratio: 4 / 5; }
.feature-body > .lead { margin-top: 20px; }
.feature-body .sub { margin: 44px 0 0; }
.feature-body .numbered { margin-top: 26px; margin-left: 0; }
@media (min-width: 700px) {
  .section-feature { padding: 152px 0 160px; }
  .feature { grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr); gap: 64px; align-items: center; }
  .feature-media { aspect-ratio: 5 / 6; }
}
@media (min-width: 960px) {
  .section-feature { padding: 200px 0 208px; }
  .feature { grid-template-columns: minmax(0, 1.36fr) minmax(0, 1fr); gap: 96px; }
  .feature-media { aspect-ratio: 4 / 5; }
  .feature-body { max-width: 32rem; }
  .feature-body > .lead { margin-top: 24px; }
  .feature-body .sub { margin-top: 56px; }
  .feature-body .numbered { margin-top: 30px; gap: 34px; grid-template-columns: minmax(0, 1fr); }
  .feature-body .numbered article { max-width: none; }
}
@media (min-width: 1300px) {
  .section-feature { padding: 232px 0 240px; }
  .feature { grid-template-columns: minmax(0, 1.42fr) minmax(0, 1fr); gap: 128px; }
  .feature-body { max-width: 34rem; }
  .feature-body .numbered { gap: 38px; }
}
.shot-band-narrow .shot { max-width: 660px; }
@media (min-width: 960px) { .shot-band-narrow .shot { max-width: 52%; } }
.closer-centred { margin-left: auto; margin-right: auto; text-align: center; }
.closer-centred h2, .closer-centred .lead { margin-left: auto; margin-right: auto; }
.closer-centred .actions { justify-content: center; }

/* --- grid normalisation: one gutter scale, one indent, edges aligned --- */
.wrap.hero-inner { padding-left: 20px; padding-right: 20px; }
.indent, .head-body { margin-left: 0; }
.split, .approach, .insight, .role-grid, .media-split, .editorial,
.form-layout, .contact-layout, .legal, .legal-rights { column-gap: var(--gap-col); }
.grid-items, .triple, .sectors { column-gap: var(--gap-card); row-gap: var(--gap-card); }
.principles, .band-inner { column-gap: var(--gap-col); }
@media (min-width: 700px) { :root { --gap-card: 28px; } }
@media (min-width: 960px) {
  :root { --gap-col: 56px; }
  .indent { margin-left: var(--indent); }
  .head-body { margin-left: var(--indent); }
}
@media (min-width: 1300px) { :root { --gap-col: 72px; --gap-card: 34px; } }
.approach div { max-width: none; }
.approach div .pull { max-width: none; }
.head-mark { display: block; width: auto; height: 44px; margin-bottom: 30px; }
@media (min-width: 960px) { .head-mark { height: 56px; margin-bottom: 40px; } }