/* ============ cta-night — the closing band, restaged (2026-07-20) ============
   Iman: the final CTA felt flat and random (washed waves, floating icon debris,
   off-system dark button). Restage per DESIGN-TOKENS: the page's night moment —
   navy aurora panel, living orb, unified blue CTA, channel dots. Scoped
   .cta-band.night; transform/opacity only. */

.cta-band.night{position:relative; overflow:hidden; text-align:center; display:block;
  border-radius:32px; padding:78px 28px 62px;
  background:
    radial-gradient(95% 70% at 82% -12%, rgba(45,108,246,.42), transparent 55%),
    radial-gradient(70% 55% at 6% 0%, rgba(34,211,238,.20), transparent 55%),
    radial-gradient(130% 95% at 50% 122%, rgba(20,184,166,.20), transparent 62%),
    linear-gradient(172deg,#16244A 0%,#0F1B33 55%,#122448 100%);
  border:1px solid rgba(120,190,255,.2);
  box-shadow:inset 0 1.5px 0 rgba(255,255,255,.12), 0 42px 95px -52px rgba(15,27,51,.85)}
/* base art off: ::before orbs + the JS-INJECTED .cta-mark wave svg (motion-net.js
   re-injects it at runtime — markup removal alone cannot kill it) */
.cta-band.night::before{display:none; content:none}
.cta-band.night .cta-mark{display:none!important}

/* slow ambient drift */
.cta-band.night::after{content:""; position:absolute; left:50%; top:-46%; width:760px; height:760px;
  margin-left:-380px; border-radius:50%; pointer-events:none; opacity:.32;
  background:conic-gradient(from 0deg, rgba(45,108,246,.18), rgba(34,211,238,.06) 30%,
    transparent 55%, rgba(20,184,166,.12) 75%, rgba(45,108,246,.18));
  filter:blur(30px)}
@media (prefers-reduced-motion:no-preference){
  .cta-band.night::after{animation:cnDrift 26s linear infinite}
}
@keyframes cnDrift{to{transform:rotate(360deg)}}
.cn-in{position:relative; z-index:1}

/* type */
.cta-band.night h2{color:#fff; font-family:var(--font-head); font-weight:800;
  font-size:clamp(30px,4.6vw,46px); letter-spacing:-1.2px; line-height:1.12; margin:0 0 14px}
.cta-band.night .g2{font-family:'Instrument Serif',Georgia,serif; font-style:italic; font-weight:400;
  letter-spacing:0; background:linear-gradient(96deg,#7BC4FF,#22D3EE);
  -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent}
.cta-band.night p{color:#C7D3E8; font-size:16px; line-height:1.6; max-width:540px; margin:0 auto}

/* buttons — unified house blue (Mario CTA rule) */
.cta-band.night .row{display:flex; justify-content:center; align-items:center; gap:14px; flex-wrap:wrap; margin-top:28px}
.cta-go{display:inline-flex; align-items:center; gap:10px; font-family:var(--font-body); font-weight:800;
  font-size:15.5px; color:#fff; text-decoration:none; padding:15px 28px; border-radius:100px;
  background:linear-gradient(96deg,var(--blue) 0%,#1F5AE0 100%);
  box-shadow:0 16px 34px -14px rgba(45,108,246,.8), inset 0 1.5px 0 rgba(255,255,255,.28);
  transition:transform .18s, box-shadow .2s}
.cta-go:hover{transform:translateY(-2px); box-shadow:0 22px 42px -14px rgba(45,108,246,.9), inset 0 1.5px 0 rgba(255,255,255,.28)}
.cta-go svg{flex:0 0 auto}
.cta-band.night .cta-ghost{color:#EAF2FF; background:rgba(255,255,255,.09); border:1px solid rgba(255,255,255,.22);
  border-radius:100px; padding:15px 26px; font-weight:700; font-size:15px; text-decoration:none;
  backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px); transition:background .2s}
.cta-band.night .cta-ghost:hover{background:rgba(255,255,255,.15)}

/* the living orb (right of the headline, desktop only) */
.cn-orb{position:absolute; right:66px; top:50%; margin-top:-62px; width:112px; height:112px; pointer-events:none; z-index:0}
.cn-sph{position:absolute; inset:0; border-radius:50%; display:block;
  background:radial-gradient(circle at 32% 25%, rgba(255,255,255,.95), transparent 30%),
    radial-gradient(circle at 68% 82%, rgba(34,211,238,.55), transparent 42%),
    radial-gradient(circle at 36% 32%, #8CC2FF 0%, #2D6CF6 52%, #0D2258 100%);
  box-shadow:inset 0 -16px 26px rgba(6,16,50,.6), inset 0 6px 12px rgba(255,255,255,.4),
    0 18px 40px -12px rgba(45,108,246,.75)}
.cn-halo{position:absolute; inset:-26px; border-radius:50%; display:block;
  background:radial-gradient(circle, rgba(45,108,246,.45) 0%, rgba(34,211,238,.16) 45%, transparent 70%)}
.cn-ring{position:absolute; inset:-10px; border-radius:50%; display:block; opacity:.8;
  background:conic-gradient(from 0deg, rgba(45,108,246,0), rgba(45,108,246,.9) 18%,
    rgba(34,211,238,.9) 38%, rgba(34,211,238,0) 55%, transparent 100%);
  -webkit-mask:radial-gradient(farthest-side, transparent calc(100% - 2.5px), #000 calc(100% - 2px));
  mask:radial-gradient(farthest-side, transparent calc(100% - 2.5px), #000 calc(100% - 2px))}
@media (prefers-reduced-motion:no-preference){
  .cn-halo{animation:cnBreath 3.8s ease-in-out infinite}
  .cn-ring{animation:cnSpin 8s linear infinite}
}
@keyframes cnBreath{0%,100%{transform:scale(1)}50%{transform:scale(1.12)}}
@keyframes cnSpin{to{transform:rotate(360deg)}}

/* channel dots row */
.cn-chips{display:flex; justify-content:center; flex-wrap:wrap; gap:9px; margin-top:30px}
.cn-chips span{display:inline-flex; align-items:center; gap:8px; font-size:12.5px; font-weight:700;
  color:#C7D3E8; padding:8px 14px; border-radius:100px;
  background:rgba(255,255,255,.07); border:1px solid rgba(255,255,255,.14)}
.cd{width:8px; height:8px; border-radius:50%; flex:0 0 auto}
.cd.tel{background:#2D6CF6; box-shadow:0 0 8px rgba(45,108,246,.9)}
.cd.web{background:#22D3EE; box-shadow:0 0 8px rgba(34,211,238,.9)}
.cd.wa{background:#25D366; box-shadow:0 0 8px rgba(37,211,102,.9)}
.cd.kig{background:#7C5CFC; box-shadow:0 0 8px rgba(124,92,252,.9)}
.cn-chips .soon{color:#3A2504; background:linear-gradient(135deg,#FFD34D,#F59E0B); border:1px solid rgba(255,255,255,.5)}

/* responsive */
@media (max-width:1000px){ .cn-orb{display:none} }
@media (max-width:720px){
  .cta-band.night{padding:56px 18px 46px; border-radius:26px}
  .cta-band.night p{font-size:15px}
  .cta-go{font-size:14.5px; padding:14px 24px}
  .cta-band.night .cta-ghost{font-size:14px; padding:14px 22px}
}
@media (prefers-reduced-motion:reduce){
  .cta-go{transition:none}
  .cta-go:hover{transform:none}
}