/* NonaShield brand layer. Palette sampled from the logo:
   royal blue, near-black navy, aqua and ice blue, on white. Geometric sans to match the wordmark.
   Loaded after tailwind.css and each page's own styles; overrides only. */
:root{
  --royal:#0A16A0;      /* logo deep blue: accents, links, primary actions */
  --royal-2:#1E2FD0;    /* hover */
  --navy:#02073F;       /* logo black-blue: text and dark surfaces (replaces pure black) */
  --navy-2:#04094F;
  --navy-3:#04106B;
  --aqua:#6FE3E1;       /* logo light cyan: accents on dark */
  --aqua-deep:#0E9C98;
  --ice:#E5F9F8;        /* logo pale cyan: light tint */
  --pale:#E8EDFF;       /* pale royal tint */
  --mute:#4A5278;
  --hair:rgba(2,7,63,.09);
  --ease:cubic-bezier(0.32,0.72,0,1);
  --pure-black:var(--navy); --accent-blue:var(--royal); --accent:var(--royal); --gold:var(--royal);
  --blue:var(--royal);
}
html{scroll-behavior:smooth}
body{font-family:'Plus Jakarta Sans',system-ui,sans-serif;color:var(--navy)}
::selection{background:var(--royal);color:#fff}
:focus-visible{outline:2px solid var(--royal);outline-offset:3px;border-radius:6px}

/* ---- Type: geometric sans like the wordmark, wide-tracked caps like the tagline ---- */
h1,h2,.hero-title,h2[class*="font-black"]{
  font-family:'Plus Jakarta Sans',system-ui,sans-serif;font-weight:700;
  text-transform:none;letter-spacing:-0.03em;line-height:1.06
}
.hero-title{font-weight:700;line-height:1.04;letter-spacing:-0.035em}
@media(min-width:1024px){.hero-title{font-size:clamp(2.8rem,4.4vw,4.6rem)}}
h2[class*="text-4xl"],h2[class*="text-5xl"]{font-size:clamp(2.3rem,4.8vw,3.9rem)}
h1[class*="text-6xl"],h1[class*="text-8xl"]{font-size:clamp(2.8rem,6.6vw,5.4rem)}
.premium-shield{letter-spacing:.32em}

/* ---- Palette: every blue, cyan, amber, green and black maps to the logo ---- */
.text-black,.text-gray-900{color:var(--navy)}
.bg-black,.bg-gray-900,[class*="bg-[#02073F]"]{background-color:var(--navy)}
.bg-gray-800{background-color:var(--navy-2)}
.text-gray-500,.text-gray-600{color:var(--mute)}
.text-blue-600,.text-blue-500,.text-blue-700,.text-amber-600,.text-amber-700,.hover\:text-blue-600:hover{color:var(--royal)}
.text-blue-400,.text-blue-300,.text-cyan-400,.text-cyan-300,.text-green-400,.text-emerald-400,.text-amber-400,.hover\:text-blue-400:hover{color:var(--aqua)}
.bg-blue-600,.bg-blue-500{background-color:var(--royal)}
.bg-blue-50,.bg-blue-50\/50,.bg-blue-50\/40{background-color:var(--pale)}
.bg-blue-500\/5,.bg-blue-500\/10{background-color:rgba(10,22,160,.08)}
.bg-amber-50,.bg-yellow-500\/10{background-color:var(--pale)}
.bg-green-500,.bg-emerald-500,.bg-yellow-500{background-color:var(--aqua)}
.border-blue-100,.border-blue-300,.border-blue-500\/20,.border-blue-500\/30,.border-amber-300,.border-amber-400\/60,.hover\:border-blue-500:hover{border-color:rgba(10,22,160,.25)}
.border-blue-500{border-color:var(--royal)}
.from-cyan-400{--tw-gradient-from:#6FE3E1 var(--tw-gradient-from-position);--tw-gradient-to:rgb(111 227 225 / 0) var(--tw-gradient-to-position);--tw-gradient-stops:var(--tw-gradient-from),var(--tw-gradient-to)}
.to-blue-500{--tw-gradient-to:#6FE3E1 var(--tw-gradient-to-position)}
.hover\:bg-blue-600:hover{background:var(--royal)!important;color:#fff!important}

/* Status colours stay inside the palette: positive is aqua, highlights are royal */
.text-green-600,.text-emerald-600,.text-emerald-700,.text-teal-600,.text-teal-700,.text-teal-800{color:var(--aqua-deep)}
.bg-emerald-50,.bg-emerald-100,.bg-teal-50{background-color:var(--ice)}
.bg-amber-100{background-color:var(--pale)}
.bg-emerald-400{background-color:var(--aqua)}
.border-teal-500,.ring-teal-500{border-color:var(--aqua-deep);--tw-ring-color:var(--aqua-deep)}

/* On dark surfaces the royal accent switches to aqua so it stays legible */
.hero-dark .text-blue-600,[class*="bg-black"] .text-blue-600,[class*="bg-[#02073F]"] .text-blue-600,[class*="bg-[#04094F]"] .text-blue-600,[data-theme="dark"] .text-blue-600,[data-theme="dark"] .text-blue-500{color:var(--aqua)}
.premium-shield{color:var(--royal)}
.hero-dark .premium-shield,[data-theme="dark"] .premium-shield,[class*="bg-black"] .premium-shield{color:var(--aqua)}

/* Dark briefs keep their dark layout, in brand navy */
[data-theme="dark"]{--bg-black:var(--navy); --apple-black:var(--navy); --apple-gray:var(--navy-2); --card-gray:var(--navy-2);
  --apple-blue:var(--aqua); --accent-blue:var(--aqua); --accent:var(--aqua); --apple-white:#fff; --text-white:#fff; --border:rgba(111,227,225,.22)}

/* ---- Surfaces ---- */
.hero-dark{background:linear-gradient(165deg,#01032A 0%,var(--navy) 55%,var(--navy-3) 100%)}
.hero-fade-base{background:linear-gradient(180deg,transparent 0%,#fff 100%)}
.hero-dark .hero-title,[data-theme="dark"] .hero-title{background:linear-gradient(180deg,#FFFFFF 30%,var(--ice) 100%);-webkit-background-clip:text;background-clip:text}
.hero-title{background:linear-gradient(180deg,var(--navy) 20%,var(--navy-3) 100%);-webkit-background-clip:text;background-clip:text}
.border-gray-100,.border-gray-200,.border-y,.border-t{border-color:var(--hair)}
[class*="blur-[120px]"]{display:none}

/* Cards: soft ambient depth instead of hard borders */
[class*="rounded-[2rem]"],[class*="rounded-[2.5rem]"],[class*="rounded-[3rem]"],[class*="rounded-[1.5rem]"]{
  box-shadow:inset 0 1px 0 rgba(255,255,255,.7),0 28px 60px -36px rgba(2,7,63,.22);
  transition:box-shadow .7s var(--ease),border-color .7s var(--ease)
}
[class*="rounded-[2rem]"]:hover,[class*="rounded-[2.5rem]"]:hover{
  box-shadow:inset 0 1px 0 rgba(255,255,255,.8),0 36px 70px -34px rgba(10,22,160,.3);
  border-color:rgba(10,22,160,.3)
}
.bg-black[class*="rounded-[2"],.hero-dark [class*="rounded-[2"],[data-theme="dark"] [class*="rounded-[2"]{box-shadow:0 30px 70px -40px rgba(0,0,0,.6)}

/* Nav island */
nav .glass-dock{border:1px solid rgba(10,22,160,.16);box-shadow:0 18px 50px -30px rgba(2,7,63,.35)}

/* Buttons: flat 8px, smooth colour change, pressed-in on click */
a[class*="rounded-full"],button[class*="rounded-full"]{
  transition:background-color .6s var(--ease),color .6s var(--ease),transform .5s var(--ease),box-shadow .6s var(--ease)
}
a[class*="rounded-full"][class*="py-"],button[class*="rounded-full"][class*="py-"]{border-radius:8px}
a[class*="bg-black"][class*="rounded-full"]:hover,button[class*="bg-black"][class*="rounded-full"]:hover{background-color:var(--royal);color:#fff;box-shadow:0 14px 30px -16px rgba(10,22,160,.7)}
a.rounded-full:active,button.rounded-full:active{transform:scale(.98)}

/* Icon chips and stats */
.icon-chip--light{background:var(--pale);color:var(--royal)}
.icon-chip--dark{background:rgba(111,227,225,.14);color:var(--aqua)}
.stat-number{background:linear-gradient(180deg,var(--navy) 0%,var(--royal) 130%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
[data-theme="dark"] .stat-number{background:linear-gradient(180deg,#fff 0%,var(--aqua) 100%);-webkit-background-clip:text;background-clip:text}

/* Footer */
.ns-footer{font-family:'Plus Jakarta Sans',system-ui,sans-serif}
.ns-footer a:hover{color:var(--royal)}

/* Room to breathe, and the screen used well */
section[class*="py-16"],section[class*="py-20"],section[class*="py-24"]{padding-top:6.5rem;padding-bottom:6.5rem}
section[id] > .container{max-width:80rem}
#solution .max-w-4xl{max-width:66rem}
section[id][class*="py-"]{padding-top:clamp(4.25rem,6.5vw,6rem);padding-bottom:clamp(4.25rem,6.5vw,6rem)}

/* ---- Product visuals as clean panels ---- */
#solution .group[class*="bg-black"][class*="rounded-2xl"],
#live-soc-24hours [class*="from-slate-800"]{
  position:relative;background:#fff!important;background-image:none!important;
  border:1px solid rgba(2,7,63,.1)!important;border-radius:18px!important;
  box-shadow:0 30px 60px -36px rgba(2,7,63,.3)!important;padding-top:2.5rem!important
}
#solution .group[class*="bg-black"][class*="rounded-2xl"]::before,
#live-soc-24hours [class*="from-slate-800"]::before{
  content:"";position:absolute;left:16px;top:14px;width:48px;height:10px;
  background:radial-gradient(circle at 5px 5px,#C9D2F2 4px,transparent 4.5px) 0 0/16px 10px repeat-x
}
#solution .group[class*="bg-black"] > div{background:#F4F6FF!important;border-radius:12px}
#live-soc-24hours [class*="from-slate-800"] .text-cyan-400{color:var(--royal)}
#live-soc-24hours [class*="from-slate-800"] [class*="border-white"]{border-color:rgba(2,7,63,.1)!important}
#live-soc-24hours [class*="radial-gradient(#0A16A0"]{display:none}
#live-soc-24hours [class*="from-slate-800"]{max-width:44rem!important;width:100%}
#live-soc-24hours [class*="from-slate-800"] [class*="aspect-video"]{position:relative}
#live-soc-24hours [class*="from-slate-800"] [class*="aspect-video"]::after{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(100deg,transparent 38%,rgba(111,227,225,.22) 50%,transparent 62%);
  transform:translateX(-100%);animation:soc-sweep 5s var(--ease) infinite}
@keyframes soc-sweep{to{transform:translateX(100%)}}

/* Mobile videos in a phone */
.video-portrait-card{max-width:310px;padding:11px;background:var(--navy);border:0;border-radius:44px;position:relative;
  box-shadow:0 44px 80px -40px rgba(2,7,63,.6),inset 0 0 0 2px #0B1470}
.video-portrait-card::before{content:"";position:absolute;top:15px;left:50%;width:86px;height:22px;transform:translateX(-50%);background:var(--navy);border-radius:14px;z-index:2;pointer-events:none}
.video-portrait-card video{border-radius:34px;background:#000}

/* ---- Moving compliance strip: dark blue, light blue and navy ---- */
.proof-row{background:#fff;padding:3.25rem 0 2.5rem;border-bottom:1px solid var(--hair)}
.proof-inner{max-width:64rem;margin:0 auto;text-align:center;padding:0 1.5rem}
.proof-label{font-size:.72rem;letter-spacing:.22em;text-transform:uppercase;font-weight:700;color:var(--mute);margin:0 0 1.25rem}
.proof-note{margin:1rem 0 0;font-size:.72rem;color:#7A83A6}
.reg-marquee{overflow:hidden;margin:0 auto;max-width:100%;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent);mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent)}
.reg-track{display:flex;gap:1.25rem;width:max-content;list-style:none;margin:0;padding:.75rem 0;animation:reg-scroll 36s linear infinite}
.reg-marquee:hover .reg-track{animation-play-state:paused}
@keyframes reg-scroll{to{transform:translateX(-50%)}}
.reg{display:flex;flex-direction:column;gap:.3rem;min-width:19rem;padding:1.25rem 1.75rem;border-radius:16px;border:1px solid;
  transition:transform .6s var(--ease),box-shadow .6s var(--ease)}
.reg:hover{transform:translateY(-3px);box-shadow:0 22px 40px -26px rgba(2,7,63,.5)}
.reg-name{font-weight:800;font-size:2rem;letter-spacing:.12em;line-height:1}
.reg-label{font-size:.8rem;font-weight:600;letter-spacing:.02em;opacity:.9}
.reg-rbi{background:var(--royal);color:#fff;border-color:var(--royal)}
.reg-npci{background:var(--ice);color:var(--royal);border-color:#B7EFEC}
.reg-sebi{background:var(--navy);color:var(--aqua);border-color:var(--navy)}
.reg-pci{background:#fff;color:var(--navy);border-color:var(--navy)}
.reg-dpdp{background:var(--aqua);color:var(--navy);border-color:var(--aqua)}

@media(prefers-reduced-motion:reduce){*{transition-duration:.01ms!important;scroll-behavior:auto!important}.reg-track{animation:none}#live-soc-24hours [class*="aspect-video"]::after{animation:none}}
@media(max-width:640px){.reg{min-width:15rem;padding:1rem 1.25rem}.reg-name{font-size:1.6rem}}

/* ---- 3D exploded view of the nine layers ---- */
.iso{position:relative;height:44rem;perspective:1600px;display:flex;justify-content:center;align-items:center;overflow:visible}
.iso-stage{position:relative;width:32rem;height:19rem;transform-style:preserve-3d;margin-top:0;top:8.5rem;
  transform:rotateX(58deg) rotateZ(-38deg);animation:iso-spin 26s cubic-bezier(0.45,0,0.55,1) infinite alternate}
@keyframes iso-spin{from{transform:rotateX(58deg) rotateZ(-46deg)}to{transform:rotateX(58deg) rotateZ(-30deg)}}
.iso-plate{position:absolute;inset:0;border-radius:20px;transform:translateZ(calc(var(--i)*46px));
  background:linear-gradient(135deg,rgba(255,255,255,.96),rgba(232,237,255,.9));
  border:1px solid rgba(10,22,160,.28);box-shadow:0 38px 50px -26px rgba(2,7,63,.38),inset 0 1px 0 #fff}
.iso-plate:nth-child(9){background:linear-gradient(135deg,#1B2BD0,var(--royal));border-color:var(--royal)}
.iso-plate:nth-child(9) span{color:#fff}
.iso-plate:nth-child(1){background:linear-gradient(135deg,#E5F9F8,#CFF4F2)}
.iso-plate span{position:absolute;left:1.3rem;bottom:1rem;right:1.2rem;font-size:.7rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--navy);line-height:1.3}
.iso-plate::before{content:"";position:absolute;right:1rem;top:1rem;width:.55rem;height:.55rem;border-radius:50%;background:var(--royal);opacity:.55}
.iso-plate::after{content:"";position:absolute;inset:-1px;border-radius:inherit;pointer-events:none;opacity:0;
  box-shadow:0 0 0 2px var(--aqua),0 0 42px 8px rgba(111,227,225,.6)}
.iso-caption{text-align:center;font-size:.78rem;color:var(--mute);margin:0}
@media(max-width:700px){.iso{height:24rem}.iso-stage{width:16.5rem;height:10rem;top:5.4rem}.iso-plate{transform:translateZ(calc(var(--i)*32px))}.iso-plate.is-active{transform:translateZ(calc(var(--i)*32px + 22px))}.iso-plate span{font-size:.58rem}}

/* ---- Illustrative live decision stream ---- */
.live-feed{margin-top:1rem;padding-top:.95rem;border-top:1px solid rgba(2,7,63,.09);text-align:left}
.live-feed-head{display:flex;align-items:center;gap:.55rem;font-size:.68rem;font-weight:800;letter-spacing:.18em;text-transform:uppercase;color:var(--navy)}
.live-feed-head em{margin-left:auto;font-style:normal;font-weight:700;letter-spacing:.08em;padding:.18rem .6rem;border-radius:999px;background:var(--pale);color:var(--royal)}
.live-dot{width:.5rem;height:.5rem;border-radius:50%;background:var(--aqua-deep);box-shadow:0 0 0 0 rgba(14,156,152,.5);animation:live-pulse 2.2s cubic-bezier(0.32,0.72,0,1) infinite}
@keyframes live-pulse{0%{box-shadow:0 0 0 0 rgba(14,156,152,.5)}70%{box-shadow:0 0 0 9px rgba(14,156,152,0)}100%{box-shadow:0 0 0 0 rgba(14,156,152,0)}}
.live-feed-list{list-style:none;margin:.7rem 0 0;padding:0;display:flex;flex-direction:column;gap:.4rem;min-height:11.6rem}
.lf-row{display:grid;grid-template-columns:4.7rem 1fr auto;align-items:center;gap:.7rem;padding:.55rem .75rem;border-radius:10px;background:#F4F6FF;
  animation:lf-in .8s cubic-bezier(0.32,0.72,0,1) both}
@keyframes lf-in{from{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:none}}
.lf-tag{font-size:.62rem;font-weight:800;letter-spacing:.12em;text-align:center;padding:.22rem 0;border-radius:6px}
.lf-allow .lf-tag{background:var(--ice);color:#0B7A77}
.lf-stepup .lf-tag{background:var(--pale);color:var(--royal)}
.lf-block .lf-tag{background:var(--navy);color:#fff}
.lf-msg{font-size:.8rem;font-weight:600;color:var(--navy)}
.lf-id{font-size:.68rem;color:#7A83A6;font-variant-numeric:tabular-nums}
.live-feed-note{margin:.7rem 0 0;font-size:.68rem;color:#7A83A6}

@media(prefers-reduced-motion:reduce){.iso-stage,.iso-plate::after,.live-dot,.lf-row{animation:none}.iso-stage{transform:rotateX(58deg) rotateZ(-38deg)}}

@media(max-width:640px){
  .lf-row{grid-template-columns:4rem 1fr;gap:.55rem;padding:.5rem .6rem}
  .lf-id{display:none}
  .lf-msg{font-size:.74rem}
  .live-feed-head{flex-wrap:wrap}
  .live-feed-head em{margin-left:0}
  .live-feed-list{min-height:10.4rem}
}

/* ---- Interactive 3D layers: hover, focus or tap a plate for the detail panel ---- */
.iso-grid{display:grid;gap:1.5rem;align-items:center;padding-top:1rem}
@media(min-width:900px){.iso-grid{grid-template-columns:minmax(0,1.45fr) minmax(0,.75fr);gap:2rem}}
.iso-plate{cursor:pointer;transition:transform .7s var(--ease),opacity .6s var(--ease)}
.iso-plate:focus-visible{outline:none}
.iso-plate::after{transition:opacity .6s var(--ease)}
.iso-plate.is-active{transform:translateZ(calc(var(--i)*46px + 34px))}
.iso-plate.is-active::after{opacity:1}
.iso-wrap.has-active .iso-plate:not(.is-active){opacity:.8}
.iso-stage:has(.iso-plate:hover){animation-play-state:paused}
.iso-panel{background:#fff;border:1px solid rgba(2,7,63,.1);border-radius:20px;padding:1.6rem 1.7rem 1.8rem;box-shadow:0 30px 60px -38px rgba(2,7,63,.3);min-height:39rem;display:flex;flex-direction:column}
.iso-hint{margin:0 0 1.2rem;padding-bottom:1rem;border-bottom:1px dashed rgba(2,7,63,.14);font-size:.8rem;line-height:1.55;color:var(--mute)}
.iso-details{display:grid;margin:auto 0}
.iso-detail{grid-area:1/1;visibility:hidden;opacity:0;transform:translateY(8px);transition:opacity .2s var(--ease),transform .2s var(--ease),visibility 0s linear .2s}
.iso-detail.is-on{visibility:visible;opacity:1;transform:none;transition:opacity .45s var(--ease) .2s,transform .45s var(--ease) .2s,visibility 0s linear .2s}
.iso-num{display:inline-block;font-size:.66rem;font-weight:800;letter-spacing:.2em;text-transform:uppercase;color:var(--royal);background:var(--pale);padding:.25rem .7rem;border-radius:999px}
.iso-detail h3{margin:.8rem 0 .9rem;font-size:1.5rem;font-weight:700;letter-spacing:-.02em;color:var(--navy);line-height:1.15}
.iso-detail h4{margin:1rem 0 .35rem;font-size:.66rem;font-weight:800;letter-spacing:.2em;text-transform:uppercase;color:#7A83A6}
.iso-detail p{margin:0;font-size:.95rem;line-height:1.6;color:var(--mute)}
.iso-tags{list-style:none;margin:.2rem 0 0;padding:0;display:flex;flex-wrap:wrap;gap:.45rem}
.iso-tags li{font-size:.76rem;font-weight:600;padding:.38rem .8rem;border-radius:999px;background:var(--ice);color:#0B6F6C;border:1px solid #B7EFEC}

@media(max-width:899px){.iso-panel{min-height:0}}

/* ---- Layer panel tagline ---- */
.iso-tagline{margin:-.3rem 0 .2rem!important;font-weight:600;color:var(--royal)!important;font-size:.95rem!important}
.iso-caption{max-width:46rem;margin:0 auto;line-height:1.6}

/* ---- Identity and location: rotating earth ---- */
.idl{background:var(--navy);color:#fff;padding:clamp(4.5rem,8vw,7.5rem) 0}
.idl-grid{display:grid;gap:3rem;align-items:center}
@media(min-width:1000px){.idl-grid{grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);gap:4rem}}
.idl-eyebrow{display:inline-block;font-family:'Syncopate',sans-serif;font-size:.7rem;letter-spacing:.3em;text-transform:uppercase;color:var(--aqua);margin-bottom:1.1rem}
.idl-h2{font-size:clamp(2.4rem,5vw,4.1rem);line-height:1.04;color:#fff;margin:0 0 1.2rem}
.idl-lead{font-size:1.05rem;line-height:1.65;color:#C6CCEB;max-width:36rem;margin:0 0 1.8rem}
.idl-cards{display:grid;gap:1rem;max-width:36rem}
.idl-card{display:block;position:relative;padding:1.15rem 1.3rem 1.2rem 3rem;border-radius:18px;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.12);color:#fff;text-decoration:none;
  transition:border-color .6s var(--ease),transform .6s var(--ease),background-color .6s var(--ease)}
.idl-card:hover{border-color:rgba(111,227,225,.6);background:rgba(255,255,255,.08);transform:translateY(-3px)}
.idl-card h3{margin:0 0 .3rem;font-size:1.15rem;font-weight:700;color:#fff}
.idl-card p{margin:0 0 .6rem;font-size:.9rem;line-height:1.55;color:#C6CCEB}
.idl-more{font-size:.78rem;font-weight:700;color:var(--aqua);letter-spacing:.02em}
.idl-card .idl-dot{position:absolute;left:1.2rem;top:1.45rem}
.idl-dot{display:inline-block;width:.7rem;height:.7rem;border-radius:50%}
.idl-dot-id{background:#8FA0FF;box-shadow:0 0 0 4px rgba(143,160,255,.22)}
.idl-dot-loc{background:var(--aqua);box-shadow:0 0 0 4px rgba(111,227,225,.22)}
.idl-legend{display:flex;gap:1.6rem;list-style:none;margin:1.4rem 0 0;padding:0;font-size:.78rem;font-weight:600;color:#C6CCEB}
.idl-legend li{display:flex;align-items:center;gap:.5rem}
.idl-legend .idl-dot{width:.6rem;height:.6rem}
.idl-note{margin:.7rem 0 0;font-size:.72rem;color:#8C94BD}
.idl-globe{position:relative;width:100%;max-width:38rem;margin:0 auto;aspect-ratio:1}
.idl-globe canvas{width:100%;height:100%;display:block}

/* ---- Top threat origins (sample data) ---- */
.idl-grid{align-items:start}
@media(min-width:1000px){.idl-grid{grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr)}}
.idl-right{display:flex;flex-direction:column;gap:1.2rem;min-width:0}
.idl-top{border:1px solid rgba(255,255,255,.12);border-radius:18px;background:rgba(255,255,255,.04);padding:1rem 1.1rem 1.1rem}
.idl-top-head{display:flex;align-items:center;justify-content:space-between;gap:.6rem;margin-bottom:.7rem;font-size:.68rem;font-weight:800;letter-spacing:.18em;text-transform:uppercase;color:#fff}
.idl-top-head em{font-style:normal;font-weight:700;letter-spacing:.08em;padding:.2rem .65rem;border-radius:999px;background:rgba(111,227,225,.16);color:var(--aqua)}
.idl-top-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:.3rem}
.idl-row{display:grid;grid-template-columns:1.3rem 6.2rem minmax(0,1fr) 5rem;align-items:center;gap:.7rem;padding:.5rem .6rem;border-radius:10px;border-left:2px solid transparent;cursor:pointer;
  transition:background-color .5s var(--ease),border-color .5s var(--ease)}
.idl-row:hover,.idl-row.is-on{background:rgba(255,255,255,.07)}
.idl-row.is-on{border-left-color:var(--aqua)}
.idl-row:focus-visible{outline:2px solid var(--aqua);outline-offset:1px}
.idl-rank{font-size:.7rem;font-weight:800;color:#8C94BD;font-variant-numeric:tabular-nums}
.idl-place{font-size:.84rem;font-weight:700;color:#fff}
.idl-threat{font-size:.78rem;color:#C6CCEB;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.idl-bar{height:.38rem;border-radius:99px;background:rgba(255,255,255,.1);overflow:hidden}
.idl-bar i{display:block;height:100%;border-radius:99px}
.idl-row.idl-id .idl-bar i{background:#8FA0FF}
.idl-row.idl-loc .idl-bar i{background:var(--aqua)}
.idl-top-note{margin:.8rem 0 0;font-size:.7rem;color:#8C94BD;line-height:1.5}
@media(max-width:640px){.idl-row{grid-template-columns:1.1rem 5.2rem minmax(0,1fr);gap:.5rem}.idl-bar{display:none}.idl-threat{font-size:.72rem}}

/* ---- Dynamic threat table ---- */
.idl-top-head{flex-wrap:wrap}
.idl-tabs{display:inline-flex;gap:.25rem;padding:.2rem;border-radius:999px;background:rgba(255,255,255,.07)}
.idl-tabs button{font:inherit;font-size:.66rem;font-weight:700;letter-spacing:.08em;text-transform:none;color:#C6CCEB;background:transparent;border:0;padding:.32rem .8rem;border-radius:999px;cursor:pointer;
  transition:background-color .5s var(--ease),color .5s var(--ease)}
.idl-tabs button:hover{color:#fff}
.idl-tabs button.is-on{background:var(--aqua);color:var(--navy)}
.idl-row{grid-template-columns:1.3rem 6.2rem minmax(0,1fr) 5rem 3.2rem}
.idl-count{font-size:.78rem;font-weight:700;color:#fff;text-align:right;font-variant-numeric:tabular-nums}
.idl-bar i{transition:width .9s var(--ease)}
.idl-top-list{transition:opacity .24s var(--ease),transform .24s var(--ease)}
.idl-top-list.is-out{opacity:0;transform:translateY(8px)}
.idl-row.is-in{animation:idl-in .7s cubic-bezier(0.32,0.72,0,1) both;animation-delay:var(--d,0ms)}
@keyframes idl-in{from{opacity:0;transform:translateX(-12px)}to{opacity:1;transform:none}}
.idl-bar i{transform-origin:left}
.idl-row.is-in .idl-bar i{animation:idl-grow .9s cubic-bezier(0.32,0.72,0,1) both;animation-delay:calc(var(--d,0ms) + 120ms)}
@keyframes idl-grow{from{transform:scaleX(0)}to{transform:scaleX(1)}}
.idl-foot{margin:.8rem 0 0;font-size:.72rem;color:#8C94BD}
@media(max-width:640px){.idl-row{grid-template-columns:1.1rem 5.2rem minmax(0,1fr) 2.8rem}.idl-bar{display:none}.idl-tabs button{padding:.3rem .6rem}}
@media(prefers-reduced-motion:reduce){.idl-row.is-in,.idl-row.is-in .idl-bar i{animation:none}}

/* ---- Nav: Use Cases dropdown with the 13 industry brochures ---- */
.dd-panel .glass-dock::-webkit-scrollbar{width:6px}
.dd-panel .glass-dock::-webkit-scrollbar-thumb{background:rgba(2,7,63,.18);border-radius:6px}

/* ---- Six critical threats ---- */
.thr{background:#fff;padding:clamp(4.5rem,8vw,7rem) 0;border-top:1px solid var(--hair)}
.thr-head{max-width:52rem;margin:0 auto 3rem;text-align:center}
.thr-eyebrow{display:inline-block;font-family:'Syncopate',sans-serif;font-size:.7rem;letter-spacing:.3em;text-transform:uppercase;color:var(--royal);margin-bottom:1rem}
.thr-h2{font-size:clamp(2.2rem,4.6vw,3.7rem);line-height:1.06;color:var(--navy);margin:0 0 1rem}
.thr-sub{font-size:1.05rem;line-height:1.6;color:var(--mute);margin:0}
.thr-grid{display:grid;gap:1.4rem}
@media(min-width:720px){.thr-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(min-width:1100px){.thr-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
.thr-card{position:relative;background:#fff;border:1px solid rgba(2,7,63,.1);border-radius:22px;padding:1.7rem 1.6rem 1.5rem;box-shadow:0 30px 60px -40px rgba(2,7,63,.28);
  transition:transform .7s var(--ease),box-shadow .7s var(--ease),border-color .7s var(--ease)}
.thr-card:hover{transform:translateY(-4px);border-color:rgba(10,22,160,.3);box-shadow:0 38px 70px -38px rgba(10,22,160,.35)}
.thr-num{position:absolute;top:1.3rem;right:1.4rem;font-size:.72rem;font-weight:800;letter-spacing:.2em;color:#9AA3C6}
.thr-card h3{margin:0 2rem .9rem 0;font-size:1.28rem;font-weight:700;letter-spacing:-.02em;line-height:1.2;color:var(--navy)}
.thr-card h4{margin:1rem 0 .3rem;font-size:.64rem;font-weight:800;letter-spacing:.2em;text-transform:uppercase;color:#7A83A6}
.thr-card h4.thr-how{color:var(--royal)}
.thr-card p{margin:0;font-size:.92rem;line-height:1.6;color:var(--mute)}
.thr-chips{list-style:none;margin:1rem 0 0;padding:0;display:flex;flex-wrap:wrap;gap:.4rem}
.thr-chips li{font-size:.7rem;font-weight:700;padding:.3rem .7rem;border-radius:999px;background:var(--pale);color:var(--royal)}

/* ---- Live SOC dashboard: image links to the video ---- */
.soc-play-link{display:block;position:relative;width:100%;height:100%;border-radius:inherit}
.soc-play{position:absolute;left:50%;top:50%;width:4.2rem;height:4.2rem;margin:-2.1rem 0 0 -2.1rem;border-radius:50%;background:rgba(2,7,63,.78);border:1px solid rgba(111,227,225,.7);
  box-shadow:0 0 0 0 rgba(111,227,225,.5);animation:soc-ring 2.6s cubic-bezier(0.32,0.72,0,1) infinite;transition:transform .6s var(--ease),background-color .6s var(--ease)}
.soc-play::after{content:"";position:absolute;left:50%;top:50%;margin:-.55rem 0 0 -.3rem;border-left:1.05rem solid #fff;border-top:.65rem solid transparent;border-bottom:.65rem solid transparent}
.soc-play-link:hover .soc-play{transform:scale(1.08);background:rgba(10,22,160,.9)}
@keyframes soc-ring{0%{box-shadow:0 0 0 0 rgba(111,227,225,.5)}70%{box-shadow:0 0 0 18px rgba(111,227,225,0)}100%{box-shadow:0 0 0 0 rgba(111,227,225,0)}}
@media(prefers-reduced-motion:reduce){.soc-play{animation:none}}