/* Official Ion Layer design system: designsystem.pdf, supplied 2026-09-27.
   Loaded after the captured page styles so component exceptions cannot override
   the official type scale. Existing responsive heading sizes are retained on mobile. */
:root {
  --red-400:#EE4444; --red-450:#E93535; --red-500:#E02929;
  --red-600:#CF1717; --red-650:#BD0F0F; --red-700:#AA0909; --red-750:#801E19;
  --grey-25:#F6F8F8; --grey-75:#E8ECEE; --grey-125:#D6DDE1;
  --grey-225:#BBC4C9; --grey-300:#9EABB2; --grey-400:#82939C;
  --grey-500:#6A7982; --grey-600:#555E63; --grey-700:#3C4448;
  --grey-750:#30373B; --grey-825:#242B2E; --grey-875:#1A2023; --grey-950:#0D1012;
  --canvas-25:#FBFBF8; --canvas-50:#F7F5F0; --canvas-75:#F3EFE8; --canvas-100:#EDE9DE;
  --white:#FFFFFF; --black:#000000;
}
/* All three semantic schemes are defined by the supplied reference. */
:root, [data-color-scheme="vitality-light"] {
  --color-surface-0:var(--canvas-25); --color-surface-1:var(--white); --color-surface-2:var(--canvas-50);
  --color-surface-brand:var(--red-400); --color-surface-brand-hover:var(--red-500);
  --color-surface-brand-accent:var(--grey-125); --color-surface-brand-accent-hover:var(--grey-225);
  --color-text-primary:var(--grey-950); --color-text-secondary:var(--grey-750); --color-text-tertiary:var(--grey-600);
  --color-text-on-primary:var(--white); --color-text-on-secondary:var(--grey-750);
  --color-text-brand:var(--red-600); --color-text-brand-accent:var(--grey-600);
  --color-border-subtle:rgb(0 0 0 / 6%); --color-border-medium:rgb(0 0 0 / 9%); --color-border-strong:rgb(0 0 0 / 12%);
}
[data-color-scheme="vitality-dark"] {
  --color-surface-0:var(--grey-950); --color-surface-1:var(--grey-875); --color-surface-2:var(--grey-825);
  --color-surface-brand:var(--red-400); --color-surface-brand-hover:var(--red-500);
  --color-surface-brand-accent:var(--grey-125); --color-surface-brand-accent-hover:var(--grey-225);
  --color-text-primary:var(--canvas-25); --color-text-secondary:rgb(251 251 248 / 75%); --color-text-tertiary:rgb(251 251 248 / 60%);
  --color-text-on-primary:var(--white); --color-text-on-secondary:var(--grey-750);
  --color-text-brand:var(--red-400); --color-text-brand-accent:var(--grey-300);
  --color-border-subtle:rgb(255 255 255 / 6%); --color-border-medium:rgb(255 255 255 / 9%); --color-border-strong:rgb(255 255 255 / 12%);
}
[data-color-scheme*="scientific"] {
  --color-surface-0:var(--grey-75); --color-surface-1:var(--white); --color-surface-2:var(--grey-125);
  --color-surface-brand:var(--red-700); --color-surface-brand-hover:var(--red-750);
  --color-surface-brand-accent:var(--grey-125); --color-surface-brand-accent-hover:var(--grey-225);
  --color-text-primary:var(--grey-950); --color-text-secondary:var(--grey-825); --color-text-tertiary:var(--grey-600);
  --color-text-on-primary:var(--white); --color-text-on-secondary:var(--grey-750);
  --color-text-brand:var(--red-750); --color-text-brand-accent:var(--grey-600);
  --color-border-subtle:rgb(0 0 0 / 6%); --color-border-medium:rgb(0 0 0 / 9%); --color-border-strong:rgb(0 0 0 / 12%);
}
/* H1 replaces the storefront's smaller product-only title exception. */
.pdp__title {
  font-family:var(--font-serif); font-size:48px; line-height:56px;
  font-weight:600; font-style:normal; letter-spacing:-.02em;
}
@media(min-width:1024px) { .pdp__title {font-size:64px; line-height:72px;} }
.btn:not(.btn--small) {font-size:18px; line-height:24px; font-weight:900; letter-spacing:.08em;}
.site-header__nav-link {line-height:1; text-transform:uppercase;}
.announcement-bar {line-height:20px;}
/* Label Small: 14 / 20, Bold, 8% tracking. */
.badge, .pdp__intake-notice .label-sm, .product-dosage__day-label,
.product-dosage__day-marker, .how-to-use__number {
  font-family:var(--font-sans); font-size:14px; line-height:20px;
  font-weight:700; letter-spacing:.08em;
}
/* Body Small: 14 / 20, Medium, no tracking. */
.product-dosage__day-benefit, .split-content__badge, .category-strip__label {
  font-family:var(--font-sans); font-size:14px; line-height:20px;
  font-weight:500; letter-spacing:0;
}
/* Body Large: 20 / 32, Regular, 0.5% tracking. */
.testimonials-featured__quote {
  font-family:var(--font-sans); font-size:20px; line-height:32px;
  font-weight:400; letter-spacing:.005em;
}
/* Data emphasis follows Display Hero; smaller values follow H3. */
.product-clinical__primary-value {
  font-family:var(--font-serif); font-size:64px; line-height:72px;
  font-weight:600; font-style:italic; letter-spacing:-.02em;
}
.product-clinical__stat-value, .feature-list__number {
  font-family:var(--font-serif); font-size:36px; line-height:40px;
  font-weight:600; font-style:italic; letter-spacing:0;
}
.how-to-use__step-title, .how-to-use__grid--stack .how-to-use__step-title {
  font-family:var(--font-sans); font-size:20px; line-height:28px;
  font-weight:500; font-style:normal; letter-spacing:0;
}
/* Eliminate off-palette grey and gold UI accents. Product artwork is unchanged. */
.pdp__option-meta, .pdp__option-cancel {color:var(--color-text-secondary);}
.star-rating {color:var(--color-surface-brand) !important;}
/* Replace custom spacing/radius exceptions with official tokens. */
.pdp__option {padding:var(--space-xl);}
.pdp__option-badge {
  top:calc(-1 * var(--space-md)); left:var(--space-md);
  padding:var(--space-2xs) var(--space-sm); border-radius:var(--radius-xs);
}
.pdp__option-radio {border-radius:var(--radius-full);}
.pdp__accordion .accordion__content ul {padding-left:var(--space-xl);}
.pdp__accordion .accordion__content li {margin-bottom:var(--space-2xs);}
/* Keep purchase options readable as type grows at narrow widths. */
.pdp__option-details {min-width:0;}
.pdp__option-cancel {white-space:normal;}
@media(max-width:479px) {
  .pdp__option-row {flex-wrap:wrap;}
  .pdp__option-price {margin-left:auto;}
  .pdp__social-proof {flex-wrap:wrap;}
}
/* The PDF specifies one type system across its three color schemes. */
[data-color-scheme*="scientific"] :is(h1,h2,h3,.h1,.h2,.h3,.display-hero):not(.h4,.h5,.h6,.how-to-use__step-title),
[data-color-scheme*="scientific"] .section-header__accent {
  font-family:var(--font-serif); font-weight:600;
}
[data-color-scheme*="scientific"] :is(h3,.h3,.display-hero):not(.h4,.h5,.h6,.how-to-use__step-title),
[data-color-scheme*="scientific"] .section-header__accent {font-style:italic;}
[data-color-scheme*="scientific"] .feature-list__number {font-family:var(--font-serif); font-weight:600;}