/* ==========================================================================
   Void Walkers — Department theme scenes
   Loaded only by /cybercrime/ and /machines/. Every rule is scoped to its
   department body, so the other six domain pages keep the shared template.
   ========================================================================== */

/* ==========================================================================
   CYBER CRIME — “The last orbit”
   A forensic tableau around the black hole: victim, compromised terminal,
   patrol craft, and a blood thread caught in the event horizon.
   ========================================================================== */

body[data-department="cybercrime"] {
  --case-red: 255 77 94;
  --case-blue: 143 202 255;
  --case-paper: 236 232 220;
  --case-floor: #0b0a09;
}

body[data-department="cybercrime"] .dept-hero {
  min-height: 100svh;
  justify-content: flex-end;
  padding-bottom: clamp(48px, 8vh, 94px);
  border-bottom-color: rgb(var(--case-red) / 0.16);
}

body[data-department="cybercrime"] .dept-hero::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  background:
    radial-gradient(circle at 50% 44%, transparent 0 12%, rgb(var(--case-red) / 0.035) 23%, transparent 48%),
    linear-gradient(180deg, transparent 54%, rgba(4, 5, 11, 0.72) 88%, var(--bg));
}

body[data-department="cybercrime"] .hero__canvas {
  opacity: 0.84;
  filter: saturate(0.86) contrast(1.04);
}

body[data-department="cybercrime"] .dept-hero__inner {
  width: 100%;
  gap: var(--space-4);
}

body[data-department="cybercrime"] .dept-hero__title {
  max-width: 14ch;
  font-size: clamp(3.1rem, 6.6vw, 6rem);
  text-wrap: balance;
  text-shadow: 0 8px 80px rgba(0, 0, 0, 0.92);
}

body[data-department="cybercrime"] .dept-hero__blurb {
  max-width: 52ch;
  color: #c8c5bf;
}

.case-file {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px 14px;
  width: fit-content;
  padding: 8px 12px;
  border: 1px solid rgb(var(--case-red) / 0.28);
  border-radius: 5px;
  background: rgb(7 7 11 / 0.58);
  font-family: var(--font-mono);
  font-size: 0.61rem;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: #aaa69e;
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}

.case-file b { font-weight: 400; color: #e8e3d9; }
.case-file__sep { width: 1px; height: 11px; background: rgb(255 255 255 / 0.18); }
.case-file__live { display: inline-flex; align-items: center; gap: 6px; color: rgb(var(--case-red)); }
.case-file__live::before {
  content: "";
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: currentColor;
  box-shadow: 0 0 10px currentColor;
  animation: case-pulse 2.2s ease-in-out infinite;
}

@keyframes case-pulse { 50% { opacity: 0.28; transform: scale(0.8); } }

.case-hero__foot {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-4);
  width: 100%;
  margin-top: var(--space-4);
  padding-top: var(--space-4);
  border-top: 1px solid rgb(255 255 255 / 0.12);
}

