/* ============================================================
   Лендінг парку до відкриття (_loc_status = coming_soon).
   ============================================================ */

.coming {
  position: relative;
  overflow: hidden;
  padding-block: clamp(var(--space-16), 9vw, var(--space-32));
  background: var(--accent);
  color: var(--mp-ink);
}

.coming__inner { position: relative; }

.coming__marks { position: absolute; inset: -10% -5%; pointer-events: none; color: var(--mp-yellow-deep); opacity: 0.42; }
/* Пара width/height, а не aspect-ratio: у `.mark` є height:100%. */
.coming__mark { position: absolute; }
.coming__mark--a { top: 0;    right: 6%;  width: clamp(90px, 12vw, 190px); height: clamp(90px, 12vw, 190px); }
.coming__mark--b { bottom: 0; right: 26%; width: clamp(70px, 9vw, 140px);  height: clamp(70px, 9vw, 140px); }

.coming__eyebrow {
  display: inline-block;
  padding: var(--space-3) var(--space-6);
  background: var(--mp-ink);
  color: var(--mp-white);
  border-radius: var(--radius-xs);
  font-family: var(--font-display);
  font-size: var(--fs-micro);
  text-transform: uppercase;
  letter-spacing: var(--ls-label);
  line-height: 1;
}

.coming__title {
  margin-top: var(--space-6);
  font-family: var(--font-display);
  font-weight: var(--fw-extrabold);
  font-size: var(--fs-display);
  line-height: 0.88;
  text-transform: uppercase;
  letter-spacing: var(--ls-display);
}

.coming__lede {
  margin-top: var(--space-6);
  max-width: 44ch;
  font-size: clamp(17px, 1.8vw, 22px);
}

.countdown {
  display: flex;
  gap: var(--space-3);
  margin-top: clamp(var(--space-8), 4vw, var(--space-12));
}
.countdown__cell {
  min-width: 96px;
  padding: var(--space-4);
  background: var(--mp-ink);
  color: var(--mp-white);
  border-radius: var(--radius-md);
  text-align: center;
}
.countdown__cell span {
  display: block;
  font-family: var(--font-display);
  font-weight: var(--fw-extrabold);
  font-size: clamp(28px, 3.4vw, 44px);
  line-height: 1;
}
.countdown__cell small {
  display: block;
  margin-top: var(--space-2);
  font-size: var(--fs-micro);
  text-transform: uppercase;
  letter-spacing: var(--ls-label);
  color: var(--text-secondary);
}

.coming__date {
  margin-top: var(--space-4);
  font-family: var(--font-display);
  font-size: var(--fs-body-sm);
}

.coming__actions {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-3);
  margin-top: clamp(var(--space-8), 4vw, var(--space-12));
}
.coming__actions .button--primary { background: var(--mp-ink); color: var(--mp-white); }
.coming__actions .button--primary:hover { background: var(--mp-charcoal); box-shadow: none; }
.coming__actions .button--ghost { border-color: var(--mp-ink); color: var(--mp-ink); }
.coming__actions .button--ghost:hover { background: rgba(23, 24, 26, 0.08); color: var(--mp-ink); }

.coming__address { margin-top: var(--space-8); font-family: var(--font-display); font-size: var(--fs-body-sm); }

@media (max-width: 620px) {
  .countdown__cell { flex: 1; min-width: 0; padding: var(--space-3); }
  .coming__actions .button { flex: 1 1 100%; }
}
