:root {
  --text-s: 0.875rem;
  --text-m: 1.125rem;
  --text-l: 1.375rem;
  --heading-weight: 650;
}

html[data-font-size="s"] {
  font-size: 13px;
  --brand-rail-scale: 0.7;
  --solution-logo-scale: 0.7;
}

html[data-font-size="m"] {
  font-size: 14px;
  --brand-rail-scale: 0.85;
  --solution-logo-scale: 0.85;
}

html[data-font-size="l"] {
  font-size: 15px;
  --brand-rail-scale: 1;
  --solution-logo-scale: 1;
}

.brand-rail .brand-link img {
  max-width: calc(205px * var(--brand-rail-scale));
  max-height: calc(70px * var(--brand-rail-scale));
}

.brand-rail .brand-sos img {
  max-width: calc(185px * 0.71 * var(--brand-rail-scale));
  max-height: calc(125px * 0.71 * var(--brand-rail-scale));
}

.solution .solution-logo {
  max-width: calc(195px * var(--solution-logo-scale));
  height: calc(55px * var(--solution-logo-scale));
  margin-bottom: calc(83px - (55px * var(--solution-logo-scale)));
}

.solution .solution-logo-sos {
  max-width: calc(234px * var(--solution-logo-scale));
  height: calc(81.6px * var(--solution-logo-scale));
  margin-bottom: calc(89px - (81.6px * var(--solution-logo-scale)));
}

body {
  font-size: var(--text-m);
  line-height: 1.65;
}

.site-nav a,
.button,
.access-card small {
  font-size: var(--text-s);
}

.font-size-control {
  display: inline-flex;
  align-items: center;
  min-height: 36px;
  padding: 0 6px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: var(--panel);
}

.font-size-control select {
  min-width: 46px;
  height: 28px;
  padding: 0 4px;
  border: 0;
  border-radius: 999px;
  background: var(--surface-blue);
  color: var(--ink);
  font: inherit;
  font-size: 1rem;
  font-weight: 750;
  cursor: pointer;
}

.brand,
.impact-number,
.health-card-number,
.step-number,
.flow-number,
.security-layer > span,
.federation-node span,
.scope-regions,
.federation-bridge b,
.scope-brand strong,
.access-index {
  font-size: var(--text-s);
}

.font-size-control select:focus-visible {
  outline: 2px solid var(--orange);
  outline-offset: 2px;
}

.hero h1 {
  font-size: clamp(2.625rem, calc(3.5rem + .5vw), 4.25rem);
  font-weight: 650;
  line-height: 1.06;
  letter-spacing: 0.005em;
}

.hero p {
  font-size: var(--text-m);
  line-height: 1.62;
}

.section-heading h2,
.contact h2,
html[data-font-size] h2 {
  font-size: clamp(2.125rem, calc(2.5rem + .5vw), 3.125rem);
  font-weight: 650;
  line-height: 1.08;
  letter-spacing: 0.005em;
}

.section-heading > p {
  font-size: var(--text-m);
  line-height: 1.65;
}

h3,
html[data-font-size] h3,
.impact-card h3,
.solution h3,
.health-card-use h3,
.journey-steps h3,
.data-flow h3,
.integration-band h3 {
  font-size: 1.55rem;
  font-weight: 650;
  line-height: 1.18;
  letter-spacing: 0;
}

.impact-card > p,
.solution p,
.health-card-use p,
.security-layer p,
.data-flow p,
.integration-band p,
.contact p {
  font-size: var(--text-m);
  line-height: 1.68;
}

html[data-font-size] p {
  font-size: var(--text-m);
}

.impact-card li,
.journey-steps p,
.patent-citation,
.product-role,
.eyebrow {
  font-size: var(--text-s);
  line-height: 1.55;
}

.impact-kicker,
.product-role,
.protocol-band .protocol-label {
  font-size: var(--text-s) !important;
}

.protocol-band p span,
.solution .use-case,
.health-card-use strong,
.standards-links > span,
.standards-links a,
.coverage-note,
.responsibility-note,
.footer-grid p,
.copyright {
  font-size: var(--text-s) !important;
}

.protocol-band p,
.traceability-band > p,
.access-card p,
.operating-model p {
  font-size: 1.0625rem;
  line-height: 1.66;
}

.video-feature {
  display: block;
  padding: 0;
  background: #000;
}

.video-feature .video-frame {
  border-radius: 20px;
}

@media (max-width: 760px) {
  :root {
    --text-s: 0.875rem;
    --text-m: 1.125rem;
    --text-l: 1.25rem;
  }

  .hero h1 {
    font-size: clamp(2.375rem, calc(2.25rem + 2vw), 3rem);
    line-height: 1.08;
  }

  .hero p {
    font-size: var(--text-m);
  }

  .section-heading h2,
  html[data-font-size] h2 {
    font-size: clamp(1.875rem, calc(1.75rem + 1.5vw), 2.5rem);
    line-height: 1.1;
  }

  .font-size-control {
    margin-top: 10px;
  }

  .font-size-control select {
    min-width: 58px;
    height: 44px;
    font-size: 0.875rem;
  }
}