/* ============================================================================
   Thornton Lab — skin overrides
   ----------------------------------------------------------------------------
   Adult respirology · CF and non-CF bronchiectasis airway microbiome
   Theme: Clinical Excellence (Stitch design package)
   Palette: clinical red + slate-purple support + warm cream surface
   Typography: Source Serif 4 (institutional serif, headlines + body)
               Source Sans 3 (functional labels and nav)
   Loaded AFTER the gem's biohub-lab-theme.css via site.data.lab.skin_css.

   Semantic intent:
     primary   — clinical red    (#D6001C)
     secondary — slate-purple    (#585E73)
     accent    — soft red tint   (used for status chips and tags)
   ============================================================================ */

:root {
  /* Brand — Clinical Red + warm earth/clay support */
  --biohub-primary:           214 0 28;         /* #D6001C clinical red */
  --biohub-primary-strong:    168 0 19;         /* #A80013 darker red */
  --biohub-on-primary:        255 255 255;
  --biohub-secondary:         94 63 60;         /* #5E3F3C warm slate-brown */
  --biohub-on-secondary:      255 255 255;
  --biohub-accent:            181 0 24;         /* #B50018 clinical red muted */
  --biohub-on-accent:         255 255 255;

  /* Surfaces — warm cream tonal stack */
  --biohub-surface:           251 249 246;      /* #FBF9F6 warm cream */
  --biohub-surface-sunken:    245 242 237;      /* #F5F2ED softer cream */
  --biohub-surface-elevated:  255 255 255;      /* #FFFFFF */
  --biohub-surface-overlay:   234 232 229;      /* #EAE8E5 muted cream */
  --biohub-on-surface:        27 28 26;         /* #1B1C1A near-black */
  --biohub-on-surface-muted:  94 63 60;         /* #5E3F3C warm-toned secondary text */

  /* Soft accents */
  --biohub-secondary-soft:    234 224 210;      /* #EAE0D2 warm sand */
  --biohub-accent-soft:       231 188 184;      /* #E7BCB8 soft warm red */
  --biohub-tag-bg:            234 224 210;      /* #EAE0D2 warm sand (matches eyebrow pill family) */
  --biohub-tag-text:          94 63 60;         /* #5E3F3C warm slate-brown */

  /* Hairlines — Clinical Excellence uses subtle warm-tinted borders */
  --biohub-hairline:          226 232 240;      /* #E2E8F0 cool subtle */
  --biohub-hairline-strong:   146 110 107;      /* #926E6B warm grey-brown */

  /* Status */
  --biohub-danger:            186 26 26;        /* #BA1A1A material error */
  --biohub-on-danger:         255 255 255;

  /* Typography — Source Serif 4 (headline + body), Source Sans 3 (labels) */
  --biohub-font-headline:     "Source Serif 4", ui-serif, Georgia, serif;
  --biohub-font-body:         "Source Serif 4", ui-serif, Georgia, serif;
  --biohub-font-label:        "Source Sans 3", ui-sans-serif, system-ui, sans-serif;
}

/* Overall type-scale step-down (-15% to -20% from gem defaults). Nav scale
   is preserved via the explicit selectors further down. */

/* h1 (hero + page-hero): 5xl/6xl/7xl -> 40/48/48 */
h1.biohub-display.text-5xl {
  font-size: 2.5rem;     /* 40px (was 48px) */
}
@media (min-width: 768px) {
  h1.biohub-display.md\:text-6xl {
    font-size: 3rem;     /* 48px md (was 60px) */
  }
}
@media (min-width: 1024px) {
  h1.biohub-display.lg\:text-7xl {
    font-size: 3rem;     /* 48px lg (was 72px) */
    line-height: 1.1;
  }
}

/* h2 (section headlines, e.g. "Three threads of work"): 4xl/5xl -> 30/36 */
h2.biohub-headline.text-4xl {
  font-size: 1.875rem;   /* 30px (was 36px) */
}
@media (min-width: 768px) {
  h2.biohub-headline.md\:text-5xl {
    font-size: 2.25rem;  /* 36px md (was 48px) */
  }
}

/* Lead paragraphs (.biohub-body.text-xl) — hero excerpt etc. */
.biohub-body.text-xl {
  font-size: 1.125rem;   /* 18px (was 20px) */
  line-height: 1.7;
}

/* Hero CTAs — gem uses text-lg (18px); step down. */
header a.text-lg {
  font-size: 1rem;       /* 16px (was 18px) */
}

/* Long-form prose pages (e.g. /legal/) — give h2s real hierarchy + spacing.
   The gem's .biohub-prose class doesn't style nested headings on its own. */
.biohub-prose h2 {
  font-family: var(--biohub-font-headline);
  font-size: 1.375rem;
  font-weight: 700;
  color: rgb(var(--biohub-primary));
  margin-top: 2.5rem;
  margin-bottom: 0.75rem;
  line-height: 1.3;
}
.biohub-prose h2:first-child {
  margin-top: 0;
}
.biohub-prose p {
  margin-bottom: 1rem;
}
.biohub-prose p:last-child {
  margin-bottom: 0;
}

/* Member card — vertically centre the photo against the bio at md+ so
   there isn't white space below short photos with longer bios. */
@media (min-width: 768px) {
  article.biohub-ambient-shadow {
    align-items: center;
  }
}

/* Team page — tighten the member roster type scale. */
article.biohub-ambient-shadow h3.biohub-headline {
  font-size: 1.125rem;     /* 18px */
}
@media (min-width: 768px) {
  article.biohub-ambient-shadow h3.biohub-headline {
    font-size: 1.25rem;    /* 20px md */
  }
}
article.biohub-ambient-shadow h3.biohub-headline .text-base {
  font-size: 0.8125rem;    /* 13px suffix */
}

/* Role label above each name (.biohub-label). */
article.biohub-ambient-shadow .biohub-label {
  font-size: 0.875rem;     /* 14px */
}

/* Member bio paragraph. The gem caps prose at max-w-3xl which leaves
   a big right margin inside the card — let it flow to the card edge. */
article.biohub-ambient-shadow .biohub-prose {
  font-size: 0.9rem;       /* ~14.4px */
  max-width: none;
  text-align: justify;
  hyphens: auto;
}

/* "Current Members" / "Alumni" section headings on Team. */
section h2.biohub-headline.text-3xl {
  font-size: 1.25rem;      /* 20px */
}

/* Masthead — logo +50% (h-8 -> h-12, 32px -> 48px), wordmark +30%
   (text-xl 20px -> ~26px), nav links +30% (text-sm 14px -> ~18px). */
nav[aria-label="Primary"] a img {
  height: 3rem;        /* 48px */
}
nav[aria-label="Primary"] a span.text-xl {
  font-size: 1.625rem; /* 26px */
}
nav[aria-label="Primary"] .gap-8 a {
  font-size: 1.15rem;  /* 18.4px */
}