@charset "UTF-8";

/* Titles read as complete sentences; narrow screens wrap only when needed. */
main :is(h1,h2,h3,h4) { text-wrap: wrap; word-break: normal; }
main :is(h1,h2,h3,h4) span { white-space: normal; }
.hero-title-row { grid-column: 1 / -1; min-width: 0; }
.tech-hero .hero-title-row h1,
.service-hero .hero-title-row h1 { margin-bottom: 0; }
.tech-hero,
.service-hero { row-gap: 30px; }
.section-lead,
.service-chapter-head,
.service-discovery-head { display: block; }
.section-lead .lead-copy,
.service-chapter-head > p,
.service-discovery-head > p { max-width: 780px; margin-top: 22px; }
.section-lead h2,
.service-chapter-head h2,
.service-discovery-head h2 { max-width: none; }
.art-section { grid-template-columns: 1fr; gap: 42px; }
.art-list { min-width: 0; }
.collaboration-label,
.art-type { flex-wrap: wrap; }
.redundancy-grid h3 span { display: inline; margin-left: .55em; }
#tech-grading .grading-story-intro { grid-template-columns: 1fr; gap: 20px; }
.work-copy,
.space-copy { container-type: inline-size; }
.work-copy :is(h2,h3), .page-live .work-copy h2 { font-size: clamp(22px, 8.8cqw, 36px); }
.space-copy :is(h2,h3), .page-live .space-copy h2 { font-size: clamp(22px, 12cqw, 36px); }

@media (max-width: 760px) {
  main :is(h1,h2,h3,h4) { text-wrap: balance; }
  main p:not(.eyebrow) { text-wrap: balance; }
  .intro-heading h1 { font-size: clamp(27px, 6.8vw, 50px); letter-spacing: -.045em; }
  .section-heading h2,
  .art-heading h2,
  .contact-section h2 { font-size: clamp(24px, 5.5vw, 40px); line-height: 1.4; }
  .tech-hero .hero-title-row h1,
  .service-hero .hero-title-row h1 { font-size: clamp(24px, 5.6vw, 38px); line-height: 1.4; }
  .section-lead h2,
  .service-chapter-head h2,
  .service-discovery-head h2 { font-size: clamp(23px, 5.3vw, 32px); line-height: 1.45; }
  .section-lead .lead-copy,
  .service-chapter-head > p,
  .service-discovery-head > p { margin-top: 18px; }
  .art-section { gap: 32px; }
}

@media (max-width: 450px) {
  .tech-hero .hero-title-row h1,
  .service-hero .hero-title-row h1 { font-size: clamp(20px, 5.4vw, 24px); }
}

@media (max-width: 360px) {
  /* Six characters still fit when a classic scrollbar reduces the content width. */
  body.page-live .page-heading h1 { font-size: 44px; }
}

.curation-name { container-type: inline-size; min-width: 0; }
.curation-name h2 { font-size: clamp(32px, 18cqw, 70px); }
