/* ============================================================
   BAZA — TIPOGRAFIE
   Scala fluida: aceleasi clase pe mobil si desktop, fara media queries.
   ============================================================ */

:root {
  --t-display: clamp(2.75rem, 1.55rem + 5.3vw, 5.25rem);
  --t-h1:      clamp(2.25rem, 1.55rem + 3.1vw, 3.75rem);
  --t-h2:      clamp(1.75rem, 1.35rem + 1.9vw, 2.75rem);
  --t-h3:      clamp(1.375rem, 1.2rem + 0.85vw, 1.875rem);
  --t-h4:      clamp(1.125rem, 1.06rem + 0.32vw, 1.375rem);
  --t-lead:    clamp(1.0625rem, 1.01rem + 0.28vw, 1.25rem);
  --t-body:    1rem;
  --t-sm:      0.9375rem;
  --t-xs:      0.8125rem;
  --t-eyebrow: 0.75rem;

  --lh-tight: 1.02;
  --lh-snug: 1.14;
  --lh-heading: 1.22;
  --lh-body: 1.65;
  --lh-relaxed: 1.75;

  --measure: 68ch;
  --measure-narrow: 54ch;
}

html { -webkit-text-size-adjust: 100%; }

body {
  font-family: var(--font-body);
  font-size: var(--t-body);
  line-height: var(--lh-body);
  color: var(--ink);
  background: var(--bg);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

.t-display, .t-h1, .t-h2, .t-h3, .t-h4,
h1, h2, h3, h4 {
  font-family: var(--font-display);
  font-weight: var(--font-weight-display);
  letter-spacing: var(--tracking-display);
  color: var(--ink);
  text-wrap: balance;
  margin: 0;
}

.t-display { font-size: var(--t-display); line-height: var(--lh-tight); font-weight: var(--font-weight-display-alt); }
.t-h1, h1  { font-size: var(--t-h1);      line-height: var(--lh-snug); }
.t-h2, h2  { font-size: var(--t-h2);      line-height: var(--lh-heading); }
.t-h3, h3  { font-size: var(--t-h3);      line-height: var(--lh-heading); letter-spacing: -0.01em; }
.t-h4, h4  { font-size: var(--t-h4);      line-height: 1.3; letter-spacing: -0.005em; }

.t-lead { font-size: var(--t-lead); line-height: var(--lh-relaxed); color: var(--ink-muted); max-width: var(--measure); text-wrap: pretty; }
.t-body { font-size: var(--t-body); line-height: var(--lh-body); max-width: var(--measure); text-wrap: pretty; }
.t-sm   { font-size: var(--t-sm); line-height: 1.6; }
.t-xs   { font-size: var(--t-xs); line-height: 1.5; }

/* Eyebrow — preia tracking-ul all-caps din wordmark-ul logo-ului */
.t-eyebrow {
  font-family: var(--font-display);
  font-size: var(--t-eyebrow);
  font-weight: 700;
  letter-spacing: var(--tracking-eyebrow);
  text-transform: uppercase;
  color: var(--accent-text);
  display: inline-flex;
  align-items: center;
  gap: var(--sp-2);
  margin: 0;
}
.t-eyebrow::before {
  content: "";
  width: 1.5rem; height: 2px; border-radius: 2px;
  background: var(--accent);
  flex: none;
}

/* Cifre pentru preturi, telefon, statistici */
.t-num { font-variant-numeric: tabular-nums; }
.t-stat {
  font-family: var(--font-display);
  font-size: clamp(2.25rem, 1.6rem + 2.8vw, 3.5rem);
  font-weight: var(--font-weight-display-alt);
  line-height: 1;
  letter-spacing: -0.03em;
  font-variant-numeric: tabular-nums;
  color: var(--ink);
}

.t-muted { color: var(--ink-muted); }
.t-subtle { color: var(--ink-subtle); }

/* Evidentiere in titluri: cuvantul cheie primeste cyanul din logo */
.t-mark { color: var(--accent-text); }
[data-surface="dark"] .t-mark { color: var(--c-accent-300); }
.t-underline {
  background-image: linear-gradient(var(--accent), var(--accent));
  background-repeat: no-repeat;
  background-position: 0 92%;
  background-size: 100% 0.22em;
  padding-inline: 0.05em;
}

a { color: var(--accent-text); text-underline-offset: 0.2em; text-decoration-thickness: 1px; }
a:hover { color: var(--c-accent-800); }
[data-surface="dark"] a:hover { color: var(--c-accent-200); }
