@font-face {
  font-family: "DW Inter";
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
  src: url("/fonts/inter-latin-variable.woff2") format("woff2");
}

@font-face {
  font-family: "DW Instrument Serif";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("/fonts/instrument-serif-latin-regular.woff2") format("woff2");
}

@font-face {
  font-family: "DW Instrument Serif";
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url("/fonts/instrument-serif-latin-italic.woff2") format("woff2");
}

:root {
  --font-sans: "DW Inter", "Helvetica Neue", Arial, sans-serif;
  --font-display: "DW Instrument Serif", Georgia, serif;
  --font-micro: "DW Inter", "Helvetica Neue", Arial, sans-serif;
}

html {
  font-kerning: normal;
  font-synthesis: none;
}

body {
  font-family: var(--font-sans);
  font-size: 1rem;
  font-weight: 400;
  letter-spacing: -0.012em;
  line-height: 1.65;
  text-rendering: optimizeLegibility;
}

h1,
h2,
h3 {
  font-family: var(--font-display);
  font-stretch: normal;
  font-style: normal;
  font-weight: 400;
  letter-spacing: -0.035em;
  text-transform: none;
}

p,
li {
  hanging-punctuation: first last;
}

.brand-copy strong {
  font-family: var(--font-sans);
  font-size: 0.76rem;
  font-weight: 620;
  letter-spacing: 0.02em;
}

.brand-copy small {
  font-family: var(--font-sans);
  font-size: 0.59rem;
  font-weight: 500;
  letter-spacing: 0.055em;
}

.primary-nav a,
.header-cta {
  font-family: var(--font-sans);
  font-size: 0.7rem;
  font-weight: 600;
  letter-spacing: 0.055em;
}

.eyebrow,
.section-kicker,
.case-page-label,
.artifact-label,
.visual-disclaimer,
.case-source-note,
.responsible-note,
.case-study-meta,
.case-study-kicker,
.case-kicker,
.case-mini-proof li,
.role-ledger-meta > span,
.role-ledger-meta a,
.workflow-flow span,
.decision-log span,
.case-proofbar span,
.case-card-visual figcaption span,
.case-card-visual figcaption small,
.hero-art figcaption span,
.hero-art figcaption small,
.approach-art figcaption span,
.approach-art figcaption small,
.visual-caption span,
.visual-caption small,
.tag-list li,
.specialisms li,
.metric-card small,
.proof-panel-top,
.preview-chip,
.context-strip-inner > span,
.case-breadcrumb {
  font-family: var(--font-sans);
  font-weight: 600;
  letter-spacing: 0.055em;
}

.eyebrow,
.section-kicker,
.case-page-label {
  font-size: 0.7rem;
  line-height: 1.45;
}

.hero h1 {
  max-width: 10.8ch;
  font-family: var(--font-display);
  font-size: clamp(4.7rem, 7.7vw, 8.35rem);
  font-stretch: normal;
  font-weight: 400;
  letter-spacing: -0.045em;
  line-height: 0.84;
  text-transform: none;
}

.hero h1 span {
  font-style: italic;
  font-weight: 400;
}

.hero-lede {
  max-width: 39rem;
  font-size: clamp(1rem, 1.22vw, 1.12rem);
  font-weight: 400;
  letter-spacing: -0.012em;
  line-height: 1.66;
}

.specialisms li {
  font-size: 0.69rem;
}

.button,
.text-link,
.case-link,
.role-ledger-row a {
  font-family: var(--font-sans);
  font-weight: 600;
  letter-spacing: 0.035em;
}

.metric-card strong {
  font-family: var(--font-display);
  font-weight: 400;
  letter-spacing: -0.035em;
  line-height: 0.9;
}

.visual-outcome strong,
.visual-outcome-top strong {
  font-family: var(--font-display);
  font-weight: 400;
  letter-spacing: -0.035em;
  line-height: 0.88;
}

.metric-card > span {
  font-family: var(--font-sans);
  font-size: 0.72rem;
  font-weight: 600;
  line-height: 1.3;
}

.context-strip li {
  font-family: var(--font-display);
  font-size: clamp(1.15rem, 1.45vw, 1.4rem);
  font-weight: 400;
  letter-spacing: -0.02em;
  line-height: 1;
  text-transform: none;
}

