:root {
  --primary: #93E0B8;
  --primary-50: #16261F;
  --primary-900: #DEF6EC;
  --secondary: #F7B8CE;
  --accent: #FBD888;
  --neutral-50: #1E2C28;
  --neutral-200: #2E403B;
  --neutral-500: #7B8E88;
  --neutral-900: #E9EEEC;
  --bg: #16221F;
  --surface: #1E2C28;
  --text: #E9EEEC;
  --text-muted: #AEBDB8;
  --success: #93E0B8;
  --warning: #FBD888;
  --danger: #F58C8C;
  --max-width: 72rem;
  --container-px: clamp(1.25rem, 4vw, 2.5rem);
  --font-heading: 'Fredoka', 'Trebuchet MS', 'Comic Sans MS', system-ui, -apple-system, sans-serif;
  --font-body: 'Quicksand', system-ui, -apple-system, 'Segoe UI', 'Helvetica Neue', Arial, sans-serif;
  --font-display: 'Pacifico', 'Brush Script MT', 'Comic Sans MS', cursive;
  --fs-h1: clamp(2.125rem, 4.4vw, 3.375rem);
  --fs-h2: clamp(1.625rem, 3vw, 2.25rem);
  --fs-h3: 1.4375rem;
  --fs-body: 1.0625rem;
  --fs-small: 0.9375rem;
  --lh-heading: 1.18;
  --lh-body: 1.7;
  --radius-button: 18px;
  --radius-card: 22px;
  --on-primary: #111111;
}
*, *::before, *::after { box-sizing: border-box; }
* { margin: 0; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
body { font-family: var(--font-body); font-size: var(--fs-body); line-height: var(--lh-body); color: var(--text); background: var(--bg); -webkit-font-smoothing: antialiased; }
h1, h2, h3, h4 { font-family: var(--font-heading); line-height: var(--lh-heading); font-weight: 700; color: var(--text); text-wrap: balance; }
h1 { font-size: var(--fs-h1); letter-spacing: -0.02em; }
h2 { font-size: var(--fs-h2); margin-top: 2.5rem; margin-bottom: 0.75rem; }
h3 { font-size: var(--fs-h3); margin-top: 1.75rem; margin-bottom: 0.5rem; }
p { margin-bottom: 1rem; max-width: 68ch; }
a { color: var(--primary); }
ul, ol { margin: 0 0 1rem 1.25rem; max-width: 68ch; }
li { margin-bottom: 0.35rem; }
strong { font-weight: 700; }
code { font-family: ui-monospace, "SF Mono", Menlo, monospace; background: var(--neutral-50); border: 1px solid var(--neutral-200); border-radius: 4px; padding: 0.1em 0.35em; font-size: 0.9em; }
blockquote { border-left: 3px solid var(--primary); padding-left: 1rem; color: var(--text-muted); margin: 0 0 1rem; }
img { max-width: 100%; height: auto; display: block; }
sup.cite a { text-decoration: none; color: var(--accent); font-weight: 600; }
.container { width: 100%; max-width: var(--max-width); margin-inline: auto; padding-inline: var(--container-px); }
.skip-link { position: absolute; left: -999px; }
.skip-link:focus { left: 1rem; top: 1rem; background: var(--surface); padding: 0.5rem 1rem; z-index: 100; }
.site-header { border-bottom: 1px solid var(--neutral-200); background: var(--surface); position: sticky; top: 0; z-index: 50; }
.site-header .container { display: flex; align-items: center; justify-content: space-between; min-height: 4rem; gap: 1rem; }
.site-brand { font-family: var(--font-display); font-weight: 800; font-size: 1.2rem; color: var(--text); text-decoration: none; }
.site-nav ul { display: flex; gap: 1.25rem; list-style: none; margin: 0; }
.site-nav a { color: var(--text-muted); text-decoration: none; font-size: var(--fs-small); font-weight: 600; }
.site-nav a:hover { color: var(--primary); }
.nav-toggle { display: none; background: none; border: 1px solid var(--neutral-200); border-radius: 6px; padding: 0.4rem 0.6rem; font-size: 1.1rem; cursor: pointer; color: var(--text); }
main { display: block; }
.hero { padding: clamp(2.5rem, 6vw, 5rem) 0 clamp(1.5rem, 4vw, 3rem); }
.hero .container { max-width: min(var(--max-width), 56rem); }
.eyebrow { font-family: var(--font-display); text-transform: uppercase; letter-spacing: 0.12em; font-size: var(--fs-small); font-weight: 700; color: var(--accent); margin-bottom: 0.75rem; }
.hero h1 { max-width: 22ch; }
.subheadline { font-size: 1.2rem; color: var(--text-muted); margin-top: 1rem; max-width: 60ch; }
.cta-row { display: flex; flex-wrap: wrap; gap: 0.75rem; margin-top: 1.75rem; }
.btn { display: inline-block; padding: 0.8125rem 1.75rem; border-radius: var(--radius-button); font-weight: 700; text-decoration: none; font-size: var(--fs-small); transition: transform .15s ease, opacity .15s ease; }
.btn:hover { transform: translateY(-1px); }
.btn-primary { background: var(--primary); color: var(--on-primary); }
.btn-secondary { background: transparent; color: var(--primary); border: 1.5px solid var(--primary); }
article > section, main > article { padding-block: 0.5rem; }
.content { padding-block: 1rem 3rem; }
.hero-figure { margin: 1.5rem 0; }
.hero-figure img { border-radius: var(--radius-card); }
.card { background: var(--surface); border: a single soft ~1.75px rounded outline (petal_ink #CDD8D3 for neutral; petal-pink for a DAC card; lavender for a no-DAC card; mint for a confirmed-finding card; coral for a CAREFUL card) with a small daisy or star doodle tucked at one corner, ALWAYS carrying the SIGNATURE CHUNKY 6px PASTEL OFFSET SHADOW (the source's '6px chunky offset shadow') in the card's role color at low opacity — this offset shadow IS the card's identity and depth language. Most running prose uses NO card (the reading column carries it); the daisy card is reserved for the two variant companion plates, discrete research-finding blocks, the GH/IGF-1 pathway entries, the section openers and FAQ items.; border-radius: var(--radius-card); padding: 1.625rem 1.75rem; }
.references-list { padding-left: 1.5rem; }
.references-list li { margin-bottom: 0.75rem; font-size: var(--fs-small); color: var(--text-muted); }
.references-list li a { word-break: break-word; }
.site-footer { background: var(--primary-900); color: var(--neutral-50); margin-top: 4rem; padding-block: 2.5rem; }
.site-footer a { color: var(--neutral-50); text-decoration: none; opacity: 0.85; }
.site-footer a:hover { opacity: 1; text-decoration: underline; }
.footer-disclaimer { font-style: italic; opacity: 0.8; margin-bottom: 1.5rem; max-width: 60ch; }
.footer-cols { display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); gap: 1.5rem; }
.footer-cols h2 { font-size: var(--fs-small); text-transform: uppercase; letter-spacing: 0.08em; margin: 0 0 0.6rem; opacity: 0.7; }
.footer-cols ul { list-style: none; margin: 0; }
.footer-cols li { margin-bottom: 0.4rem; font-size: var(--fs-small); }
.copyright { margin-top: 1.75rem; font-size: var(--fs-small); opacity: 0.6; }
@media (max-width: 720px) {
  .nav-toggle { display: block; }
  .site-nav { display: none; position: absolute; top: 4rem; left: 0; right: 0; background: var(--surface); border-bottom: 1px solid var(--neutral-200); padding: 1rem var(--container-px); }
  .site-nav.open { display: block; }
  .site-nav ul { flex-direction: column; gap: 0.75rem; }
}
@media (prefers-reduced-motion: reduce) { * { scroll-behavior: auto !important; transition: none !important; } }