/*
  Страница-заглушка на время разработки (settings.COMING_SOON).
  Самодостаточный файл: style.css сюда не подключается, потому что заглушке
  не нужно ничего из вёрстки сайта. Удаляется вместе с флагом.
*/

:root {
  --soon-text: #0f172a;
  --soon-font: 'Inter', system-ui, -apple-system, sans-serif;
}

* {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

html {
  background: #ffffff;
}

body.soon {
  min-height: 100dvh;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 40px 24px;
  background: #ffffff;
  color: var(--soon-text);
  font-family: var(--soon-font);
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
}

.soon-inner {
  width: 100%;
  max-width: 640px;
  text-align: center;
}

.soon-logo {
  width: auto;
  height: 64px;
  /* Появление собрано на одной анимации с задержками по элементам: так порядок
     чтения задаётся разметкой, а не набором отдельных keyframes. */
  animation: soon-rise 0.7s ease-out both;
}

.soon-headline {
  margin-top: 40px;
  font-size: clamp(1.5rem, 1.05rem + 2.1vw, 2.5rem);
  font-weight: 500;
  line-height: 1.25;
  letter-spacing: -0.02em;
  text-wrap: balance;
  animation: soon-rise 0.7s ease-out 0.1s both;
}

@keyframes soon-rise {
  from {
    opacity: 0;
    transform: translateY(12px);
  }

  to {
    opacity: 1;
    transform: none;
  }
}

@media (prefers-reduced-motion: reduce) {

  .soon-logo,
  .soon-headline {
    animation: none;
  }
}