/* ==========================================================================
   Typography: Archivo for headings and body, exactly as the design system.
   ========================================================================== */

body {
  background: var(--color-bg);
  color: var(--color-text);
  font-family: var(--font-body);
  margin: 0;
  font-size: 15px;
  line-height: 1.55;
  font-weight: 400;
}

h1, h2, h3, h4, h5, h6 {
  font-family: var(--font-heading); font-weight: var(--font-heading-weight);
  line-height: 1.12; letter-spacing: -0.015em; margin: 0 0 var(--space-2);
}
h1 { font-size: 42px; }
h2 { font-size: 32px; }
h3 { font-size: 25px; }
h4 { font-size: 20px; }
h5 { font-size: 16px; }
h6 { font-size: 13px; }
h6 { letter-spacing: 0.08em; text-transform: uppercase; }
p { margin: 0 0 var(--space-3); }
a { color: var(--color-accent); text-underline-offset: 3px; }

figcaption {
  font-size: 11px;
  margin-top: var(--space-1);
  color: color-mix(in srgb, var(--color-text) 55%, transparent);
}

.text-muted { color: color-mix(in srgb, var(--color-text) 55%, transparent); }

/* Body copy inside long-form content (block editor / Elementor text) */
.art-body p {
  font-size: clamp(17px,1.35vw,19px);
  line-height: 1.72;
  margin: 0 0 22px;
  color: color-mix(in srgb, var(--color-text) 88%, transparent);
  max-width: 66ch;
}

.art-body h2 {
  font-family: var(--font-heading);
  font-weight: 800;
  font-size: clamp(22px,2.2vw,30px);
  line-height: 1.1;
  letter-spacing: -.02em;
  margin: 38px 0 16px;
}

.art-body h3 {
  font-family: var(--font-heading);
  font-weight: 800;
  font-size: clamp(19px,1.8vw,24px);
  line-height: 1.15;
  letter-spacing: -.015em;
  margin: 30px 0 12px;
}

.art-body ul,
.art-body ol {
  padding-left: 1.2em;
  margin: 0 0 22px;
  max-width: 66ch;
  font-size: clamp(17px,1.35vw,19px);
  line-height: 1.7;
}

.art-body a { color: var(--color-accent-700); }

.art-body blockquote {
  margin: 28px 0;
  padding-left: 20px;
  border-left: 2px solid var(--color-accent);
  font-size: clamp(20px,2vw,26px);
  line-height: 1.4;
  max-width: 50ch;
}

.art-body img { max-width: 100%; height: auto; }
