#hero{position:relative;min-height:100vh;display:flex;align-items:center;justify-content:center;overflow:hidden}
.hero-bg{position:absolute;inset:0;z-index:0;background:var(--midnight)}
.hero-bg video{width:100%;height:100%;object-fit:cover;object-position:center;filter:brightness(0.65) saturate(1.35) contrast(1.05) hue-rotate(10deg);position:relative;z-index:1}
.hero-bg::after{
  content:'';position:absolute;inset:0;z-index:2;
  background:
    linear-gradient(to bottom, rgba(5,20,100,0.4) 0%, transparent 30%, transparent 60%, var(--midnight) 100%),
    linear-gradient(135deg, rgba(85,4,213,0.2) 0%, transparent 60%),
    radial-gradient(ellipse at 50% 50%, rgba(188,134,255,0.06) 0%, transparent 70%);
}
@media (min-width: 901px) {
  .hero-bg {
    perspective: 1500px;
    overflow: hidden;
  }
  .hero-bg video {
    transform: rotateX(2.5deg) scale(1.05);
    transform-origin: center center;
    box-shadow: 0 0 100px rgba(85,4,213,0.3);
  }
  .hero-bg::before {
    content: '';
    position: absolute;
    inset: 0;
    z-index: 3;
    background: 
      linear-gradient(90deg, rgba(0, 0, 0, 0.45) 0%, rgba(5, 20, 100, 0.2) 8%, transparent 22%, transparent 78%, rgba(5, 20, 100, 0.2) 92%, rgba(0, 0, 0, 0.45) 100%),
      linear-gradient(135deg, rgba(255, 255, 255, 0.04) 0%, transparent 50%, rgba(255, 255, 255, 0.01) 100%),
      linear-gradient(180deg, rgba(5, 20, 100, 0.5) 0%, transparent 6%, transparent 94%, var(--midnight) 100%);
    pointer-events: none;
    box-shadow: inset 0 0 80px rgba(85, 4, 213, 0.3);
  }
}
.hero-grid{
  position:absolute;inset:0;z-index:4;
  background-image:
    linear-gradient(rgba(188,134,255,0.04) 1px, transparent 1px),
    linear-gradient(90deg, rgba(188,134,255,0.04) 1px, transparent 1px);
  background-size:60px 60px;
  mask-image:radial-gradient(ellipse at center, black 20%, transparent 70%);
  pointer-events: none;
}
.particles{position:absolute;inset:0;z-index:5;overflow:hidden;pointer-events:none}
.particle{position:absolute;width:2px;height:2px;background:var(--lavanda);border-radius:50%;animation:float-up linear infinite;opacity:0;box-shadow:0 0 4px var(--lavanda)}
@keyframes float-up{0%{transform:translateY(100vh) translateX(0);opacity:0}10%{opacity:0.7}90%{opacity:0.7}100%{transform:translateY(-100px) translateX(30px);opacity:0}}
.hero-content{position:relative;z-index:10;text-align:center;padding:0 20px;padding-top:var(--nav-h);display:flex;flex-direction:column;align-items:center;gap:20px;animation:hero-in 1.2s ease both}
@keyframes hero-in{from{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}
.hero-badge{
  display:inline-flex;align-items:center;gap:8px;padding:6px 18px;
  border:1px solid rgba(188,134,255,0.35);border-radius:100px;
  background:rgba(85,4,213,0.08);
  font-family:'Rajdhani',sans-serif;font-size:clamp(9px,1.5vw,12px);font-weight:600;
  letter-spacing:0.3em;text-transform:uppercase;color:var(--lavanda);
}
.hero-badge::before{content:'';width:6px;height:6px;border-radius:50%;background:var(--lavanda);animation:ping 1.5s ease-in-out infinite;box-shadow:0 0 8px var(--lavanda)}
@keyframes ping{0%,100%{transform:scale(1);opacity:1}50%{transform:scale(1.4);opacity:0.5}}
.hero-fp{position:relative;width:clamp(140px,20vw,200px);height:clamp(140px,20vw,200px);cursor:pointer;margin:8px 0}
.hero-fp-rings{position:absolute;inset:-40px;z-index:0;pointer-events:none}
.hero-fp-rings circle{fill:none;stroke:var(--lavanda);stroke-width:0.8;opacity:0.15;transform-origin:50% 50%;animation:ring-expand 4s ease-in-out infinite}
.hero-fp-rings circle:nth-child(1){r:80;animation-delay:0s}
.hero-fp-rings circle:nth-child(2){r:110;animation-delay:0.7s}
.hero-fp-rings circle:nth-child(3){r:140;animation-delay:1.4s}
.hero-fp-rings circle:nth-child(4){r:170;animation-delay:2.1s}
@keyframes ring-expand{0%,100%{opacity:0.08}50%{opacity:0.22}}
.hero-logo-img{
  position:relative;z-index:1;width:100%;height:100%;border-radius:50%;overflow:hidden;
  border:3px solid var(--lavanda);
  box-shadow:0 0 24px rgba(188,134,255,0.5), 0 0 60px rgba(85,4,213,0.3), 0 0 8px var(--neon-purple);
  animation:fp-glow 3s ease-in-out infinite;
  transition:transform 0.3s ease;
}
.hero-logo-img img{width:100%;height:100%;object-fit:cover}
@keyframes fp-glow{
  0%,100%{
    box-shadow:0 0 24px rgba(188,134,255,0.4), 0 0 60px rgba(85,4,213,0.2);
    border-color: var(--lavanda);
  }
  50%{
    box-shadow:0 0 40px rgba(188,134,255,0.7), 0 0 80px rgba(85,4,213,0.4), 0 0 16px rgba(177,160,254,0.3);
    border-color: var(--white);
  }
}
.hero-fp:hover .hero-logo-img{transform:scale(1.05)}
.hero-fp.scanning .hero-logo-img{animation:fp-scan-glow 0.15s ease-in-out infinite}
@keyframes fp-scan-glow{0%,100%{box-shadow:0 0 50px var(--lavanda), 0 0 80px rgba(85,4,213,0.5), 0 0 20px var(--white);}50%{box-shadow:0 0 30px var(--lavanda), 0 0 60px rgba(85,4,213,0.3);}}
.scan-bar{position:absolute;left:10%;right:10%;height:2px;background:linear-gradient(90deg,transparent,var(--lavanda),var(--neon-purple),var(--lavanda),transparent);top:10%;z-index:2;opacity:0;border-radius:2px;pointer-events:none}
.hero-fp.scanning .scan-bar{animation:scan-move 0.8s linear infinite;opacity:1}
@keyframes scan-move{from{top:10%}to{top:88%}}
.tap-hint{font-family:'Orbitron',monospace;font-size:clamp(8px,1vw,10px);letter-spacing:0.3em;color:var(--lavanda);text-transform:uppercase;animation:blink2 2s ease-in-out infinite;margin-top:-8px;text-shadow:0 0 8px rgba(188,134,255,0.3)}
@keyframes blink2{0%,100%{opacity:0.9}50%{opacity:0.25}}
.hero-title{
  font-family:'Orbitron',monospace;font-size:clamp(2.2rem,7vw,6rem);font-weight:900;
  letter-spacing:0.06em;line-height:1;
  background:linear-gradient(135deg,var(--white) 0%,var(--b-pale) 50%,var(--lavanda) 100%);
  -webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;
}
.hero-title span{
  display:block;font-size:clamp(1.8rem,5.5vw,4.5rem);
  background:linear-gradient(135deg,var(--lavanda) 0%,var(--soft-lav) 50%,var(--sky) 100%);
  -webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;
  font-style:italic;
}
.hero-tagline{font-family:'Rajdhani',sans-serif;font-size:clamp(1rem,2.2vw,1.5rem);font-weight:300;letter-spacing:0.08em;color:rgba(255,255,255,0.65);max-width:560px;line-height:1.5}
.hero-divider{width:80px;height:2px;background:linear-gradient(90deg,transparent,var(--neon-purple),var(--lavanda),var(--neon-purple),transparent);margin:4px auto;box-shadow:0 0 10px rgba(85,4,213,0.3)}
.hero-lateral{position:absolute;z-index:4;top:50%;width:clamp(180px, 16vw, 260px);perspective:900px;pointer-events:auto}
.hero-lateral.left{left:clamp(16px, 3vw, 50px);animation:lateralSlideLeft 1.2s cubic-bezier(0.22, 1, 0.36, 1) 0.5s both}
.hero-lateral.right{right:clamp(16px, 3vw, 50px);animation:lateralSlideRight 1.2s cubic-bezier(0.22, 1, 0.36, 1) 0.8s both}
@keyframes lateralSlideLeft{from{opacity:0;transform:translateY(-50%) translateX(-120px) scale(0.7)}to{opacity:1;transform:translateY(-50%) translateX(0) scale(1)}}
@keyframes lateralSlideRight{from{opacity:0;transform:translateY(-50%) translateX(120px) scale(0.7)}to{opacity:1;transform:translateY(-50%) translateX(0) scale(1)}}
.hero-lateral-card{
  position:relative;border-radius:14px;overflow:hidden;
  border:1px solid rgba(188,134,255,0.2);
  background:rgba(5,20,100,0.5);
  backdrop-filter:blur(14px) saturate(1.2);
  box-shadow:
    0 16px 50px rgba(0,0,0,0.55),
    0 0 25px rgba(85,4,213,0.12),
    0 0 60px rgba(188,134,255,0.04),
    inset 0 1px 0 rgba(255,255,255,0.08);
  transform-style:preserve-3d;
  transition:transform 0.5s cubic-bezier(0.2, 0.8, 0.2, 1), box-shadow 0.5s ease, border-color 0.3s;
  cursor:pointer;
}
.hero-lateral.left .hero-lateral-card{animation:lateralFloatL 7s ease-in-out infinite}
.hero-lateral.right .hero-lateral-card{animation:lateralFloatR 7s ease-in-out 1.5s infinite}
@keyframes lateralFloatL{0%,100%{transform:rotateY(10deg) rotateX(2deg) translateY(0)}25%{transform:rotateY(8deg) rotateX(-1deg) translateY(-12px)}50%{transform:rotateY(12deg) rotateX(3deg) translateY(-6px)}75%{transform:rotateY(7deg) rotateX(0deg) translateY(-16px)}}
@keyframes lateralFloatR{0%,100%{transform:rotateY(-10deg) rotateX(2deg) translateY(0)}25%{transform:rotateY(-8deg) rotateX(-1deg) translateY(-14px)}50%{transform:rotateY(-12deg) rotateX(3deg) translateY(-4px)}75%{transform:rotateY(-7deg) rotateX(0deg) translateY(-18px)}}
.hero-lateral-card:hover{
  transform:rotateY(0deg) rotateX(0deg) scale(1.1) translateY(-8px) !important;
  border-color:rgba(188,134,255,0.65);
  box-shadow:
    0 25px 70px rgba(0,0,0,0.6),
    0 0 45px rgba(85,4,213,0.25),
    0 0 90px rgba(188,134,255,0.1),
    inset 0 1px 0 rgba(255,255,255,0.1);
}
.hero-lateral-card::before{content:'';position:absolute;inset:0;background:linear-gradient(135deg, rgba(85,4,213,0.08) 0%, transparent 45%, transparent 55%, rgba(188,134,255,0.04) 100%);z-index:2;pointer-events:none;transition:opacity 0.4s}
.hero-lateral-card:hover::before{background:linear-gradient(135deg, rgba(85,4,213,0.16) 0%, transparent 45%, transparent 55%, rgba(188,134,255,0.08) 100%)}
.hero-lateral-card::after{content:'';position:absolute;top:-100%;left:-60%;width:220%;height:220%;background:linear-gradient(115deg, transparent 25%, rgba(188,134,255,0.06) 42%, rgba(255,255,255,0.09) 50%, rgba(85,4,213,0.06) 58%, transparent 75%);animation:lateralShine 6s ease-in-out infinite;z-index:3;pointer-events:none}
.hero-lateral.right .hero-lateral-card::after{animation-delay:3s}
@keyframes lateralShine{0%,100%{transform:translateX(-90%);opacity:0}10%{opacity:1}50%{transform:translateX(90%);opacity:1}60%{opacity:0}}
.hero-lateral-img{position:relative;z-index:1;padding:10px}
.hero-lateral-img img{width:100%;height:auto;display:block;border-radius:6px;transition:transform 0.5s cubic-bezier(0.2,0.8,0.2,1), filter 0.4s;filter:drop-shadow(0 3px 10px rgba(0,0,0,0.3))}
.hero-lateral-card:hover .hero-lateral-img img{transform:scale(1.04);filter:drop-shadow(0 6px 18px rgba(0,0,0,0.4)) brightness(1.06)}
.hero-lateral-label{
  position:relative;z-index:4;padding:8px 14px;
  display:flex;align-items:center;justify-content:center;gap:7px;
  background:rgba(5,20,100,0.75);
  border-top:1px solid rgba(188,134,255,0.12);
}
.hero-lateral-dot{width:5px;height:5px;border-radius:50%;background:var(--lavanda);box-shadow:0 0 8px var(--lavanda), 0 0 16px rgba(85,4,213,0.3);animation:ping 2s ease-in-out infinite}
.hero-lateral-text{font-family:'Orbitron',monospace;font-size:clamp(6px, 0.9vw, 9px);font-weight:600;letter-spacing:0.18em;text-transform:uppercase;color:var(--lavanda)}
.hero-lateral-corner{position:absolute;width:16px;height:16px;z-index:5;pointer-events:none}
.hero-lateral-corner::before,.hero-lateral-corner::after{content:'';position:absolute;background:var(--lavanda);box-shadow:0 0 6px var(--lavanda), 0 0 12px rgba(85,4,213,0.4);transition:all 0.3s}
.hero-lateral-corner.tl{top:5px;left:5px}.hero-lateral-corner.tr{top:5px;right:5px}.hero-lateral-corner.bl{bottom:5px;left:5px}.hero-lateral-corner.br{bottom:5px;right:5px}
.hero-lateral-corner.tl::before,.hero-lateral-corner.bl::before{left:0;width:12px;height:1px}
.hero-lateral-corner.tr::before,.hero-lateral-corner.br::before{right:0;width:12px;height:1px}
.hero-lateral-corner.tl::after,.hero-lateral-corner.tr::after{top:0;width:1px;height:12px}
.hero-lateral-corner.bl::after,.hero-lateral-corner.br::after{bottom:0;width:1px;height:12px}
.hero-lateral-corner.tl::before{top:0}.hero-lateral-corner.tl::after{left:0}
.hero-lateral-corner.tr::before{top:0}.hero-lateral-corner.tr::after{right:0}
.hero-lateral-corner.bl::before{bottom:0}.hero-lateral-corner.bl::after{left:0}
.hero-lateral-corner.br::before{bottom:0}.hero-lateral-corner.br::after{right:0}
.hero-lateral-card:hover .hero-lateral-corner::before,.hero-lateral-card:hover .hero-lateral-corner::after{box-shadow:0 0 12px var(--lavanda), 0 0 24px rgba(85,4,213,0.5)}
.hero-cta-row{display:flex;gap:16px;flex-wrap:wrap;justify-content:center;margin-top:8px}
.btn-bid-regional {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  height: 48px;
  padding: 0 32px;
  background: linear-gradient(135deg, var(--neon-purple), var(--royal));
  border: 1px solid rgba(188, 134, 255, 0.4);
  border-radius: 6px;
  font-family: 'Rajdhani', sans-serif;
  font-size: clamp(12px, 1.5vw, 14px);
  font-weight: 700;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--white);
  transition: all 0.3s cubic-bezier(0.165, 0.84, 0.44, 1);
  box-shadow: 
    0 4px 20px rgba(85, 4, 213, 0.4),
    0 0 30px rgba(85, 4, 213, 0.1);
  text-decoration: none;
  box-sizing: border-box;
}
.btn-bid-regional:hover {
  background: linear-gradient(135deg, var(--lavanda), var(--neon-purple));
  border-color: var(--lavanda);
  box-shadow: 
    0 6px 30px rgba(85, 4, 213, 0.6),
    0 0 45px rgba(188, 134, 255, 0.25);
  transform: translateY(-2px);
}
.btn-primary{
  display:inline-flex;align-items:center;gap:10px;padding:14px 32px;
  background:linear-gradient(135deg, var(--neon-purple), var(--royal));
  border:1px solid rgba(188,134,255,0.3);
  border-radius:6px;
  font-family:'Rajdhani',sans-serif;font-size:clamp(12px,1.5vw,14px);font-weight:700;
  letter-spacing:0.2em;text-transform:uppercase;color:var(--white);
  transition:all 0.3s;
  box-shadow:0 4px 24px rgba(85,4,213,0.4), 0 0 40px rgba(85,4,213,0.1);
}
.btn-primary:hover{
  background:linear-gradient(135deg, var(--lavanda), var(--neon-purple));
  box-shadow:0 6px 32px rgba(85,4,213,0.6), 0 0 60px rgba(188,134,255,0.2);
  transform:translateY(-2px);
}
.btn-outline{
  display:inline-flex;align-items:center;gap:10px;padding:13px 28px;
  border:1.5px solid rgba(188,134,255,0.4);border-radius:6px;
  font-family:'Rajdhani',sans-serif;font-size:clamp(12px,1.5vw,14px);font-weight:600;
  letter-spacing:0.2em;text-transform:uppercase;color:var(--lavanda);
  background:rgba(85,4,213,0.06);transition:all 0.3s;
}
.btn-outline:hover{
  background:rgba(85,4,213,0.18);
  box-shadow:0 4px 20px rgba(85,4,213,0.3), 0 0 30px rgba(188,134,255,0.1);
  transform:translateY(-2px);border-color:var(--lavanda);
}
.btn-instagram{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;height:48px;padding:0 28px;border-radius:6px;
  font-family:'Rajdhani',sans-serif;font-size:clamp(12px,1.5vw,14px);font-weight:700;
  letter-spacing:0.2em;text-transform:uppercase;color:#fff;
  background:linear-gradient(45deg, #f09433 0%, #e6683c 25%, #dc2743 50%, #cc2366 75%, #bc1888 100%);
  transition:all 0.3s;box-shadow:0 4px 20px rgba(225, 48, 108, 0.25);text-decoration:none;
  box-sizing:border-box;
}
.btn-instagram:hover{transform:translateY(-2px);box-shadow:0 6px 28px rgba(225, 48, 108, 0.5);filter:brightness(1.1);color:#fff}
.btn-instagram svg{width:18px;height:18px}
.arrow-icon{font-size:18px;transition:transform 0.3s}
.btn-primary:hover .arrow-icon,.btn-outline:hover .arrow-icon,.btn-bid-regional:hover .arrow-icon{transform:translateX(4px)}
.hero-scroll{
  position:absolute;bottom:32px;left:50%;transform:translateX(-50%);z-index:3;
  display:flex;flex-direction:column;align-items:center;gap:6px;
  font-family:'Rajdhani',sans-serif;font-size:11px;letter-spacing:0.25em;text-transform:uppercase;color:var(--dim);
}
.scroll-line{width:1px;height:40px;background:linear-gradient(to bottom,var(--lavanda),transparent);animation:scroll-anim 2s ease-in-out infinite}
@keyframes scroll-anim{0%,100%{transform:scaleY(1);opacity:1}50%{transform:scaleY(0.5);opacity:0.4}}