/* Typography by content role. Portfolio wordmarks and map labels retain their
   independently sized artwork; layout and spacing remain in style.css. */
:root {
  --type-display: clamp(74px, 7.5vw, 114px);
  --type-closing: clamp(70px, 8vw, 115px);
  --type-section: clamp(42px, 4.4vw, 60px);
  --type-service: 32px;
  --type-card: 30px;
  --type-list-heading: 20px;
  --type-lead: 18px;
  --type-body: 17px;
  --type-support: 15px;
  --type-interface: 14px;
  --type-label: 12px;
  --type-caption: 12px;
  --type-index: 13px;
}
body { font-family: var(--sans); font-size: var(--type-body); line-height: 1.5; }
h1, h2 { font-family: var(--serif); font-weight: 400; letter-spacing: -.025em; line-height: 1.08; }
h2, .global h2, .faq h2 { font-size: var(--type-section); }
.hero h1 { font-size: var(--type-display); letter-spacing: -.035em; line-height: .98; }
.contact h2 { font-size: var(--type-closing); }
dialog h2 { font-size: 42px; }

/* Equal paragraph roles share size, rhythm and weight across all sections. */
p, .intro-bottom p, .section-top > p, .service-content p,
.sector-intro p, .process-grid p, .global p, .faq details p,
.contact-bottom p, dialog p {
  font-size: var(--type-body); font-weight: 400; line-height: 1.7; letter-spacing: 0;
}
.hero p { font-size: var(--type-lead); line-height: 1.75; }
.service-content ul, .sector-list p {
  font-size: var(--type-support); font-weight: 400; line-height: 1.65;
}

/* Serif titles: service rows, process cards and people. */
.service h3, .process-grid h3, .person-info h3 {
  font-family: var(--serif); font-weight: 400; line-height: 1.2; letter-spacing: -.015em;
}
.service h3 { font-size: var(--type-service); }
.process-grid h3, .person-info h3 { font-size: var(--type-card); }
.person-info { flex-wrap: wrap; }
.sector-list h3 { font-size: var(--type-list-heading); font-weight: 500; line-height: 1.4; }
.firm-positioning b { font-family: var(--sans); font-size: var(--type-body); font-weight: 500; line-height: 1.4; }
.faq summary { font-size: var(--type-body); font-weight: 500; line-height: 1.5; }

/* Shared uppercase label system, including The Firm and In Numbers. */
.eyebrow, .section-label, .contact .section-label, .process-grid article > span,
.person-info span, .footer-label, .firm-positioning span {
  font-size: var(--type-label); font-weight: 500; letter-spacing: .12em; line-height: 1.6;
}
.number, .sector-list span { font-size: var(--type-index); font-weight: 400; line-height: 1.5; }

/* Navigation, buttons, metric descriptors and portfolio captions. */
.header nav, .header nav a, .header-cta, .button, .contact-bottom .button,
.text-link, .company-bottom, .metrics-grid dt, .portfolio-total > span,
.footer-main p, .footer-nav {
  font-size: var(--type-interface); line-height: 1.5; letter-spacing: 0;
}
.header nav a, .header-cta, .button, .text-link { font-weight: 500; }
.metrics-grid dt { font-weight: 400; }
.email-link { font-size: var(--type-body); line-height: 1.5; }
.experience-note, .footer-bottom, .footer-bottom button,
.art-caption, .art-caption span {
  font-size: var(--type-caption); font-weight: 400; line-height: 1.6;
}
.art-caption, .art-caption span { letter-spacing: .08em; }
.art-caption { flex-wrap: wrap; gap: 6px 18px; }

@media (max-width: 1100px) {
  :root { --type-display: 80px; }
}
@media (max-width: 800px) {
  :root { --type-display: 66px; --type-service: 30px; }
  .header nav a { font-size: var(--type-body); }
}
@media (max-width: 560px) {
  :root {
    --type-display: clamp(60px, 13.5vw, 77px);
    --type-closing: 76px;
    --type-section: 44px;
    --type-service: 28px;
    --type-card: 28px;
    --type-list-heading: 20px;
    --type-body: 16px;
    --type-lead: 17px;
    --type-label: 11px;
  }
}