/* Security hero: radar sweep zaps bugs, shield kicks, scan card counts. */
.jp-sec-hero{--bug:#ff6b5e;--night:#06263b;position:relative;overflow:hidden;color:#fff;padding:150px 0 110px;background:radial-gradient(55% 65% at 76% 45%,rgba(29,139,202,.85),rgba(29,139,202,0) 70%),linear-gradient(160deg,#0b5d8f 0%,#08466c 40%,var(--night) 100%)}
.jp-sec-hero::before{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.06) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.06) 1px,transparent 1px);background-size:44px 44px;mask-image:radial-gradient(70% 80% at 70% 45%,#000,transparent);-webkit-mask-image:radial-gradient(70% 80% at 70% 45%,#000,transparent);pointer-events:none}
.jp-sec-hero .btn{white-space:normal;text-align:left}
.jp-sec-hero .kicker{display:inline-flex;align-items:center;gap:10px;padding:8px 16px 8px 10px;border-radius:999px;background:var(--ink);color:#fff;font-size:14px;font-weight:600;border:2px solid rgba(255,255,255,.18)}
.jp-sec-hero .kicker i{width:12px;height:12px;border-radius:50%;background:var(--blue);animation:jp-sec-hero-ping 1.8s infinite}
@keyframes jp-sec-hero-ping{0%{box-shadow:0 0 0 0 rgba(67,186,255,.8)}70%,100%{box-shadow:0 0 0 12px rgba(67,186,255,0)}}
.jp-sec-hero .hero-grid{position:relative;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:40px;align-items:center}
.jp-sec-hero h1{color:#fff;font-size:clamp(42px,6vw,88px);line-height:.92;letter-spacing:-.045em;margin:24px 0 24px}
.jp-sec-hero h1 .lock{display:inline-block;background:var(--blue);color:var(--ink);padding:0 .16em .05em;border-radius:.16em;box-shadow:.07em .07em 0 var(--ink);transform:rotate(-2deg)}
.jp-sec-hero .lead{font-size:clamp(16px,1.5vw,19px);color:#e3f3ff;max-width:33em}
.jp-sec-hero .actions{display:flex;gap:16px;flex-wrap:wrap;margin-top:34px}
.jp-sec-hero .chips{display:flex;flex-wrap:wrap;gap:10px;margin-top:34px}
.jp-sec-hero .chips li{display:flex;align-items:center;gap:8px;padding:9px 14px;border-radius:14px;border:2px solid rgba(255,255,255,.25);background:rgba(6,38,59,.55);font-size:14px;font-weight:600;color:#fff}
.jp-sec-hero .chips b{font:800 20px/1 var(--jp-display);color:var(--sun)}

.jp-sec-hero .radar-fig{position:relative;margin:0}
.jp-sec-hero .s-scene{width:min(540px,100%);overflow:visible}
.jp-sec-hero .radar{position:absolute;inset:4%;border-radius:50%;overflow:hidden;background:radial-gradient(circle,#0e5f90 0%,#073f62 62%,#062f4a 100%);border:4px solid var(--ink);box-shadow:10px 10px 0 var(--ink),inset 0 0 0 10px rgba(67,186,255,.12)}
.jp-sec-hero .radar .rings{position:absolute;inset:0;background:repeating-radial-gradient(circle,transparent 0 15.5%,rgba(127,210,255,.28) 15.5% calc(15.5% + 2px))}
.jp-sec-hero .radar .cross{position:absolute;inset:0;background:linear-gradient(rgba(127,210,255,.22),rgba(127,210,255,.22)) 50% 0/2px 100% no-repeat,linear-gradient(90deg,rgba(127,210,255,.22),rgba(127,210,255,.22)) 0 50%/100% 2px no-repeat}
.jp-sec-hero .sweep{position:absolute;inset:0;border-radius:50%;background:conic-gradient(from 0deg,rgba(67,186,255,0) 0deg,rgba(67,186,255,0) 250deg,rgba(67,186,255,.5) 357deg,rgba(255,255,255,.95) 360deg);transform:rotate(var(--a,40deg));will-change:transform}
.jp-sec-hero .sweep::after{content:"";position:absolute;left:calc(50% - 1.5px);top:0;width:3px;height:50%;background:#fff;box-shadow:0 0 12px #9ddcff}
.jp-sec-hero .bugs{position:absolute;inset:0}
.jp-sec-hero .bug{position:absolute;width:11%;aspect-ratio:1;margin:-5.5% 0 0 -5.5%;opacity:0;transform:scale(0)}
.jp-sec-hero .bug svg{width:100%;height:100%;overflow:visible;animation:jp-sec-hero-crawl .5s ease-in-out infinite alternate}
.jp-sec-hero .bug.in{opacity:1;transform:scale(1);transition:transform .7s var(--spring),opacity .2s}
.jp-sec-hero .bug.zap{animation:jp-sec-hero-zap .65s var(--out) forwards}
.jp-sec-hero .bug::after{content:"";position:absolute;inset:-30%;border-radius:50%;border:3px solid #fff;opacity:0;transform:scale(.2)}
.jp-sec-hero .bug.zap::after{animation:jp-sec-hero-burst .6s var(--out)}
@keyframes jp-sec-hero-crawl{from{transform:rotate(-10deg)}to{transform:rotate(10deg) translateY(-6%)}}
@keyframes jp-sec-hero-zap{0%{opacity:1;transform:scale(1)}25%{opacity:1;transform:scale(1.45);filter:brightness(2.2)}100%{opacity:0;transform:scale(0) rotate(120deg)}}
@keyframes jp-sec-hero-burst{0%{opacity:1;transform:scale(.2)}100%{opacity:0;transform:scale(1.6)}}
.jp-sec-hero .beam{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;overflow:visible}
.jp-sec-hero .beam line{stroke:#fff;stroke-width:1.4;stroke-linecap:round;opacity:0;filter:drop-shadow(0 0 2px #7fd2ff)}
.jp-sec-hero .beam line.fire{animation:jp-sec-hero-beam .45s var(--out)}
@keyframes jp-sec-hero-beam{0%{opacity:1;stroke-width:2.2}100%{opacity:0;stroke-width:.4}}
.jp-sec-hero .s-scene .stage{pointer-events:none}
.jp-sec-hero .shield-glow{position:absolute;left:30%;top:28%;width:40%;aspect-ratio:1;border-radius:50%;background:radial-gradient(closest-side,rgba(127,210,255,.55),transparent);animation:jp-sec-hero-glow 2.4s ease-in-out infinite alternate}
@keyframes jp-sec-hero-glow{from{transform:scale(.85);opacity:.6}to{transform:scale(1.15);opacity:1}}
.jp-sec-hero .shield-obj.hit{animation:jp-sec-hero-kick .45s var(--spring)}
@keyframes jp-sec-hero-kick{40%{scale:1.1}}

.jp-sec-hero .scan-card{position:absolute;right:-2%;bottom:-4%;width:min(270px,58%);background:#fff;color:var(--ink);border:3px solid var(--ink);border-radius:20px;box-shadow:6px 6px 0 var(--ink);padding:14px 16px;transform:rotate(2.5deg)}
.jp-sec-hero .scan-card .top{display:flex;align-items:center;justify-content:space-between;gap:10px;font-weight:700;font-size:13px}
.jp-sec-hero .scan-card .top span{display:inline-flex;align-items:center;gap:6px}
.jp-sec-hero .scan-card .top em{font-style:normal;font-weight:600;color:#4a5560}
.jp-sec-hero .scan-card .top span::before{content:"";width:9px;height:9px;border-radius:50%;background:#22c55e;box-shadow:0 0 0 3px rgba(34,197,94,.25)}
.jp-sec-hero .scan-card .num{font:800 44px/1 var(--jp-display);letter-spacing:-.04em;margin:6px 0 2px;display:inline-block}
.jp-sec-hero .scan-card .num.bump{animation:jp-sec-hero-bump .5s var(--spring)}
@keyframes jp-sec-hero-bump{40%{transform:scale(1.25) rotate(-4deg);color:var(--deep)}}
.jp-sec-hero .scan-card small{display:block;font-size:12.5px;color:#4a5560;line-height:1.35}
.jp-sec-hero .scan-log{margin-top:10px;font:500 11.5px/1.5 ui-monospace,SFMono-Regular,Consolas,monospace;color:#2b3238;min-height:3em}
.jp-sec-hero .scan-log li{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;animation:jp-sec-hero-logline .5s var(--out)}
.jp-sec-hero .scan-log li::before{content:"✓ ";color:#16a34a;font-weight:700}
@keyframes jp-sec-hero-logline{from{opacity:0;transform:translateY(8px)}}
.jp-sec-hero .illus{position:absolute;left:0;bottom:-4%;font-size:12px;color:#b9dcf2;background:rgba(6,38,59,.7);padding:4px 10px;border-radius:999px}

@media (max-width:1020px){
  .jp-sec-hero .hero-grid{grid-template-columns:minmax(0,1fr)}
}
@media (max-width:640px){
  .jp-sec-hero{padding:120px 0 90px}
  .jp-sec-hero .scan-card{position:relative;right:auto;bottom:auto;width:100%;margin-top:22px;transform:rotate(1deg)}
  .jp-sec-hero .illus{position:static;display:inline-block;margin-top:12px}
}