/* V13: contrast, chronology and a clearer contact experience. */

/* A slow, compositor-friendly ambient motion keeps the hero alive. */
.version-v13 .hero-reactor {
  position: absolute;
  z-index: 2;
  inset: 0;
  overflow: hidden;
  pointer-events: none;
  mix-blend-mode: multiply;
}

.version-v13 .hero-energy {
  position: absolute;
  top: 2%;
  right: 0;
  width: min(69vw, 1060px);
  height: auto;
  overflow: visible;
}

.version-v13 .energy-rail,
.version-v13 .energy-trace {
  fill: none;
  vector-effect: non-scaling-stroke;
}

.version-v13 .energy-rail {
  stroke: rgba(36, 77, 62, 0.18);
  stroke-width: 1.5;
}

.version-v13 .rail-secondary { opacity: 0.62; }

.version-v13 .energy-trace {
  stroke: #a8e83e;
  stroke-width: 3;
  stroke-linecap: round;
  stroke-dasharray: 0.08 0.92;
  animation: v13-energy-run 7.5s linear infinite;
}

.version-v13 .trace-secondary {
  stroke-width: 2;
  animation-duration: 6.2s;
  animation-delay: -3.1s;
}

.version-v13 .energy-particle { fill: #b8ff3f; }
.version-v13 .particle-secondary { fill: #f7fff0; }

.version-v13 .energy-node {
  transform-box: fill-box;
  transform-origin: center;
}

.version-v13 .energy-ring {
  fill: none;
  stroke: #9ee12f;
  stroke-width: 2;
  transform-box: fill-box;
  transform-origin: center;
  animation: v13-energy-burst 7.8s ease-out var(--node-delay) infinite;
}

.version-v13 .energy-core {
  fill: #82bf22;
  transform-box: fill-box;
  transform-origin: center;
  animation: v13-energy-core 3.9s ease-in-out var(--node-delay) infinite;
}

.version-v13 .portrait-hex::before {
  position: absolute;
  inset: -22%;
  content: '';
  opacity: 0.5;
  background: conic-gradient(from 0deg, transparent 0 64%, rgba(240, 255, 208, 0.9) 72%, transparent 81%);
  animation: v13-hex-scan 8s linear infinite;
}

.version-v13 .hero-word-charge {
  color: var(--ink);
  background: linear-gradient(100deg, var(--ink) 0 38%, #78a91f 47%, #ceff68 51%, var(--ink) 60% 100%);
  background-clip: text;
  background-size: 300% 100%;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  animation: v13-word-charge 9s ease-in-out 1.2s infinite;
}

.version-v13 .hero-word-charge.charge-late { animation-delay: 5.2s; }

.version-v13 .hero::before {
  animation: v13-hero-glow 11s ease-in-out infinite;
  will-change: transform, opacity;
}

.version-v13 .cluster-a {
  animation: v13-molecule-drift-a 12s ease-in-out infinite;
  will-change: transform;
}

.version-v13 .cluster-b {
  animation: v13-molecule-drift-b 15s ease-in-out -5s infinite;
  will-change: transform;
}

.version-v13 .portrait-hex {
  animation: v13-portrait-hex 10s ease-in-out -3s infinite;
  will-change: transform;
}

body.version-v13.is-ready .molecule circle {
  animation:
    nodeAppear 420ms ease 360ms forwards,
    v13-node-breathe 5.5s ease-in-out 900ms infinite;
}

@keyframes v13-hero-glow {
  0%, 100% { opacity: 0.54; transform: translate3d(-5%, 2%, 0) scale(0.94); }
  50% { opacity: 0.82; transform: translate3d(6%, -4%, 0) scale(1.08); }
}

@keyframes v13-molecule-drift-a {
  0%, 100% { transform: translate3d(0, 0, 0) rotate(0deg); }
  50% { transform: translate3d(28px, -20px, 0) rotate(1.1deg); }
}

@keyframes v13-molecule-drift-b {
  0%, 100% { transform: translate3d(0, 0, 0) rotate(0deg); }
  50% { transform: translate3d(-24px, 18px, 0) rotate(-1.25deg); }
}

@keyframes v13-portrait-hex {
  0%, 100% { transform: translate3d(-5px, 5px, 0) rotate(-0.5deg) scale(0.975); }
  50% { transform: translate3d(7px, -14px, 0) rotate(0.8deg) scale(1.03); }
}

@keyframes v13-node-breathe {
  0%, 100% { opacity: 0.82; transform: scale(0.92); }
  50% { opacity: 0.48; transform: scale(1.08); }
}

@keyframes v13-energy-run {
  from { stroke-dashoffset: 1; }
  to { stroke-dashoffset: 0; }
}

@keyframes v13-energy-burst {
  0%, 18%, 100% { opacity: 0; transform: scale(0.22); }
  28% { opacity: 0.85; transform: scale(0.42); }
  55% { opacity: 0; transform: scale(1.45); }
}

@keyframes v13-energy-core {
  0%, 100% { opacity: 0.32; transform: scale(0.72); }
  50% { opacity: 1; transform: scale(1.5); }
}

@keyframes v13-hex-scan {
  to { transform: rotate(1turn); }
}

@keyframes v13-word-charge {
  0%, 18%, 100% { background-position: 100% 50%; }
  38%, 62% { background-position: 0 50%; }
}

.version-v13 .current-editorial-image {
  overflow: clip;
  background: #07120d;
  clip-path: inset(0);
  contain: paint;
}

.version-v13 .current-editorial-image img {
  filter: contrast(1.18) saturate(1.12) brightness(0.93);
}

.version-v13 .current-editorial-image:hover img {
  filter: contrast(1.2) saturate(1.17) brightness(0.95);
}

.version-v13 .current-editorial-image::after {
  background:
    linear-gradient(180deg, rgba(3, 10, 7, 0.02) 45%, rgba(3, 12, 8, 0.3) 100%),
    linear-gradient(90deg, transparent 68%, rgba(5, 18, 12, 0.08));
}

/* AI Lab: the first current project gets its own brighter system panel. */
.version-v13 .current-editorial {
  min-height: clamp(580px, 50svh, 640px);
}

.version-v13 .current-ai {
  grid-template-columns: minmax(0, 1.08fr) minmax(420px, 0.92fr);
  color: var(--ink);
  background: #d5fa85;
}

.version-v13 .current-ai .current-editorial-copy {
  order: 1;
  padding: clamp(2.75rem, 3.75vw, 4rem);
  color: var(--ink);
  background:
    radial-gradient(circle at 16% 12%, rgba(255, 255, 255, 0.72), transparent 30%),
    linear-gradient(135deg, #e8ffb2 0%, #c9f66d 100%);
  background-image:
    radial-gradient(circle at 16% 12%, rgba(255, 255, 255, 0.72), transparent 30%),
    var(--hex-pattern),
    linear-gradient(135deg, #e8ffb2 0%, #c9f66d 100%);
  background-size: auto, 180px auto, auto;
}

@media (min-width: 1180px) {
  .version-v13 .current-ai .current-editorial-copy {
    padding-left: max(clamp(2.75rem, 3.75vw, 4rem), calc((100vw - 1420px) / 2 + 3rem));
  }
}

.version-v13 .current-ai .current-editorial-copy h2 {
  max-width: 12ch;
  font-size: clamp(3.4rem, 4.8vw, 5.6rem);
}

.version-v13 .current-podcast .current-editorial-copy {
  padding: clamp(2.75rem, 3.75vw, 4rem);
}

.version-v13 .current-podcast .current-editorial-copy h2 {
  max-width: 12ch;
  font-size: clamp(3.4rem, 4.8vw, 5.6rem);
}

.version-v13 .current-ai .current-editorial-image {
  order: 2;
  min-height: 100%;
  background: var(--forest-dark);
}

.version-v13 .ai-lab-system-visual {
  position: absolute;
  z-index: 1;
  inset: 0;
  overflow: hidden;
  color: #efffd2;
  background:
    radial-gradient(circle at 50% 48%, rgba(205, 255, 104, 0.16), transparent 26%),
    radial-gradient(circle at 82% 12%, rgba(205, 255, 104, 0.1), transparent 24%),
    linear-gradient(145deg, #071b13 0%, #0c3022 57%, #061710 100%);
  isolation: isolate;
}

.version-v13 .ai-lab-system-visual img {
  position: static;
  width: auto;
  height: auto;
  min-height: 0;
  object-fit: contain;
  transform: none;
  transition: none;
}

.version-v13 .ai-visual-grid {
  position: absolute;
  inset: 0;
  opacity: 0.42;
  background-image:
    linear-gradient(rgba(207, 255, 101, 0.12) 1px, transparent 1px),
    linear-gradient(90deg, rgba(207, 255, 101, 0.12) 1px, transparent 1px);
  background-size: 64px 64px;
  mask-image: radial-gradient(circle at center, #000 22%, transparent 78%);
}

.version-v13 .ai-visual-option {
  position: absolute;
  inset: 0;
  display: none;
}

.version-v13 [data-variant='network'] .ai-visual-network,
.version-v13 [data-variant='pipeline'] .ai-visual-pipeline,
.version-v13 [data-variant='swarm'] .ai-visual-swarm {
  display: block;
}

.version-v13 .ai-visual-network {
  inset: 10% 11%;
}

.version-v13 .ai-visual-eyebrow {
  position: absolute;
  top: 5.5%;
  left: 6%;
  color: rgba(239, 255, 210, 0.62);
  font-size: clamp(0.64rem, 0.8vw, 0.76rem);
  font-weight: 800;
  letter-spacing: 0.12em;
}

.version-v13 .ai-network-core,
.version-v13 .ai-agent-node,
.version-v13 .ai-pipeline-stage,
.version-v13 .ai-swarm-core,
.version-v13 .ai-swarm-agent {
  position: absolute;
  display: grid;
  place-items: center;
}

.version-v13 .ai-network-core {
  z-index: 4;
  top: 50%;
  left: 50%;
  width: clamp(92px, 7.8vw, 126px);
  aspect-ratio: 1;
  border: 1px solid rgba(207, 255, 101, 0.56);
  border-radius: 50%;
  background: radial-gradient(circle at 38% 30%, #e7ffad, #a9e83d 45%, #659d19 100%);
  box-shadow: 0 0 0 12px rgba(207, 255, 101, 0.05), 0 0 54px rgba(176, 242, 61, 0.22);
  transform: translate(-50%, -50%);
  animation: v13-ai-core 5.8s ease-in-out infinite;
}

.version-v13 .ai-network-core img {
  width: 34%;
  height: auto;
  filter: none;
}

.version-v13 .ai-agent-node {
  z-index: 4;
  width: clamp(60px, 5.2vw, 82px);
  aspect-ratio: 1;
  border: 1px solid rgba(207, 255, 101, 0.34);
  border-radius: 14px;
  background: rgba(8, 31, 22, 0.88);
  box-shadow: 0 18px 40px rgba(0, 0, 0, 0.2);
  backdrop-filter: blur(8px);
  animation: v13-ai-node-float 5s ease-in-out var(--node-delay, 0s) infinite;
}

.version-v13 .ai-agent-node img {
  width: 30%;
  height: auto;
  filter: invert(92%) sepia(75%) saturate(529%) hue-rotate(25deg) brightness(106%);
}

.version-v13 .ai-agent-node small {
  margin-top: -18%;
  color: rgba(239, 255, 210, 0.62);
  font-size: clamp(0.46rem, 0.55vw, 0.58rem);
  font-weight: 800;
  letter-spacing: 0.08em;
}

.version-v13 .ai-agent-node.node-a { top: 22%; left: 17%; --node-delay: -0.8s; }
.version-v13 .ai-agent-node.node-b { top: 23%; right: 16%; --node-delay: -2.2s; }
.version-v13 .ai-agent-node.node-c { bottom: 19%; left: 16%; --node-delay: -3.4s; }
.version-v13 .ai-agent-node.node-d { right: 17%; bottom: 18%; --node-delay: -4.3s; }

.version-v13 .ai-network-lines i {
  position: absolute;
  z-index: 2;
  top: 50%;
  left: 50%;
  width: 34%;
  height: 1px;
  opacity: 0.7;
  background: linear-gradient(90deg, rgba(207, 255, 101, 0.08), rgba(207, 255, 101, 0.68));
  transform-origin: left center;
}

.version-v13 .ai-network-lines .line-a { transform: rotate(214deg); }
.version-v13 .ai-network-lines .line-b { transform: rotate(326deg); }
.version-v13 .ai-network-lines .line-c { transform: rotate(145deg); }
.version-v13 .ai-network-lines .line-d { transform: rotate(34deg); }

.version-v13 .ai-network-lines b {
  position: absolute;
  z-index: 3;
  top: 50%;
  left: 50%;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--signal);
  box-shadow: 0 0 16px rgba(207, 255, 101, 0.95);
  animation: v13-ai-packet 3.2s ease-in-out var(--packet-delay, 0s) infinite;
}

.version-v13 .ai-network-lines .packet-a { --packet-x: -185px; --packet-y: -112px; --packet-delay: -0.3s; }
.version-v13 .ai-network-lines .packet-b { --packet-x: 182px; --packet-y: -110px; --packet-delay: -1.5s; }
.version-v13 .ai-network-lines .packet-c { --packet-x: -190px; --packet-y: 116px; --packet-delay: -2.1s; }
.version-v13 .ai-network-lines .packet-d { --packet-x: 188px; --packet-y: 114px; --packet-delay: -2.8s; }

.version-v13 .ai-network-status {
  position: absolute;
  right: 5%;
  bottom: 5%;
  display: flex;
  align-items: center;
  gap: 0.45rem;
  color: rgba(239, 255, 210, 0.62);
  font-size: 0.62rem;
  font-weight: 800;
  letter-spacing: 0.1em;
}

.version-v13 .ai-network-status i {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--signal);
  box-shadow: 0 0 12px rgba(207, 255, 101, 0.9);
  animation: v13-ai-status 2.2s ease-in-out infinite;
}

/* Option 02: a clear operating pipeline. */
.version-v13 .ai-pipeline-rail {
  position: absolute;
  top: 50%;
  right: 9%;
  left: 9%;
  height: 2px;
  background: rgba(207, 255, 101, 0.26);
}

.version-v13 .ai-pipeline-rail i {
  position: absolute;
  top: -3px;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--signal);
  box-shadow: 0 0 16px rgba(207, 255, 101, 0.74);
}

.version-v13 .ai-pipeline-rail i:nth-child(1) { left: 25%; }
.version-v13 .ai-pipeline-rail i:nth-child(2) { left: 50%; }
.version-v13 .ai-pipeline-rail i:nth-child(3) { left: 75%; }

.version-v13 .ai-pipeline-stage {
  z-index: 2;
  top: 50%;
  width: clamp(102px, 9.5vw, 148px);
  aspect-ratio: 0.88;
  border: 1px solid rgba(207, 255, 101, 0.36);
  border-radius: 20px;
  background: rgba(7, 29, 20, 0.9);
  box-shadow: 0 20px 42px rgba(0, 0, 0, 0.22);
  transform: translate(-50%, -50%);
  animation: v13-pipeline-card 5s ease-in-out var(--pipeline-delay, 0s) infinite;
}

.version-v13 .ai-pipeline-stage.stage-a { left: 13%; --pipeline-delay: -0.3s; }
.version-v13 .ai-pipeline-stage.stage-b { left: 38%; --pipeline-delay: -1.5s; }
.version-v13 .ai-pipeline-stage.stage-c { left: 63%; --pipeline-delay: -2.7s; }
.version-v13 .ai-pipeline-stage.stage-d { left: 87%; --pipeline-delay: -3.9s; }
.version-v13 .ai-pipeline-stage.stage-d { color: var(--ink); background: var(--signal); }

.version-v13 .ai-pipeline-stage img { width: 28%; filter: invert(93%) sepia(61%) saturate(558%) hue-rotate(24deg) brightness(105%); }
.version-v13 .ai-pipeline-stage.stage-d img { filter: none; }
.version-v13 .ai-pipeline-stage small { position: absolute; top: 10%; left: 12%; color: rgba(239, 255, 210, 0.54); font-size: 0.6rem; }
.version-v13 .ai-pipeline-stage.stage-d small { color: rgba(9, 30, 21, 0.62); }
.version-v13 .ai-pipeline-stage b { margin-top: -12%; font-size: clamp(0.56rem, 0.72vw, 0.74rem); letter-spacing: 0.08em; }

.version-v13 .ai-pipeline-signal {
  position: absolute;
  z-index: 3;
  top: calc(50% - 4px);
  left: 7%;
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background: #f4ffd9;
  box-shadow: 0 0 20px rgba(207, 255, 101, 0.98);
  animation: v13-pipeline-signal 4.5s linear infinite;
}

.version-v13 .ai-pipeline-signal.signal-b { animation-delay: -2.25s; }

/* Option 03: an orchestrated agent swarm. */
.version-v13 .ai-swarm-orbit {
  position: absolute;
  top: 50%;
  left: 50%;
  border: 1px solid rgba(207, 255, 101, 0.25);
  border-radius: 50%;
  transform: translate(-50%, -50%) rotate(-12deg);
}

.version-v13 .ai-swarm-orbit.orbit-a { width: 62%; aspect-ratio: 1.85; }
.version-v13 .ai-swarm-orbit.orbit-b { width: 76%; aspect-ratio: 2.2; transform: translate(-50%, -50%) rotate(18deg); }

.version-v13 .ai-swarm-core {
  z-index: 4;
  top: 50%;
  left: 50%;
  width: clamp(116px, 11vw, 170px);
  aspect-ratio: 1;
  border-radius: 38% 62% 58% 42% / 44% 38% 62% 56%;
  color: var(--ink);
  background: var(--signal);
  box-shadow: 0 0 60px rgba(207, 255, 101, 0.25);
  transform: translate(-50%, -50%);
  animation: v13-swarm-core 8s ease-in-out infinite;
}

.version-v13 .ai-swarm-core img { width: 29%; }
.version-v13 .ai-swarm-core b { margin-top: -25%; font-size: clamp(1.3rem, 2vw, 2rem); }

.version-v13 .ai-swarm-agent {
  z-index: 4;
  width: clamp(58px, 6vw, 86px);
  aspect-ratio: 1;
  border: 1px solid rgba(207, 255, 101, 0.4);
  border-radius: 50%;
  background: #0a271c;
  box-shadow: 0 12px 34px rgba(0, 0, 0, 0.24);
  animation: v13-swarm-agent 5.4s ease-in-out var(--swarm-delay, 0s) infinite;
}

.version-v13 .ai-swarm-agent img { width: 34%; filter: invert(93%) sepia(61%) saturate(558%) hue-rotate(24deg) brightness(105%); }
.version-v13 .ai-swarm-agent.swarm-a { top: 18%; left: 22%; --swarm-delay: -0.4s; }
.version-v13 .ai-swarm-agent.swarm-b { top: 17%; right: 20%; --swarm-delay: -1.5s; }
.version-v13 .ai-swarm-agent.swarm-c { top: 45%; right: 10%; --swarm-delay: -2.6s; }
.version-v13 .ai-swarm-agent.swarm-d { bottom: 13%; right: 29%; --swarm-delay: -3.7s; }
.version-v13 .ai-swarm-agent.swarm-e { bottom: 16%; left: 17%; --swarm-delay: -4.8s; }

.version-v13 .ai-swarm-caption {
  position: absolute;
  right: 6%;
  bottom: 5%;
  display: flex;
  align-items: baseline;
  gap: 0.7rem;
}

.version-v13 .ai-swarm-caption small { color: rgba(239, 255, 210, 0.55); font-size: 0.58rem; letter-spacing: 0.1em; }
.version-v13 .ai-swarm-caption b { color: var(--signal); font-size: 1.4rem; }

.version-v13 .project-thumb.ai-lab-thumb,
.version-v13 .project-detail-image.ai-lab-detail {
  position: relative;
  background: var(--forest-dark);
}

.version-v13 .project-thumb.ai-lab-thumb .ai-lab-system-visual {
  transform: scale(1.01);
  transition: transform 550ms var(--ease), filter 350ms ease;
}

.version-v13 .project-summary:hover .project-thumb.ai-lab-thumb .ai-lab-system-visual,
.version-v13 .project-item.open .project-thumb.ai-lab-thumb .ai-lab-system-visual {
  filter: saturate(1.1);
  transform: scale(1.07);
}

.version-v13 .project-detail-image.ai-lab-detail .ai-lab-system-visual {
  position: absolute;
  inset: 0;
}

.version-v13 .ai-lab-system-visual.is-compact .ai-visual-eyebrow,
.version-v13 .ai-lab-system-visual.is-compact small,
.version-v13 .ai-lab-system-visual.is-compact .ai-network-status,
.version-v13 .ai-lab-system-visual.is-compact .ai-swarm-caption {
  display: none;
}

.version-v13 .ai-lab-system-visual.is-compact .ai-network-core { width: 35%; }
.version-v13 .ai-lab-system-visual.is-compact .ai-network-core img { width: 44%; }
.version-v13 .ai-lab-system-visual.is-compact .ai-agent-node { width: 22%; border-radius: 5px; }
.version-v13 .ai-lab-system-visual.is-compact .ai-agent-node img { width: 45%; }
.version-v13 .ai-lab-system-visual.is-compact .ai-network-lines b { display: none; }
.version-v13 .ai-lab-system-visual.is-compact .ai-pipeline-stage { width: 20%; border-radius: 5px; }
.version-v13 .ai-lab-system-visual.is-compact .ai-pipeline-stage b { display: none; }
.version-v13 .ai-lab-system-visual.is-compact .ai-swarm-core { width: 29%; }
.version-v13 .ai-lab-system-visual.is-compact .ai-swarm-core b { font-size: 0.75rem; }
.version-v13 .ai-lab-system-visual.is-compact .ai-swarm-agent { width: 18%; }

@keyframes v13-ai-core {
  0%, 100% { box-shadow: 0 0 0 10px rgba(207, 255, 101, 0.04), 0 0 42px rgba(176, 242, 61, 0.18); transform: translate(-50%, -50%) scale(0.97); }
  50% { box-shadow: 0 0 0 17px rgba(207, 255, 101, 0.07), 0 0 62px rgba(176, 242, 61, 0.28); transform: translate(-50%, -50%) scale(1.025); }
}

@keyframes v13-ai-node-float {
  0%, 100% { transform: translate3d(0, 3px, 0); }
  50% { transform: translate3d(0, -7px, 0); }
}

@keyframes v13-ai-packet {
  0%, 12% { opacity: 0; transform: translate3d(0, 0, 0) scale(0.5); }
  35% { opacity: 1; }
  78% { opacity: 0.9; }
  100% { opacity: 0; transform: translate3d(var(--packet-x), var(--packet-y), 0) scale(1.2); }
}

@keyframes v13-ai-status { 0%, 100% { opacity: 0.45; } 50% { opacity: 1; } }
@keyframes v13-pipeline-card { 0%, 100% { transform: translate(-50%, -50%) translateY(3px); } 50% { transform: translate(-50%, -50%) translateY(-6px); } }
@keyframes v13-pipeline-signal { 0% { opacity: 0; transform: translateX(0); } 8% { opacity: 1; } 92% { opacity: 1; } 100% { opacity: 0; transform: translateX(76vw); } }
@keyframes v13-swarm-core { 0%, 100% { border-radius: 38% 62% 58% 42% / 44% 38% 62% 56%; transform: translate(-50%, -50%) rotate(-2deg); } 50% { border-radius: 58% 42% 39% 61% / 39% 59% 41% 61%; transform: translate(-50%, -50%) rotate(3deg); } }
@keyframes v13-swarm-agent { 0%, 100% { transform: translate3d(0, 4px, 0); } 50% { transform: translate3d(0, -8px, 0); } }

.version-v13 .current-ai .current-editorial-image img {
  position: relative;
  z-index: 1;
  object-position: 43% center;
  filter: contrast(1.09) saturate(0.9) brightness(0.88);
}

.version-v13 .current-ai .current-editorial-image::after {
  z-index: 2;
  background:
    linear-gradient(90deg, rgba(13, 45, 32, 0.18), transparent 48%),
    linear-gradient(180deg, transparent 55%, rgba(6, 23, 16, 0.42));
}

.version-v13 .current-ai .current-editorial-meta .section-label,
.version-v13 .current-ai .current-editorial-copy .current-kicker,
.version-v13 .current-ai .current-editorial-meta > p:last-child {
  color: rgba(16, 36, 29, 0.72);
}

.version-v13 .current-ai .current-editorial-lead {
  color: rgba(16, 36, 29, 0.78);
}

.version-v13 .current-ai .button {
  border-color: var(--ink);
  color: var(--paper-bright);
  background: var(--ink);
}

.version-v13 .current-ai .button:hover {
  color: var(--ink);
  background: var(--paper-bright);
}

.version-v13 .current-ai-grid {
  position: absolute;
  z-index: 3;
  inset: 0;
  pointer-events: none;
  opacity: 0.5;
  background-image:
    linear-gradient(rgba(207, 255, 101, 0.16) 1px, transparent 1px),
    linear-gradient(90deg, rgba(207, 255, 101, 0.16) 1px, transparent 1px);
  background-size: 72px 72px;
  mask-image: linear-gradient(90deg, #000, transparent 72%);
}

.version-v13 .current-ai-grid i {
  position: absolute;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--signal);
  box-shadow: 0 0 0 7px rgba(207, 255, 101, 0.14), 0 0 24px rgba(207, 255, 101, 0.8);
  animation: v13-ai-node 6s ease-in-out infinite;
}

.version-v13 .current-ai-grid i:nth-child(1) { top: 18%; left: 14%; }
.version-v13 .current-ai-grid i:nth-child(2) { top: 36%; left: 58%; animation-delay: -1.5s; }
.version-v13 .current-ai-grid i:nth-child(3) { top: 72%; left: 29%; animation-delay: -3s; }
.version-v13 .current-ai-grid i:nth-child(4) { top: 81%; left: 78%; animation-delay: -4.5s; }

/* Podcast: a restrained energy sweep through the editorial panel. */
.version-v13 .current-editorial-copy {
  position: relative;
  overflow: hidden;
  isolation: isolate;
}

.version-v13 .current-editorial-copy::after {
  position: absolute;
  z-index: -1;
  top: -35%;
  bottom: -35%;
  left: -42%;
  width: 32%;
  content: '';
  opacity: 0;
  background: linear-gradient(90deg, transparent, rgba(206, 255, 104, 0.2), transparent);
  transform: translate3d(0, 0, 0) skewX(-14deg);
  animation: v13-podcast-sweep 11s ease-in-out 1.5s infinite;
  will-change: transform, opacity;
}

/* Projects: a travelling charge touches one project row after another. */
.version-v13 .project-summary {
  position: relative;
  overflow: hidden;
}

.version-v13 .project-summary::after {
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  height: 2px;
  content: '';
  opacity: 0;
  background: linear-gradient(90deg, transparent 0%, #9fdb38 42%, #ceff68 50%, transparent 100%);
  transform: translate3d(-105%, 0, 0) scaleX(0.35);
  animation: v13-project-charge 13s cubic-bezier(0.55, 0, 0.2, 1) var(--row-delay, 0s) infinite;
  will-change: transform, opacity;
}

.version-v13 .project-item:nth-child(1) .project-summary { --row-delay: 0s; }
.version-v13 .project-item:nth-child(2) .project-summary { --row-delay: 1.1s; }
.version-v13 .project-item:nth-child(3) .project-summary { --row-delay: 2.2s; }
.version-v13 .project-item:nth-child(4) .project-summary { --row-delay: 3.3s; }
.version-v13 .project-item:nth-child(5) .project-summary { --row-delay: 4.4s; }
.version-v13 .project-item:nth-child(6) .project-summary { --row-delay: 5.5s; }
.version-v13 .project-item:nth-child(7) .project-summary { --row-delay: 6.6s; }
.version-v13 .project-item:nth-child(8) .project-summary { --row-delay: 7.7s; }

/* Projects: the geometric sketch stays alive without moving the project rows. */
.version-v13 .projects-molecule svg {
  transform-origin: 52% 46%;
  animation: v13-projects-geometry 17s ease-in-out infinite;
  will-change: transform;
}

/* About: keep the portrait calm and move only the molecular field on the right. */
.version-v13 .about-copy {
  position: relative;
  overflow: hidden;
  isolation: isolate;
}

.version-v13 .about-copy > * {
  position: relative;
  z-index: 2;
}

.version-v13 .about-copy::before {
  position: absolute;
  z-index: 0;
  inset: -12%;
  content: '';
  opacity: 0.24;
  background-image: var(--hex-pattern);
  background-size: 168px auto;
  mask-image: radial-gradient(circle at 76% 42%, #000 0 26%, rgba(0, 0, 0, 0.7) 48%, transparent 75%);
  animation: v13-about-pattern-breathe 9s ease-in-out infinite;
  will-change: opacity;
}

.version-v13 .about-copy::after {
  content: none;
}

/* Career: a single bright packet travels down the timeline. */
.version-v13 .career-list::after {
  position: absolute;
  z-index: 1;
  top: 2rem;
  left: 124px;
  width: 5px;
  height: 14%;
  border-radius: 999px;
  content: '';
  opacity: 0;
  background: linear-gradient(180deg, transparent, var(--signal) 52%, transparent);
  box-shadow: 0 0 16px rgba(206, 255, 104, 0.72);
  transform: translate3d(0, -110%, 0);
  animation: v13-career-signal 10s ease-in-out infinite;
  will-change: transform, opacity;
}

.version-v13 .career-list li.is-current .career-node {
  animation: v13-career-node 4.8s ease-in-out infinite;
}

.version-v13 .career-logo.logo-ai-lab {
  border-color: var(--signal);
  color: var(--forest-dark);
  background: var(--signal);
}

.version-v13 .career-logo-text {
  font-size: 0.88rem;
  letter-spacing: -0.04em;
}

/* The clipped animated outline caused isolated green antialiasing pixels. */
.version-v13 .current-editorial-hex {
  display: none;
}

.version-v13 .contact-form-section {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  border-top: 1px solid rgba(207, 255, 101, 0.24);
  border-bottom-color: rgba(251, 250, 244, 0.14);
  color: var(--paper-bright);
  background:
    radial-gradient(circle at 12% 18%, rgba(207, 255, 101, 0.13), transparent 34%),
    linear-gradient(135deg, #071c14 0%, #0d2d21 55%, #071c14 100%);
}

.version-v13 .contact-form-section::before {
  position: absolute;
  z-index: -1;
  inset: 0;
  content: '';
  opacity: 0.42;
  background-image: var(--hex-pattern);
  mask-image: linear-gradient(90deg, #000, transparent 58%);
}

.version-v13 .contact-form-section::after {
  position: absolute;
  z-index: -1;
  right: -8%;
  bottom: -46%;
  width: min(48vw, 720px);
  aspect-ratio: 1;
  border-radius: 50%;
  content: '';
  opacity: 0.46;
  background: radial-gradient(circle, rgba(206, 255, 104, 0.3), rgba(206, 255, 104, 0.06) 48%, transparent 72%);
  transform: translate3d(0, 0, 0) scale(0.88);
  animation: v13-contact-light 15s ease-in-out infinite;
  will-change: transform, opacity;
}

/* Off-screen sections do not spend animation time or GPU layers. */
.js .version-v13 [data-ambient]:not(.ambient-active) *,
.js .version-v13 [data-ambient]:not(.ambient-active)::before,
.js .version-v13 [data-ambient]:not(.ambient-active)::after,
.js .version-v13 [data-ambient]:not(.ambient-active) *::before,
.js .version-v13 [data-ambient]:not(.ambient-active) *::after {
  animation-play-state: paused !important;
}

.version-v13 .contact-form-intro,
.version-v13 .contact-form {
  position: relative;
  z-index: 1;
}

.version-v13 .contact-form-intro .section-label {
  color: var(--signal);
}

.version-v13 .contact-form-intro h2 {
  color: var(--paper-bright);
  text-wrap: balance;
}

.version-v13 .contact-form-intro > p:last-child {
  color: rgba(251, 250, 244, 0.7);
  line-height: 1.55;
}

.version-v13 .contact-form {
  padding: clamp(1.4rem, 2.6vw, 2.6rem);
  gap: 1rem;
  border: 1px solid rgba(251, 250, 244, 0.18);
  border-radius: 28px;
  color: var(--ink);
  background: rgba(246, 244, 232, 0.97);
  box-shadow: 0 32px 90px rgba(0, 8, 5, 0.3);
}

.version-v13 .contact-field {
  padding: 1rem 1.1rem 0.85rem;
  gap: 0.45rem;
  border: 1px solid rgba(16, 36, 29, 0.2);
  border-radius: 16px;
  background: #fffef8;
  transition:
    border-color 180ms ease,
    box-shadow 180ms ease,
    transform 220ms var(--ease);
}

.version-v13 .contact-field label {
  color: rgba(16, 36, 29, 0.72);
  font-size: 0.78rem;
}

.version-v13 .contact-field input,
.version-v13 .contact-field textarea {
  padding: 0.25rem 0 0.45rem;
  color: var(--ink);
  caret-color: var(--forest);
}

.version-v13 .contact-field input::placeholder,
.version-v13 .contact-field textarea::placeholder {
  color: rgba(16, 36, 29, 0.38);
}

.version-v13 .contact-field input {
  font-size: clamp(1.25rem, 1.8vw, 1.7rem);
  letter-spacing: -0.025em;
}

.version-v13 .contact-field textarea {
  min-height: 210px;
  font-size: 1.1rem;
}

.version-v13 .contact-field:focus-within {
  border-color: var(--forest);
  box-shadow: 0 0 0 3px rgba(16, 54, 41, 0.12);
  transform: translateY(-1px);
}

.version-v13 .contact-form-footer {
  margin-top: 0.35rem;
}

.version-v13 .contact-form-footer button {
  min-height: 60px;
  border-color: var(--signal);
  color: var(--forest-dark);
  background: var(--signal);
  box-shadow: 0 12px 28px rgba(74, 100, 28, 0.2);
}

.version-v13 .contact-form-footer button:hover {
  border-color: var(--forest-dark);
  color: var(--paper-bright);
  background: var(--forest-dark);
}

.version-v13 .contact-form-footer button[aria-disabled='true'] {
  cursor: wait;
  opacity: 0.62;
  transform: none;
}

.version-v13 .contact-status[data-state='pending'] {
  color: rgba(16, 36, 29, 0.62);
}

.version-v13 .contact-form-footer p {
  color: rgba(16, 36, 29, 0.62);
}

@keyframes v13-podcast-sweep {
  0%, 12%, 100% { opacity: 0; transform: translate3d(0, 0, 0) skewX(-14deg); }
  24% { opacity: 0.55; }
  52% { opacity: 0.12; transform: translate3d(470%, 0, 0) skewX(-14deg); }
  58% { opacity: 0; transform: translate3d(470%, 0, 0) skewX(-14deg); }
}

@keyframes v13-ai-node {
  0%, 100% { opacity: 0.4; transform: scale(0.7); }
  45% { opacity: 1; transform: scale(1.18); }
}

@keyframes v13-project-charge {
  0%, 8%, 100% { opacity: 0; transform: translate3d(-105%, 0, 0) scaleX(0.35); }
  13% { opacity: 0.85; }
  24% { opacity: 0.12; transform: translate3d(105%, 0, 0) scaleX(0.35); }
  27% { opacity: 0; transform: translate3d(105%, 0, 0) scaleX(0.35); }
}

@keyframes v13-projects-geometry {
  0%, 100% { transform: translate3d(0, 0, 0) rotate(-0.45deg) scale(0.985); }
  42% { transform: translate3d(-13px, 9px, 0) rotate(0.75deg) scale(1.018); }
  72% { transform: translate3d(6px, -5px, 0) rotate(0.2deg) scale(1); }
}

@keyframes v13-about-pattern-breathe {
  0%, 100% { opacity: 0.18; }
  50% { opacity: 0.34; }
}

@keyframes v13-career-signal {
  0%, 10%, 100% { opacity: 0; transform: translate3d(0, -110%, 0); }
  18% { opacity: 0.95; }
  75% { opacity: 0.8; }
  88% { opacity: 0; transform: translate3d(0, 610%, 0); }
}

@keyframes v13-career-node {
  0%, 100% { box-shadow: 0 0 0 4px rgba(206, 255, 104, 0.1); transform: scale(0.9); }
  50% { box-shadow: 0 0 0 9px rgba(206, 255, 104, 0); transform: scale(1.2); }
}

@keyframes v13-contact-light {
  0%, 100% { opacity: 0.32; transform: translate3d(-8%, 5%, 0) scale(0.86); }
  50% { opacity: 0.62; transform: translate3d(9%, -10%, 0) scale(1.08); }
}

@media (max-width: 900px) {
  .version-v13 .current-editorial {
    min-height: 0;
  }

  .version-v13 .current-ai {
    grid-template-columns: 1fr;
    margin-bottom: 32px;
  }

  .version-v13 .current-ai .current-editorial-copy {
    order: 1;
  }

  .version-v13 .current-ai .current-editorial-image {
    order: 2;
    min-height: 0;
    aspect-ratio: 16 / 10;
  }
}

@media (max-width: 720px) {
  .version-v13 .career-list::after {
    left: 3px;
  }
}

@media (max-width: 640px) {
  .version-v13 .current-editorial-copy {
    order: 1;
  }

  .version-v13 .current-editorial-image {
    order: 2;
  }

  .version-v13 .current-ai {
    grid-template-columns: 1fr;
    margin-bottom: 36px;
  }

  .version-v13 .current-ai .current-editorial-copy {
    order: 1;
  }

  .version-v13 .current-ai .current-editorial-image {
    order: 2;
    aspect-ratio: 16 / 11;
    min-height: 0;
  }

  .version-v13 .ai-network-core {
    width: 88px;
  }

  .version-v13 .ai-agent-node {
    width: 56px;
  }

  .version-v13 .ai-agent-node.node-a { top: 16%; left: 9%; }
  .version-v13 .ai-agent-node.node-b { top: 17%; right: 8%; }
  .version-v13 .ai-agent-node.node-c { bottom: 13%; left: 8%; }
  .version-v13 .ai-agent-node.node-d { right: 9%; bottom: 12%; }

  .version-v13 .ai-network-lines .packet-a { --packet-x: -120px; --packet-y: -75px; }
  .version-v13 .ai-network-lines .packet-b { --packet-x: 118px; --packet-y: -74px; }
  .version-v13 .ai-network-lines .packet-c { --packet-x: -122px; --packet-y: 78px; }
  .version-v13 .ai-network-lines .packet-d { --packet-x: 120px; --packet-y: 77px; }

  .version-v13 .ai-pipeline-stage {
    width: 76px;
    border-radius: 12px;
  }

  .version-v13 .ai-swarm-agent {
    width: 52px;
  }

  .version-v13 .ai-swarm-core {
    width: 96px;
  }

  .version-v13 .contact-form-section {
    gap: 2.7rem;
  }

  .version-v13 .contact-form-intro h2 {
    margin-top: 2.2rem;
    font-size: clamp(2.8rem, 14vw, 4rem);
  }

  .version-v13 .contact-form {
    padding: 1rem;
    border-radius: 20px;
  }

  .version-v13 .contact-field {
    border-radius: 13px;
  }

  .version-v13 .contact-field textarea {
    min-height: 180px;
  }

  .version-v13 .contact-form-footer button {
    width: 100%;
    justify-content: space-between;
  }
}

@media (prefers-reduced-motion: reduce) {
  .version-v13 .hero::before,
  .version-v13 .cluster-a,
  .version-v13 .cluster-b,
  .version-v13 .portrait-hex,
  .version-v13 .portrait-hex::before,
  .version-v13 .energy-trace,
  .version-v13 .energy-ring,
  .version-v13 .energy-core,
  .version-v13 .hero-word-charge,
  .version-v13 .current-editorial-copy::after,
  .version-v13 .current-ai-grid i,
  .version-v13 .ai-network-core,
  .version-v13 .ai-agent-node,
  .version-v13 .ai-network-lines b,
  .version-v13 .ai-network-status i,
  .version-v13 .ai-pipeline-stage,
  .version-v13 .ai-pipeline-signal,
  .version-v13 .ai-swarm-core,
  .version-v13 .ai-swarm-agent,
  .version-v13 .projects-molecule svg,
  .version-v13 .project-summary::after,
  .version-v13 .about-copy::before,
  .version-v13 .about-copy::after,
  .version-v13 .career-list::after,
  .version-v13 .career-list li.is-current .career-node,
  .version-v13 .contact-form-section::after,
  body.version-v13.is-ready .molecule circle {
    animation: none;
  }

  .version-v13 .hero-reactor { display: none; }
}

/* KI-Wissensmanagement: eindeutiges Motiv, zwei saubere Wege und neue Marke. */
.version-v13 .current-ai .current-editorial-image > img {
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
  object-position:right center;
  filter:contrast(1.04) saturate(.96) brightness(.9);
}

.version-v13 .current-ai .current-editorial-image:hover > img {
  filter:contrast(1.06) saturate(1) brightness(.94);
}

.version-v13 .current-ai .current-links {
  display:flex;
  flex-wrap:wrap;
  gap:.75rem;
}

.version-v13 .current-ai .current-link-secondary {
  color:var(--ink);
  background:transparent;
}

.version-v13 .current-ai .current-link-secondary:hover {
  color:var(--paper-bright);
  background:var(--ink);
}

.version-v13 .project-links {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
}

.version-v13 .project-link-secondary {
  color: var(--paper-bright);
  background: var(--ink);
}

.version-v13 .project-link-secondary:hover {
  color: var(--ink);
  background: transparent;
}

.version-v13 .career-logo.logo-knowledge-system {
  width: 54px;
  padding: 0;
  overflow: visible;
  border: 0;
  border-radius: 0;
  background: transparent;
}

.version-v13 .career-list li.is-current .career-entry {
  grid-template-columns: 54px minmax(0, 1fr);
}

.version-v13 .career-logo.logo-knowledge-system img {
  width:100%;
  height:100%;
  object-fit:contain;
  filter: brightness(0) invert(1);
}

@media(max-width:640px){
  .version-v13 .current-ai .current-links{width:100%}
  .version-v13 .current-ai .current-links .button{
    width:100%;
    justify-content:space-between;
  }
}