/*!
 * Fresh Air — site-specific styles on top of Bootstrap 5.3 + base.css
 *
 * Design language: editorial monochrome. Near-black on off-white, one blue
 * accent used sparingly.
 */

:root {
  --nm-rule: color-mix(in srgb, var(--bs-body-color), transparent 85%);
}

.tight {
  font-weight: 600;
  letter-spacing: -0.04em;
  line-height: 0.96;
}

/* ---------------------------------------------------------------
   Header + hero
   --------------------------------------------------------------- */

.wordmark {
  font-weight: 700;
  letter-spacing: -0.03em;
  font-size: 1.25rem;
  text-decoration: none;
}

.hero {
  padding-block: clamp(5rem, 12vw, 9rem) clamp(3rem, 7vw, 5rem);
  border-bottom: 1px solid var(--nm-rule);
}

.hero-title { font-size: clamp(2.75rem, 1rem + 7.5vw, 7rem); text-wrap: balance; }

/* ---------------------------------------------------------------
   Capabilities, approach
   --------------------------------------------------------------- */

.cap-row {
  display: grid;
  gap: 0.5rem 2rem;
  grid-template-columns: 1fr;
  padding: 1.5rem 0;
  border-top: 1px solid var(--nm-rule);
}

@media (width >= 768px) { .cap-row { grid-template-columns: 16rem 1fr; } }

.cap-name { font-size: 1.25rem; font-weight: 600; letter-spacing: -0.02em; }

.step-no {
  font-size: clamp(2.5rem, 2rem + 2vw, 4rem);
  font-weight: 600;
  letter-spacing: -0.05em;
  line-height: 1;
  color: color-mix(in srgb, var(--bs-body-color), transparent 82%);
}

/* ---------------------------------------------------------------
   Customer area: sign-in pages
   --------------------------------------------------------------- */

.auth-section { min-height: calc(100vh - 4rem); }

.auth-card { border-color: var(--nm-rule); }

.min-w-0 { min-width: 0; }

/* Header action button on the customer-area pages ("Вход" / "Регистрация" /
   "Выйти"): fixed to the longest label's width so it doesn't jump when moving
   between the pages. */
.auth-switch { min-width: 8.5rem; }
/* ...except on phones: next to "Партнёрский кабинет" on the dashboard the
   fixed width pushes the header past a 320px screen. */
@media (width < 576px) { .auth-switch { min-width: 0; } }

/* The landing's kicker line above the heading (was an inline style; the
   CSP allows no inline styles). */
.eyebrow { letter-spacing: .14em; text-transform: uppercase; }
