/* ==========================================================================
   Typography — единая иерархия шрифтов (Montserrat headings + Roboto body)
   ========================================================================== */

body {
  font-family: var(--font-body);
  font-weight: var(--fw-regular);
  font-size: var(--fs-base);
  line-height: var(--lh-relaxed);
  color: var(--color-text);
  background: var(--color-bg);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}

h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6 {
  font-family: var(--font-display);
  font-weight: var(--fw-semibold);
  color: var(--color-text);
  margin-block-end: var(--space-3);
  line-height: var(--lh-snug);
  letter-spacing: var(--tracking-tight);
}

h1, .h1 { font-size: var(--fs-3xl); line-height: var(--lh-tight); }
h2, .h2 { font-size: var(--fs-2xl); }
h3, .h3 { font-size: var(--fs-xl); }
h4, .h4 { font-size: var(--fs-lg); }
h5, .h5 { font-size: var(--fs-md); }
h6, .h6 { font-size: var(--fs-base); }

@media (min-width: 768px) {
  h1, .h1 { font-size: var(--fs-4xl); }
  h2, .h2 { font-size: var(--fs-3xl); }
  h3, .h3 { font-size: var(--fs-2xl); }
}

p, span, a, label, li, dt, dd, td, th, input, textarea, select, button {
  font-family: var(--font-body);
}

p {
  margin-block-end: var(--space-4);
  line-height: var(--lh-relaxed);
}
p:last-child { margin-block-end: 0; }

a {
  color: var(--color-primary);
  text-decoration: none;
  transition: color var(--dur-fast) var(--ease-out);
}
a:hover {
  color: var(--color-primary-600);
  text-decoration: underline;
}

strong, b { font-weight: var(--fw-semibold); }
small, .small { font-size: var(--fs-sm); }

/* Display utility — для крупных hero-заголовков */
.text-display {
  font-family: var(--font-display);
  font-weight: var(--fw-bold);
  font-size: var(--fs-4xl);
  line-height: var(--lh-tight);
  letter-spacing: var(--tracking-tight);
}
@media (min-width: 768px) {
  .text-display { font-size: var(--fs-5xl); }
}

/* Eyebrow — мелкая надпись над заголовком */
.text-eyebrow {
  font-family: var(--font-display);
  font-weight: var(--fw-medium);
  font-size: var(--fs-xs);
  letter-spacing: var(--tracking-wide);
  text-transform: uppercase;
  color: var(--color-primary);
}

/* Lead-параграф */
.lead {
  font-size: var(--fs-md);
  line-height: var(--lh-relaxed);
  color: var(--color-text-soft);
}

/* Muted/soft варианты */
.text-muted { color: var(--color-text-muted) !important; }
.text-soft  { color: var(--color-text-soft); }

/* Numbers — слегка приподнимаем для цен/счётчиков */
.numeric {
  font-feature-settings: 'tnum' 1, 'lnum' 1;
}

::selection {
  background: var(--color-primary-100);
  color: var(--color-primary-700);
}