.section-heading h2,
.about-copy h2,
.contact-inner h2 {
  font-family: var(--font-display);
  font-size: clamp(3.45rem, 5.8vw, 6.3rem);
  font-weight: 400;
  letter-spacing: -0.045em;
  line-height: 0.88;
  text-transform: none;
}

.section-heading > h2 + p,
.section-heading > p,
.about-copy > p,
.contact-inner > p {
  font-size: clamp(0.98rem, 1.1vw, 1.06rem);
  letter-spacing: -0.012em;
  line-height: 1.68;
}

.case-study h3 {
  font-family: var(--font-display);
  font-size: clamp(2.9rem, 4.15vw, 4.65rem);
  font-weight: 400;
  letter-spacing: -0.04em;
  line-height: 0.92;
  text-transform: none;
}

.case-summary {
  max-width: 42rem;
  font-size: 0.98rem;
  line-height: 1.62;
}

.case-kicker {
  font-size: 0.7rem;
  font-weight: 600;
  letter-spacing: 0.05em;
  line-height: 1.4;
}

.case-kicker > span:first-child {
  font-family: var(--font-display);
  font-size: 1.4rem;
  font-weight: 400;
  letter-spacing: -0.02em;
  line-height: 1;
}

.case-mini-proof li {
  font-size: 0.7rem;
  font-weight: 600;
  letter-spacing: 0.035em;
  line-height: 1.35;
}

.case-link {
  font-size: 0.78rem;
  font-weight: 600;
  letter-spacing: 0.045em;
}

.case-proof-list li,
.case-proof-chips li,
.case-proof-chips span {
  font-family: var(--font-sans);
  font-size: 0.68rem;
  font-weight: 600;
  letter-spacing: 0.035em;
  line-height: 1.35;
}

.experience-copy h3 {
  font-family: var(--font-display);
  font-size: clamp(3rem, 4.3vw, 4.85rem);
  font-stretch: normal;
  font-weight: 400;
  letter-spacing: -0.04em;
  line-height: 0.92;
  text-transform: none;
}

.experience-copy > p:not(.responsible-note) {
  font-size: 0.98rem;
  line-height: 1.65;
}

.card-meta span:first-child {
  font-family: var(--font-display);
  font-weight: 400;
  letter-spacing: -0.025em;
  line-height: 0.95;
}

.card-meta span:not(:first-child),
.tag-list li,
.responsible-note {
  font-family: var(--font-sans);
  font-weight: 600;
  letter-spacing: 0.045em;
}

.role-ledger-meta h3 {
  font-family: var(--font-display);
  font-size: clamp(1.85rem, 2.55vw, 2.7rem);
  font-weight: 400;
  letter-spacing: -0.035em;
  line-height: 0.98;
  text-transform: none;
}

.role-ledger-summary p {
  font-size: 0.86rem;
  line-height: 1.62;
}

.capability-card h3,
.approach-step h3,
.about-facts strong,
.case-grid h3,
.artifact h3,
.decision-log h3,
.case-outcome h3,
.case-callout h3 {
  font-family: var(--font-display);
  font-weight: 400;
  letter-spacing: -0.025em;
  line-height: 1;
  text-transform: none;
}

.capability-card p,
.approach-step p,
.about-facts p {
  line-height: 1.65;
}

.capability-marquee {
  font-family: var(--font-display);
  font-weight: 400;
  letter-spacing: -0.045em;
  line-height: 0.82;
  text-transform: none;
}

.case-page-hero h1 {
  max-width: 10.8ch;
  font-family: var(--font-display);
  font-size: clamp(3.8rem, 6.1vw, 6.75rem);
  font-weight: 400;
  letter-spacing: -0.045em;
  line-height: 0.88;
  text-transform: none;
}

.case-page-hero h1 span {
  font-style: italic;
  font-weight: 400;
}

.case-page-intro {
  max-width: 39rem;
  font-size: clamp(1rem, 1.2vw, 1.1rem);
  line-height: 1.66;
}

.case-proofbar strong {
  font-family: var(--font-sans);
  font-size: 0.86rem;
  font-weight: 600;
  letter-spacing: -0.01em;
  line-height: 1.4;
}

