:root{
  --ink:#070c0f; --ink2:#0d171b; --panel:rgba(16,28,33,.72);
  --silver:#d6dde4; --mist:#9aa9b3; --teal:#3fd1c4; --blue:#2f7de1;
  --line:rgba(201,214,224,.16); --err:#ff9a8a;
  --display:'Cinzel',serif; --body:'Outfit',system-ui,sans-serif; --mono:'Spline Sans Mono',monospace;
}
*{box-sizing:border-box;margin:0;padding:0}
html,body{min-height:100%}
body{min-height:100dvh;background:radial-gradient(1200px 700px at 78% 10%,rgba(47,125,225,.16),transparent 60%),radial-gradient(900px 600px at 10% 90%,rgba(63,209,196,.13),transparent 60%),var(--ink);color:var(--silver);font-family:var(--body);display:flex;flex-direction:column;-webkit-font-smoothing:antialiased;overflow-x:hidden}
body::after{content:"";position:fixed;inset:0;pointer-events:none;opacity:.05;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence baseFrequency='.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}
.bg{position:fixed;inset:0;pointer-events:none;z-index:0}
.facets{width:100%;height:100%;animation:drift 40s ease-in-out infinite alternate}
@keyframes drift{to{transform:scale(1.06) rotate(1.5deg)}}
.spark{position:absolute;width:10px;height:10px;background:var(--silver);clip-path:polygon(50% 0,60% 40%,100% 50%,60% 60%,50% 100%,40% 60%,0 50%,40% 40%);opacity:0;animation:twinkle 6s ease-in-out infinite}
.s1{top:18%;left:46%}.s2{top:70%;left:88%;animation-delay:2s}.s3{top:84%;left:30%;animation-delay:4s;width:7px;height:7px}
@keyframes twinkle{0%,100%{opacity:0;transform:scale(.4)}50%{opacity:.8;transform:scale(1) rotate(45deg)}}

.wrap{position:relative;z-index:1;flex:1;width:min(1180px,100%);margin:0 auto;padding:clamp(28px,6vw,72px) clamp(20px,4vw,48px) 24px;display:grid;grid-template-columns:1.25fr .9fr;gap:clamp(32px,6vw,88px);align-items:center}
.wrap > *{min-width:0}
.pitch>*{animation:rise .9s cubic-bezier(.2,.7,.2,1) both}
.pitch>*:nth-child(2){animation-delay:.08s}.pitch>*:nth-child(3){animation-delay:.16s}.pitch>*:nth-child(4){animation-delay:.24s}.pitch>*:nth-child(5){animation-delay:.32s}
@keyframes rise{from{opacity:0;transform:translateY(14px)}}

.brands{display:flex;align-items:center;gap:clamp(14px,2.4vw,26px);margin-bottom:28px}
.logo{display:block;height:auto;filter:drop-shadow(0 10px 24px rgba(0,0,0,.5))}
.logo-gn{width:clamp(78px,9vw,112px);aspect-ratio:512/493}
.logo-gx{width:clamp(76px,8.6vw,108px);aspect-ratio:1/1;border-radius:14px}
.brand-join{color:var(--teal);display:grid;place-items:center;opacity:.8}
.eyebrow{font-family:var(--mono);font-size:.78rem;letter-spacing:.28em;text-transform:uppercase;color:var(--teal);margin-bottom:14px}
.eyebrow span{color:var(--mist)}
h1{font-family:var(--display);font-weight:600;font-size:clamp(2.3rem,5.4vw,4.4rem);line-height:1.04;letter-spacing:-.01em;color:#eef3f6;max-width:12ch}
h1 em{font-style:normal;background:linear-gradient(100deg,var(--teal),var(--silver) 55%,var(--blue));-webkit-background-clip:text;background-clip:text;color:transparent}
.lede{margin-top:20px;font-size:clamp(1.02rem,1.4vw,1.16rem);line-height:1.65;color:var(--mist);max-width:52ch;font-weight:300}
.facets-list{list-style:none;margin-top:32px;display:flex;flex-wrap:wrap;row-gap:18px;border-top:1px solid var(--line)}
.facets-list li{flex:1 1 150px;padding:16px 18px 0 0;position:relative}
.facets-list li::before{content:"";position:absolute;top:-4px;left:0;width:7px;height:7px;background:var(--teal);transform:rotate(45deg)}
.facets-list b{display:block;font-family:var(--display);font-weight:600;font-size:.95rem;letter-spacing:.06em;color:#eef3f6}
.facets-list span{font-size:.88rem;color:var(--mist)}

.gate{position:relative;background:var(--panel);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border:1px solid var(--line);border-radius:6px;padding:clamp(28px,3.4vw,40px);box-shadow:0 30px 80px -30px rgba(0,0,0,.8);clip-path:polygon(22px 0,calc(100% - 22px) 0,100% 22px,100% calc(100% - 22px),calc(100% - 22px) 100%,22px 100%,0 calc(100% - 22px),0 22px);animation:rise 1s .2s cubic-bezier(.2,.7,.2,1) both}
.gate::before{content:"";position:absolute;inset:0 0 auto;height:2px;background:linear-gradient(90deg,transparent,var(--teal),var(--silver),var(--blue),transparent)}
.gate-gem{margin-bottom:18px}
.gate-gem svg{animation:float 5s ease-in-out infinite}
@keyframes float{50%{transform:translateY(-4px)}}
h2{font-family:var(--display);font-weight:600;font-size:1.5rem;letter-spacing:.04em;color:#eef3f6}
.gate-note{margin:8px 0 24px;font-size:.92rem;line-height:1.55;color:var(--mist)}
label{display:block;font-family:var(--mono);font-size:.74rem;letter-spacing:.2em;text-transform:uppercase;color:var(--silver);margin-bottom:8px}
.field{display:flex;align-items:stretch;border:1px solid rgba(214,221,228,.28);background:rgba(7,12,15,.6);border-radius:4px;transition:border-color .2s,box-shadow .2s}
.field:focus-within{border-color:var(--teal);box-shadow:0 0 0 3px rgba(63,209,196,.18)}
.field.invalid{border-color:var(--err)}
input{flex:1;min-width:0;background:transparent;border:0;outline:0;color:#eef3f6;font-family:var(--mono);font-size:1.05rem;letter-spacing:.12em;padding:14px 14px}
.toggle{background:transparent;border:0;border-left:1px solid var(--line);color:var(--mist);font-family:var(--mono);font-size:.74rem;letter-spacing:.14em;text-transform:uppercase;padding:0 16px;cursor:pointer;min-width:72px}
.toggle:hover{color:var(--teal)}
.toggle:focus-visible,.submit:focus-visible{outline:2px solid var(--teal);outline-offset:2px}
.msg{min-height:1.4em;margin:10px 0 6px;font-size:.88rem;color:var(--err)}
.msg.ok{color:var(--teal)}
.submit{width:100%;display:flex;align-items:center;justify-content:center;gap:10px;padding:15px 18px;border:0;border-radius:4px;cursor:pointer;font-family:var(--display);font-weight:700;font-size:1rem;letter-spacing:.18em;text-transform:uppercase;color:#061013;background:linear-gradient(110deg,var(--teal),#c9d6df 55%,#6fa6ec);background-size:200% 100%;transition:background-position .5s,transform .15s}
.submit:hover{background-position:100% 0}
.submit:active{transform:translateY(1px)}
.submit[disabled]{opacity:.6;cursor:progress}
.foot{position:relative;z-index:1;text-align:center;padding:18px 20px 26px;font-size:.78rem;color:#6f7f89;line-height:1.7}

@media (max-width:860px){
  .wrap{grid-template-columns:minmax(0,1fr);gap:36px}
  h1{max-width:none}
}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}}

/* ---- Three-brand row (original palette) ---- */
.brands{list-style:none;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(12px,1.8vw,20px);align-items:start;margin-bottom:32px}
.brand{display:flex;flex-direction:column;align-items:center;text-align:center;gap:6px}
.plate{width:100%;aspect-ratio:1/1;display:grid;place-items:center;padding:14%;background:linear-gradient(150deg,rgba(63,209,196,.08),rgba(22,36,42,.92) 45%,rgba(47,125,225,.1));border:1px solid var(--line);clip-path:polygon(14px 0,calc(100% - 14px) 0,100% 14px,100% calc(100% - 14px),calc(100% - 14px) 100%,14px 100%,0 calc(100% - 14px),0 14px);box-shadow:0 20px 40px -24px rgba(0,0,0,.9)}
.logo,.logo-gn,.logo-gx,.logo-gw{width:100%;height:100%;max-width:100%;object-fit:contain;aspect-ratio:auto;border-radius:0;filter:drop-shadow(0 8px 18px rgba(0,0,0,.5))}
.logo-gx{border-radius:8px}
.brand b{margin-top:6px;font-family:var(--display);font-weight:600;font-size:.9rem;letter-spacing:.06em;color:#eef3f6}
.brand span{font-size:.78rem;line-height:1.4;color:var(--mist);max-width:22ch}
@media (max-width:520px){.brands{gap:10px}.brand b{font-size:.78rem}.brand span{font-size:.72rem}}
@media (max-width:380px){.brands{grid-template-columns:minmax(0,1fr)}.brand{display:grid;grid-template-columns:72px 1fr;text-align:left;column-gap:12px;row-gap:2px}.plate{grid-row:span 2}.brand b{margin:0;align-self:end}.brand span{max-width:none}}