/* ============================================================
   Neocities Theme — Typography & Accessibility Overrides
   
   VT323 (assigned to --mono) is a pixel/display font.
   It requires significantly larger sizes than typical body
   fonts to remain legible. This file corrects sizes across
   all components and ensures font assignments are consistent.
   
   Rule: VT323 only for display/heading elements at 1.2rem+
         Trebuchet MS (--serif) for all body/paragraph text
   ============================================================ */

/* ------------------------------------------------------------
   BASE BODY
   Bump the inherited 1.05rem up; VT323 in surrounding UI
   elements needs room, and Trebuchet MS benefits from it too.
   ------------------------------------------------------------ */
[data-theme="neocities"] body {
  font-size: 1.2rem;
  line-height: 1.75;
  font-family: var(--serif); /* Trebuchet MS — readable body font */
}

/* Paragraphs, lists, table cells: always Trebuchet MS */
[data-theme="neocities"] p,
[data-theme="neocities"] li,
[data-theme="neocities"] td,
[data-theme="neocities"] th,
[data-theme="neocities"] blockquote {
  font-family: var(--serif);
  font-size: 1.1rem;
  line-height: 1.8;
}

/* ------------------------------------------------------------
   NAVIGATION
   Nav links use --mono; VT323 needs a comfortable minimum.
   ------------------------------------------------------------ */
[data-theme="neocities"] .nav-link {
  font-size: 1.05rem;
  letter-spacing: 0.06em;
}

[data-theme="neocities"] .theme-toggle {
  font-size: 1rem;
}

[data-theme="neocities"] .nav-toggle {
  font-size: 1.2rem;
}

/* ------------------------------------------------------------
   HERO SECTION
   ------------------------------------------------------------ */
[data-theme="neocities"] .hero-title {
  font-size: clamp(2.6rem, 6vw, 4.5rem);
  line-height: 1.1;
}

[data-theme="neocities"] .hero-subtitle,
[data-theme="neocities"] .hero-desc {
  font-family: var(--serif);
  font-size: 1.2rem;
  line-height: 1.7;
}

[data-theme="neocities"] .hero-meta,
[data-theme="neocities"] .hero-byline {
  font-family: var(--mono); /* VT323 for retro label feel */
  font-size: 1.1rem;
  letter-spacing: 0.04em;
}

/* ------------------------------------------------------------
   HEADINGS
   h1 is typically the hero title (handled above).
   h2/h3 use --mono throughout the site; boost their sizes.
   ------------------------------------------------------------ */
[data-theme="neocities"] h2,
[data-theme="neocities"] .section-title {
  font-size: clamp(1.9rem, 4vw, 2.8rem);
  line-height: 1.15;
}

[data-theme="neocities"] h3 {
  font-size: clamp(1.4rem, 3vw, 1.8rem);
  line-height: 1.2;
}

[data-theme="neocities"] h4 {
  font-size: 1.3rem;
  line-height: 1.3;
}

/* Eyebrow / section labels (small uppercase mono above headings) */
[data-theme="neocities"] .section-eyebrow,
[data-theme="neocities"] .eyebrow,
[data-theme="neocities"] .label-mono,
[data-theme="neocities"] .overline {
  font-size: 1rem;
  letter-spacing: 0.12em;
}

/* ------------------------------------------------------------
   AI DISCLOSURE BANNER
   ------------------------------------------------------------ */
[data-theme="neocities"] .ai-disclosure {
  font-size: 1rem;
  line-height: 1.6;
}

[data-theme="neocities"] .disclosure-label {
  font-size: 1rem;
  letter-spacing: 0.08em;
}

/* ------------------------------------------------------------
   ACTIVITY CARDS & CONTENT CARDS
   ------------------------------------------------------------ */
[data-theme="neocities"] .activity-card h3,
[data-theme="neocities"] .activity-title {
  font-size: 1.5rem;
  line-height: 1.2;
}