.case-section-heading h2 {
  font-family: var(--font-display);
  font-size: clamp(2.35rem, 3.55vw, 3.9rem);
  font-weight: 400;
  letter-spacing: -0.035em;
  line-height: 0.95;
  text-transform: none;
}

.case-section-content > p,
.case-grid p,
.artifact p,
.decision-log p,
.case-outcome p,
.case-callout p {
  font-size: 0.98rem;
  line-height: 1.68;
}

.case-grid h3,
.artifact h3,
.case-outcome h3,
.case-callout h3 {
  font-size: clamp(1.55rem, 2.2vw, 2.15rem);
}

.workflow-flow strong,
.decision-log strong {
  font-family: var(--font-sans);
  font-weight: 600;
  letter-spacing: -0.012em;
  line-height: 1.42;
}

.case-deep-dive > summary span {
  font-family: var(--font-display);
  font-weight: 400;
  letter-spacing: -0.025em;
  line-height: 1;
  text-transform: none;
}

.case-deep-dive > summary small {
  font-family: var(--font-sans);
  font-size: 0.76rem;
  font-weight: 500;
  letter-spacing: 0;
  line-height: 1.5;
}

@media (max-width: 58rem) {
  .hero h1 {
    max-width: 9.8ch;
    font-size: clamp(4rem, 12vw, 6.5rem);
    line-height: 0.88;
  }

  .section-heading h2,
  .about-copy h2,
  .contact-inner h2 {
    font-size: clamp(3.15rem, 10vw, 5rem);
    line-height: 0.91;
  }

  .experience-copy h3 {
    font-size: clamp(2.8rem, 8vw, 4.25rem);
  }

  .case-page-hero h1 {
    max-width: 11ch;
    font-size: clamp(3.45rem, 10vw, 5.4rem);
    line-height: 0.91;
  }
}

@media (max-width: 44rem) {
  .brand-copy strong {
    font-size: 0.72rem;
    line-height: 1.18;
  }

  .brand-copy small {
    font-size: 0.62rem;
  }

  .header-cta {
    font-size: 0.66rem;
    letter-spacing: 0.045em;
  }

  .hero h1 {
    max-width: 9.25ch;
    font-size: clamp(3.7rem, 16.3vw, 4.85rem);
    letter-spacing: -0.04em;
    line-height: 0.89;
  }

  .hero-lede {
    font-size: 1rem;
    line-height: 1.66;
  }

  .section-heading h2,
  .about-copy h2,
  .contact-inner h2 {
    font-size: clamp(3rem, 13vw, 4.2rem);
    letter-spacing: -0.038em;
    line-height: 0.92;
  }

  .case-study h3 {
    font-size: clamp(2.75rem, 12vw, 3.45rem);
    letter-spacing: -0.035em;
    line-height: 0.94;
  }

  .case-summary {
    font-size: 0.96rem;
    line-height: 1.62;
  }

  .experience-copy h3 {
    font-size: clamp(2.7rem, 12vw, 3.55rem);
    line-height: 0.94;
  }

  .role-ledger-meta h3 {
    font-size: 1.95rem;
    line-height: 1;
  }

  .case-page-hero h1 {
    max-width: 10.4ch;
    font-size: clamp(3.3rem, 14vw, 4.35rem);
    letter-spacing: -0.038em;
    line-height: 0.92;
  }

  .case-section-heading h2 {
    font-size: clamp(2.35rem, 10.5vw, 3.2rem);
    line-height: 0.97;
  }

  .case-section-content > p,
  .case-grid p,
  .artifact p,
  .decision-log p,
  .case-outcome p,
  .case-callout p {
    font-size: 0.96rem;
    line-height: 1.66;
  }

  .eyebrow,
  .section-kicker,
  .case-page-label,
  .artifact-label,
  .case-card-visual figcaption span,
  .case-card-visual figcaption small {
    font-size: 0.66rem;
  }
}

@media (max-width: 23rem) {
  .header-cta {
    max-width: 7.6rem;
    line-height: 1.25;
    text-align: right;
  }

  .hero h1 {
    font-size: clamp(3.45rem, 15.8vw, 4rem);
  }

  .section-heading h2,
  .about-copy h2,
  .contact-inner h2 {
    font-size: 2.9rem;
  }
}

@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }
}