/* ──────────────────────────────────────────────────────────────────
   Nucleus Healthcare — Design Tokens
   Colors, type, spacing and elevation
   Sourced from the 2023 Nucleushealthcare.com Figma library
   ────────────────────────────────────────────────────────────────── */

@import url('https://fonts.googleapis.com/css2?family=Source+Serif+4:ital,opsz,wght@0,8..60,300..900;1,8..60,300..900&family=Hanken+Grotesk:ital,wght@0,100..900;1,100..900&display=swap');

@font-face {
  font-family: 'Proxima Nova';
  font-weight: 100;
  font-style: normal;
  font-display: swap;
  src: url('fonts/ProximaNova-Thin.otf') format('opentype');
}
@font-face {
  font-family: 'Proxima Nova';
  font-weight: 300;
  font-style: normal;
  font-display: swap;
  src: url('fonts/ProximaNova-Light.otf') format('opentype');
}
@font-face {
  font-family: 'Proxima Nova';
  font-weight: 300;
  font-style: italic;
  font-display: swap;
  src: url('fonts/ProximaNova-LightIt.otf') format('opentype');
}
@font-face {
  font-family: 'Proxima Nova';
  font-weight: 400;
  font-style: normal;
  font-display: swap;
  src: url('fonts/ProximaNova-Regular.woff2') format('woff2');
}
@font-face {
  font-family: 'Proxima Nova';
  font-weight: 400;
  font-style: italic;
  font-display: swap;
  src: url('fonts/ProximaNova-RegularIt.otf') format('opentype');
}
@font-face {
  font-family: 'Proxima Nova';
  font-weight: 700;
  font-style: normal;
  font-display: swap;
  src: url('fonts/ProximaNova-Bold.otf') format('opentype');
}
@font-face {
  font-family: 'Proxima Nova';
  font-weight: 800;
  font-style: normal;
  font-display: swap;
  src: url('fonts/ProximaNova-Extrabld.otf') format('opentype');
}

:root {
  /* Stability — primary navy */
  --stability-10: #6697BF;
  --stability-20: #4D78A2;
  --stability-30: #335885;
  --stability-40: #1A3968;
  --stability-50: #00194B;
  --stability-60: #00153F;
  --stability-70: #001234;
  --stability-80: #010711;
  --stability-90: #010B1D;

  /* Atom — teal accent */
  --atom-10: #D9F7F5;
  --atom-20: #B7EBE7;
  --atom-30: #96DFD9;
  --atom-40: #74D3CB;
  --atom-50: #52C7BD;
  --atom-60: #43B1A9;
  --atom-70: #339C95;
  --atom-80: #055B59;
  --atom-90: #14716D;

  /* Scrubs — soft blue */
  --scrubs-10: #D7E8F9;
  --scrubs-20: #BFD7F6;
  --scrubs-30: #A6C6F3;
  --scrubs-40: #8EB5F1;
  --scrubs-50: #75A4EE;
  --scrubs-60: #638BCA;
  --scrubs-70: #5172A6;
  --scrubs-80: #1C283A;
  --scrubs-90: #2E415E;

  /* Spark — bright green */
  --spark-tint-2: #90E8B5;
  --spark-50:    #4DD889;
  --spark-shade-1: #2FA266;
  --spark-shade-2: #106B42;

  /* Proton — vibrant purple */
  --proton-50: #947FEE;
  --proton-60: #7D6CC9;
  --proton-70: #6550C3;
  --proton-deep: #4A3CBC;
  --proton-tint: #C3CBE6;
  --proton-light: #C2B4FF;
  --proton-faint: #EEF3FF;

  --pearl: #FBFBFF;
  --pink-accent: #F11454;
  --pink-bright: #F21555;

  /* Semantic neutrals */
  --ink-900: #061C2C;
  --ink-700: #405564;
  --ink-500: #6B7280;
  --ink-400: #9CA3AF;
  --ink-300: #D2D6DA;
  --ink-200: #E0E4E8;
  --ink-100: #F4F5F5;
  --ink-0:   #FFFFFF;

  --text-link: #3467B2;
  --text-on-dark: #FFFFFF;
  --text-on-dark-muted: #EEF3FF;

  /* Semantic roles */
  --color-bg:         var(--ink-0);
  --color-bg-soft:    var(--pearl);
  --color-bg-cool:    #EAEFF5;
  --color-bg-dark:    var(--stability-50);
  --color-fg:         var(--ink-900);
  --color-fg-muted:   var(--ink-700);
  --color-fg-hint:    var(--ink-400);
  --color-border:     var(--ink-300);

  --color-primary:    var(--stability-50);
  --color-accent:     var(--atom-50);
  --color-highlight:  var(--proton-50);
  --color-focus:      var(--proton-deep);

  --wash-purple:      rgba(103, 88, 165, 0.70);
  --wash-purple-soft: rgba(148, 127, 238, 0.70);
  --wash-blue-grad:   linear-gradient(rgba(74,90,155,0.75) 0%, rgba(153,147,189,0.75) 100%);
  --wash-cool:        rgba(234, 239, 245, 0.20);

  /* Typography stacks */
  --font-display: 'Source Serif 4', 'Source Serif Pro', 'Iowan Old Style', Georgia, serif;
  --font-sans: 'Proxima Nova', 'Mulish', 'Inter', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --font-ui: 'Hanken Grotesk', 'Proxima Nova', 'Mulish', system-ui, -apple-system, sans-serif;
  --font-mono: 'IBM Plex Mono', ui-monospace, 'SF Mono', Menlo, monospace;

  /* Type scale */
  --fs-display:   3.375rem;
  --fs-display-2: 3rem;
  --fs-title-xl:  2.25rem;
  --fs-title-lg:  2rem;
  --fs-title-1:   1.75rem;
  --fs-title-2:   1.5rem;
  --fs-title-3:   1.25rem;
  --fs-headline:  1.125rem;
  --fs-body:      1rem;
  --fs-callout:   0.875rem;
  --fs-footnote:  0.75rem;
  --fs-caption:   0.625rem;

  --lh-tight:   1.2;
  --lh-snug:    1.4;
  --lh-normal:  1.6;
  --tracking-display: -0.02em;

  /* Spacing */
  --space-02: 0.25rem;
  --space-03: 0.5rem;
  --space-04: 0.75rem;
  --space-05: 1rem;
  --space-06: 1.5rem;
  --space-07: 2rem;
  --space-08: 2.5rem;
  --space-09: 3rem;
  --space-10: 4rem;
  --space-11: 5rem;
  --space-12: 6rem;
  --space-13: 10rem;

  /* Radii */
  --radius-xs:  4px;
  --radius-sm:  5px;
  --radius-md:  8px;
  --radius-lg:  20px;
  --radius-pill: 1000px;
  --radius-full: 9999px;

  /* Elevation */
  --shadow-1: 0px 4px 4px 0px rgba(0,0,0,0.05);
  --shadow-2: 0px 5px 10px 2px rgba(33,48,85,0.20);
  --shadow-3: 0px 8px 24px -8px rgba(0,25,75,0.18);
  --shadow-focus: 0 0 0 2px var(--proton-deep);
  --shadow-inset-border: inset 0 0 0 1px var(--ink-200);

  --blur-glass: 25px;
}

