/* ===========================================
   Typography
   ===========================================
   Font definitions and text styles.
   Public Sans (OFL 1.1), self-hosted variable font.
   =========================================== */

@font-face {
  font-family: "Public Sans";
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url("/assets/public-sans-latin-wght-normal-dca702d4.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: "Public Sans";
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url("/assets/public-sans-latin-ext-wght-normal-fcd1369e.woff2") format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@layer base {
  /* Font family definitions */
  :root {
    --font-sans: "Public Sans", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
      "Helvetica Neue", Arial, sans-serif;
    --font-mono: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas,
      "Liberation Mono", monospace;

    /* Font sizes */
    --text-xs:   0.75rem;   /* 12px */
    --text-sm:   0.875rem;  /* 14px */
    --text-base: 1rem;      /* 16px */
    --text-lg:   1.125rem;  /* 18px */
    --text-xl:   1.25rem;   /* 20px */
    --text-2xl:  1.5rem;    /* 24px */
    --text-3xl:  1.875rem;  /* 30px */
    --text-4xl:  2.25rem;   /* 36px */
    --text-5xl:  3rem;      /* 48px */
    --text-6xl:  4rem;      /* 64px */

    /* Font weights */
    --font-normal:   400;
    --font-medium:   500;
    --font-semibold: 600;
    --font-bold:     700;

    /* Line heights */
    --leading-tight:  1.25;
    --leading-snug:   1.375;
    --leading-normal: 1.5;
    --leading-relaxed: 1.625;
    --leading-loose:  2;
  }

  /* Base typography */
  body {
    font-family: var(--font-sans);
    font-size: var(--text-base);
    font-weight: var(--font-normal);
    line-height: var(--leading-normal);
    color: var(--color-text);
    -webkit-font-smoothing: antialiased;
  }

  /* Headings */
  h1, .h1 {
    font-size: var(--text-4xl);
    font-weight: var(--font-bold);
    line-height: 1.15;
    letter-spacing: -0.025em;
  }

  h2, .h2 {
    font-size: var(--text-3xl);
    font-weight: var(--font-semibold);
    line-height: 1.2;
    letter-spacing: -0.02em;
  }

  h3, .h3 {
    font-size: var(--text-2xl);
    font-weight: var(--font-semibold);
  }

  h4, .h4 {
    font-size: var(--text-xl);
    font-weight: var(--font-semibold);
  }

  h5, .h5 {
    font-size: var(--text-lg);
    font-weight: var(--font-medium);
  }

  h6, .h6 {
    font-size: var(--text-base);
    font-weight: var(--font-medium);
  }

  /* Paragraph */
  p {
    margin-bottom: var(--space-4);
  }

  p:last-child {
    margin-bottom: 0;
  }

  /* Small text */
  small, .text-sm {
    font-size: var(--text-sm);
  }

  .text-xs {
    font-size: var(--text-xs);
  }

  .text-center {
    text-align: center;
  }

  .text-right {
    text-align: right;
  }

  /* Lead paragraph */
  .lead {
    font-size: var(--text-xl);
    line-height: var(--leading-relaxed);
    color: var(--color-text-muted);
  }

  /* Monospace / Code */
  code, kbd, samp, pre {
    font-family: var(--font-mono);
    font-size: 0.875em;
  }

  code {
    padding: 0.125em 0.25em;
    background-color: var(--color-gray-200);
    border-radius: var(--radius-sm);
  }

  pre {
    padding: var(--space-4);
    background-color: var(--color-gray-900);
    color: var(--color-gray-100);
    border-radius: var(--radius-lg);
    overflow-x: auto;
  }

  pre code {
    padding: 0;
    background-color: transparent;
    border-radius: 0;
  }

  /* Strong and emphasis */
  strong, b {
    font-weight: var(--font-bold);
  }

  /* Blockquote */
  blockquote {
    margin-left: 0;
    padding-left: var(--space-5);
    border-left: 1px solid var(--color-gray-400);
    color: var(--color-text-muted);
  }

  /* Lists */
  ul, ol {
    padding-left: var(--space-6);
    margin-bottom: var(--space-4);
  }

  li {
    margin-bottom: var(--space-1);
  }

  /* Horizontal rule */
  hr {
    border: none;
    border-top: 1px solid var(--color-border);
    margin: var(--space-8) 0;
  }

  /* Mark / Highlight */
  mark {
    background-color: var(--color-warning-light);
    padding: 0.125em 0.25em;
    border-radius: var(--radius-sm);
  }

  /* Selection */
  ::selection {
    background-color: var(--color-primary-200);
    color: var(--color-primary-900);
  }
} /* End @layer base */