/* Shared reading hierarchy across the home and inner pages. */
:root {
  --type-overline: 12px;
  --type-small: 14px;
  --type-body: 16px;
  --type-card: 20px;
  --type-section: clamp(36px, 3.6vw, 46px);
  --type-display: clamp(66px, 6.7vw, 88px);
}

body { font-size: var(--type-body); }
nav, .text-link, .button, .footer-links { font-size: var(--type-small); }
.eyebrow, .project-category, .fact-label, .article-label {
  font-size: var(--type-overline);
}
h2, .approach-heading h2, .about-heading h2, .press-heading h2,
.start-band h2, .faq h2 { font-size: var(--type-section); }
.hero h1 { font-size: var(--type-display); }
.hero-role, .about-content .lead { font-size: var(--type-card); }
.hero-description, .section-intro, .approach-heading > p:not(.eyebrow),
.approach-points p, .about-content > p:not(.lead), .start-description,
.media-intro { font-size: var(--type-body); }
.request h3, .approach-points h3, .practice-scope > h3,
.secondary-project h3 { font-size: var(--type-card); }
.request p, .scope-copy p, .featured-copy > p:not(.project-category),
.secondary-project p:last-child, .faq-list details p {
  font-size: var(--type-small);
}

/* Make the request cards easier to scan. */
.requests-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 42px 30px;
}
.request h3 {
  min-height: 2.7em;
  line-height: 1.35;
  margin-bottom: 14px;
}
.index {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 40px;
  min-height: 36px;
  padding: 4px 8px;
  margin-bottom: 20px;
  font-size: 20px;
  line-height: 1;
  font-weight: 700;
}
.point-mark { font-size: 16px; }
.request-highlight {
  font-style: normal;
  font-weight: 600;
  line-height: 1.7;
}
.practice-scope > h3 {
  width: fit-content;
  align-self: start;
  background: var(--yellow);
  padding: 2px 6px;
  line-height: 1.45;
  border: 0;
  box-shadow: none;
  text-decoration: none;
}
.practice-scope > h3::before,
.practice-scope > h3::after {
  content: none !important;
  display: none !important;
}

/* Keep article and media pages within the same hierarchy. */
.article-hero h1 { font-size: clamp(48px, 5.7vw, 72px); }
.article-lead { font-size: var(--type-card); }
.article-copy { font-size: var(--type-body); }
.article-label .article-number { font-size: 18px; }
.journalist-card h2 { font-size: 36px; }
.journalist-card p { font-size: var(--type-body); }
.media-page h1 { font-size: clamp(48px, 5.7vw, 72px); }

@media (max-width: 1050px) {
  .requests-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 760px) {
  :root {
    --type-section: clamp(32px, 8.5vw, 38px);
    --type-display: clamp(56px, 13vw, 72px);
  }
  .article-hero h1, .media-page h1 {
    font-size: clamp(40px, 10vw, 54px);
  }
  .article-lead { font-size: 18px; }
}

@media (max-width: 680px) {
  .requests-grid { grid-template-columns: 1fr; gap: 28px; }
  .request h3 { min-height: 0; }
  .request p, .scope-copy p { font-size: var(--type-body); }
  .index { margin-bottom: 16px; }
}

.footer-links{flex-wrap:wrap;max-width:440px}