.t-display {
  font-family: var(--font-display);
  font-weight: 700;
  font-size: var(--fs-display);
  line-height: var(--lh-snug);
  letter-spacing: var(--tracking-display);
  color: var(--color-fg);
  text-wrap: balance;
}
.t-h1 {
  font-family: var(--font-display);
  font-weight: 700;
  font-size: var(--fs-title-xl);
  line-height: var(--lh-snug);
  letter-spacing: var(--tracking-display);
  color: var(--color-fg);
  text-wrap: balance;
}
.t-h2 {
  font-family: var(--font-display);
  font-weight: 700;
  font-size: var(--fs-title-lg);
  line-height: var(--lh-snug);
  letter-spacing: var(--tracking-display);
  color: var(--color-fg);
}
.t-h3 {
  font-family: var(--font-sans);
  font-weight: 700;
  font-size: var(--fs-title-2);
  line-height: var(--lh-snug);
  color: var(--color-fg);
}
.t-eyebrow {
  font-family: var(--font-display);
  font-style: italic;
  font-weight: 600;
  font-size: var(--fs-headline);
  letter-spacing: 0.01em;
  color: var(--proton-deep);
}
.t-label {
  font-family: var(--font-ui);
  font-weight: 700;
  font-size: 0.8125rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--proton-deep);
}
.t-body {
  font-family: var(--font-sans);
  font-weight: 400;
  font-size: var(--fs-body);
  line-height: var(--lh-normal);
  color: var(--color-fg-muted);
}
.t-callout {
  font-family: var(--font-ui);
  font-weight: 400;
  font-size: var(--fs-callout);
  line-height: var(--lh-normal);
  color: var(--color-fg-muted);
}
.t-footnote {
  font-family: var(--font-ui);
  font-weight: 400;
  font-size: var(--fs-footnote);
  color: var(--color-fg-muted);
}
.t-cta {
  font-family: var(--font-sans);
  font-weight: 500;
  font-size: var(--fs-body);
  line-height: 1.4;
  color: var(--color-fg);
}