/* ==========================================================================
   PROFITNESS · базовые компоненты
   Версия 1.0 · 29 августа 2026
   Зависит от tokens.css. Ни одного «сырого» цвета или размера — только токены.
   Префикс pf- у всех классов, чтобы стили не сталкивались с чужой вёрсткой.
   ========================================================================== */

/* --- основа ------------------------------------------------------------- */
.pf-root {
  background: var(--pf-bg);
  color: var(--pf-text);
  font-family: var(--pf-font-text);
  font-size: var(--pf-body-size);
  line-height: var(--pf-body-lh);
  -webkit-font-smoothing: antialiased;
}
.pf-container { max-width: var(--pf-container); margin-inline: auto; padding-inline: var(--pf-gutter); }
.pf-container--narrow { max-width: var(--pf-container-narrow); }
.pf-stack > * + * { margin-top: var(--pf-space-4); }
.pf-measure { max-width: var(--pf-measure); }

/* --- типографика --------------------------------------------------------- */
.pf-display, .pf-h1, .pf-h2, .pf-h3 {
  font-family: var(--pf-font-display);
  text-transform: uppercase;
  text-wrap: balance;
  margin: 0;
}
.pf-display { font-size: var(--pf-display-size); font-weight: var(--pf-display-weight); line-height: var(--pf-display-lh); letter-spacing: var(--pf-display-ls); }
.pf-h1 { font-size: var(--pf-h1-size); font-weight: var(--pf-h1-weight); line-height: var(--pf-h1-lh); letter-spacing: var(--pf-h1-ls); }
.pf-h2 { font-size: var(--pf-h2-size); font-weight: var(--pf-h2-weight); line-height: var(--pf-h2-lh); letter-spacing: var(--pf-h2-ls); }
.pf-h3 { font-size: var(--pf-h3-size); font-weight: var(--pf-h3-weight); line-height: var(--pf-h3-lh); letter-spacing: var(--pf-h3-ls); }
.pf-eyebrow {
  font-size: var(--pf-eyebrow-size); font-weight: var(--pf-eyebrow-weight);
  letter-spacing: var(--pf-eyebrow-ls); text-transform: uppercase;
  color: var(--pf-accent); margin: 0;
}
.pf-lead { font-size: var(--pf-lead-size); line-height: var(--pf-lead-lh); color: var(--pf-text-muted); margin: 0; }
.pf-small { font-size: var(--pf-small-size); line-height: var(--pf-small-lh); }
.pf-caption {
  font-size: var(--pf-caption-size); font-weight: var(--pf-caption-weight);
  letter-spacing: var(--pf-caption-ls); text-transform: uppercase; color: var(--pf-text-subtle);
}
.pf-numeral {
  font-family: var(--pf-font-display); font-size: var(--pf-numeral-size);
  font-weight: var(--pf-numeral-weight); line-height: var(--pf-numeral-lh);
  font-variant-numeric: tabular-nums;
}
.pf-numeral small { font-family: var(--pf-font-text); font-size: .38em; font-weight: 600; color: var(--pf-text-subtle); }

/* --- кнопки -------------------------------------------------------------- */
.pf-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: var(--pf-space-2);
  font-family: var(--pf-font-text); font-weight: 700; font-size: .95rem;
  padding: 13px var(--pf-space-5); border: 1px solid transparent; border-radius: var(--pf-radius-sm);
  cursor: pointer; text-decoration: none; line-height: 1.2;
  transition: background-color .15s ease, border-color .15s ease, color .15s ease;
}
.pf-btn--primary { background: var(--pf-accent); color: var(--pf-on-accent); }
.pf-btn--primary:hover { background: var(--pf-accent-hover); }
.pf-btn--secondary { background: transparent; color: var(--pf-text); border-color: var(--pf-border-strong); }
.pf-btn--secondary:hover { border-color: var(--pf-accent); color: var(--pf-accent); }
.pf-btn--ghost { background: transparent; color: var(--pf-accent); padding-inline: var(--pf-space-2); }
.pf-btn--ghost:hover { background: var(--pf-accent-subtle); }
.pf-btn--sm { padding: 8px var(--pf-space-4); font-size: .85rem; }
.pf-btn--lg { padding: 17px var(--pf-space-6); font-size: 1.05rem; }
.pf-btn:disabled, .pf-btn[aria-disabled="true"] { opacity: .45; cursor: not-allowed; }
.pf-btn:focus-visible, .pf-link:focus-visible, .pf-input:focus-visible {
  outline: 2px solid var(--pf-focus); outline-offset: 2px;
}

.pf-link { color: var(--pf-accent); text-decoration: underline; text-underline-offset: 3px; text-decoration-thickness: 1px; }
.pf-link:hover { text-decoration-thickness: 2px; }

