*{margin:0;padding:0;box-sizing:border-box}
html,body{width:100%;height:100%;overflow:hidden;background:#07090f;font-family:'Exo 2',sans-serif}
canvas{position:fixed;inset:0;z-index:0}

.lang-switcher{
  position:fixed;top:26px;left:50%;transform:translateX(-50%);z-index:10;
  display:flex;align-items:center;gap:2px;
  background:rgba(8,12,22,.8);border:1px solid rgba(41,121,255,.2);
  border-radius:50px;padding:4px;
  backdrop-filter:blur(16px);
  white-space:nowrap;
}
.lang-opt{
  display:flex;align-items:center;gap:7px;
  padding:6px 13px;border-radius:50px;
  cursor:pointer;transition:background .25s,border-color .25s;
  font-family:'Space Mono',monospace;font-size:10px;font-weight:700;
  letter-spacing:.14em;color:rgba(100,120,160,.45);
  user-select:none;border:1px solid transparent;
}
.lang-opt svg{width:20px;height:14px;border-radius:2px;flex-shrink:0;opacity:.5;transition:opacity .25s}
.lang-opt.active{background:rgba(41,121,255,.15);color:rgba(91,159,255,.95);border-color:rgba(41,121,255,.28)}
.lang-opt.active svg{opacity:1}
.lang-opt:not(.active):hover{color:rgba(160,180,210,.6)}
.lang-opt:not(.active):hover svg{opacity:.7}

main{
  position:relative;z-index:1;width:100%;height:100vh;
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  text-align:center;padding:40px 24px;
}
.badge{
  display:inline-flex;align-items:center;gap:8px;
  border:1px solid rgba(41,121,255,.3);border-radius:50px;
  padding:7px 18px;margin-bottom:32px;
  font-size:10px;font-weight:700;letter-spacing:.22em;text-transform:uppercase;
  color:rgba(91,159,255,.9);opacity:0;
}
.badge-dot{width:5px;height:5px;border-radius:50%;background:#2979FF;flex-shrink:0;animation:blink 2s infinite}
@keyframes blink{0%,100%{opacity:1;box-shadow:0 0 0 0 rgba(41,121,255,.7)}60%{opacity:.3;box-shadow:0 0 0 8px rgba(41,121,255,0)}}

.logo{
  width:124px;height:124px;object-fit:contain;margin-bottom:26px;opacity:0;
  filter:drop-shadow(0 0 36px rgba(41,121,255,.65)) drop-shadow(0 0 10px rgba(41,121,255,.3));
}
h1{font-size:clamp(36px,6.5vw,82px);font-weight:900;line-height:1.05;letter-spacing:-.025em;margin-bottom:20px;}
.t1{
  display:block;opacity:0;
  background:linear-gradient(135deg,#fff 0%,#b8c8e0 100%);
  -webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;
}
.t2{
  display:block;opacity:0;
  background:linear-gradient(135deg,#2979FF 0%,#5B9FFF 55%,#a8c8ff 100%);
  -webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;
}
p.sub{
  max-width:520px;font-size:15px;font-weight:300;opacity:0;
  color:rgba(160,180,210,.75);line-height:1.8;margin-bottom:44px;
}
p.sub strong{color:rgba(180,200,230,.95);font-weight:600}
.wrap-cta{opacity:0;overflow:visible}
.btn-a{
  padding:13px 36px;border-radius:7px;
  font-family:'Exo 2',sans-serif;font-size:13px;font-weight:700;
  letter-spacing:.1em;text-transform:uppercase;
  cursor:pointer;border:none;background:#2979FF;color:#fff;
  position:relative;overflow:hidden;
  transition:box-shadow .3s, filter .3s;
}
.btn-a:hover{ box-shadow:0 0 24px 6px rgba(41,121,255,.45), 0 0 60px 10px rgba(41,121,255,.18); filter:brightness(1.15) }

.bottom{
  position:fixed;bottom:26px;width:100%;
  display:flex;flex-direction:column;align-items:center;
  font-family:'Space Mono',monospace;font-size:10px;
  color:rgba(100,120,150,.5);letter-spacing:.1em;text-align:center;opacity:0;
}
.bottom-line{display:flex;align-items:center;gap:16px}
.bottom-line::before,.bottom-line::after{content:'';height:1px;width:50px;background:rgba(100,120,150,.2)}
.bottom-link{color:rgba(100,120,150,.5);text-decoration:none;transition:color .2s}
.bottom-link:hover{color:rgba(91,159,255,.8)}

@keyframes glitchIn{
  0%  {opacity:0;transform:translate(-6px,0) skewX(-10deg);clip-path:inset(40% 0 50% 0);filter:brightness(4) hue-rotate(90deg)}
  10% {opacity:1;transform:translate(6px,0) skewX(7deg);clip-path:inset(5% 0 85% 0);filter:brightness(3) hue-rotate(-60deg)}
  20% {opacity:.5;transform:translate(-3px,0) skewX(-4deg);clip-path:inset(65% 0 15% 0);filter:brightness(2) hue-rotate(30deg)}
  30% {opacity:1;transform:translate(4px,0) skewX(2deg);clip-path:inset(0 0 0 0);filter:brightness(2.5)}
  40% {opacity:.7;transform:translate(-2px,0);clip-path:inset(25% 0 45% 0);filter:brightness(1.5) hue-rotate(-20deg)}
  55% {opacity:1;transform:translate(2px,0);clip-path:inset(0 0 0 0);filter:brightness(1.2)}
  70% {opacity:.9;transform:translate(-1px,0) skewX(-.5deg);filter:brightness(1.1)}
  85% {opacity:1;transform:translate(1px,0)}
  100%{opacity:1;transform:translate(0,0) skewX(0);filter:brightness(1);clip-path:inset(0 0 0 0)}
}
@keyframes glitchInLogo{
  0%  {opacity:0;transform:scale(.6) translateX(-20px);filter:drop-shadow(8px 0 0 rgba(255,0,60,.9)) drop-shadow(-8px 0 0 rgba(0,200,255,.9)) brightness(4)}
  12% {opacity:1;transform:scale(1.18) translateX(10px);filter:drop-shadow(-10px 0 0 rgba(255,0,60,1)) drop-shadow(10px 0 0 rgba(0,200,255,1)) brightness(3)}
  24% {opacity:.6;transform:scale(.93) translateX(-6px);filter:drop-shadow(5px 0 0 rgba(255,0,60,.6)) drop-shadow(-5px 0 0 rgba(0,200,255,.6)) brightness(2)}
  36% {opacity:1;transform:scale(1.06) translateX(4px);filter:drop-shadow(-4px 0 0 rgba(255,0,60,.4)) drop-shadow(4px 0 0 rgba(0,200,255,.4)) brightness(1.5)}
  50% {opacity:.85;transform:scale(.99) translateX(-2px);filter:drop-shadow(2px 0 0 rgba(255,0,60,.2)) drop-shadow(-2px 0 0 rgba(0,200,255,.2)) brightness(1.3)}
  65% {opacity:1;transform:scale(1.01);filter:drop-shadow(0 0 36px rgba(41,121,255,.65)) brightness(1.15)}
  82% {opacity:1;transform:scale(1.0);filter:drop-shadow(0 0 36px rgba(41,121,255,.65)) drop-shadow(0 0 10px rgba(41,121,255,.3))}
  100%{opacity:1;transform:scale(1);filter:drop-shadow(0 0 36px rgba(41,121,255,.65)) drop-shadow(0 0 10px rgba(41,121,255,.3))}
}
.glitch-switch{animation:glitchSwitch .35s ease forwards}
@keyframes glitchSwitch{
  0%  {transform:translate(0,0)}
  15% {opacity:.4;transform:translate(6px,0) skewX(-6deg);filter:hue-rotate(90deg) brightness(2.5)}
  30% {opacity:.7;transform:translate(-5px,0) skewX(4deg);filter:hue-rotate(-45deg) brightness(1.8)}
  50% {opacity:.5;transform:translate(3px,0);filter:brightness(2)}
  70% {opacity:.9;transform:translate(-1px,0)}
  100%{opacity:1;transform:translate(0,0);filter:none}
}

/* ── CUSTOM CURSOR ── */
*, *::before, *::after { cursor: none !important; }
.cur-dot {
  position: fixed; width: 8px; height: 8px;
  background: #2979FF; border-radius: 50%;
  pointer-events: none; z-index: 9999;
  transform: translate(-50%,-50%);
  transition: width .15s, height .15s, background .2s;
  box-shadow: 0 0 10px rgba(41,121,255,.8), 0 0 20px rgba(41,121,255,.4);
}
.cur-ring {
  position: fixed; width: 32px; height: 32px;
  border: 1px solid rgba(41,121,255,.6); border-radius: 50%;
  pointer-events: none; z-index: 9998;
  transform: translate(-50%,-50%);
  transition: width .3s, height .3s, border-color .3s;
}
.cur-ring.hover {
  width: 54px; height: 54px;
  border-color: rgba(91,159,255,.9);
}
.cur-dot.hover { width: 14px; height: 14px; background: #5B9FFF; }

/* ── LOGO IDLE GLITCH ── */
@keyframes logoPulse {
  0%,100% {
    opacity:1;
    filter: drop-shadow(0 0 36px rgba(41,121,255,.65)) drop-shadow(0 0 10px rgba(41,121,255,.3));
    transform: scale(1) translateX(0);
  }
  2%  { opacity:1; filter: drop-shadow(8px 0 0 rgba(255,0,60,.9)) drop-shadow(-8px 0 0 rgba(0,200,255,.9)) brightness(3.5); transform: scale(1.04) translateX(5px); }
  4%  { opacity:1; filter: drop-shadow(-7px 0 0 rgba(255,0,60,.8)) drop-shadow(7px 0 0 rgba(0,200,255,.8)) brightness(2.8); transform: scale(.96) translateX(-4px) skewX(-3deg); }
  6%  { opacity:1; filter: drop-shadow(5px 0 0 rgba(255,0,60,.6)) drop-shadow(-5px 0 0 rgba(0,200,255,.6)) brightness(2.2); transform: scale(1.03) translateX(3px); }
  8%  { opacity:1; filter: drop-shadow(-3px 0 0 rgba(255,0,60,.4)) drop-shadow(3px 0 0 rgba(0,200,255,.4)) brightness(1.6); transform: scale(.99) translateX(-1px); }
  10% { opacity:1; filter: drop-shadow(0 0 55px rgba(41,121,255,1)) drop-shadow(0 0 22px rgba(255,255,255,.7)) brightness(2); transform: scale(1.07); }
  13% { opacity:1; filter: drop-shadow(0 0 40px rgba(41,121,255,.9)) brightness(1.4); transform: scale(1.03); }
  17% { opacity:1; filter: drop-shadow(0 0 36px rgba(41,121,255,.65)) drop-shadow(0 0 10px rgba(41,121,255,.3)); transform: scale(1) translateX(0); }
}


/* ── MODAL OVERLAY ── */
.modal-overlay {
  position:fixed;inset:0;z-index:200;
  display:flex;align-items:center;justify-content:center;
  padding:20px;
  opacity:0;pointer-events:none;
  transition:opacity .35s ease;
}
.modal-overlay.open { opacity:1;pointer-events:all; }
.modal-backdrop {
  position:absolute;inset:0;
  background:rgba(4,7,14,.85);
  backdrop-filter:blur(18px);
  -webkit-backdrop-filter:blur(18px);
}

/* modal box */
.modal {
  position:relative;z-index:1;
  width:100%;max-width:520px;
  background:rgba(10,15,28,.95);
  border:1px solid rgba(41,121,255,.22);
  border-radius:20px;
  padding:44px 40px 36px;
  transform:translateY(30px) scale(.96);
  transition:transform .4s cubic-bezier(.34,1.56,.64,1), opacity .35s ease;
  opacity:0;
  box-shadow:0 0 80px rgba(41,121,255,.12), 0 30px 80px rgba(0,0,0,.6);
}
.modal-overlay.open .modal {
  transform:translateY(0) scale(1);
  opacity:1;
}

/* glitch line top */
.modal::before {
  content:'';position:absolute;top:0;left:10%;right:10%;height:1px;
  background:linear-gradient(90deg,transparent,rgba(41,121,255,.7),transparent);
}

.modal-close {
  position:absolute;top:18px;right:20px;
  background:none;border:none;
  color:rgba(100,120,160,.5);font-size:22px;line-height:1;
  transition:color .2s,transform .2s;
}
.modal-close:hover { color:rgba(91,159,255,.9);transform:rotate(90deg); }

.modal-title {
  font-size:22px;font-weight:900;letter-spacing:-.02em;
  margin-bottom:4px;
  background:linear-gradient(135deg,#fff 0%,#b8c8e0 100%);
  -webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;
}
.modal-sub {
  font-size:12px;color:rgba(100,120,160,.6);
  font-family:'Space Mono',monospace;letter-spacing:.08em;
  margin-bottom:28px;
}

/* form */
.form-row { display:grid;grid-template-columns:1fr 1fr;gap:14px; }
.form-group { display:flex;flex-direction:column;gap:7px;margin-bottom:14px; }
.form-group label {
  font-size:10px;font-weight:700;letter-spacing:.18em;
  text-transform:uppercase;color:rgba(91,159,255,.7);
}
.form-group input,
.form-group textarea,
.form-group select {
  background:rgba(255,255,255,.04);
  border:1px solid rgba(41,121,255,.18);
  border-radius:8px;
  padding:12px 14px;
  font-family:'Exo 2',sans-serif;font-size:14px;
  color:#e0eaff;
  outline:none;
  transition:border-color .25s,box-shadow .25s,background .25s;
  cursor:none !important;
}
.form-group textarea { resize:none;height:100px;line-height:1.6; }
.form-group input::placeholder,
.form-group textarea::placeholder { color:rgba(100,120,160,.4); }
.form-group input:focus,
.form-group textarea:focus {
  border-color:rgba(41,121,255,.6);
  background:rgba(41,121,255,.06);
  box-shadow:0 0 0 3px rgba(41,121,255,.1);
}

.btn-submit {
  width:100%;padding:14px;margin-top:6px;
  background:linear-gradient(135deg,#2979FF,#1553cc);
  color:#fff;border:none;border-radius:9px;
  font-family:'Exo 2',sans-serif;font-size:13px;font-weight:700;
  letter-spacing:.12em;text-transform:uppercase;
  transition:box-shadow .3s, filter .3s;
  position:relative;overflow:hidden;
}
.btn-submit::after {
  content:'';position:absolute;inset:0;
  background:linear-gradient(135deg,rgba(255,255,255,.12),transparent);
  opacity:0;transition:opacity .3s;
}
.btn-submit:hover { box-shadow:0 0 24px 6px rgba(41,121,255,.45), 0 0 60px 10px rgba(41,121,255,.18); filter:brightness(1.15) }
.btn-submit:hover::after { opacity:1; }

/* success state */
.modal-success {
  display:none;flex-direction:column;align-items:center;
  justify-content:center;text-align:center;padding:20px 0;gap:14px;
}
.modal-success.show { display:flex; }
.success-icon {
  width:56px;height:56px;border-radius:50%;
  background:rgba(41,121,255,.15);border:1px solid rgba(41,121,255,.4);
  display:flex;align-items:center;justify-content:center;
  animation:popIn .5s cubic-bezier(.34,1.56,.64,1) forwards;
}
@keyframes popIn { from{transform:scale(0)}to{transform:scale(1)} }
.success-icon svg { width:24px;height:24px;stroke:#5B9FFF;fill:none;stroke-width:2.5; }
.success-title { font-size:18px;font-weight:800;color:#e0eaff; }
.success-sub { font-size:13px;color:rgba(160,180,210,.7);font-weight:300; }

/* modal glitch open */
@keyframes modalGlitchOpen {
  0%   { opacity:0; transform:translateY(50px) scale(.88) skewX(4deg);
         filter:brightness(5) hue-rotate(120deg) saturate(3);
         clip-path:inset(50% 5% 45% 5%); }
  8%   { opacity:1; transform:translateY(-12px) scale(1.04) skewX(-3deg);
         filter:brightness(3) hue-rotate(-60deg);
         clip-path:inset(0% 3% 80% 3%); }
  16%  { opacity:.7; transform:translateY(8px) scale(.97) skewX(2deg);
         filter:brightness(2.2) hue-rotate(40deg);
         clip-path:inset(60% 0% 10% 0%); }
  24%  { opacity:1; transform:translateY(-5px) scale(1.02) skewX(-1deg);
         filter:brightness(1.8);
         clip-path:inset(0% 0% 0% 0%); }
  35%  { opacity:.85; transform:translateY(4px) scale(.99) skewX(.5deg);
         filter:brightness(1.4) hue-rotate(-15deg); }
  48%  { opacity:1; transform:translateY(-2px) scale(1.005);
         filter:brightness(1.15); }
  65%  { opacity:1; transform:translateY(1px) scale(1.001);
         filter:brightness(1.06); }
  82%  { opacity:1; transform:translateY(-.5px) scale(1);
         filter:brightness(1.02); }
  100% { opacity:1; transform:translateY(0) scale(1) skewX(0);
         filter:brightness(1); clip-path:inset(0% 0% 0% 0%); }
}
/* modal glitch close */
@keyframes modalGlitchClose {
  0%   { opacity:1; transform:translateY(0) scale(1) skewX(0);
         filter:brightness(1); clip-path:inset(0% 0% 0% 0%); }
  12%  { opacity:1; transform:translateY(-6px) scale(1.02) skewX(-2deg);
         filter:brightness(2.5) hue-rotate(60deg);
         clip-path:inset(0% 0% 0% 0%); }
  25%  { opacity:.8; transform:translateY(4px) scale(.97) skewX(3deg);
         filter:brightness(3) hue-rotate(-80deg);
         clip-path:inset(20% 4% 60% 4%); }
  40%  { opacity:.5; transform:translateY(-3px) scale(.94) skewX(-2deg);
         filter:brightness(4) hue-rotate(120deg) saturate(3);
         clip-path:inset(55% 2% 30% 2%); }
  60%  { opacity:.2; transform:translateY(8px) scale(.88) skewX(5deg);
         filter:brightness(6) hue-rotate(-90deg);
         clip-path:inset(10% 8% 80% 8%); }
  80%  { opacity:.05; transform:translateY(30px) scale(.8);
         clip-path:inset(45% 0% 50% 0%); }
  100% { opacity:0; transform:translateY(50px) scale(.75);
         clip-path:inset(50% 0% 50% 0%); }
}
.modal-overlay.open .modal { animation:modalGlitchClose .5s cubic-bezier(.25,.46,.45,.94) reverse forwards; }
.modal.closing { animation:modalGlitchClose .45s cubic-bezier(.55,0,1,.45) forwards !important; }

  15%  { transform:translate(-3px,0) skewX(-4deg); filter:brightness(2) hue-rotate(60deg); clip-path:inset(20% 0 60% 0) }
  30%  { transform:translate(3px,0) skewX(3deg); filter:brightness(2.5) hue-rotate(-40deg); clip-path:inset(55% 0 15% 0) }
  45%  { transform:translate(-2px,0) skewX(-2deg); filter:brightness(1.8); clip-path:inset(0% 0 0% 0) }
  60%  { transform:translate(2px,0) skewX(1deg); filter:brightness(1.4) hue-rotate(20deg); clip-path:inset(30% 0 50% 0) }
  75%  { transform:translate(-1px,0); filter:brightness(1.2); clip-path:inset(0% 0 0% 0) }
  100% { transform:translate(0,0) skewX(0); filter:brightness(1.1); clip-path:none }
}