/* Stránka před spuštěním */

.cs {
  position: relative;
  display: grid;
  place-items: center;
  min-height: 100vh;
  padding: 48px 24px 96px;
  overflow: hidden;
  background: radial-gradient(ellipse at 50% 40%, #ffffff 0%, #f5f5f6 45%, #e6e6e8 100%);
}

.cs::before {
  content: "";
  position: absolute;
  inset: -10%;
  background-image: radial-gradient(rgba(29, 29, 31, 0.09) 1px, transparent 1.4px);
  background-size: 20px 20px;
  -webkit-mask-image: radial-gradient(circle at 50% 45%, #000 0%, transparent 55%);
          mask-image: radial-gradient(circle at 50% 45%, #000 0%, transparent 55%);
  animation: drift 50s linear infinite;
}

.cs-inner { position: relative; max-width: 620px; text-align: center; }

.cs-logo {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  font-size: 1.6rem;
  font-weight: 700;
  letter-spacing: -0.02em;
  animation: rise 0.8s ease-out both;
}

.cs-mark { width: 44px; height: 44px; animation: breathe 4s ease-in-out infinite; }

.cs-kicker {
  margin: 44px 0 14px;
  font: 600 0.78rem ui-monospace, SFMono-Regular, Menlo, monospace;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: #9a9aa0;
  animation: rise 0.8s 0.15s ease-out both;
}

.cs h1 {
  margin: 0 0 18px;
  font-size: clamp(2.6rem, 8vw, 4.6rem);
  font-weight: 700;
  line-height: 1.02;
  letter-spacing: -0.045em;
  animation: rise 0.8s 0.25s ease-out both;
}

.cs-sub {
  margin: 0 auto;
  max-width: 44ch;
  font-size: 1.08rem;
  line-height: 1.6;
  color: var(--muted);
  animation: rise 0.8s 0.35s ease-out both;
}

.cs-line {
  width: 160px;
  height: 2px;
  margin: 40px auto 0;
  overflow: hidden;
  background: #dcdce0;
  border-radius: 2px;
  animation: rise 0.8s 0.45s ease-out both;
}

.cs-line i {
  display: block;
  width: 40%;
  height: 100%;
  background: linear-gradient(90deg, transparent, #e2b54f, transparent);
  animation: scan 2.4s ease-in-out infinite;
}

.cs-foot {
  position: absolute;
  bottom: calc(24px + env(safe-area-inset-bottom, 0px));
  display: flex;
  gap: 20px;
  font-size: 0.82rem;
  color: #9a9aa0;
}

.cs-foot a { color: #9a9aa0; text-decoration: none; }
.cs-foot a:hover { color: var(--text); }

@keyframes breathe {
  0%, 100% { transform: scale(1); }
  50% { transform: scale(1.06); }
}

@keyframes scan {
  0% { transform: translateX(-100%); }
  100% { transform: translateX(260%); }
}
