/* ==========================================================================
   Redix Digital: the client area, until it opens (client-area.html,
   tools/build-client-area.js; Roei, 2026-10-29: "בקרוב" in the style of the
   academy's opening page, redix-academy.com). v2.css carries the bar, the
   menu, the footer and the WhatsApp button, page.css the still sky behind
   them. In the middle of the night: a thin line of welcome, the studio's name
   large (its D in the cyan of the logo), a lit pill that says it opens soon,
   two short lines and the way back.
   ========================================================================== */

/* The still sky, lifted: its horizon (65% down the picture) sits near the foot of the screen here,
   under the last line, so every word stands on the open night. Where it stood, the glow of the
   horizon was behind the two lines of text, too bright for them (measured, 2026-10-29). */
body:has(main.soon) .sky {
  background-size: max(100%, calc(140svh * 1.7778)) auto;
  background-position: 50% 0;
}

@media (max-aspect-ratio: 4/5) {
  body:has(main.soon) .sky { background-size: max(100%, calc(140svh * 0.4614)) auto; }
}

.soon {
  display: grid;
  place-items: center;
  min-height: 100svh;
  padding: calc(76px + clamp(28px, 6vh, 72px)) var(--pad) clamp(56px, 10vh, 120px);
  text-align: center;
}

.soon-say {
  display: grid;
  justify-items: center;
  max-width: 46rem;
}

.soon-title {
  display: grid;
  justify-items: center;
  gap: clamp(10px, 2vh, 22px);
  margin: 0;
}

.soon-hi {
  font-size: clamp(1.25rem, 2.1vw, 1.875rem);
  font-weight: 300;
  line-height: 1.3;
  color: var(--text-mid);
}

/* The name as the academy's page writes it: heavy, wide, light grey, and the D of the logo cyan */
.soon-mark {
  font-size: clamp(2.875rem, 8.6vw, 7rem);
  font-weight: 800;
  line-height: 0.95;
  letter-spacing: -0.01em;
  color: #c9d3ea;
  white-space: nowrap;
}

.soon-mark span { color: var(--cyan); }

/* the pill: a point of light that breathes, and the words */
.soon-pill {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  margin: clamp(22px, 4vh, 36px) 0 0;
  padding: 11px 22px 11px 18px;
  border-radius: 999px;
  background: rgba(10, 16, 36, 0.78);
  box-shadow: inset 0 0 0 1px rgba(125, 240, 244, 0.32), 0 14px 40px -18px rgba(0, 196, 204, 0.55);
  font-size: clamp(1rem, 1.25vw, 1.125rem);
  font-weight: 700;
  color: var(--cyan-hi);
  text-shadow: none;
}

.soon-pill i {
  position: relative;
  flex: none;
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background: var(--cyan);
  box-shadow: 0 0 10px 2px rgba(47, 224, 230, 0.6);
}

/* the breath is a ring that grows and fades: transform and opacity only */
.soon-pill i::after {
  content: "";
  position: absolute;
  inset: -5px;
  border-radius: 50%;
  box-shadow: 0 0 0 1.5px rgba(125, 240, 244, 0.7);
  opacity: 0;
}

html:not(.no-motion) .soon-pill i::after { animation: soon-breath 2.4s cubic-bezier(0.23, 1, 0.32, 1) infinite; }

@keyframes soon-breath {
  0% { transform: scale(0.6); opacity: 0.9; }
  100% { transform: scale(1.6); opacity: 0; }
}

.soon-text {
  max-width: 34em;
  margin: clamp(22px, 3.6vh, 34px) 0 0;
  font-size: clamp(1.0625rem, 1.3vw, 1.25rem);
  line-height: 1.6;
  color: var(--text);
}

.soon-note {
  margin: 10px 0 0;
  font-size: 0.9375rem;
  line-height: 1.6;
  color: var(--text-mid);
}

.soon-cta {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 12px;
  margin-top: clamp(24px, 4vh, 36px);
}

@media (max-width: 767px) {
  .soon { padding-top: calc(64px + clamp(24px, 5vh, 48px)); }
  .soon-pill { padding: 10px 18px 10px 14px; }
}

/* the colour modes of the accessibility menu and the system's own: plain words, the point still */
html:is(.a11y-contrast, .a11y-negative, .a11y-light) .soon-mark span { color: inherit; }
html:is(.a11y-contrast, .a11y-negative, .a11y-light) .soon-pill { outline: 1px solid currentColor; }

@media (forced-colors: active) {
  .soon-pill { border: 1px solid CanvasText; }
  .soon-pill i { forced-color-adjust: none; background: CanvasText; box-shadow: none; }
  .soon-pill i::after { display: none; }
}