/* =========================================================================
   NIKSUN — capability page styles (Maya, Maya, Maya, etc.)
   ========================================================================= */
.cap-page [id]{scroll-margin-top:128px}

/* hero */
.cap-hero{position:relative;padding:clamp(64px,8vw,108px) 0 clamp(40px,5vw,60px);overflow:hidden}
.cap-hero::before{content:'';position:absolute;inset:0;background:radial-gradient(60% 60% at 78% 0,rgba(22,190,220,.14),transparent 64%);z-index:-1}
.cap-hero .grid{display:grid;grid-template-columns:1.05fr .95fr;gap:48px;align-items:center}
@media(max-width:920px){.cap-hero .grid{grid-template-columns:1fr;gap:36px}}
.cap-badge{display:inline-flex;align-items:center;gap:10px;margin-bottom:20px}
.cap-badge .mark{width:38px;height:38px;border-radius:11px;background:linear-gradient(150deg,var(--cyan),var(--blue));display:grid;place-items:center;color:#fff;font:800 16px/1 var(--sans);box-shadow:0 10px 26px -10px rgba(22,190,220,.7)}
.cap-badge .nm{font:700 16px/1 var(--sans);letter-spacing:-.01em}
.cap-badge .nm small{display:block;font:500 11px/1 var(--mono);color:var(--blue-action);margin-top:4px;letter-spacing:.04em}
.cap-hero h1{font-size:clamp(34px,5vw,60px);font-weight:800;letter-spacing:-.03em;line-height:1.02}
.cap-hero h1 em{font-style:normal;background:linear-gradient(100deg,var(--cyan),var(--blue));-webkit-background-clip:text;background-clip:text;color:transparent}
.cap-hero .lead{margin-top:20px;max-width:54ch}
.cap-hero .cta{display:flex;gap:14px;margin-top:30px;flex-wrap:wrap}

/* section scaffold */
.cap-page .sec{padding:clamp(56px,7vw,100px) 0;border-top:1px solid var(--line-soft)}
.cap-page .sec.alt{background:var(--paper-2)}
.cap-page .sec.dark{background:linear-gradient(180deg,#0d2c47,#06182b);color:#fff;border-top:0;position:relative;overflow:hidden}
.cap-page .sec.dark h2,.cap-page .sec.dark .h2{color:#fff}
.cap-page .sec.dark .lead{color:#AFC6DA}.cap-page .sec.dark .eyebrow{color:var(--blue-bright)}
/* dark theme: deepen the standard bands so they read as a cohesive near-black family,
   leaving the marquee's blue gradient as the clearly-distinct hero band */
:root[data-theme="dark"] .cap-page .sec.alt{background:#0a1825}
:root[data-theme="dark"] .cap-page .sec:not(.alt):not(.dark):not(.cap-cta){background:#060d16}
.cap-grid2{display:grid;grid-template-columns:1fr 1fr;gap:clamp(34px,5vw,72px);align-items:center}
@media(max-width:880px){.cap-grid2{grid-template-columns:1fr;gap:38px}}
/* marquee — dark, centered, visual below: reserved for the 1–2 hero capabilities */
.cap-grid2.marquee{grid-template-columns:1fr;gap:clamp(28px,4vw,46px);text-align:center;justify-items:center}
.cap-grid2.marquee>div:first-child{max-width:800px}
.cap-grid2.marquee .ce-shead{justify-content:center;flex-direction:column;align-items:center;gap:13px;text-align:center}
.cap-grid2.marquee .lead{margin-left:auto;margin-right:auto}
.cap-grid2.marquee .cap-feat{max-width:560px;margin:22px auto 0;text-align:left}
.cap-grid2.marquee>div:last-child{width:100%;max-width:900px}
.cap-grid2.marquee .cn-hub{max-width:520px;margin:0 auto}
.cap-page .sec.dark .lnk{color:var(--blue-bright)}
.cap-kchip{display:inline-flex;align-items:center;gap:8px;font:600 12px/1 var(--mono);color:var(--blue-action);background:var(--paper-3);padding:8px 13px;border-radius:999px;margin-bottom:16px}
.cap-page .sec.dark .cap-kchip{background:rgba(79,176,230,.14);color:var(--blue-bright)}
.cap-feat{list-style:none;margin-top:22px;display:flex;flex-direction:column;gap:13px}
.cap-feat li{display:flex;gap:12px;font-size:15px;color:var(--ink-soft);align-items:flex-start}
.cap-page .sec.dark .cap-feat li{color:#C5D6E5}
.cap-feat li .ck{flex:none;width:20px;height:20px;border-radius:50%;background:var(--paper-3);color:var(--blue-action);display:grid;place-items:center;font-size:11px;margin-top:1px}
.cap-page .sec.dark .cap-feat li .ck{background:rgba(79,176,230,.18);color:var(--blue-bright)}

/* feature trio */
.cap-trio{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:14px}
@media(max-width:840px){.cap-trio{grid-template-columns:1fr}}
.cap-card{background:var(--paper);border:1px solid var(--line);border-radius:16px;padding:24px;transition:transform .3s var(--ease),box-shadow .3s}
.cap-card:hover{transform:translateY(-4px);box-shadow:0 22px 44px -30px rgba(10,37,64,.38)}
.cap-card .ic{width:42px;height:42px;border-radius:12px;background:var(--paper-3);display:grid;place-items:center;color:var(--blue-action);font-size:18px;margin-bottom:15px}
.cap-card h4{font-size:17px;font-weight:700;letter-spacing:-.01em;margin-bottom:7px}
.cap-card p{font-size:13.5px;color:var(--ink-soft);line-height:1.5}

/* chat mock (Maya) */
.cap-chat{background:var(--paper);border:1px solid var(--line);border-radius:20px;padding:10px;box-shadow:0 36px 70px -44px rgba(10,37,64,.5)}
.cap-chat .q{display:flex;gap:10px;align-items:flex-start;padding:16px;border-bottom:1px solid var(--line-soft)}
.cap-chat .q .av{width:30px;height:30px;border-radius:50%;background:var(--paper-3);flex:none;display:grid;place-items:center;font:600 12px/1 var(--mono);color:var(--ink-soft)}
.cap-chat .q p{font-size:15px;color:var(--ink)}
.cap-chat .a{padding:18px 16px}
.cap-chat .a .who{display:flex;align-items:center;gap:9px;margin-bottom:12px}
.cap-chat .a .who .dot{width:26px;height:26px;border-radius:8px;background:linear-gradient(150deg,var(--cyan),var(--blue));display:grid;place-items:center;color:#fff;font:700 11px/1 var(--mono)}
.cap-chat .a .who img.dot{object-fit:cover}
.cap-chat .a .who b{font-size:13px}.cap-chat .a .who small{color:var(--muted);font:500 11px/1 var(--mono)}
.cap-chat .a .txt{font-size:14.5px;color:var(--ink-soft);line-height:1.6}.cap-chat .a .txt b{color:var(--ink)}
.cap-chat .tags{display:flex;gap:8px;margin-top:14px;flex-wrap:wrap}
.cap-chat .tags span{font:500 11px/1 var(--mono);color:var(--blue-action);background:var(--paper-3);padding:7px 11px;border-radius:8px}
.cap-chat .acts{display:flex;gap:8px;margin-top:14px;flex-wrap:wrap}
.cap-chat .acts a{font-size:13px;font-weight:600;color:#fff;background:var(--ink);padding:9px 14px;border-radius:9px;text-decoration:none}
.cap-chat .acts a.alt{background:var(--paper-3);color:var(--ink)}
.cap-chat .acts a{cursor:pointer}
:root[data-theme="dark"] .cap-chat .acts a{background:var(--blue-action);color:#06182b}
:root[data-theme="dark"] .cap-chat .acts a.alt{background:var(--paper-3);color:var(--ink)}

/* inline-styled Playbook action buttons (Vuln Scanning, ThreatStream cards) */
.pb-acts a{font-size:12px;font-weight:600;padding:8px 12px;border-radius:8px;text-decoration:none;cursor:pointer;background:var(--ink);color:var(--paper)}
.pb-acts a.alt{background:var(--paper-3);color:var(--ink)}
:root[data-theme="dark"] .pb-acts a{background:var(--blue-action);color:#06182b}
:root[data-theme="dark"] .pb-acts a.alt{background:var(--paper-3);color:var(--ink)}

/* steps */
.cap-steps{display:grid;grid-template-columns:repeat(4,1fr);gap:0;counter-reset:cst;margin-top:14px}
@media(max-width:840px){.cap-steps{grid-template-columns:1fr 1fr;gap:28px 0}}
.cap-step{position:relative;padding:0 24px}
.cap-step:not(:last-child)::after{content:'';position:absolute;right:0;top:18px;width:1px;height:calc(100% - 24px);background:rgba(255,255,255,.14)}
.cap-step .num{counter-increment:cst;font:500 12px/1 var(--mono);color:var(--blue-bright);margin-bottom:14px}
.cap-step .num::before{content:counter(cst,decimal-leading-zero)}
.cap-step h4{font-size:17px;font-weight:700;margin-bottom:7px;letter-spacing:-.01em;color:#fff}
.cap-step p{font-size:13.5px;color:#AFC6DA}

/* related */
.cap-rel{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:14px}
@media(max-width:840px){.cap-rel{grid-template-columns:1fr}}
.cap-rc{background:var(--paper);border:1px solid var(--line);border-radius:16px;padding:22px;text-decoration:none;color:inherit;transition:.25s;display:flex;flex-direction:column}
.cap-rc:hover{transform:translateY(-4px);box-shadow:0 22px 44px -30px rgba(10,37,64,.38);border-color:#cfe1f0}
.cap-rc .role{font:500 11px/1 var(--mono);color:var(--blue-action);margin-bottom:8px}
.cap-rc h4{font-size:17px;font-weight:700;letter-spacing:-.01em;margin-bottom:6px}
.cap-rc p{font-size:13px;color:var(--ink-soft);flex:1}
.cap-rc .go{margin-top:14px;font-size:13px;font-weight:600;color:var(--blue-action);display:inline-flex;gap:6px;align-items:center}
.cap-rc .go::after{content:'\2192';transition:transform .25s var(--ease)}
.cap-rc:hover .go::after{transform:translateX(4px)}

/* cta */
.cap-cta{background:linear-gradient(140deg,#0a2540,#06182b 60%,#072034);color:#fff;text-align:center;position:relative;overflow:hidden}
.cap-cta::before{content:'';position:absolute;inset:auto 50% -60% 50%;transform:translateX(-50%);width:760px;height:500px;border-radius:50%;background:radial-gradient(circle,rgba(46,151,215,.4),transparent 65%)}
.cap-cta .in{position:relative}
.cap-cta h2{color:#fff;max-width:18ch;margin:0 auto}
.cap-cta p{color:#AFC6DA;max-width:52ch;margin:20px auto 0;font-size:18px}
.cap-cta .cta{display:flex;gap:14px;justify-content:center;margin-top:32px;flex-wrap:wrap}

/* ===== Solution-page extras (Replaces badge, product callout) ===== */
.sol-replaces{display:inline-flex;align-items:center;gap:9px;font:500 12px/1 var(--mono);color:var(--ink-soft);background:var(--paper);border:1px solid var(--line);padding:9px 13px;border-radius:999px;margin-top:18px}
.sol-replaces s{color:var(--muted);text-decoration-color:#cdd9e5}
.sol-replaces b{color:var(--blue-action)}
.cap-page .sec.dark .sol-replaces{background:rgba(255,255,255,.05);border-color:rgba(79,176,230,.3);color:#C5D6E5}

.sol-product{display:flex;gap:18px;align-items:flex-start;background:var(--paper);border:1px solid var(--line);border-radius:18px;padding:24px;box-shadow:0 24px 50px -40px rgba(10,37,64,.4)}
.sol-product .badge{flex:none;display:flex;flex-direction:column;align-items:center;justify-content:center;width:84px;height:84px;border-radius:16px;background:linear-gradient(150deg,#0a2540,#06182b);color:#fff;text-align:center;padding:8px}
.sol-product .badge img{width:26px;height:26px;filter:brightness(0) invert(1);margin-bottom:6px}
.sol-product .badge span{font:600 9px/1.2 var(--mono);letter-spacing:.02em;color:var(--blue-bright)}
.sol-product .bd .k{font:500 11px/1 var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--blue-action)}
.sol-product .bd h4{font-size:19px;font-weight:800;letter-spacing:-.02em;margin:7px 0 8px}
.sol-product .bd p{font-size:14px;color:var(--ink-soft);line-height:1.55}
.sol-product .bd .lnk{margin-top:12px;font-size:13.5px}

.sol-unify{background:linear-gradient(120deg,#0a2540,#06182b);border-radius:20px;padding:36px;color:#fff;position:relative;overflow:hidden}
.sol-unify::after{content:'';position:absolute;right:-60px;top:-60px;width:220px;height:220px;border-radius:50%;background:radial-gradient(circle,rgba(46,151,215,.5),transparent 70%)}
.sol-unify .k{font:500 11px/1 var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--blue-bright);position:relative}
.sol-unify h3{font-size:24px;font-weight:800;letter-spacing:-.02em;margin:12px 0 10px;position:relative}
.sol-unify p{font-size:15px;color:#AFC6DA;max-width:60ch;position:relative}
.sol-unify .cta{margin-top:20px;display:flex;gap:12px;flex-wrap:wrap;position:relative}


/* ===== product ingest→analytics viz (.pv) ===== */
.pv{position:relative;background:linear-gradient(180deg,#0b2237,#06182b);border:1px solid rgba(79,176,230,.2);border-radius:18px;padding:16px;overflow:hidden;box-shadow:0 30px 60px -42px rgba(10,37,64,.5)}
.pv::after{content:'';position:absolute;inset:0;pointer-events:none;background:radial-gradient(60% 50% at 80% 0,rgba(22,190,220,.10),transparent 60%)}
.pv-hd{display:flex;align-items:center;gap:10px;margin-bottom:13px;position:relative;z-index:1}
.pv-nm{display:flex;align-items:center;gap:7px;font:700 12px/1 var(--sans);color:#fff}
.pv-nm img{width:16px;height:16px}
.pv-live{margin-left:auto;display:flex;align-items:center;gap:5px;font:600 9px/1 var(--mono);letter-spacing:.08em;color:var(--blue-bright)}
.pv-live i{width:6px;height:6px;border-radius:50%;background:var(--cyan);box-shadow:0 0 7px var(--cyan);animation:pvBlink 1.6s ease-in-out infinite}
@keyframes pvBlink{0%,100%{opacity:1}50%{opacity:.3}}
.pv-in{display:flex;flex-wrap:wrap;gap:6px;position:relative;z-index:1}
.pv-src{font:600 9.5px/1 var(--mono);color:#bcd3e6;background:rgba(255,255,255,.05);border:1px solid rgba(79,176,230,.28);padding:6px 9px;border-radius:6px;display:flex;align-items:center;gap:5px}
.pv-src::before{content:'';width:5px;height:5px;border-radius:50%;background:var(--blue-bright)}
.pv-stream{position:relative;height:28px;margin:3px 0;overflow:hidden}
.pv-stream i{position:absolute;top:-20%;width:1.4px;height:140%;background:linear-gradient(180deg,transparent,var(--blue-bright) 60%,var(--cyan));animation:pvFall 1.8s linear infinite}
@keyframes pvFall{0%{transform:translateY(-45%)}100%{transform:translateY(45%)}}
.pv-core{position:relative;z-index:1;text-align:center;font:600 10px/1.3 var(--mono);color:#fff;background:linear-gradient(120deg,rgba(22,190,220,.16),rgba(46,151,215,.08));border:1px solid rgba(22,190,220,.34);border-radius:9px;padding:9px;margin-bottom:11px}
.pv-core b{color:var(--blue-bright)}
.pv-out{position:relative;z-index:1;background:rgba(255,255,255,.035);border:1px solid rgba(79,176,230,.16);border-radius:11px;padding:12px}
.pv-cap{font:600 9px/1 var(--mono);letter-spacing:.1em;text-transform:uppercase;color:#6E8aa3;margin-bottom:10px;display:flex;justify-content:space-between}
.pv-cap b{color:var(--blue-bright);font-weight:600}
.pv-bars{display:flex;align-items:flex-end;gap:5px;height:72px}
.pv-bars i{flex:1;border-radius:3px 3px 0 0;background:linear-gradient(180deg,var(--cyan),var(--blue));transform-origin:bottom;animation:pvGrow .8s var(--ease) backwards}
.pv-bars i.hot{background:linear-gradient(180deg,#FF8A8D,#FF5A5D)}
.pv-bars i:nth-child(1){animation-delay:.05s}.pv-bars i:nth-child(2){animation-delay:.11s}.pv-bars i:nth-child(3){animation-delay:.17s}.pv-bars i:nth-child(4){animation-delay:.23s}.pv-bars i:nth-child(5){animation-delay:.29s}.pv-bars i:nth-child(6){animation-delay:.35s}.pv-bars i:nth-child(7){animation-delay:.41s}.pv-bars i:nth-child(8){animation-delay:.47s}
@keyframes pvGrow{from{transform:scaleY(0)}to{transform:scaleY(1)}}
.pv-line{position:relative;height:72px}
.pv-line svg{width:100%;height:100%;display:block;overflow:visible}
.pv-line .ar{fill:url(#pvg)}
.pv-line .ln{fill:none;stroke:var(--cyan);stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:420;stroke-dashoffset:420;animation:pvDraw 1.6s var(--ease) .2s forwards}
@keyframes pvDraw{to{stroke-dashoffset:0}}
.pv-foot{display:flex;align-items:center;gap:8px;margin-top:11px}
.pv-stat{flex:1;background:rgba(255,255,255,.04);border:1px solid rgba(79,176,230,.16);border-radius:8px;padding:8px 9px}
.pv-stat .v{font:800 14px/1 var(--sans);letter-spacing:-.02em;color:#fff}
.pv-stat .l{font:500 8.5px/1 var(--mono);letter-spacing:.06em;text-transform:uppercase;color:#7C93A6;margin-top:4px}
.pv-chip{font:600 9px/1.1 var(--mono);color:#ffd0d1;background:rgba(255,107,110,.14);border:1px solid rgba(255,107,110,.34);padding:8px 10px;border-radius:7px;white-space:nowrap}
@media(prefers-reduced-motion:reduce){.pv-live i,.pv-stream i,.pv-bars i{animation:none}.pv-line .ln{animation:none;stroke-dashoffset:0}.pv-bars i{transform:none}}