/* Shared typography using the supplied Myriad Pro standard-width faces.
   Regular: body/forms. Semibold: headings/navigation/CTAs. Bold: strong emphasis.
   Real Semibold/Bold italics support emphasis without synthetic heading italics.
   Condensed variants are intentionally omitted to preserve text readability. */
@font-face {
  font-family: "Myriad Pro";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("assets/fonts/myriad-pro/myriad-pro-regular.otf") format("opentype");
}
@font-face {
  font-family: "Myriad Pro";
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("assets/fonts/myriad-pro/myriad-pro-semibold.otf") format("opentype");
}
@font-face {
  font-family: "Myriad Pro";
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("assets/fonts/myriad-pro/myriad-pro-bold.otf") format("opentype");
}
@font-face {
  font-family: "Myriad Pro";
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url("assets/fonts/myriad-pro/myriad-pro-light.otf") format("opentype");
}
@font-face {
  font-family: "Myriad Pro";
  font-style: italic;
  font-weight: 600;
  font-display: swap;
  src: url("assets/fonts/myriad-pro/myriad-pro-semibold-italic.otf") format("opentype");
}
@font-face {
  font-family: "Myriad Pro";
  font-style: italic;
  font-weight: 700;
  font-display: swap;
  src: url("assets/fonts/myriad-pro/myriad-pro-bold-italic.otf") format("opentype");
}
@font-face {
  font-family: "Myriad Pro";
  font-style: normal;
  font-weight: 900;
  font-display: swap;
  src: url("assets/fonts/myriad-pro/myriad-pro-black.otf") format("opentype");
}

:root {
  --font-site: "Myriad Pro", Arial, Helvetica, sans-serif;
  --type-body: 1rem;
  --type-small: .875rem;
  --type-label: .75rem;
  --type-h1: clamp(2.25rem, 4.5vw, 4rem);
  --type-h2: clamp(1.75rem, 3vw, 2.75rem);
  --type-h3: 1.25rem;
  --space-copy: 1rem;
  --space-section: clamp(3rem, 6vw, 5rem);
}

:root body,
:root body.font-sans {
  font-family: var(--font-site);
  font-size: var(--type-body);
  font-weight: 400;
  line-height: 1.75;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
}

body :is(button, input, select, textarea) {
  font-family: inherit;
  letter-spacing: normal;
}

/* Specificity deliberately beats legacy per-page CSS and CDN utilities.
   Color, alignment and layout remain the responsibility of each page. */
:root body :is(h1, h2, h3, h4, h5, h6) {
  font-family: var(--font-site);
  font-weight: 600;
  overflow-wrap: break-word;
}
:root body main h1 {
  max-width: 22ch;
  font-size: var(--type-h1);
  line-height: 1.12;
  letter-spacing: -.035em;
}
:root body main h2 {
  max-width: 30ch;
  font-size: var(--type-h2);
  line-height: 1.2;
  letter-spacing: -.025em;
}
:root body main h3 {
  font-size: var(--type-h3);
  line-height: 1.35;
  letter-spacing: -.015em;
}
:root body :is(h4, h5, h6) {
  line-height: 1.4;
  letter-spacing: normal;
}

/* Cards and legal subsections are a smaller heading tier, regardless of tag. */
:root body main :is(.site-card-copy, .site-card-content, .legal-document) :is(h2, h3, h4) {
  max-width: none;
  font-size: var(--type-h3);
  line-height: 1.35;
  letter-spacing: -.015em;
}

:root body main p:not(.site-display, .uppercase, .ora-eyebrow, .ora-breadcrumb, .ora-caption, .ora-note, .ora-subtitle, .text-xs, .text-\[10px\], .text-\[11px\]) {
  font-size: var(--type-body);
  line-height: 1.75;
}
:root body main p.site-display {
  max-width: 22ch;
  font-size: var(--type-h2);
  font-weight: 600;
  line-height: 1.2;
  letter-spacing: -.025em;
}
:root body main :is(.uppercase, .ora-eyebrow) {
  font-size: var(--type-label);
  font-weight: 600;
  line-height: 1.5;
  letter-spacing: .12em;
}
body :is(.font-bold, .font-extrabold) {
  font-weight: 700;
}
body .font-light { font-weight: 300; }
body .font-black { font-weight: 900; }
body :is(strong, b) {
  font-weight: 700;
}
body :is(h1, h2, h3, h4, h5, h6) :is(strong, b) {
  font-weight: inherit;
}

/* One copy rhythm, including markup inserted by product-page.js. */
:root body main :is(h1, h2, h3, h4) + p,
:root body main p + p {
  margin-top: var(--space-copy);
  margin-bottom: 0;
}
:root body main :is(.site-card-copy, .site-card-content) > :is(h2, h3, h4) + p {
  padding-top: 0;
}
:root body main :is(.site-card-copy, .site-card-content) > p.font-semibold:first-child {
  font-size: var(--type-small);
}
:root body main :is(p.uppercase, .ora-eyebrow) + :is(h1, h2, h3) {
  margin-top: var(--space-copy);
}
:root body main :is(.site-card-copy, .site-card-content, .legal-document section) > :first-child {
  margin-top: 0;
}
:root body main :is(.site-card-copy, .site-card-content, .legal-document section) > :last-child {
  margin-bottom: 0;
}
:root body main :is(.site-card-copy, .site-card-content, .legal-document) :is(ul, ol) {
  margin-block: 1.25rem 0;
  line-height: 1.75;
}
:root body main :is(.site-card-copy, .site-card-content, .legal-document) li + li {
  margin-top: .5rem;
}

/* Normalize section rhythm only on padded content wrappers; media stays full bleed. */
:root body main > section[class*="py-"],
:root body main > section > :is(.mx-auto, .container)[class*="py-"],
:root body .ora-section {
  padding-block: var(--space-section);
}

body header nav,
body footer {
  font-size: var(--type-small);
  line-height: 1.6;
}
body header nav a {
  font-weight: 600;
}
body header nav :is(.site-nav-menu, .site-mobile-group) a {
  font-weight: 400;
}
body :is(a, button):is(.rounded-full, .rounded-md, .rounded-xl)[class*="bg-spms-red"],
body :is(a, button).rounded-full[class*="border"],
body .ora-button {
  font-size: var(--type-small);
  font-weight: 600;
  line-height: 1.5;
}
@media (min-width: 1024px) {
  body a.rounded-full,
  body button.rounded-full[class*="bg-spms-red"],
  body .ora-button {
    white-space: nowrap;
    flex-shrink: 0;
  }
  body main .flex:has(> a.rounded-full) {
    flex-wrap: wrap;
  }
}