@import url("./storm-iso27001.css");

body[data-page="nistcsf"] .isms-hero {
  background:
    radial-gradient(circle at 81% 14%,rgba(85,153,255,.24),transparent 29%),
    radial-gradient(circle at 61% 89%,rgba(39,121,255,.28),transparent 34%),
    linear-gradient(135deg,#131827,#1d2a45 63%,#17243e);
}

.nist-wheel {
  position: relative;
  min-height: 500px;
  padding: 24px;
  border: 1px solid rgba(206,222,249,.2);
  border-radius: 30px;
  background: rgba(255,255,255,.06);
  box-shadow: 0 34px 74px rgba(0,0,0,.29);
  backdrop-filter: blur(18px);
  overflow: hidden;
}

.nist-wheel-head {
  position: relative;
  z-index: 4;
  display: flex;
  align-items: center;
  justify-content: space-between;
  color: #c9d7eb;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.nist-wheel-head span:last-child { color: #82b3ff; }
.nist-wheel-stage { position: relative; min-height: 410px; }

.nist-wheel-orbit {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 320px;
  height: 320px;
  border: 1px dashed rgba(113,169,255,.42);
  border-radius: 50%;
  box-shadow: inset 0 0 0 47px rgba(255,255,255,.024),0 0 75px rgba(39,121,255,.14);
  transform: translate(-50%,-50%);
  animation: nist-orbit-turn 28s linear infinite;
}

.nist-wheel-orbit::before,
.nist-wheel-orbit::after {
  position: absolute;
  content: "";
  border-radius: 50%;
}

.nist-wheel-orbit::before { inset: 56px; border: 1px solid rgba(126,175,255,.31); }
.nist-wheel-orbit::after { top: -7px; left: 153px; width: 13px; height: 13px; background: #4f91ff; box-shadow: 0 0 0 8px rgba(79,145,255,.15); }

.nist-wheel-centre {
  position: absolute;
  top: 50%;
  left: 50%;
  z-index: 3;
  width: 152px;
  height: 152px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  color: #fff;
  text-align: center;
  background: linear-gradient(145deg,#3182ff,#174fa8);
  box-shadow: 0 20px 50px rgba(12,57,136,.4);
  transform: translate(-50%,-50%);
}

.nist-wheel-centre strong { display: block; font-size: 24px; letter-spacing: -.045em; }
.nist-wheel-centre small { display: block; max-width: 105px; margin-top: 5px; color: #cfe0ff; font-size: 9px; line-height: 1.3; letter-spacing: .1em; text-transform: uppercase; }

.nist-wheel-node {
  position: absolute;
  z-index: 3;
  min-width: 112px;
  padding: 11px 13px;
  border: 1px solid rgba(199,220,251,.22);
  border-radius: 14px;
  color: #fff;
  background: rgba(18,25,42,.93);
  box-shadow: 0 14px 30px rgba(0,0,0,.21);
  font-size: 11px;
  font-weight: 850;
  letter-spacing: .055em;
  text-align: center;
  text-transform: uppercase;
}

.nist-wheel-node::after { display: block; margin-top: 4px; color: #8496b1; font-size: 8px; font-weight: 700; letter-spacing: .04em; text-transform: none; }
.nist-wheel-node--identify { top: 32px; left: 10%; }
.nist-wheel-node--identify::after { content: "assets · risk"; }
.nist-wheel-node--protect { top: 32px; right: 10%; }
.nist-wheel-node--protect::after { content: "safeguards"; }
.nist-wheel-node--detect { top: 47%; right: 0; }
.nist-wheel-node--detect::after { content: "monitor · analyse"; }
.nist-wheel-node--respond { right: 10%; bottom: 28px; }
.nist-wheel-node--respond::after { content: "manage · communicate"; }
.nist-wheel-node--recover { bottom: 28px; left: 10%; }
.nist-wheel-node--recover::after { content: "restore · communicate"; }
.nist-function-grid { grid-template-columns: repeat(3,1fr); }
.nist-function { min-height: 252px; }
.nist-function h3 { margin-top: 26px; }
.nist-code { display: inline-flex; margin-top: 18px; padding: 6px 9px; border-radius: 999px; color: #1769e5; background: #edf4ff; font-size: 9px; font-weight: 850; letter-spacing: .06em; }

.nist-profile-grid { margin-top: 54px; display: grid; grid-template-columns: repeat(3,1fr); gap: 14px; }
.nist-profile-card { min-height: 290px; padding: 28px; border: 1px solid rgba(204,221,246,.2); border-radius: 20px; background: rgba(255,255,255,.045); }
.nist-profile-card span { color: #82b3ff; font-size: 11px; font-weight: 850; letter-spacing: .08em; text-transform: uppercase; }
.nist-profile-card h3 { margin: 36px 0 14px; color: #fff; font-size: 24px; letter-spacing: -.035em; }
.nist-profile-card p { margin: 0; color: #b9c8da; font-size: 14px; line-height: 1.65; }
.nist-profile-card small { display: block; margin-top: 23px; color: #8797af; font-size: 10px; font-weight: 800; line-height: 1.45; letter-spacing: .07em; text-transform: uppercase; }

@keyframes nist-orbit-turn {
  to { transform: translate(-50%,-50%) rotate(360deg); }
}

@media (max-width:1100px) {
  .nist-wheel { max-width: 750px; }
}

@media (max-width:820px) {
  .nist-function-grid,.nist-profile-grid { grid-template-columns: repeat(2,1fr); }
}

@media (max-width:580px) {
  .nist-wheel { min-height: 505px; padding: 15px; }
  .nist-wheel-stage { min-height: 430px; }
  .nist-wheel-orbit { width: 245px; height: 245px; }
  .nist-wheel-orbit::after { left: 116px; }
  .nist-wheel-centre { width: 122px; height: 122px; }
  .nist-wheel-node { min-width: 94px; padding: 9px; font-size: 9px; }
  .nist-wheel-node--identify,.nist-wheel-node--recover { left: 0; }
  .nist-wheel-node--protect,.nist-wheel-node--respond { right: 0; }
  .nist-function-grid,.nist-profile-grid { grid-template-columns: 1fr; }
}

@media (prefers-reduced-motion:reduce) {
  .nist-wheel-orbit { animation: none; }
}