/* Self-hosted fonts (docs/07-security.md — no Google Fonts CDN) */

@font-face {
  font-family: 'Fredoka';
  font-style: normal;
  font-weight: 600 800;
  font-display: swap;
  src: url('../../assets/fonts/fredoka-bold.woff2') format('woff2');
}

@font-face {
  font-family: 'Plus Jakarta Sans';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('../../assets/fonts/plusjakartasans-400-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2122, U+2212, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Plus Jakarta Sans';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('../../assets/fonts/plusjakartasans-400-vietnamese.woff2') format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
@font-face {
  font-family: 'Plus Jakarta Sans';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('../../assets/fonts/plusjakartasans-700-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2122, U+2212, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Plus Jakarta Sans';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('../../assets/fonts/plusjakartasans-700-vietnamese.woff2') format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}

body {
  font-family: var(--font-body);
  font-weight: 400;
  color: var(--color-charcoal);
  background: var(--color-bg);
  line-height: 1.5;
}

.h1 {
  font-family: var(--font-headline);
  font-weight: 700;
  line-height: 1.08;
  font-size: clamp(2rem, 1.4rem + 2.6vw, 4.25rem);
  color: var(--color-brand-black);
}

.h2 {
  font-family: var(--font-headline);
  font-weight: 700;
  line-height: 1.1;
  font-size: clamp(1.75rem, 1.4rem + 1.6vw, 3.5rem);
  color: var(--color-brand-black);
}

.h3 {
  font-family: var(--font-headline);
  font-weight: 700;
  font-size: 1.25rem;
  line-height: 1.3;
  color: var(--color-brand-black);
}

.eyebrow {
  font-weight: 700;
  font-size: 0.75rem;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  /* --color-primary-hover, not --color-primary: measured ~4.2-4.5:1 at
     this small bold size on --color-bg/--color-subtle, right at (or
     just under) WCAG AA's 4.5:1 minimum. The hover shade gives ~5.6:1+
     while staying visually within the same red family. */
  color: var(--color-primary-hover);
}

.body-lg { font-size: 1.125rem; line-height: 1.6; }
.body-md { font-size: 1rem; line-height: 1.5; }
.body-sm { font-size: 0.875rem; line-height: 1.4; }

.label {
  font-weight: 700;
  font-size: 0.875rem;
  line-height: 1.3;
}