[data-theme="neocities"] .activity-step,
[data-theme="neocities"] .step-label,
[data-theme="neocities"] .activity-card p,
[data-theme="neocities"] .activity-card li {
  font-family: var(--serif);
  font-size: 1.05rem;
  line-height: 1.75;
}

[data-theme="neocities"] .activity-card .tag,
[data-theme="neocities"] .activity-card .badge,
[data-theme="neocities"] .card-label,
[data-theme="neocities"] .card-tag {
  font-size: 0.95rem;
  letter-spacing: 0.06em;
}

/* ------------------------------------------------------------
   BIG QUESTION BREAKS (full-width statement slides)
   ------------------------------------------------------------ */
[data-theme="neocities"] .big-question,
[data-theme="neocities"] .big-question p,
[data-theme="neocities"] .big-question span {
  font-size: clamp(1.5rem, 3.5vw, 2.6rem);
  line-height: 1.3;
}

/* ------------------------------------------------------------
   BOOK / RESOURCE CARDS
   ------------------------------------------------------------ */
[data-theme="neocities"] .book-title,
[data-theme="neocities"] .resource-title {
  font-size: 1.2rem;
  line-height: 1.3;
}

[data-theme="neocities"] .book-author,
[data-theme="neocities"] .book-note,
[data-theme="neocities"] .resource-desc {
  font-family: var(--serif);
  font-size: 1rem;
  line-height: 1.65;
}

/* ------------------------------------------------------------
   BUTTONS & CTAs
   ------------------------------------------------------------ */
[data-theme="neocities"] .btn,
[data-theme="neocities"] .cta-btn,
[data-theme="neocities"] button:not(.nav-toggle):not(.theme-toggle) {
  font-size: 1.1rem;
  letter-spacing: 0.05em;
}

/* ------------------------------------------------------------
   METADATA, CAPTIONS, SMALL MONO TEXT
   These are the most common problem spots with VT323 —
   anything that was 0.75–0.85rem becomes illegible.
   ------------------------------------------------------------ */
[data-theme="neocities"] .meta,
[data-theme="neocities"] .pub-meta,
[data-theme="neocities"] .card-meta,
[data-theme="neocities"] .item-meta,
[data-theme="neocities"] time,
[data-theme="neocities"] figcaption,
[data-theme="neocities"] caption {
  font-size: 1rem;
  line-height: 1.6;
}

/* Tags and badges */
[data-theme="neocities"] .tag,
[data-theme="neocities"] .badge,
[data-theme="neocities"] .pill {
  font-size: 0.95rem;
  letter-spacing: 0.05em;
}

/* ------------------------------------------------------------
   FOOTER
   ------------------------------------------------------------ */
[data-theme="neocities"] .site-footer {
  font-size: 1rem;
}

[data-theme="neocities"] .footer-oer,
[data-theme="neocities"] .footer-copy,
[data-theme="neocities"] .footer-links,
[data-theme="neocities"] .footer-links a {
  font-size: 1rem;
  line-height: 1.7;
}

/* ------------------------------------------------------------
   TABLES & DEFINITION LISTS
   ------------------------------------------------------------ */
[data-theme="neocities"] table,
[data-theme="neocities"] dl,
[data-theme="neocities"] dt,
[data-theme="neocities"] dd {
  font-family: var(--serif);
  font-size: 1.05rem;
  line-height: 1.7;
}

[data-theme="neocities"] dt {
  font-family: var(--mono);
  font-size: 1.1rem;
  letter-spacing: 0.04em;
}

/* ------------------------------------------------------------
   BLOCKQUOTES
   ------------------------------------------------------------ */
[data-theme="neocities"] blockquote {
  font-family: var(--serif);
  font-size: 1.15rem;
  line-height: 1.8;
}

/* ------------------------------------------------------------
   LINKS (inherit correct font from parent, not global default)
   ------------------------------------------------------------ */
[data-theme="neocities"] p a,
[data-theme="neocities"] li a,
[data-theme="neocities"] td a {
  font-family: inherit;
  font-size: inherit;
}