/* Keep supporting content comfortable to read at every layout size. */
.header-shell { position: relative; z-index: 20; }
.brand-role { font-size: 11px; }
.eyebrow { font-size: 11px; }
.hero-location { font-size: 11px; }
.hero-bottom { font-size: 10px; flex-wrap: wrap; gap: 10px; }
.feature-topline { font-size: 11px; }
.feature-foot { font-size: 10px; gap: 10px; }
.featured-meta { font-size: 11px; }
.micro-label, .section-number { font-size: 10px; }
.client-row > p { font-size: 11px; }
.section-intro { font-size: 13px; }
.filters { flex-wrap: wrap; gap: 5px; }
.filter { font-size: 12px; }
.filter > span { font-size: 10px; }
.project-count { font-size: 11px; white-space: nowrap; }
.project-kicker, .project-image-label { font-size: 10px; }
.project-info > div > p:last-child { font-size: 12px; }
.project-tags > span, .skill-tags > span { font-size: 10px; }
.expertise-panel > p { font-size: 13px; }
.expertise-tab small { font-size: 12px; }
.tab-number { font-size: 10px; }
.panel-note { font-size: 11px; }
.process-row { font-size: 12px; }
.process-row b { font-size: 10px; }
.about-intro > p:not(.eyebrow) { font-size: 14px; }
.experience-date { font-size: 10px; }
.experience-item > p { font-size: 12px; }
.experience-item > small, .education-note { font-size: 11px; }
.availability { font-size: 11px; }
.contact-bottom > div > p { font-size: 13px; }
.contact-links { font-size: 13px; }
.footer-inner { font-size: 10px; }
.dialog-heading > p:last-child, .dialog-body p, .dialog-body li { font-size: 13px; }
.dialog-footer button { font-size: 12px; }
@media (min-width: 900px) {
  .site-header nav { font-size: 13px; }
}
@media (max-width: 800px) {
  .brand-role { font-size: 9px; }
  .feature-foot { font-size: 8px; }
  .featured-meta { font-size: 9px; }
  .hero-location { font-size: 9px; }
  .expertise-tab strong { font-size: 14px; }
  .expertise-tab small { font-size: 10px; }
  .expertise-panel > p { font-size: 12px; }
  .process-row > div { font-size: 10px; }
}
@media (max-width: 620px) {
  .hero-location { font-size: 10px; }
  .hero-bottom { font-size: 9px; }
  .section-intro { font-size: 13px; }
  .expertise-section .section-intro { font-size: 13px; }
  .filter { font-size: 11px; padding-inline: 9px; }
  .project-count { font-size: 10px; padding-top: 7px; }
  .work-toolbar { align-items: flex-start; }
  .project-tags > span { font-size: 10px; }
  .expertise-tab strong { font-size: 15px; }
  .expertise-tab small { font-size: 12px; }
  .expertise-panel > p { font-size: 13px; }
  .panel-note { font-size: 11px; }
  .process-row > div { font-size: 10px; }
  .footer-brand { font-size: 10px; }
  .dialog-footer button { font-size: 10px; }
  .dialog-heading > p:last-child, .dialog-body p, .dialog-body li { font-size: 12px; }
}
@media (max-width: 360px) {
  h1 { font-size: 44px; }
  h1 > span { white-space: nowrap; }
  .hero-actions { gap: 17px; }
  .hero-actions .button { white-space: nowrap; padding-inline: 14px; gap: 13px; font-size: 10px; }
  .hero-actions .text-link { white-space: nowrap; font-size: 10px; gap: 5px; }
  .hero-location { font-size: 9px; }
  .featured-caption strong { font-size: 24px; }
}