/* Hero — production: Whisper (вариант II) */

.hero {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  min-height: 100svh;
  min-height: 100dvh;
  padding: max(6rem, calc(4.5rem + env(safe-area-inset-top, 0px))) 2rem
    max(3rem, calc(2rem + env(safe-area-inset-bottom, 0px)));
  isolation: isolate;
  text-align: center;
}

.hero__inner {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
  max-width: 680px;
  margin: 0 auto;
}

.hero__eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 1rem;
  margin: 0 0 1.5rem;
  font-family: var(--font-ui);
  font-size: var(--type-caption);
  font-weight: 700;
  letter-spacing: var(--tracking-caption);
  text-transform: uppercase;
  color: var(--hero-eyebrow, var(--accent-secondary));
  text-shadow: var(--hero-text-shadow);
}

.hero__line {
  width: 40px;
  height: 1px;
  background: linear-gradient(90deg, transparent, var(--accent), transparent);
  flex-shrink: 0;
  opacity: 0.85;
}

.hero__title {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0;
  margin: 0 0 1.25rem;
  font-family: var(--font-display);
  font-size: var(--type-display-lg);
  font-weight: 300;
  line-height: 1;
  letter-spacing: 0.01em;
  color: var(--text-bright);
  text-shadow: var(--hero-title-shadow);
}

.hero__title-line {
  display: block;
  line-height: 0.92;
}

.hero__title-line + .hero__title-line {
  margin-top: -0.06em;
}

.hero__title em {
  font-style: italic;
  color: var(--accent);
  text-shadow: var(--hero-title-shadow);
}

.hero__lead {
  margin: 0 0 2.25rem;
  font-family: var(--font-body);
  font-size: var(--type-body-lg);
  font-weight: 400;
  line-height: var(--leading-relaxed);
  letter-spacing: 0.01em;
  color: var(--hero-lead, rgba(232, 238, 252, 0.92));
  text-shadow: var(--hero-text-shadow);
}

.hero__actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 1rem;
}

.hero__actions .btn {
  min-width: 180px;
}

.hero__legal-note {
  margin: 1rem 0 0;
  max-width: 22rem;
  font-size: 0.75rem;
  font-style: italic;
  line-height: var(--leading-relaxed);
  color: var(--text-faint);
  opacity: 0.9;
}

.hero-reveal {
  opacity: 0;
  transform: translateY(24px);
  animation: hero-reveal 0.95s cubic-bezier(0.22, 1, 0.36, 1) var(--reveal-delay, 0s) forwards;
}

@keyframes hero-reveal {
  to { opacity: 1; transform: translateY(0); }
}

@media (prefers-reduced-motion: reduce) {
  .hero-reveal { opacity: 1; transform: none; animation: none; }
}

@media (max-width: 900px) {
  .hero {
    min-height: 100svh;
    min-height: 100dvh;
    padding-top: max(6.5rem, calc(5rem + env(safe-area-inset-top, 0px)));
    padding-bottom: max(3.5rem, calc(2.5rem + env(safe-area-inset-bottom, 0px)));
  }
}