/* ============================================================
   GLOBAL CTA + CONTACT + CURVED BLACK FOOTER  (Buzz × Apple × Linear)
   White CTA  ->  white form  ->  curved transition  ->  black footer.
   Loaded on every page. Reuses brand tokens (--font-*, purple #7B61FF).
   ============================================================ */

/* ===== SECTION 1 — PRE-FORM CTA ===== */
.gx-cta{ position:relative; overflow:hidden; background:#FFFFFF; padding:clamp(90px,13vh,150px) 0 clamp(70px,9vh,110px); }
.gx-cta::before{ content:""; position:absolute; inset:0; z-index:0; pointer-events:none;
  background:radial-gradient(60% 70% at 50% 0%, rgba(123,97,255,0.10), rgba(0,174,239,0.05) 40%, transparent 70%); }
.gx-cta-shape{ position:absolute; z-index:1; pointer-events:none; opacity:.45; mix-blend-mode:multiply; }
.gx-cta-shape::before{ content:""; position:absolute; inset:0; background:linear-gradient(140deg,#7B61FF,#5B7DFF 55%,#00AEEF);
  clip-path:polygon(22% 0,100% 0,62% 100%,0 60%); filter:blur(1px); }
.gx-cta-shape.a{ width:120px; height:150px; top:14%; left:7%; animation:gxFloatA 10s ease-in-out infinite; }
.gx-cta-shape.b{ width:88px; height:112px; top:22%; right:8%; opacity:.38; animation:gxFloatB 12s ease-in-out infinite; }
.gx-cta-inner{ position:relative; z-index:2; text-align:center; max-width:880px; margin:0 auto; }
.gx-cta-eyebrow{ font-family:var(--font-mono); font-size:12px; letter-spacing:0.18em; text-transform:uppercase; color:#7B61FF; font-weight:600; }
.gx-cta-h{ font-family:var(--font-display); font-size:clamp(34px,5.5vw,64px); font-weight:700; letter-spacing:-0.035em; line-height:1.04; color:#0A0A0A; margin:18px 0 0; }
.gx-cta-sub{ font-size:clamp(16px,1.5vw,20px); line-height:1.55; color:#5A6678; max-width:600px; margin:22px auto 0; }
.gx-feats{ list-style:none; display:flex; flex-wrap:wrap; justify-content:center; gap:14px 30px; margin:42px auto 0; max-width:780px; padding:0; }
.gx-feats li{ display:flex; align-items:center; gap:10px; font-size:15px; font-weight:500; color:#2A3548; }
.gx-feats li::before{ content:"\2713"; display:grid; place-items:center; width:22px; height:22px; border-radius:50%;
  background:linear-gradient(135deg,#6E54F7,#8B5CF6); color:#fff; font-size:11px; font-weight:700; flex-shrink:0; }
.gx-cta-btns{ display:flex; flex-wrap:wrap; gap:14px; justify-content:center; margin-top:46px; }
.gx-btn-primary{ display:inline-flex; align-items:center; gap:9px; font-size:16px; font-weight:600; color:#fff; text-decoration:none;
  background:linear-gradient(135deg,#6E54F7,#8B5CF6); border-radius:100px; padding:0 34px; min-height:58px;
  box-shadow:0 12px 32px rgba(123,97,255,0.32), inset 0 1px 0 rgba(255,255,255,0.2); transition:transform .26s cubic-bezier(.2,.8,.2,1), box-shadow .3s; }
.gx-btn-primary span{ transition:transform .26s; } .gx-btn-primary:hover span{ transform:translateX(4px); }
.gx-btn-primary:hover{ transform:translateY(-3px); box-shadow:0 22px 46px rgba(123,97,255,0.42); }
.gx-btn-secondary{ display:inline-flex; align-items:center; gap:9px; font-size:16px; font-weight:600; color:#0A0A0A; text-decoration:none;
  background:#fff; border:1px solid rgba(10,10,10,0.14); border-radius:100px; padding:0 30px; min-height:58px;
  box-shadow:0 4px 14px rgba(10,10,10,0.05); transition:transform .26s cubic-bezier(.2,.8,.2,1), box-shadow .3s, border-color .26s, color .26s; }
.gx-btn-secondary:hover{ transform:translateY(-3px); color:#7B61FF; border-color:rgba(123,97,255,0.4); box-shadow:0 14px 30px rgba(123,97,255,0.14); }

/* ===== SECTION 2 — FORM (white) ===== */
.gx-form-section{ position:relative; background:#FFFFFF; padding:clamp(36px,5vh,64px) 0 clamp(120px,16vh,180px); }
.gx-form-head{ max-width:900px; }
.gx-h1{ font-family:var(--font-display); font-size:clamp(36px,6vw,76px); font-weight:700; letter-spacing:-0.04em; line-height:1.04; color:#0A0A0A; margin:0; }
.gx-dot{ display:inline-block; width:clamp(10px,1.2vw,15px); height:clamp(10px,1.2vw,15px); border-radius:50%; background:#7B61FF;
  margin-left:0.16em; vertical-align:0.05em; box-shadow:0 0 20px rgba(123,97,255,0.85),0 0 40px rgba(123,97,255,0.4); animation:gxDot 2.4s ease-in-out infinite; }
.gx-sub{ font-size:clamp(16px,1.5vw,21px); line-height:1.5; color:#5A6678; max-width:640px; margin-top:26px; }
.gx-form{ max-width:1040px; margin-top:clamp(46px,7vh,78px); }
.gx-grid{ display:grid; grid-template-columns:1fr 1fr; gap:44px 60px; }
.gx-field{ position:relative; } .gx-field.full{ grid-column:1/-1; }
.gx-field label{ display:block; font-family:var(--font-mono); font-size:12px; letter-spacing:0.12em; text-transform:uppercase; color:#8A94A6; margin-bottom:12px; transition:color .3s; }
.gx-field:focus-within label{ color:#7B61FF; }
.gx-input{ width:100%; border:none; border-bottom:1.5px solid rgba(10,10,10,0.14); background:transparent; padding:8px 0 12px;
  font-family:var(--font-display); font-size:clamp(18px,1.6vw,22px); font-weight:500; color:#0A0A0A; letter-spacing:-0.01em; transition:border-color .3s; }
.gx-input::placeholder{ color:#C4CBD6; font-weight:400; } .gx-input:focus{ outline:none; }
textarea.gx-input{ resize:none; line-height:1.5; min-height:42px; }
.gx-field::after{ content:""; position:absolute; left:0; bottom:0; height:2px; width:0; background:linear-gradient(90deg,#7B61FF,#00AEEF); border-radius:2px; transition:width .42s cubic-bezier(.2,.8,.2,1); }
.gx-field:focus-within::after{ width:100%; }
.gx-field.invalid .gx-input{ border-bottom-color:rgba(239,68,68,0.6); }
.gx-block{ margin-top:clamp(46px,6vh,68px); }
.gx-block-label{ font-family:var(--font-mono); font-size:13px; letter-spacing:0.12em; text-transform:uppercase; color:#0A0A0A; font-weight:600; margin-bottom:20px; }
.gx-chips{ display:flex; flex-wrap:wrap; gap:12px; }
.gx-chip{ cursor:pointer; user-select:none; font-family:var(--font-body); font-size:15px; font-weight:500; color:#41506A; background:#fff;
  border:1px solid rgba(10,10,10,0.12); border-radius:100px; padding:11px 22px; line-height:1;
  transition:transform .25s cubic-bezier(.2,.8,.2,1), box-shadow .28s, border-color .25s, color .25s, background .25s; }
.gx-chip:hover{ border-color:rgba(123,97,255,0.42); color:#7B61FF; transform:translateY(-2px); box-shadow:0 8px 22px rgba(123,97,255,0.12); }
.gx-chip.active{ background:linear-gradient(135deg,#6E54F7,#8B5CF6); border-color:transparent; color:#fff; box-shadow:0 8px 24px rgba(123,97,255,0.3); }
.gx-chip.active:hover{ color:#fff; }
.gx-submit{ width:100%; display:inline-flex; align-items:center; justify-content:center; gap:10px; border:none; cursor:pointer; margin-top:clamp(48px,7vh,76px);
  font-family:var(--font-body); font-size:17px; font-weight:600; color:#fff; background:linear-gradient(135deg,#6E54F7,#8B5CF6); border-radius:100px; min-height:64px;
  box-shadow:0 14px 36px rgba(123,97,255,0.34), inset 0 1px 0 rgba(255,255,255,0.22); transition:transform .26s cubic-bezier(.2,.8,.2,1), box-shadow .32s; }
.gx-submit span{ transition:transform .26s; } .gx-submit:hover{ transform:translateY(-3px); box-shadow:0 24px 52px rgba(123,97,255,0.44); } .gx-submit:hover span{ transform:translateX(4px); }
.gx-note{ text-align:center; font-size:13.5px; color:#8A94A6; margin-top:18px; }
.gx-success{ max-width:680px; text-align:center; margin:0 auto; padding:30px 0; }
.gx-success-icon{ width:62px; height:62px; border-radius:50%; display:grid; place-items:center; font-size:28px; color:#fff; background:linear-gradient(135deg,#6E54F7,#8B5CF6); box-shadow:0 12px 30px rgba(123,97,255,0.3); margin:0 auto 24px; }
.gx-success h2{ font-family:var(--font-display); font-size:clamp(26px,3.4vw,38px); font-weight:700; letter-spacing:-0.03em; color:#0A0A0A; margin-bottom:14px; }
.gx-success p{ font-size:17px; line-height:1.6; color:#5A6678; }

/* ===== CURVED WHITE -> BLACK + BLACK FOOTER ===== */
.gx-footer{ position:relative; background:#0A0A0F; color:#fff; overflow:hidden; padding:clamp(130px,17vh,190px) 0 clamp(48px,7vh,80px); }
.gx-footer::before{ content:""; position:absolute; top:-2px; left:-4%; right:-4%; height:clamp(90px,12vw,150px); background:#FFFFFF; z-index:1;
  border-radius:0 0 50% 50% / 0 0 100% 100%; }
.gx-footer::after{ content:""; position:absolute; bottom:-22%; left:50%; transform:translateX(-50%); width:82%; max-width:920px; height:620px; z-index:0; pointer-events:none;
  background:radial-gradient(ellipse at center, rgba(123,97,255,0.22), rgba(0,174,239,0.08) 45%, transparent 70%); filter:blur(50px); }
.gx-foot-shapes{ position:absolute; inset:0; z-index:1; pointer-events:none; }
.gx-torus{ position:absolute; width:108px; height:108px; border-radius:50%; border:13px solid rgba(123,97,255,0.34); top:32%; left:9%; box-shadow:0 0 28px rgba(123,97,255,0.18); animation:gxFloatA 11s ease-in-out infinite; }
.gx-sphere{ position:absolute; width:88px; height:88px; border-radius:50%; top:26%; right:11%;
  background:radial-gradient(circle at 32% 28%, rgba(255,255,255,0.5), rgba(123,97,255,0.25) 45%, rgba(0,174,239,0.18) 75%);
  box-shadow:0 8px 40px rgba(123,97,255,0.3), inset 0 0 20px rgba(255,255,255,0.2); animation:gxFloatB 9s ease-in-out infinite; }
.gx-crystal{ position:absolute; width:68px; height:88px; bottom:24%; left:15%; background:linear-gradient(140deg,rgba(123,97,255,0.5),rgba(0,174,239,0.34));
  clip-path:polygon(50% 0,100% 38%,78% 100%,22% 100%,0 38%); opacity:.55; animation:gxFloatA 13s ease-in-out infinite; }
.gx-crystal.two{ width:52px; height:68px; bottom:32%; right:17%; clip-path:polygon(22% 0,100% 0,62% 100%,0 60%); opacity:.5; animation:gxFloatB 10s ease-in-out infinite; }
.gx-particle{ position:absolute; width:4px; height:4px; border-radius:50%; background:rgba(155,133,255,0.85); box-shadow:0 0 8px rgba(123,97,255,0.7); animation-name:gxParticle; animation-timing-function:linear; animation-iteration-count:infinite; }
.gx-foot-inner{ position:relative; z-index:3; text-align:center; }
.gx-foot-logo{ height:clamp(58px,7.5vw,98px); width:auto; display:block; margin:0 auto;
  filter:drop-shadow(0 6px 22px rgba(123,97,255,0.30)) drop-shadow(0 2px 10px rgba(0,0,0,0.45));
  animation:gxLogoFloat 6s ease-in-out infinite; }
.gx-foot-tag{ font-family:var(--font-display); font-size:clamp(20px,2.4vw,30px); font-weight:700; letter-spacing:-0.03em; color:#fff; margin-top:clamp(30px,4vh,44px); }
.gx-socials{ display:flex; gap:14px; justify-content:center; margin-top:30px; }
.gx-socials a{ width:42px; height:42px; border-radius:50%; display:grid; place-items:center; color:#fff; font-size:14px; font-weight:600; text-decoration:none; background:rgba(255,255,255,0.06); border:1px solid rgba(255,255,255,0.12); transition:transform .25s, background .25s, border-color .25s; }
.gx-socials a:hover{ background:linear-gradient(135deg,#6E54F7,#8B5CF6); border-color:transparent; transform:translateY(-3px); }
.gx-foot-links{ display:flex; gap:30px; justify-content:center; flex-wrap:wrap; margin-top:34px; }
.gx-foot-links a{ font-size:14px; color:rgba(255,255,255,0.65); text-decoration:none; transition:color .2s; }
.gx-foot-links a:hover{ color:#fff; }
.gx-foot-disc{ font-family:var(--font-mono); font-size:12px; letter-spacing:0.1em; text-transform:uppercase; color:rgba(255,255,255,0.4); margin-top:28px; }
.gx-copy{ font-size:12.5px; color:rgba(255,255,255,0.35); margin-top:14px; }

@keyframes gxDot{ 0%,100%{ transform:scale(1);} 50%{ transform:scale(1.22);} }
@keyframes gxLogoFloat{ 0%,100%{ transform:translateY(0);} 50%{ transform:translateY(-12px);} }
@keyframes gxFloatA{ 0%,100%{ transform:translateY(0) rotate(-4deg);} 50%{ transform:translateY(-20px) rotate(3deg);} }
@keyframes gxFloatB{ 0%,100%{ transform:translateY(0) rotate(5deg);} 50%{ transform:translateY(-15px) rotate(-3deg);} }
@keyframes gxParticle{ 0%{ transform:translateY(0); opacity:0;} 12%{opacity:1;} 88%{opacity:1;} 100%{ transform:translateY(-130px); opacity:0;} }

@media (max-width:760px){
  .gx-grid{ grid-template-columns:1fr; gap:34px; }
  .gx-cta-btns{ flex-direction:column; } .gx-btn-primary,.gx-btn-secondary{ width:100%; justify-content:center; }
  .gx-feats{ gap:12px 22px; text-align:left; }
  .gx-torus,.gx-sphere{ transform:scale(.66); opacity:.4; } .gx-crystal{ transform:scale(.66); opacity:.4; }
  .gx-foot-links{ gap:20px 26px; }
}
@media (prefers-reduced-motion:reduce){
  .gx-dot,.gx-foot-logo,.gx-torus,.gx-sphere,.gx-crystal,.gx-particle,.gx-cta-shape{ animation:none !important; }
}