/* --- карточка ------------------------------------------------------------ */
.pf-card {
  background: var(--pf-surface); border: 1px solid var(--pf-border);
  border-radius: var(--pf-radius-none); padding: var(--pf-space-5);
}
.pf-card--raised { box-shadow: var(--pf-shadow-md); border-color: transparent; }
.pf-card__title { font-family: var(--pf-font-display); font-weight: 600; font-size: 1.15rem; text-transform: uppercase; letter-spacing: .03em; margin: 0 0 var(--pf-space-2); }
.pf-card__meta { font-size: var(--pf-small-size); color: var(--pf-text-subtle); }
.pf-card__body { color: var(--pf-text-muted); font-size: var(--pf-small-size); line-height: 1.55; margin: var(--pf-space-2) 0 0; }

/* --- бейдж интенсивности -------------------------------------------------- */
.pf-badge {
  display: inline-flex; align-items: center; gap: 6px;
  font-size: .72rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase;
  padding: 4px 10px; border-radius: var(--pf-radius-pill); color: var(--pf-intensity-ink);
}
.pf-badge--calm    { background: var(--pf-intensity-calm); box-shadow: inset 0 0 0 1px var(--pf-border-strong); }
.pf-badge--medium  { background: var(--pf-intensity-medium); }
.pf-badge--intense { background: var(--pf-intensity-intense); color: var(--pf-intensity-intense-ink); }
.pf-badge--neutral { background: var(--pf-surface-sunken); color: var(--pf-text-muted); }

/* --- ячейка расписания ---------------------------------------------------- */
.pf-cell {
  display: flex; flex-direction: column; gap: 2px;
  padding: 9px 11px; border-radius: var(--pf-radius-sm);
  background: var(--pf-surface-sunken); color: var(--pf-intensity-ink);
  font-size: .8rem; line-height: 1.3; min-height: 44px;
}
.pf-cell--calm    { background: var(--pf-intensity-calm); }
.pf-cell--medium  { background: var(--pf-intensity-medium); }
.pf-cell--intense { background: var(--pf-intensity-intense); color: var(--pf-intensity-intense-ink); }
.pf-cell--empty   { background: transparent; border: 1px dashed var(--pf-border); }
.pf-cell__name { font-family: var(--pf-font-display); font-weight: 600; letter-spacing: .03em; text-transform: uppercase; font-size: .82rem; }
.pf-cell__note { font-size: .68rem; opacity: .72; }

/* --- таблица -------------------------------------------------------------- */
.pf-table { width: 100%; border-collapse: collapse; font-size: var(--pf-small-size); }
.pf-table th, .pf-table td { text-align: left; padding: 12px var(--pf-space-4); border-bottom: 1px solid var(--pf-border); vertical-align: top; }
.pf-table thead th {
  font-family: var(--pf-font-display); font-weight: 600; text-transform: uppercase;
  letter-spacing: .09em; font-size: .72rem; color: var(--pf-accent);
  background: var(--pf-surface-sunken); white-space: nowrap;
}
.pf-table tbody tr:last-child td { border-bottom: 0; }
.pf-table td.pf-num { font-variant-numeric: tabular-nums; text-align: right; white-space: nowrap; font-weight: 700; }
.pf-table__wrap { overflow-x: auto; border: 1px solid var(--pf-border); background: var(--pf-surface); }

/* --- поле формы ----------------------------------------------------------- */
.pf-field { display: flex; flex-direction: column; gap: 6px; }
.pf-label { font-size: .82rem; font-weight: 700; letter-spacing: .02em; }
.pf-input {
  font-family: var(--pf-font-text); font-size: 1rem; padding: 12px var(--pf-space-4);
  background: var(--pf-surface); color: var(--pf-text);
  border: 1px solid var(--pf-border-strong); border-radius: var(--pf-radius-sm);
}
.pf-input::placeholder { color: var(--pf-text-subtle); }
.pf-hint { font-size: .78rem; color: var(--pf-text-subtle); }
.pf-error { font-size: .78rem; color: var(--pf-danger); font-weight: 600; }
.pf-field--invalid .pf-input { border-color: var(--pf-danger); }

/* --- выноска --------------------------------------------------------------- */
.pf-callout {
  border-left: 3px solid var(--pf-accent); background: var(--pf-accent-subtle);
  padding: var(--pf-space-5); font-size: var(--pf-body-size);
}
.pf-callout__title { font-weight: 800; }

/* --- волна-разделитель ------------------------------------------------------ */
/* Фирменная кривая из логотипа. Толщина: 4.8 в знаке, 3.2 в разделителе. */
.pf-rule { display: block; width: 100%; height: 14px; color: var(--pf-accent); }
.pf-rule path { fill: none; stroke: currentColor; stroke-width: 3.2; stroke-linecap: round; }

/* --- показатель -------------------------------------------------------------- */
.pf-stat { display: flex; flex-direction: column; gap: 2px; }
.pf-stat__value { font-family: var(--pf-font-display); font-weight: 700; font-size: 2.5rem; line-height: 1; font-variant-numeric: tabular-nums; }
.pf-stat__label { font-size: .78rem; font-weight: 600; letter-spacing: .07em; text-transform: uppercase; color: var(--pf-text-subtle); }

@media (prefers-reduced-motion: reduce) { .pf-btn { transition: none; } }