/* KurdCyber V96 — cyber-security login background + brand spacing */

/* Replace the cinematic nebula with a cyber-security environment. */
.kc94-background{
  background:
    radial-gradient(circle at 50% 42%,rgba(7,54,76,.72) 0%,rgba(3,22,36,.88) 33%,rgba(1,8,15,.98) 72%,#010409 100%)!important;
}
.kc94-background:before{display:none!important}
.kc94-nebula,.kc94-beam,.kc94-stars,.kc94-particles{display:none!important}

/* Perspective circuit floor */
.kc96-circuit-grid{
  position:absolute;
  z-index:1;
  left:-18%;right:-18%;bottom:-38%;height:112%;
  transform-origin:center bottom;
  transform:perspective(780px) rotateX(61deg);
  background-image:
    linear-gradient(rgba(38,215,255,.13) 1px,transparent 1px),
    linear-gradient(90deg,rgba(38,215,255,.13) 1px,transparent 1px),
    linear-gradient(rgba(38,215,255,.035) 1px,transparent 1px),
    linear-gradient(90deg,rgba(38,215,255,.035) 1px,transparent 1px);
  background-size:72px 72px,72px 72px,18px 18px,18px 18px;
  -webkit-mask-image:linear-gradient(to top,#000 8%,rgba(0,0,0,.9) 36%,transparent 92%);
  mask-image:linear-gradient(to top,#000 8%,rgba(0,0,0,.9) 36%,transparent 92%);
  animation:kc96GridTravel 8s linear infinite;
  filter:drop-shadow(0 0 12px rgba(0,194,255,.08));
}
.kc96-circuit-grid:before,.kc96-circuit-grid:after{
  content:"";position:absolute;inset:0;pointer-events:none;
}
.kc96-circuit-grid:before{
  background:
    radial-gradient(circle at 12% 23%,#39dfff 0 2px,transparent 3px),
    radial-gradient(circle at 31% 62%,#39dfff 0 2px,transparent 3px),
    radial-gradient(circle at 46% 35%,#1affb1 0 2px,transparent 3px),
    radial-gradient(circle at 64% 74%,#39dfff 0 2px,transparent 3px),
    radial-gradient(circle at 82% 44%,#1affb1 0 2px,transparent 3px),
    radial-gradient(circle at 93% 68%,#39dfff 0 2px,transparent 3px);
  filter:drop-shadow(0 0 8px rgba(48,220,255,.85));
  animation:kc96NodesPulse 2.4s ease-in-out infinite alternate;
}
.kc96-circuit-grid:after{
  background:linear-gradient(90deg,transparent 0 14%,rgba(35,223,255,.32) 14.2% 14.35%,transparent 14.55% 100%);
  opacity:.55;
  animation:kc96CircuitSweep 6.5s linear infinite;
}

/* Large holographic security shield behind the gateway */
.kc96-security-shield{
  position:absolute;z-index:1;left:50%;top:47%;width:min(520px,62vw);height:min(590px,70vw);
  transform:translate(-50%,-50%);
  clip-path:polygon(50% 0,90% 15%,86% 59%,72% 81%,50% 100%,28% 81%,14% 59%,10% 15%);
  background:linear-gradient(180deg,rgba(35,219,255,.17),rgba(18,106,164,.035) 60%,rgba(35,219,255,.1));
  opacity:.24;
  filter:drop-shadow(0 0 28px rgba(31,210,255,.12));
  animation:kc96ShieldBreathe 4.8s ease-in-out infinite alternate;
}
.kc96-security-shield:before{
  content:"";position:absolute;inset:8px;
  clip-path:inherit;
  background:linear-gradient(180deg,#03111c 0%,#020a11 100%);
}
.kc96-security-shield:after{
  content:"";position:absolute;left:50%;top:49%;width:30%;height:24%;transform:translate(-50%,-50%);
  border:2px solid rgba(59,226,255,.42);border-radius:14px;
  box-shadow:0 0 20px rgba(35,219,255,.09),inset 0 0 20px rgba(35,219,255,.04);
}
.kc96-lock{
  position:absolute;z-index:2;left:50%;top:34%;width:19%;height:22%;transform:translate(-50%,-50%);
  border:2px solid rgba(59,226,255,.42);border-bottom:0;border-radius:999px 999px 0 0;
  opacity:.92;
}

/* Falling encrypted data columns */
.kc96-data-rain{position:absolute;z-index:2;inset:-10% 0 0;overflow:hidden;opacity:.34}
.kc96-data-rain span{
  position:absolute;top:-55%;width:18px;
  color:rgba(74,229,255,.72);
  font:600 10px/1.7 "Cascadia Mono","SFMono-Regular",Consolas,monospace;
  letter-spacing:2px;writing-mode:vertical-rl;text-orientation:upright;
  text-shadow:0 0 9px rgba(32,217,255,.75);
  animation:kc96DataFall 12s linear infinite;
}
.kc96-data-rain span:nth-child(3n){color:rgba(74,255,187,.62);text-shadow:0 0 9px rgba(38,255,180,.55)}
.kc96-data-rain span:nth-child(1){left:4%;animation-delay:-8s;animation-duration:14s}.kc96-data-rain span:nth-child(2){left:12%;animation-delay:-3s;animation-duration:11s}.kc96-data-rain span:nth-child(3){left:20%;animation-delay:-6s;animation-duration:15s}.kc96-data-rain span:nth-child(4){left:29%;animation-delay:-1s;animation-duration:12s}.kc96-data-rain span:nth-child(5){left:38%;animation-delay:-9s;animation-duration:16s}.kc96-data-rain span:nth-child(6){left:47%;animation-delay:-4s;animation-duration:13s}.kc96-data-rain span:nth-child(7){left:56%;animation-delay:-10s;animation-duration:17s}.kc96-data-rain span:nth-child(8){left:65%;animation-delay:-5s;animation-duration:12.5s}.kc96-data-rain span:nth-child(9){left:73%;animation-delay:-2s;animation-duration:15.5s}.kc96-data-rain span:nth-child(10){left:81%;animation-delay:-7s;animation-duration:13.5s}.kc96-data-rain span:nth-child(11){left:89%;animation-delay:-4.5s;animation-duration:16.5s}.kc96-data-rain span:nth-child(12){left:96%;animation-delay:-11s;animation-duration:14.5s}

/* Network packet trails */
.kc96-packets{position:absolute;z-index:3;inset:0;overflow:hidden}
.kc96-packets i{position:absolute;width:5px;height:5px;border-radius:2px;background:#52e6ff;box-shadow:0 0 8px #2ddcff,0 0 18px rgba(45,220,255,.4);opacity:0;animation:kc96Packet 7s linear infinite}
.kc96-packets i:after{content:"";position:absolute;right:5px;top:2px;width:70px;height:1px;background:linear-gradient(90deg,rgba(45,220,255,.6),transparent)}
.kc96-packets i:nth-child(3n){background:#53ffc3;box-shadow:0 0 8px #35e7a7,0 0 18px rgba(53,231,167,.3)}
.kc96-packets i:nth-child(1){top:16%;left:-10%;animation-delay:-1s}.kc96-packets i:nth-child(2){top:27%;left:-8%;animation-delay:-5.2s}.kc96-packets i:nth-child(3){top:39%;left:-12%;animation-delay:-3.1s}.kc96-packets i:nth-child(4){top:54%;left:-9%;animation-delay:-6.2s}.kc96-packets i:nth-child(5){top:68%;left:-11%;animation-delay:-2.2s}.kc96-packets i:nth-child(6){top:82%;left:-8%;animation-delay:-4.5s}.kc96-packets i:nth-child(7){top:21%;left:-10%;animation-delay:-6.7s}.kc96-packets i:nth-child(8){top:61%;left:-8%;animation-delay:-.4s}

/* Security scanner line */
.kc96-scanline{
  position:absolute;z-index:4;left:0;right:0;top:-6%;height:1px;
  background:linear-gradient(90deg,transparent 8%,rgba(33,213,255,.1) 22%,rgba(64,230,255,.74) 50%,rgba(33,213,255,.1) 78%,transparent 92%);
  box-shadow:0 0 14px rgba(33,213,255,.32);
  opacity:.68;animation:kc96Scan 8.5s ease-in-out infinite;
}

/* Move the requested brand text farther below the logo. */
.kc94-brand-title{
  margin-top:8px!important;
  margin-bottom:18px!important;
}
.kc94-shell.is-open .kc94-brand-title{
  margin-top:3px!important;
  margin-bottom:16px!important;
}

@keyframes kc96GridTravel{to{background-position:0 72px,0 72px,0 18px,0 18px}}
@keyframes kc96NodesPulse{0%{opacity:.38}100%{opacity:1}}
@keyframes kc96CircuitSweep{0%{transform:translateX(-28%)}100%{transform:translateX(58%)}}
@keyframes kc96ShieldBreathe{0%{opacity:.12;filter:drop-shadow(0 0 15px rgba(31,210,255,.06))}100%{opacity:.28;filter:drop-shadow(0 0 34px rgba(31,210,255,.16))}}
@keyframes kc96DataFall{0%{transform:translateY(-25vh);opacity:0}14%{opacity:.46}78%{opacity:.23}100%{transform:translateY(170vh);opacity:0}}
@keyframes kc96Packet{0%{transform:translateX(0);opacity:0}8%{opacity:.9}86%{opacity:.4}100%{transform:translateX(125vw);opacity:0}}
@keyframes kc96Scan{0%,8%{transform:translateY(-10vh);opacity:0}18%{opacity:.72}82%{opacity:.42}100%{transform:translateY(116vh);opacity:0}}

@media(max-width:640px){
  .kc96-security-shield{width:78vw;height:90vw;top:43%;opacity:.16}
  .kc96-data-rain{opacity:.23}
  .kc96-data-rain span:nth-child(even){display:none}
  .kc96-circuit-grid{left:-48%;right:-48%;bottom:-30%;height:100%;background-size:58px 58px,58px 58px,16px 16px,16px 16px}
  .kc94-brand-title{margin-top:6px!important;margin-bottom:16px!important}
  .kc94-shell.is-open .kc94-brand-title{margin-top:2px!important;margin-bottom:13px!important}
}

@media(prefers-reduced-motion:reduce){
  .kc96-circuit-grid,.kc96-circuit-grid:before,.kc96-circuit-grid:after,.kc96-security-shield,.kc96-data-rain span,.kc96-packets i,.kc96-scanline{animation:none!important}
}