.case-jump {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  font-family: var(--font-mono);
  font-size: 0.65rem;
  letter-spacing: 0.17em;
  text-transform: uppercase;
  color: #dcd7cc;
  transition: color var(--dur) var(--ease), gap var(--dur) var(--ease);
}
.case-jump svg { width: 14px; height: 14px; color: rgb(var(--case-red)); transition: transform var(--dur) var(--ease); }
.case-jump:hover { color: #fff; gap: 14px; }
.case-jump:hover svg { transform: translateY(3px); }

.case-hero__coord {
  font-family: var(--font-mono);
  font-size: 0.59rem;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: #7d7973;
}

/* ---------- the scene ---------- */
.case-scene {
  position: absolute;
  inset: 0;
  z-index: 1;
  overflow: hidden;
  pointer-events: none;
}

.case-scene__grid {
  position: absolute;
  inset: 0;
  opacity: 0.3;
  background-image:
    linear-gradient(rgb(255 255 255 / 0.035) 1px, transparent 1px),
    linear-gradient(90deg, rgb(255 255 255 / 0.035) 1px, transparent 1px);
  background-size: 72px 72px;
  -webkit-mask: radial-gradient(ellipse at 50% 42%, #000 0 22%, transparent 68%);
  mask: radial-gradient(ellipse at 50% 42%, #000 0 22%, transparent 68%);
}

.case-orbit {
  position: absolute;
  left: 50%;
  top: 44%;
  width: min(82vw, 1150px);
  height: min(46vw, 510px);
  border: 1px dashed rgb(255 255 255 / 0.15);
  border-radius: 50%;
  transform: translate(-50%, -50%) rotate(-9deg);
  box-shadow: 0 0 0 36px rgb(255 255 255 / 0.014);
}
.case-orbit::before,
.case-orbit::after {
  content: "";
  position: absolute;
  width: 7px;
  height: 7px;
  border: 1px solid rgb(var(--case-blue) / 0.8);
  border-radius: 50%;
  background: #05060a;
  box-shadow: 0 0 15px rgb(var(--case-blue) / 0.55);
}
.case-orbit::before { top: 26%; left: 0.2%; }
.case-orbit::after { right: 8%; bottom: 4%; border-color: rgb(var(--case-red) / 0.8); box-shadow: 0 0 15px rgb(var(--case-red) / 0.45); }

.case-object {
  position: absolute;
  height: auto;
  overflow: visible;
  filter: drop-shadow(0 20px 36px rgba(0, 0, 0, 0.55));
  transform: translate3d(calc(var(--scene-x, 0) * var(--depth, 10px)), calc(var(--scene-y, 0) * var(--depth, 10px)), 0);
  transition: transform 700ms var(--ease);
  animation: case-drift 11s ease-in-out infinite alternate;
}

.case-object--victim {
  left: 12.5%;
  top: 23%;
  width: clamp(190px, 21.5vw, 310px);
  --depth: 15px;
  animation-delay: -3s;
}
.case-object--device {
  right: 10%;
  top: 44%;
  width: clamp(155px, 17vw, 242px);
  --depth: 22px;
  animation-delay: -7s;
  animation-duration: 9s;
}
.case-object--ship {
  right: 4%;
  top: 10.5%;
  width: clamp(170px, 19vw, 272px);
  --depth: 9px;
  animation-delay: -1s;
  animation-duration: 13s;
}

@keyframes case-drift {
  from { margin-top: -5px; }
  to { margin-top: 7px; }
}

.case-thread {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  overflow: visible;
}
.case-thread__desktop { display: block; }
.case-thread__mobile { display: none; }
.case-thread path {
  fill: none;
  stroke: rgb(var(--case-red) / 0.85);
  stroke-linecap: round;
  vector-effect: non-scaling-stroke;
  filter: drop-shadow(0 0 7px rgb(var(--case-red) / 0.65));
}
.case-thread .case-thread__spine { stroke-width: 1.4; opacity: 0.92; }
.case-thread .case-thread__hair { stroke-width: 0.7; opacity: 0.55; stroke-dasharray: 1 10; animation: case-flow 4.6s linear infinite reverse; }
.case-thread .case-thread__drop { fill: rgb(var(--case-red) / 0.9); stroke: none; filter: drop-shadow(0 0 5px rgb(var(--case-red) / 0.7)); }
@keyframes case-flow { to { stroke-dashoffset: -18; } }

.case-searchlight {
  position: absolute;
  top: 15%;
  right: 4%;
  width: 59%;
  height: 38%;
  opacity: 0.48;
  background: linear-gradient(106deg, transparent 10%, rgb(var(--case-blue) / 0.11) 33%, rgb(var(--case-blue) / 0.025) 73%, transparent);
  clip-path: polygon(100% 14%, 100% 45%, 14% 100%, 0 72%);
  mix-blend-mode: screen;
  transform-origin: 100% 30%;
  animation: case-sweep 8s ease-in-out infinite alternate;
}
@keyframes case-sweep { from { opacity: 0.28; transform: rotate(-2deg); } to { opacity: 0.56; transform: rotate(3deg); } }

.case-tag {
  position: absolute;
  z-index: 3;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  font-family: var(--font-mono);
  font-size: 0.56rem;
  line-height: 1;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: #9e9a91;
  text-shadow: 0 1px 8px #000;
  animation: case-tag-in 900ms var(--ease) backwards;
}
.case-tag b { font-weight: 400; color: #e8e3d9; }
.case-tag::before {
  content: "";
  width: 22px;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgb(var(--case-red) / 0.8));
}
.case-tag--victim { left: 19%; top: 53%; animation-delay: 0.7s; }
.case-tag--device { right: 9%; top: 67%; animation-delay: 1s; }
.case-tag--ship { right: 7%; top: 29%; animation-delay: 0.5s; }
.case-tag--horizon { left: 53%; top: 27%; animation-delay: 1.3s; }
.case-tag--horizon::before { background: linear-gradient(90deg, rgb(var(--case-red) / 0.8), transparent); }
.case-tag--horizon b { color: rgb(var(--case-red)); }
@keyframes case-tag-in { from { opacity: 0; transform: translateY(8px); } }

.case-stamp {
  position: absolute;
  right: var(--gutter);
  bottom: 22%;
  z-index: 3;
  writing-mode: vertical-rl;
  font-family: var(--font-mono);
  font-size: 0.53rem;
  letter-spacing: 0.24em;
  text-transform: uppercase;
  color: rgb(255 255 255 / 0.28);
}

.case-victim__suit { fill: rgba(8, 10, 16, 0.88); stroke: rgba(231, 235, 244, 0.65); stroke-width: 1.25; }
.case-victim__line { fill: none; stroke: rgba(231, 235, 244, 0.46); stroke-width: 1; stroke-linecap: round; }
.case-victim__visor { fill: rgba(9, 13, 24, 0.96); stroke: rgba(var(--case-blue) / 0.72); stroke-width: 1.4; }
.case-victim__tether { fill: none; stroke: rgba(255, 255, 255, 0.24); stroke-width: 0.9; stroke-dasharray: 2 4; }
.case-victim__wound { fill: none; stroke: rgb(var(--case-red) / 0.9); stroke-width: 2; filter: drop-shadow(0 0 5px rgb(var(--case-red) / 0.7)); }

.case-device__case { fill: rgba(10, 12, 19, 0.92); stroke: rgba(230, 236, 248, 0.6); stroke-width: 1.4; }
.case-device__screen { fill: #07090e; stroke: rgb(var(--case-red) / 0.55); stroke-width: 1; }
.case-device__hack { fill: none; stroke: rgb(var(--case-red) / 0.88); stroke-width: 1.1; filter: drop-shadow(0 0 6px rgb(var(--case-red) / 0.5)); }
.case-device__text { fill: rgb(var(--case-red) / 0.85); font-family: var(--font-mono); font-size: 6px; letter-spacing: 1.1px; }
.case-device__scan { fill: rgb(var(--case-red) / 0.1); animation: case-scan 3.4s linear infinite; }
@keyframes case-scan { from { transform: translateY(-58px); } to { transform: translateY(58px); } }
.case-device__glitch { animation: case-glitch 4.8s steps(1) infinite; transform-origin: center; }
@keyframes case-glitch {
  0%, 91%, 100% { transform: translateX(0); }
  92% { transform: translateX(3px); }
  94% { transform: translateX(-2px); }
  96% { transform: translateX(1px); }
}

.case-ship__hull { fill: rgba(12, 16, 25, 0.94); stroke: rgba(220, 233, 246, 0.64); stroke-width: 1.2; }
.case-ship__line { fill: none; stroke: rgba(var(--case-blue) / 0.55); stroke-width: 1; }
.case-ship__engine { fill: rgb(var(--case-blue) / 0.58); filter: drop-shadow(0 0 8px rgb(var(--case-blue) / 0.7)); animation: case-engine 1.8s ease-in-out infinite; }
.case-ship__beacon { fill: rgb(var(--case-red)); filter: drop-shadow(0 0 7px rgb(var(--case-red) / 0.9)); animation: case-beacon 1.2s steps(2) infinite; }
@keyframes case-engine { 50% { opacity: 0.55; } }
@keyframes case-beacon { 50% { opacity: 0.12; } }

/* ---------- evidence section ---------- */
#caseEvidence, #foundryProcess { scroll-margin-top: calc(var(--nav-height) + 20px); }

.case-evidence {
  position: relative;
  margin-top: 0;
  padding-block: 0;
}

.case-section-head {
  max-width: 66ch;
  margin-bottom: var(--space-5);
}
.case-section-head .label { display: flex; align-items: center; gap: 10px; color: rgb(var(--case-red) / 0.9); }
.case-section-head .label::before { content: ""; width: 28px; height: 1px; background: currentColor; }
.case-section-head h2 {
  max-width: 15ch;
  margin-top: var(--space-3);
  font-size: clamp(2rem, 4vw, 3.2rem);
}
.case-headline-quote {
  max-width: 23ch;
  margin-top: var(--space-3);
  padding-left: 16px;
  border-left: 2px solid rgb(var(--case-red) / 0.55);
  font-family: Didot, "Bodoni MT", "Iowan Old Style", "Palatino Linotype", Georgia, serif;
  font-size: clamp(1.35rem, 2.8vw, 2.15rem);
  font-style: italic;
  font-weight: 600;
  line-height: 1.22;
  letter-spacing: -0.01em;
  color: #f0eadd;
  text-shadow: 0 0 34px rgb(var(--case-red) / 0.14);
}
.case-section-head > p:last-child {
  max-width: 56ch;
  margin-top: var(--space-3);
  color: #b7b3aa;
}

.chalk-board {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  border: 1px solid rgb(255 255 255 / 0.12);
  border-radius: 3px;
  background:
    radial-gradient(ellipse at 52% 48%, rgba(255, 255, 255, 0.06), transparent 58%),
    radial-gradient(ellipse at 8% 12%, rgba(255, 255, 255, 0.035), transparent 22%),
    repeating-linear-gradient(0deg, transparent 0 78px, rgba(255, 255, 255, 0.023) 79px 80px),
    repeating-linear-gradient(90deg, transparent 0 78px, rgba(255, 255, 255, 0.023) 79px 80px),
    linear-gradient(152deg, #12100e 0%, #090807 62%, #0d0c0a 100%);
  box-shadow: inset 0 0 90px rgba(0, 0, 0, 0.72), 0 28px 80px rgba(0, 0, 0, 0.32);
}
.chalk-board::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 3;
  pointer-events: none;
  background: radial-gradient(ellipse at center, transparent 38%, rgba(2, 2, 2, 0.52) 100%);
}
.chalk-board__svg {
  position: relative;
  z-index: 1;
  width: 100%;
  height: auto;
  min-height: 250px;
}
.chalk-board__meta {
  position: absolute;
  top: 16px;
  left: 18px;
  right: 18px;
  z-index: 4;
  display: flex;
  justify-content: space-between;
  gap: var(--space-3);
  font-family: var(--font-mono);
  font-size: 0.56rem;
  letter-spacing: 0.17em;
  text-transform: uppercase;
  color: rgba(236, 232, 220, 0.54);
}
.chalk-board__meta b { font-weight: 400; color: rgba(236, 232, 220, 0.86); }
.chalk-board figcaption {
  position: absolute;
  left: 18px;
  right: 18px;
  bottom: 14px;
  z-index: 4;
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: var(--space-4);
  font-family: var(--font-mono);
  font-size: 0.57rem;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: rgba(236, 232, 220, 0.52);
}
.chalk-board figcaption b { font-weight: 400; color: rgba(236, 232, 220, 0.82); }

.chalk-line {
  fill: none;
  stroke: rgb(var(--case-paper) / 0.94);
  stroke-width: 4.6;
  filter: drop-shadow(0 0 2px rgb(var(--case-paper) / 0.14));
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-dasharray: 1;
  stroke-dashoffset: 1;
  transition: stroke-dashoffset 1.6s var(--ease);
}
.chalk-line--thin { stroke-width: 2.5; opacity: 0.88; }
.chalk-fill {
  opacity: 0;
  transition: opacity 1.2s var(--ease) 0.7s;
}
.case-evidence.is-drawn .chalk-line { stroke-dashoffset: 0; }
.case-evidence.is-drawn .chalk-fill { opacity: 1; }
.chalk-board .case-evidence.is-drawn .chalk-line:nth-child(2n) { transition-delay: 180ms; }

.case-chain {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1px;
  margin-top: var(--space-5);
  border: 1px solid rgb(255 255 255 / 0.1);
  background: rgb(255 255 255 / 0.1);
}
.case-chain li {
  position: relative;
  padding: var(--space-4) var(--space-4) var(--space-5);
  background: #08080a;
}
.case-chain li::before {
  content: "";
  position: absolute;
  inset: auto 0 0;
  height: 1px;
  background: linear-gradient(90deg, rgb(var(--case-red) / 0.8), transparent);
  opacity: 0.55;
}
.case-chain span {
  display: block;
  margin-bottom: var(--space-2);
  font-family: var(--font-mono);
  font-size: 0.58rem;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: rgb(var(--case-red) / 0.86);
}
.case-chain strong { display: block; font-size: var(--fs-sm); color: #e5e1d8; }
.case-chain p { margin-top: 4px; font-size: var(--fs-xs); color: #8f8c84; }

.case-dossier {
  position: relative;
  isolation: isolate;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) minmax(190px, 0.55fr);
  align-items: center;
  gap: var(--space-5);
  margin-top: var(--space-6);
  padding: var(--space-6);
  overflow: hidden;
  border: 1px solid rgb(255 255 255 / 0.1);
  background:
    radial-gradient(circle at 0% 0%, rgb(var(--case-red) / 0.08), transparent 38%),
    linear-gradient(125deg, #0c0b0c, #07080b);
}
.case-dossier::before {
  content: "XLIV";
  position: absolute;
  right: -0.08em;
  bottom: -0.34em;
  z-index: -1;
  font-family: var(--font-display);
  font-size: clamp(7rem, 16vw, 13rem);
  line-height: 1;
  letter-spacing: 0.04em;
  color: transparent;
  -webkit-text-stroke: 1px rgb(255 255 255 / 0.055);
  pointer-events: none;
}
.case-dossier__seal {
  display: grid;
  place-items: center;
  width: 86px;
  aspect-ratio: 1;
  border: 1px solid rgb(var(--case-red) / 0.58);
  border-radius: 50%;
  color: rgb(var(--case-red) / 0.88);
  text-align: center;
  font-family: var(--font-mono);
  font-size: 0.53rem;
  line-height: 1.3;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  box-shadow: inset 0 0 0 5px #09080a, inset 0 0 0 6px rgb(var(--case-red) / 0.3), 0 0 35px rgb(var(--case-red) / 0.1);
  transform: rotate(-7deg);
}
.case-dossier__seal b { display: block; font-family: var(--font-display); font-size: 1.2rem; letter-spacing: 0.03em; }
.case-dossier h2 { max-width: 17ch; margin-top: var(--space-2); font-size: clamp(1.55rem, 3vw, 2.3rem); }
.case-dossier p:not(.label) { max-width: 54ch; margin-top: var(--space-2); font-size: var(--fs-sm); color: #a5a29a; }
.case-dossier blockquote {
  padding-left: var(--space-4);
  border-left: 1px solid rgb(var(--case-red) / 0.4);
  font-family: var(--font-display);
  font-size: clamp(1.25rem, 2.2vw, 1.7rem);
  line-height: 1.2;
  letter-spacing: 0.02em;
  text-transform: uppercase;
  color: #e8e2d5;
}
.case-dossier cite {
  display: block;
  margin-top: var(--space-3);
  font-family: var(--font-mono);
  font-size: 0.55rem;
  font-style: normal;
  letter-spacing: 0.15em;
  color: #7f7a70;
}

/* ==========================================================================
   MACHINES & HARDWARE — “Orbital foundry”
   A blueprint exploded-view hero and a schematic → metal build sequence.
   ========================================================================== */

body[data-department="machines"] {
  --hw-cyan: 134 224 255;
  --hw-amber: 255 176 92;
}

body[data-department="machines"] .dept-hero {
  min-height: 100svh;
  justify-content: flex-end;
  padding-bottom: clamp(48px, 8vh, 92px);
  border-bottom-color: rgb(var(--hw-cyan) / 0.14);
}
body[data-department="machines"] .dept-hero::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  background:
    radial-gradient(circle at 72% 42%, rgb(var(--hw-cyan) / 0.085), transparent 34%),
    radial-gradient(circle at 72% 42%, rgb(var(--accent-rgb) / 0.045), transparent 55%),
    linear-gradient(180deg, transparent 50%, rgba(4, 5, 11, 0.64) 87%, var(--bg));
}
body[data-department="machines"] .dept-hero__inner { width: 100%; gap: var(--space-4); }
body[data-department="machines"] .dept-hero__title {
  max-width: 13ch;
  font-size: clamp(3rem, 6.4vw, 5.8rem);
  text-shadow: 0 10px 80px rgba(0, 0, 0, 0.9);
}
body[data-department="machines"] .dept-hero__blurb { max-width: 49ch; }

.foundry-meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px 17px;
  width: fit-content;
  padding: 8px 12px;
  border: 1px solid rgb(var(--hw-cyan) / 0.22);
  background: rgb(6 9 14 / 0.58);
  font-family: var(--font-mono);
  font-size: 0.59rem;
  letter-spacing: 0.17em;
  text-transform: uppercase;
  color: #8c969e;
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}
.foundry-meta b { font-weight: 400; color: rgb(var(--hw-cyan)); }
.foundry-meta__rule { width: 1px; height: 10px; background: rgb(255 255 255 / 0.16); }
.foundry-meta__live { display: inline-flex; align-items: center; gap: 6px; color: #d1b48e; }
.foundry-meta__live::before {
  content: "";
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: var(--hw-amber);
  box-shadow: 0 0 10px var(--hw-amber);
  animation: foundry-blink 2.4s ease-in-out infinite;
}
@keyframes foundry-blink { 50% { opacity: 0.25; } }

.foundry-hero__foot {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-4);
  width: 100%;
  margin-top: var(--space-4);
  padding-top: var(--space-4);
  border-top: 1px solid rgb(255 255 255 / 0.11);
}
.foundry-jump {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  font-family: var(--font-mono);
  font-size: 0.65rem;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: #d4d9dd;
  transition: color var(--dur) var(--ease), gap var(--dur) var(--ease);
}
.foundry-jump svg { width: 14px; height: 14px; color: var(--hw-cyan); transition: transform var(--dur) var(--ease); }
.foundry-jump:hover { color: #fff; gap: 14px; }
.foundry-jump:hover svg { transform: translateY(3px); }
.foundry-hero__coord {
  font-family: var(--font-mono);
  font-size: 0.58rem;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: #777f85;
}

/* ---------- blueprint scene ---------- */
.foundry-scene {
  position: absolute;
  inset: 0;
  z-index: 1;
  overflow: hidden;
  pointer-events: none;
}
.foundry-scene__grid {
  position: absolute;
  inset: 0;
  opacity: 0.44;
  background-image:
    linear-gradient(rgb(var(--hw-cyan) / 0.055) 1px, transparent 1px),
    linear-gradient(90deg, rgb(var(--hw-cyan) / 0.055) 1px, transparent 1px);
  background-size: 44px 44px;
  -webkit-mask: radial-gradient(ellipse at 72% 44%, #000 0 17%, transparent 66%);
  mask: radial-gradient(ellipse at 72% 44%, #000 0 17%, transparent 66%);
}
.foundry-orbit {
  position: absolute;
  right: 2%;
  top: 46%;
  width: min(62vw, 820px);
  aspect-ratio: 1.55;
  border: 1px dashed rgb(var(--hw-cyan) / 0.2);
  border-radius: 50%;
  transform: translateY(-50%) rotate(-13deg);
  animation: foundry-orbit-spin 42s linear infinite;
  box-shadow: 0 0 0 70px rgb(var(--hw-cyan) / 0.014), 0 0 0 140px rgb(var(--hw-cyan) / 0.008);
}
.foundry-orbit::before {
  content: "";
  position: absolute;
  top: 12%;
  left: 18%;
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: var(--hw-cyan);
  box-shadow: 0 0 14px rgb(var(--hw-cyan) / 0.8);
}
@keyframes foundry-orbit-spin { to { transform: translateY(-50%) rotate(347deg); } }

.foundry-blueprint {
  position: absolute;
  right: 2%;
  top: 50%;
  width: min(58vw, 780px);
  height: auto;
  transform: translate3d(calc(var(--scene-x, 0) * 9px), calc(-50% + var(--scene-y, 0) * 7px), 0) rotate(-1deg);
  transition: transform 700ms var(--ease);
  filter: drop-shadow(0 26px 50px rgba(0, 0, 0, 0.42));
}
.foundry-blueprint .hw-line { fill: none; stroke: rgb(225 244 252 / 0.76); stroke-width: 1.2; stroke-linecap: round; stroke-linejoin: round; }
.foundry-blueprint .hw-line--soft { stroke: rgb(var(--hw-cyan) / 0.5); stroke-width: 0.85; }
.foundry-blueprint .hw-line--dash { stroke: rgb(var(--hw-cyan) / 0.35); stroke-width: 0.8; stroke-dasharray: 3 5; }
.foundry-blueprint .hw-line--accent { stroke: rgb(var(--hw-amber) / 0.85); stroke-width: 1.1; }
.foundry-blueprint .hw-fill { fill: rgba(8, 13, 19, 0.84); }
.foundry-blueprint .hw-fill--cyan { fill: rgb(var(--hw-cyan) / 0.09); }
.foundry-blueprint .hw-fill--amber { fill: rgb(var(--hw-amber) / 0.12); }
.foundry-blueprint .hw-node { fill: rgb(var(--hw-cyan) / 0.78); }
.foundry-blueprint .hw-text {
  fill: rgb(var(--hw-cyan) / 0.67);
  font-family: var(--font-mono);
  font-size: 8px;
  letter-spacing: 1.3px;
  text-transform: uppercase;
}
.foundry-blueprint .hw-text--dim { fill: rgba(220, 235, 242, 0.38); font-size: 6.5px; }
.foundry-blueprint .hw-text--warm { fill: rgb(var(--hw-amber) / 0.74); }
.foundry-blueprint .hw-panel-grid { stroke: rgb(var(--hw-cyan) / 0.3); stroke-width: 0.7; }
.foundry-blueprint .hw-component { animation: hw-float 8s ease-in-out infinite alternate; transform-box: fill-box; transform-origin: center; }
.foundry-blueprint .hw-component--left { animation-delay: -2s; }
.foundry-blueprint .hw-component--right { animation-delay: -4.5s; }
.foundry-blueprint .hw-component--mast { animation-delay: -1s; animation-duration: 6s; }
.foundry-blueprint .hw-component--thruster { animation-delay: -5.5s; animation-duration: 7s; }
@keyframes hw-float { from { transform: translateY(-3px); } to { transform: translateY(4px); } }
.foundry-blueprint .hw-pulse { fill: rgb(var(--hw-amber) / 0.9); filter: drop-shadow(0 0 5px rgb(var(--hw-amber) / 0.8)); animation: hw-pulse 2.8s ease-in-out infinite; }
@keyframes hw-pulse { 50% { opacity: 0.25; } }

.foundry-stamp {
  position: absolute;
  right: var(--gutter);
  bottom: 21%;
  z-index: 3;
  writing-mode: vertical-rl;
  font-family: var(--font-mono);
  font-size: 0.52rem;
  letter-spacing: 0.23em;
  text-transform: uppercase;
  color: rgb(255 255 255 / 0.26);
}

/* ---------- process section ---------- */
.foundry-process { position: relative; margin-top: 0; padding-block: 0; }
.foundry-section-head { max-width: 64ch; margin-bottom: var(--space-5); }
.foundry-section-head .label { display: flex; align-items: center; gap: 10px; color: rgb(var(--hw-cyan) / 0.84); }
.foundry-section-head .label::before { content: ""; width: 28px; height: 1px; background: currentColor; }
.foundry-section-head h2 { max-width: 15ch; margin-top: var(--space-3); font-size: clamp(2rem, 4vw, 3.2rem); }
.foundry-section-head > p:last-child { max-width: 58ch; margin-top: var(--space-3); }

.foundry-steps {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--space-3);
}
.foundry-step {
  position: relative;
  overflow: hidden;
  min-height: 260px;
  padding: var(--space-5);
  background:
    linear-gradient(145deg, rgb(var(--hw-cyan) / 0.055), transparent 42%),
    var(--panel-grad);
  border: 1px solid var(--line);
  border-radius: var(--radius-md);
  transition: transform var(--dur) var(--ease), border-color var(--dur) var(--ease), box-shadow var(--dur) var(--ease);
}
.foundry-step:hover { transform: translateY(-4px); border-color: rgb(var(--hw-cyan) / 0.28); box-shadow: 0 18px 44px rgba(0, 0, 0, 0.3), 0 0 35px rgb(var(--hw-cyan) / 0.06); }
.foundry-step::after {
  content: attr(data-step);
  position: absolute;
  right: 12px;
  bottom: -18px;
  z-index: -1;
  font-family: var(--font-display);
  font-size: 6rem;
  line-height: 1;
  color: transparent;
  -webkit-text-stroke: 1px rgb(255 255 255 / 0.06);
}
.foundry-step__num {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-2);
  font-family: var(--font-mono);
  font-size: 0.58rem;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: rgb(var(--hw-cyan) / 0.8);
}
.foundry-step__num::after { content: ""; flex: 1; height: 1px; background: linear-gradient(90deg, rgb(var(--hw-cyan) / 0.28), transparent); }
.foundry-step__icon {
  display: grid;
  place-items: center;
  width: 54px;
  height: 54px;
  margin: var(--space-5) 0 var(--space-4);
  border: 1px solid rgb(var(--hw-cyan) / 0.24);
  border-radius: 10px;
  color: var(--hw-cyan);
  background: rgb(var(--hw-cyan) / 0.055);
}
.foundry-step__icon svg { width: 27px; height: 27px; }
.foundry-step h3 { font-size: var(--fs-md); color: #e9edf0; }
.foundry-step p { margin-top: var(--space-2); font-size: var(--fs-xs); color: #969ea4; }
.foundry-step__tags { display: flex; flex-wrap: wrap; gap: 5px; margin-top: var(--space-4); }
.foundry-step__tags span {
  padding: 4px 7px;
  border: 1px solid rgb(var(--hw-cyan) / 0.16);
  border-radius: 3px;
  font-family: var(--font-mono);
  font-size: 0.52rem;
  letter-spacing: 0.11em;
  text-transform: uppercase;
  color: #8d979d;
}

.foundry-manifesto {
  position: relative;
  isolation: isolate;
  display: grid;
  grid-template-columns: minmax(0, 1fr) 230px;
  gap: var(--space-6);
  align-items: center;
  margin-top: var(--space-4);
  padding: var(--space-6);
  overflow: hidden;
  border: 1px solid rgb(var(--hw-cyan) / 0.17);
  background:
    radial-gradient(circle at 83% 50%, rgb(var(--hw-cyan) / 0.075), transparent 34%),
    linear-gradient(110deg, #070a0f, #0a0d13 58%, #07090d);
}
.foundry-manifesto::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  opacity: 0.4;
  background-image:
    linear-gradient(rgb(var(--hw-cyan) / 0.05) 1px, transparent 1px),
    linear-gradient(90deg, rgb(var(--hw-cyan) / 0.05) 1px, transparent 1px);
  background-size: 32px 32px;
  -webkit-mask: linear-gradient(90deg, transparent, #000 45%);
  mask: linear-gradient(90deg, transparent, #000 45%);
}
.foundry-manifesto h3 { max-width: 22ch; margin-top: var(--space-2); font-family: var(--font-display); font-size: clamp(1.4rem, 2.5vw, 2rem); line-height: 1.15; text-transform: uppercase; color: #e6ecee; }
.foundry-manifesto p:not(.label) { max-width: 57ch; margin-top: var(--space-2); font-size: var(--fs-sm); color: #99a2a8; }
.foundry-manifesto__mark { justify-self: end; width: 100%; max-width: 210px; color: rgb(var(--hw-cyan) / 0.8); }

/* ---------- responsive ---------- */
@media (max-width: 1050px) {
  body[data-department="cybercrime"] .case-object--ship { right: 0.5%; }
  body[data-department="machines"] .foundry-blueprint { right: -3%; width: 60vw; opacity: 0.92; }
}

@media (max-width: 900px) {
  .case-tag { display: none; }
  .case-stamp, .foundry-stamp { display: none; }
  body[data-department="cybercrime"] .case-object--victim { left: 9%; top: 21%; }
  body[data-department="cybercrime"] .case-object--device { right: 5%; top: 41%; }
  .case-dossier { grid-template-columns: auto minmax(0, 1fr); }
  .case-dossier blockquote { grid-column: 2; }
  .foundry-steps { grid-template-columns: 1fr; }
  .foundry-step { min-height: 0; }
  .foundry-manifesto { grid-template-columns: 1fr; }
  .foundry-manifesto__mark { justify-self: start; max-width: 170px; }
}

@media (max-width: 720px) {
  body[data-department="cybercrime"] .dept-hero,
  body[data-department="machines"] .dept-hero { min-height: 100svh; padding-bottom: 40px; }
  body[data-department="cybercrime"] .dept-hero__title,
  body[data-department="machines"] .dept-hero__title { font-size: clamp(2.75rem, 12.5vw, 4.25rem); }
  body[data-department="cybercrime"] .dept-hero__blurb,
  body[data-department="machines"] .dept-hero__blurb { font-size: var(--fs-sm); max-width: 40ch; }
  .case-file, .foundry-meta { gap: 7px 9px; padding: 7px 9px; font-size: 0.53rem; }
  .case-file__sep, .foundry-meta__rule { display: none; }
  .case-hero__coord, .foundry-hero__coord { display: none; }
  .case-hero__foot, .foundry-hero__foot { margin-top: var(--space-2); padding-top: var(--space-3); }

  .case-scene__grid { opacity: 0.2; }
  .case-orbit { top: 34%; width: 118vw; height: 58vw; }
  .case-object--victim { left: -1%; top: 22%; width: 35vw; }
  .case-object--device { right: 0; top: 34%; width: 32vw; }
  .case-object--ship { right: 2%; top: 10%; width: 27vw; }
  .case-searchlight { top: 12%; width: 74%; height: 30%; opacity: 0.34; }
  .case-thread__desktop { display: none; }
  .case-thread__mobile { display: block; }

  body[data-department="machines"] .foundry-blueprint { right: -15%; top: 39%; width: 112vw; opacity: 0.66; }
  .foundry-orbit { right: -15%; top: 40%; width: 105vw; }
  .foundry-scene__grid { opacity: 0.3; }

  .case-chain { grid-template-columns: 1fr; }
  .case-chain li { padding: var(--space-4); }
  .case-chain p { max-width: 40ch; }
  .case-dossier { grid-template-columns: 1fr; gap: var(--space-4); padding: var(--space-5); }
  .case-dossier blockquote { grid-column: auto; }
  .case-dossier__seal { width: 68px; font-size: 0.48rem; }
  .case-dossier__seal b { font-size: 1rem; }
  .case-dossier h2 { max-width: 20ch; }
  .chalk-board__meta { top: 10px; left: 10px; right: 10px; font-size: 0.49rem; }
  .chalk-board figcaption { display: none; }
  .case-evidence, .foundry-process { margin-top: var(--space-7); }

  .foundry-manifesto { padding: var(--space-5); }
  .foundry-manifesto__mark { max-width: 130px; }
}

@media (prefers-reduced-motion: reduce) {
  .case-file__live::before,
  .case-object,
  .case-thread path,
  .case-searchlight,
  .case-device__scan,
  .case-device__glitch,
  .case-ship__engine,
  .case-ship__beacon,
  .foundry-meta__live::before,
  .foundry-orbit,
  .foundry-blueprint .hw-component,
  .foundry-blueprint .hw-pulse { animation: none !important; }
  .case-object,
  .foundry-blueprint { transition: none; }
}

html[data-fx="reduced"] .case-file__live::before,
html[data-fx="reduced"] .case-object,
html[data-fx="reduced"] .case-thread path,
html[data-fx="reduced"] .case-searchlight,
html[data-fx="reduced"] .case-device__scan,
html[data-fx="reduced"] .case-device__glitch,
html[data-fx="reduced"] .case-ship__engine,
html[data-fx="reduced"] .case-ship__beacon,
html[data-fx="reduced"] .foundry-meta__live::before,
html[data-fx="reduced"] .foundry-orbit,
html[data-fx="reduced"] .foundry-blueprint .hw-component,
html[data-fx="reduced"] .foundry-blueprint .hw-pulse { animation: none !important; }
html[data-fx="reduced"] .case-object,
html[data-fx="reduced"] .foundry-blueprint { transition: none; }