/* One scale for the editorial site. Wordmark and decorative monogram are artwork. */
:root {
  --type-hero: clamp(2.15rem, 7.7vw, 8rem);
  --type-section: clamp(2rem, 4.9vw, 4.75rem);
  --type-item: clamp(1.25rem, 2vw, 2rem);
  --type-body: 1rem;
  --type-control: .875rem;
  --type-caption: .75rem;
}

body,
button,
input,
select,
textarea {font-family: var(--sans);}
body {font-size: var(--type-body); line-height: 1.65;}

.film-hero h1 {
  font-size: var(--type-hero);
  font-weight: 710;
  line-height: 1;
  letter-spacing: -.076em;
}

main h2,
main .statement,
main .display,
main .contact-title,
main .standards h2,
main .field-notes h2,
main .about-copy .display,
.dialog-shell h2 {
  font-family: var(--sans);
  font-size: var(--type-section);
  font-weight: 650;
  line-height: 1.05;
  letter-spacing: -.065em;
}

main h3,
main .service-panel h3,
main .sector-list h3,
main .standards-list h3,
main .process-steps h3,
.quick-links strong,
.field-card-title,
.signature-name {
  font-family: var(--sans);
  font-size: var(--type-item);
  font-weight: 650;
  line-height: 1.2;
  letter-spacing: -.045em;
}

.film-hero .hero-lead,
.intro-bottom p,
.intro-bottom .body-large,
.section-heading > p,
.sector-heading > p,
.service-panel p,
.service-panel li,
.sector-list p,
.about-copy > p,
.about-copy > .body-large,
.process-steps p,
.faq details p,
.contact-bottom > p,
.dialog-intro,
.dialog-shell > p:not(.eyebrow),
.brief-dialog input,
.brief-dialog select,
.brief-dialog textarea {
  font-size: var(--type-body);
  line-height: 1.65;
}
.film-hero .hero-lead {max-width: 49ch;}

.navigation,
.navigation .nav-contact,
.film-hero .hero-action,
.link,
.service-panel .link,
.service-tabs > button > span:nth-child(2),
.about-facts b,
.round-cta span,
.solid-button,
.copy-button {
  font-size: var(--type-control);
  font-weight: 650;
}
.quick-links small,
.eyebrow,
.film-hero .eyebrow,
.service-panel .eyebrow,
.section-label,
.header-brand-copy small,
.language,
.film-note,
.service-num,
.sector-index,
.edition-index,
.idea-image span,
.signature-small,
.signature-role,
.about-facts span,
.process-steps article > span,
.intro-bottom > .small-note,
.footer-credit,
.footer-controls > button,
.preview-note,
.brief-dialog label > span,
.form-note,
.form-status {
  font-size: var(--type-caption);
}
.quick-links small,.idea-image span {font-family: var(--sans); letter-spacing: .1em;}
.section-label,.eyebrow {font-weight: 650;}
.header-brand-copy small {letter-spacing: .04em;}
.section-label,.quick-links small,.film-note,.idea-image span {line-height: 1.35;}

@media (max-width: 760px) {
  :root {
    --type-hero: clamp(2rem, 10.7vw, 5rem);
    --type-section: clamp(2rem, 8.5vw, 3.5rem);
  }
  .film-hero .hero-lead {line-height: 1.55;}
}