/* ---------- COMING SOON / TBA (reusable — see inc/coming-soon.php) ----------
   Centered content, black background, atmospheric red pulse/signal effect
   built from the same vocabulary as the homepage vinyl signature
   (.pulse-core/.ping-ring in assets/css/front-page.css — radial glow core +
   expanding rings). The icon/pulse sits in normal document flow between the
   headline and the description (not absolutely centered over the whole
   section) so it has its own reserved space and never overlaps the copy;
   the rings themselves are absolutely positioned *within* that reserved
   box so the glow can still bleed outward without affecting layout. Unlike
   the homepage core, the icon here has no dark disc/border behind it — just
   glow — per brand direction. prefers-reduced-motion is handled globally
   (see the *{animation-duration:.001ms !important;...} rule in style.css)
   — no extra query needed here. */

.coming-soon{position:relative;min-height:74vh;display:flex;align-items:center;justify-content:center;
  text-align:center;overflow:hidden;padding:120px 0;background:#000;isolation:isolate;}

.coming-soon-inner{position:relative;z-index:2;display:flex;flex-direction:column;align-items:center;
  max-width:600px;margin:0 auto;}
.coming-soon .eyebrow{justify-content:center;display:flex;font-size:13px;letter-spacing:.18em;}
.coming-soon-headline{margin-top:clamp(24px,3.2vw,32px);font-size:clamp(34px,5.8vw,58px);font-weight:600;color:#fff;}
.coming-soon-date{margin-top:16px;font-family:'JetBrains Mono',monospace;font-size:13px;letter-spacing:.12em;text-transform:uppercase;color:rgba(255,255,255,.75);}
.coming-soon-desc{margin-top:clamp(32px,5vw,48px);max-width:500px;font-size:17px;line-height:1.75;color:rgba(245,245,245,.82);}
.coming-soon-cta-row{margin-top:36px;display:flex;justify-content:center;gap:16px;flex-wrap:wrap;}
.coming-soon-newsletter{margin-top:24px;justify-content:center;}

/* ---------- Pulse background ---------- */
.coming-soon-bg-pulse::before{content:'';position:absolute;inset:0;z-index:0;
  background:radial-gradient(ellipse at 50% 50%, rgba(232,52,42,.30), transparent 68%);}

/* Reserved box for the icon — sized to just the icon itself; the rings are
   absolutely positioned children so they can extend well beyond this box
   (clipped only by .coming-soon's own overflow:hidden) without pushing the
   headline/description apart. */
.coming-soon-visual{position:relative;z-index:1;margin:clamp(36px,5.5vw,56px) auto 0;
  width:clamp(260px,34vw,420px);aspect-ratio:1;display:flex;align-items:center;justify-content:center;pointer-events:none;}
.cs-ring{position:absolute;top:50%;left:50%;width:220%;height:220%;border-radius:50%;border:1px solid rgba(232,52,42,.32);
  animation:cs-signal 5s cubic-bezier(.2,.6,.35,1) infinite;opacity:0;}
.cs-ring-2{animation-delay:1.65s;}
.cs-ring-3{animation-delay:3.3s;}
@keyframes cs-signal{
  0%{transform:translate(-50%,-50%) scale(.4);opacity:0;}
  12%{opacity:.55;}
  100%{transform:translate(-50%,-50%) scale(1);opacity:0;}
}
.cs-core{position:relative;width:52%;aspect-ratio:1;border-radius:50%;
  background:radial-gradient(circle at 50% 50%, rgba(232,52,42,.38) 0%, rgba(232,52,42,.14) 45%, transparent 72%);
  display:flex;align-items:center;justify-content:center;}
.cs-core img{width:64%;height:64%;object-fit:contain;
  filter:drop-shadow(0 0 26px rgba(232,52,42,.65)) drop-shadow(0 0 70px rgba(232,52,42,.32));
  animation:cs-core-pulse 4s ease-in-out infinite;}
@keyframes cs-core-pulse{0%,100%{opacity:.9;transform:scale(1);}50%{opacity:1;transform:scale(1.06);}}

/* ---------- Minimal background ---------- */
.coming-soon-bg-minimal{background:#000;}

/* ---------- Image background ---------- */
.coming-soon-image{position:absolute;inset:0;z-index:0;background-size:cover;background-position:center;}
.coming-soon-scrim{position:absolute;inset:0;z-index:1;background:linear-gradient(to top, rgba(0,0,0,.92) 0%, rgba(0,0,0,.7) 55%, rgba(0,0,0,.5) 100%);}

@media (max-width:600px){
  .coming-soon{min-height:62vh;padding:90px 0;}
  .coming-soon-visual{width:clamp(190px,48vw,240px);margin-top:28px;}
  .coming-soon-desc{max-width:340px;}
}
