/* ============================================================
   Clinical Nexus — Website Design System
   "The Authoritative Ledger"
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Newsreader:ital,wght@0,400;0,700;0,800;1,400&family=Inter:wght@400;500;600;700&display=swap');

/* ---- Reset ---- */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }

/* ---- Tokens ---- */
:root {
  --primary:            #001129;
  --primary-container:  #0f2644;
  --secondary:          #48626e;
  --surface:            #f4faff;
  --surface-low:        #e7f6ff;
  --surface-mid:        #d4e5ef;
  --surface-high:       #d9ebf5;
  --white:              #ffffff;
  --on-surface:         #0d1e25;
  --on-surface-dim:     #44474e;
  --outline:            #74777e;
  --outline-faint:      #c4c6ce;
  --evidence:           #005312;
  --evidence-light:     #a3f69c;
  --evidence-bg:        #002d06;
  --error:              #ba1a1a;
  --warn-bg:            #7a5000;
  --warn-light:         #ffe0b2;
  --tint:               #4b5f80;
  --tint-light:         #798eb1;
  --tint-dim:           #afcbd8;
}

body {
  font-family: 'Inter', -apple-system, sans-serif;
  font-size: 16px;
  line-height: 1.6;
  color: var(--on-surface);
  background: var(--surface);
  -webkit-font-smoothing: antialiased;
}

h1, h2, h3, h4 { font-family: 'Newsreader', Georgia, serif; line-height: 1.15; }

a { color: inherit; text-decoration: none; }

/* ---- Utilities ---- */
.container { max-width: 1200px; margin: 0 auto; padding: 0 2rem; }
.midnight-gradient { background: linear-gradient(135deg, var(--primary) 0%, var(--primary-container) 100%); }
.label-caps { font-size: 0.65rem; letter-spacing: 0.2em; text-transform: uppercase; font-weight: 700; font-family: 'Inter', sans-serif; }

/* ---- Nav ---- */
.site-nav {
  background: var(--surface);
  border-bottom: 1px solid var(--surface-low);
  position: sticky; top: 0; z-index: 100;
  padding: 0 2rem;
  display: flex; align-items: center; justify-content: space-between;
  height: 64px;
}
.site-nav .brand {
  font-family: 'Newsreader', serif;
  font-size: 1.35rem; font-weight: 900;
  color: var(--primary); letter-spacing: -0.3px;
}
.site-nav nav { display: flex; gap: 2rem; align-items: center; }
.site-nav nav a {
  font-size: 0.875rem; font-weight: 500; color: var(--secondary);
  transition: color 0.15s;
}
.site-nav nav a:hover, .site-nav nav a.active { color: var(--primary); }
.site-nav nav a.active { border-bottom: 2px solid var(--primary); padding-bottom: 2px; font-weight: 700; }
.btn-primary {
  display: inline-block;
  background: linear-gradient(135deg, var(--primary) 0%, var(--primary-container) 100%);
  color: #fff; padding: 0.6rem 1.5rem;
  font-size: 0.8rem; font-weight: 700;
  letter-spacing: 0.08em; text-transform: uppercase;
  transition: opacity 0.15s; cursor: pointer; border: none;
}
.btn-primary:hover { opacity: 0.88; }
.btn-secondary {
  display: inline-block;
  border: 1.5px solid var(--primary); color: var(--primary);
  padding: 0.6rem 1.5rem; font-size: 0.8rem; font-weight: 700;
  letter-spacing: 0.08em; text-transform: uppercase;
  transition: background 0.15s, color 0.15s; cursor: pointer; background: transparent;
}
.btn-secondary:hover { background: var(--primary); color: #fff; }

/* ---- Confidence badges ---- */
.badge { display: inline-block; padding: 2px 10px; font-size: 0.625rem; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase; }
.badge-high     { background: var(--evidence-bg); color: var(--evidence-light); }
.badge-moderate { background: var(--primary);     color: var(--tint-dim); }
.badge-sparse   { background: var(--on-surface-dim); color: #fff; }

/* ---- Footer ---- */
.site-footer {
  background: var(--primary); color: var(--tint-dim);
  padding: 3rem 2rem;
}
.site-footer .container { display: flex; justify-content: space-between; align-items: flex-start; gap: 3rem; flex-wrap: wrap; }
.site-footer .brand { font-family: 'Newsreader', serif; font-size: 1.1rem; font-weight: 900; color: #fff; margin-bottom: 0.5rem; }
.site-footer p { font-size: 0.8rem; line-height: 1.7; max-width: 280px; }
.site-footer nav { display: flex; flex-direction: column; gap: 0.6rem; }
.site-footer nav a { font-size: 0.8rem; color: var(--tint-dim); transition: color 0.15s; }
.site-footer nav a:hover { color: #fff; }
.site-footer .footer-cols { display: flex; gap: 3rem; }

/* ---- Section helpers ---- */
.section-label { display: block; font-size: 0.65rem; letter-spacing: 0.2em; text-transform: uppercase; font-weight: 700; color: var(--secondary); margin-bottom: 1rem; }
.section-divider { height: 1px; background: var(--surface-low); margin: 0; }