/* ds.css: one palette and one type scale for every page in the site navigation (Oct 22 2026).
   Loaded after qa.css. Not loaded on the homepage or the ad landing pages.
   Palette (live brand tokens): ink #2a2a2a, body #3d4a4f, muted #5e7480, teal #1D7686, teal-700 #13565f,
   grounds #ffffff / #f5f8f8 / #eaf2f3 / #ECFFFF, lines #e4ebec / #d3dee0. No navy. Inter only. */

:root{
  --ink:#2a2a2a; --x-ink:#2a2a2a; --x-body:#3d4a4f; --x-muted:#5e7480; --x-line:#e4ebec;
  --x-teal:#1D7686; --x-teal-d:#13565f; --x-tint:#eaf2f3; --x-tint2:#f5f8f8;
  --wx-ink:#2a2a2a; --wx-muted:#5e7480; --wx-line:#e4ebec; --wx-soft:#f5f8f8; --wx-teal-d:#13565f;
  --ds-h1:clamp(2.4rem,4.2vw,3.5rem); --ds-h2:clamp(1.9rem,3.1vw,2.75rem); --ds-h2s:clamp(1.6rem,2.2vw,2rem);
  --ds-h3l:clamp(1.3rem,1.7vw,1.5rem); --ds-h3:1.25rem;
}

/* Inter everywhere, including form controls (browsers default these to Arial) */
input,select,textarea,button,optgroup{font-family:"Inter",system-ui,sans-serif !important}
svg text{font-family:"Inter",Arial,sans-serif}

/* No tracked or negative letter-spacing anywhere */
body,body *{letter-spacing:0 !important}

/* Labels and tags in sentence case, as on the live site (eyebrows: weight 500, muted, no uppercase) */
.resin-tag,.art-cat,.lhs-l,.lhero-memb-l,.ahc-label,.lhb-k,.iu-res-eyebrow,.iu-res-tag,.nf-eyebrow,.cstudy-card h4,.xa-memb-l{text-transform:none !important}

/* Square corners: milestone nodes were the last round element */
.ms-node{border-radius:0 !important}

/* Headings: one scale, weight 700, ink */
:is(.lhero,.pd-hero,.bioh,.legal-hero) h1:not(.h1-long){font-size:var(--ds-h1) !important;line-height:1.06 !important;font-weight:700 !important}
section h2:not(:where(.art-prose h2,.ppg-section h2,.policy-content h2,.a11y-panel h2,.iu-filter h2,.xa-related-head h2,.rd-more h2,.x-head--sm h2,.wt2-contact-left h2,.wrap h2)){font-size:var(--ds-h2) !important;line-height:1.1 !important;font-weight:700 !important}
:is(.xa-related-head,.rd-more,.iu-filter) h2{font-size:var(--ds-h2s) !important;line-height:1.15 !important;font-weight:700 !important}
.x-cta-body h2,.rs-cta-left h2{font-size:clamp(1.9rem,3vw,2.6rem) !important}
h2 .accent,h1 .accent{font-weight:inherit}

/* Body copy floor: nothing a reader needs is smaller than 15px */
.xa-cf p,.cw-person p,.wtype-body p,.pd-step p,.iu-card-body p{font-size:16px !important;line-height:1.6 !important}

/* Text colours: no navy or near-black variants */
.policy-content h2,.policy-content h3,.policy-content strong{color:#2a2a2a !important}
.wt2-form-title,.wt2-input,.wt2-textarea,.wt2-select{color:#2a2a2a !important}

/* Forms: clear focus, invalid and error states */
form input:not([type=checkbox]):not([type=radio]):not([type=submit]):focus-visible,form textarea:focus-visible,form select:focus-visible{outline:2px solid #1D7686 !important;outline-offset:0;border-color:#1D7686 !important}
form input:user-invalid,form textarea:user-invalid,form select:user-invalid{border-color:#b3261e !important;background-color:#fdf6f5 !important}
form input[type=checkbox]:user-invalid{outline:2px solid #b3261e;outline-offset:2px}
.form-error{margin:14px 0 0;padding:12px 14px;background:#fdf6f5;border-left:3px solid #b3261e;color:#7a1c16;font-size:15px;line-height:1.5}
form input[type=checkbox]{accent-color:#1D7686;width:18px;height:18px}
form button[type=submit]:disabled,form input[type=submit]:disabled{opacity:.6;cursor:progress}
