@font-face {
  font-family: "Inter";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("assets/fonts/inter-latin.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: "Inter";
  font-style: normal;
  font-weight: 500 700;
  font-display: swap;
  src: url("assets/fonts/inter-latin.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: "Plus Jakarta Sans";
  font-style: normal;
  font-weight: 400 800;
  font-display: swap;
  src: url("assets/fonts/plus-jakarta-sans-latin.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: "Space Grotesk";
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
  src: url("assets/fonts/space-grotesk-latin.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

:root {
  color-scheme: dark;
  --void: #050806;
  --ink: #0a0f0b;
  --paper: #eef3e9;
  --muted: #93a494;
  --line: rgba(225, 245, 216, 0.16);
  --line-bright: rgba(223, 255, 206, 0.33);
  --acid: #bcf66d;
  --acid-soft: #93cf57;
  --moss: #466e39;
  --panel: rgba(14, 22, 15, 0.78);
  --serif: Iowan Old Style, Baskerville, Georgia, Times New Roman, serif;
  --sans: "Plus Jakarta Sans", sans-serif;
}

* {
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
  background: var(--void);
}

body {
  min-width: 320px;
  margin: 0;
  overflow-x: hidden;
  background: var(--void);
  color: var(--paper);
  font-family: "Inter Variable", "Inter", sans-serif;
  font-weight: 510;
  letter-spacing: -0.022em;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

button,
input {
  font: inherit;
}

button,
a {
  -webkit-tap-highlight-color: transparent;
}

a {
  color: inherit;
  text-decoration: none;
}

button {
  color: inherit;
}

button:focus-visible,
a:focus-visible,
input:focus-visible {
  outline: 2px solid var(--acid);
  outline-offset: 4px;
}

.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.skip-link {
  position: fixed;
  z-index: 100;
  top: 12px;
  left: 12px;
  transform: translateY(-150%);
  padding: 10px 14px;
  background: var(--acid);
  color: #0a100a;
  font-size: 0.74rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.skip-link:focus {
  transform: translateY(0);
}

.site-shell {
  position: relative;
  overflow: visible;
}

.site-header {
  position: fixed;
  z-index: 1000;
  top: 0;
  left: 0;
  width: 100%;
  padding: 26px clamp(22px, 4.3vw, 72px);
  transition: background 240ms ease, padding 240ms ease, border-color 240ms ease;
}

.site-header,
.site-header.is-scrolled {
  position: fixed !important;
  inset: 0 0 auto;
}

html {
  scroll-padding-top: 76px;
}

.site-header.is-scrolled {
  position: fixed;
  padding-top: 16px;
  padding-bottom: 16px;
  border-bottom: 1px solid rgba(221, 255, 207, 0.1);
  background: rgba(5, 8, 6, 0.74);
  backdrop-filter: blur(18px);
}

.header-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  max-width: 1500px;
  margin: 0 auto;
}

.brand {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  position: relative;
  z-index: 1;
}

.brand-icon {
  display: grid;
  width: 35px;
  height: 35px;
  place-items: center;
  overflow: hidden;
  border-radius: 50%;
  border: 1px solid rgba(205, 255, 178, 0.28);
  background: radial-gradient(circle, rgba(149, 221, 95, 0.22), rgba(21, 37, 19, 0.1) 65%);
  box-shadow: inset 0 0 16px rgba(190, 255, 135, 0.15), 0 0 20px rgba(134, 217, 89, 0.11);
}

.brand-icon img {
  width: 62px;
  max-width: none;
  transform: translateY(4px);
  filter: drop-shadow(0 0 5px rgba(183, 248, 111, 0.48));
}

.brand-name {
  font-size: 0.75rem;
  font-family: "Inter Variable", "Inter", sans-serif;
  font-weight: 510;
  letter-spacing: -0.022em;
}

.primary-nav {
  display: flex;
  align-items: center;
  gap: clamp(18px, 2.6vw, 42px);
  margin-left: auto;
  margin-right: clamp(20px, 3vw, 54px);
}

.primary-nav a,
.header-cta,
.hero-kicker,
.eyebrow,
.section-marker,
.defense-eyebrow,
.contact-label,
.site-footer p,
.console-title,
.console-footer,
.method-index {
  font-size: 0.66rem;
  font-weight: 750;
  letter-spacing: 0.13em;
  text-transform: uppercase;
}

.primary-nav a {
  position: relative;
  color: rgba(240, 247, 235, 0.75);
  transition: color 180ms ease;
}

.primary-nav a::after {
  position: absolute;
  right: 30%;
  bottom: -8px;
  left: 0;
  height: 1px;
  background: var(--acid);
  content: "";
  transform: scaleX(0);
  transform-origin: right;
  transition: transform 180ms ease;
}

.primary-nav a:hover,
.primary-nav a:focus-visible {
  color: var(--paper);
}

.primary-nav a:hover::after,
.primary-nav a:focus-visible::after {
  transform: scaleX(1);
  transform-origin: left;
}

.header-cta,
.contact-button {
  display: inline-flex;
  align-items: center;
  gap: 13px;
  padding: 12px 15px 12px 17px;
  border: 1px solid rgba(214, 255, 190, 0.28);
  border-radius: 999px;
  background: rgba(205, 249, 173, 0.08);
  cursor: pointer;
  transition: border-color 180ms ease, background 180ms ease, color 180ms ease, transform 180ms ease;
}

.header-cta svg,
.contact-button svg,
.text-link svg {
  width: 17px;
  height: 17px;
  fill: none;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 1.35;
}

.header-cta:hover,
.contact-button:hover {
  border-color: var(--acid);
  background: var(--acid);
  color: #091008;
  transform: translateY(-2px);
}

.menu-toggle {
  display: none;
  width: 43px;
  height: 43px;
  padding: 0;
  border: 1px solid rgba(226, 255, 211, 0.24);
  border-radius: 50%;
  background: rgba(4, 10, 5, 0.56);
  cursor: pointer;
}

.menu-toggle span:not(.sr-only) {
  display: block;
  width: 15px;
  height: 1px;
  margin: 4px auto;
  background: var(--paper);
  transition: transform 180ms ease;
}

.menu-toggle.is-open span:nth-of-type(2) {
  transform: translateY(2.5px) rotate(45deg);
}

.menu-toggle.is-open span:nth-of-type(3) {
  transform: translateY(-2.5px) rotate(-45deg);
}

.hero {
  position: relative;
  display: flex;
  min-height: max(780px, 100svh);
  isolation: isolate;
  align-items: stretch;
  overflow: hidden;
  border-bottom: 1px solid rgba(229, 255, 218, 0.14);
  background:
    radial-gradient(circle at 47% 44%, rgba(106, 156, 79, 0.22), transparent 22%),
    radial-gradient(circle at 71% 18%, rgba(149, 226, 89, 0.11), transparent 23%),
    radial-gradient(circle at 20% 95%, rgba(77, 119, 56, 0.17), transparent 36%),
    #050806;
}

.hero-grid,
.hero-grain,
.hero-aura,
.hero-beam,
.hero-orbit,
.hero-visual {
  position: absolute;
  pointer-events: none;
}

.hero-grid {
  z-index: -3;
  inset: 0;
  opacity: 0.52;
  background-image:
    linear-gradient(rgba(221, 255, 207, 0.06) 1px, transparent 1px),
    linear-gradient(90deg, rgba(221, 255, 207, 0.055) 1px, transparent 1px);
  background-size: 62px 62px;
  mask-image: linear-gradient(to bottom, transparent 0%, #000 25%, #000 75%, transparent 100%);
}

.hero-grain {
  z-index: -1;
  inset: 0;
  opacity: 0.1;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 240 240' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noise)' opacity='.75'/%3E%3C/svg%3E");
  mix-blend-mode: soft-light;
}

.hero-aura {
  z-index: -2;
  width: min(70vw, 1150px);
  aspect-ratio: 1.5;
  top: 7%;
  left: 50%;
  border-radius: 50%;
  transform: translateX(-50%);
  background: radial-gradient(ellipse, rgba(151, 232, 93, 0.2) 0%, rgba(90, 147, 62, 0.1) 37%, transparent 70%);
  filter: blur(16px);
}

.hero-beam {
  z-index: -1;
  width: min(62vw, 990px);
  height: 230%;
  top: -62%;
  left: 54%;
  transform: translateX(-50%) rotate(11deg);
  transform-origin: center;
  opacity: 0.8;
  background:
    linear-gradient(
      90deg,
      transparent 0%,
      rgba(105, 163, 72, 0.03) 36%,
      rgba(215, 255, 171, 0.38) 49.6%,
      rgba(220, 255, 179, 0.57) 50%,
      rgba(123, 211, 80, 0.12) 53%,
      transparent 75%
    );
  filter: blur(8px);
  mix-blend-mode: screen;
}

.hero-orbit {
  z-index: -1;
  border: 1px solid rgba(195, 255, 164, 0.14);
  border-radius: 50%;
}

.orbit-one {
  width: min(74vw, 1180px);
  aspect-ratio: 1;
  top: 7%;
  left: 50%;
  transform: translateX(-50%) rotate(-17deg);
}

.orbit-two {
  width: min(57vw, 850px);
  aspect-ratio: 1.5;
  top: 26%;
  left: 50%;
  transform: translateX(-50%) rotate(31deg);
}

.orbit-three {
  width: min(96vw, 1480px);
  aspect-ratio: 1;
  top: -8%;
  left: 50%;
  border-color: rgba(195, 255, 164, 0.09);
  transform: translateX(-50%) rotate(28deg);
}

.hero-visual {
  z-index: -1;
  inset: 0;
  overflow: hidden;
}

.hero-logo {
  position: absolute;
  width: clamp(340px, 42vw, 658px);
  top: clamp(88px, 11vh, 152px);
  left: 50%;
  opacity: 0.93;
  transform: translateX(-50%) rotate(-1.8deg);
  filter:
    drop-shadow(0 0 2px rgba(221, 255, 184, 0.9))
    drop-shadow(0 0 18px rgba(162, 239, 93, 0.52))
    drop-shadow(0 0 55px rgba(88, 172, 54, 0.34));
  animation: logo-float 6.2s ease-in-out infinite;
}

.logo-signal {
  position: absolute;
  width: clamp(340px, 45vw, 720px);
  aspect-ratio: 1;
  top: clamp(42px, 4vh, 80px);
  left: 50%;
  border: 1px solid rgba(198, 255, 172, 0.13);
  border-radius: 50%;
  transform: translateX(-50%);
  box-shadow:
    0 0 0 44px rgba(160, 239, 102, 0.025),
    0 0 0 88px rgba(160, 239, 102, 0.014),
    0 0 115px rgba(143, 225, 86, 0.2),
    inset 0 0 70px rgba(135, 217, 79, 0.07);
  animation: signal-breathe 4.6s ease-in-out infinite;
}

.hero-word {
  position: absolute;
  bottom: clamp(125px, 14vh, 172px);
  left: 50%;
  margin: 0;
  color: rgba(232, 248, 224, 0.89);
  font-size: clamp(5.8rem, 16.8vw, 18.5rem);
  font-weight: 540;
  letter-spacing: -0.095em;
  line-height: 0.7;
  white-space: nowrap;
  transform: translateX(-52%);
  text-shadow: 0 0 60px rgba(209, 255, 175, 0.13);
}

.visual-caption,
.visual-coordinate {
  color: rgba(227, 247, 218, 0.49);
  font-size: 0.56rem;
  font-weight: 700;
  letter-spacing: 0.16em;
}

.visual-caption {
  position: absolute;
  bottom: 100px;
  left: 50%;
  transform: translateX(-50%);
  white-space: nowrap;
}

.visual-coordinate {
  position: absolute;
  top: 36%;
}

.coordinate-left {
  left: clamp(25px, 8vw, 150px);
}

.coordinate-right {
  right: clamp(25px, 8vw, 150px);
}

.visual-rule {
  position: absolute;
  top: 39%;
  width: clamp(45px, 7vw, 130px);
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(214, 255, 192, 0.44));
}

.rule-one {
  left: 0;
}

.rule-two {
  right: 0;
  transform: rotate(180deg);
}

.hero-content {
  position: relative;
  z-index: 2;
  display: flex;
  width: 100%;
  max-width: 1500px;
  min-height: max(780px, 100svh);
  margin: 0 auto;
  padding: clamp(116px, 15vh, 160px) clamp(22px, 4.3vw, 72px) 125px;
  flex-direction: column;
  justify-content: flex-end;
}

.eyebrow,
.hero-kicker,
.section-marker,
.defense-eyebrow,
.contact-label {
  color: var(--acid);
}

.eyebrow {
  display: inline-flex;
  align-items: center;
  align-self: flex-start;
  gap: 9px;
  color: rgba(230, 246, 224, 0.78);
}

.eyebrow-dot,
.live-dot,
.console-orb,
.console-status i {
  display: inline-block;
  width: 7px;
  height: 7px;
  flex: 0 0 auto;
  border-radius: 50%;
  background: var(--acid);
  box-shadow: 0 0 12px rgba(188, 246, 109, 0.92);
}

.hero-copy {
  max-width: 580px;
  margin-top: auto;
}

.hero-kicker {
  margin: 0 0 14px;
}

.hero h1,
.intro-section h2,
.signal-section h2,
.method-section h2,
.contact-section h2 {
  margin: 0;
  font-family: var(--serif);
  font-weight: 400;
  letter-spacing: -0.055em;
  line-height: 0.92;
}

.hero h1 {
  max-width: 720px;
  font-size: clamp(3rem, 5.5vw, 5.75rem);
  text-shadow: 0 3px 34px rgba(0, 0, 0, 0.42);
}

h1 em,
h2 em {
  color: var(--acid);
  font-style: italic;
}

.hero-description {
  max-width: 430px;
  margin: 23px 0 0;
  color: rgba(229, 240, 225, 0.73);
  font-size: clamp(0.91rem, 1.1vw, 1.02rem);
  line-height: 1.65;
}

.signal-form {
  width: min(100%, 500px);
  margin-top: 30px;
}

.signal-form > label {
  display: block;
  margin-bottom: 10px;
  color: rgba(240, 249, 237, 0.77);
  font-size: 0.69rem;
  font-weight: 700;
  letter-spacing: 0.09em;
  text-transform: uppercase;
}

.signal-input-wrap {
  display: flex;
  align-items: center;
  border: 1px solid rgba(223, 255, 208, 0.27);
  border-radius: 8px;
  background: rgba(8, 14, 9, 0.64);
  box-shadow: inset 0 0 34px rgba(164, 228, 110, 0.03), 0 9px 36px rgba(0, 0, 0, 0.25);
  backdrop-filter: blur(14px);
  transition: border-color 200ms ease, box-shadow 200ms ease;
}

.signal-input-wrap:focus-within {
  border-color: rgba(192, 246, 122, 0.76);
  box-shadow: inset 0 0 34px rgba(164, 228, 110, 0.08), 0 0 0 4px rgba(174, 241, 109, 0.08);
}

.signal-input-wrap input {
  min-width: 0;
  flex: 1;
  padding: 17px 0 17px 17px;
  border: 0;
  outline: 0;
  background: transparent;
  color: var(--paper);
  font-size: 0.86rem;
}

.signal-input-wrap input::placeholder {
  color: rgba(221, 237, 214, 0.42);
}

.signal-input-wrap button {
  display: grid;
  width: 41px;
  height: 41px;
  place-items: center;
  margin-right: 7px;
  border: 1px solid rgba(205, 251, 157, 0.67);
  border-radius: 5px;
  background: rgba(189, 245, 115, 0.14);
  color: var(--acid);
  cursor: pointer;
  transition: background 180ms ease, color 180ms ease, transform 180ms ease;
}

.signal-input-wrap button:hover {
  background: var(--acid);
  color: #0a1109;
  transform: translateX(2px);
}

.signal-input-wrap button svg {
  width: 17px;
  height: 17px;
  fill: none;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 1.4;
}

.form-status {
  min-height: 1.3rem;
  margin: 9px 0 0;
  color: rgba(211, 234, 202, 0.45);
  font-size: 0.69rem;
  line-height: 1.45;
}

.form-status.is-success {
  color: var(--acid);
}

.form-status.is-error {
  color: #e9b38d;
}

.hero-bottom {
  position: absolute;
  z-index: 3;
  right: clamp(22px, 4.3vw, 72px);
  bottom: 29px;
  left: clamp(22px, 4.3vw, 72px);
  display: grid;
  align-items: center;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 20px;
  max-width: 1500px;
  margin: 0 auto;
  color: rgba(219, 236, 212, 0.52);
  font-size: 0.64rem;
  letter-spacing: 0.09em;
}

.live-status {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  color: rgba(231, 244, 226, 0.8);
  font-size: 0.61rem;
  font-weight: 750;
  letter-spacing: 0.12em;
}

.live-dot {
  width: 6px;
  height: 6px;
  animation: blink 1.7s ease-in-out infinite;
}

.hero-bottom p {
  margin: 0;
  text-align: center;
}

.scroll-cue {
  display: inline-flex;
  align-items: center;
  justify-content: flex-end;
  gap: 11px;
  color: rgba(235, 247, 230, 0.77);
  font-size: 0.64rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

.scroll-line {
  width: 36px;
  height: 1px;
  background: var(--acid);
  transition: width 180ms ease;
}

.scroll-cue:hover .scroll-line {
  width: 52px;
}

.intro-section,
.method-section {
  position: relative;
  max-width: 1500px;
  margin: 0 auto;
  padding: clamp(88px, 12vw, 180px) clamp(22px, 7.2vw, 116px);
}

.section-marker {
  display: flex;
  align-items: center;
  gap: 13px;
}

.section-marker::before {
  width: 32px;
  height: 1px;
  background: currentColor;
  content: "";
}

.section-marker span:first-child {
  color: rgba(227, 245, 219, 0.55);
}

.section-marker span:last-child {
  color: var(--acid);
}

.intro-layout {
  display: grid;
  align-items: end;
  grid-template-columns: minmax(0, 1.25fr) minmax(270px, 0.55fr);
  gap: clamp(30px, 10vw, 176px);
  margin-top: clamp(38px, 5.5vw, 78px);
}

.intro-section h2,
.signal-section h2,
.method-section h2,
.contact-section h2 {
  font-size: clamp(2.8rem, 5.4vw, 6.3rem);
}

.intro-copy {
  padding-bottom: 8px;
}

.intro-copy p,
.method-head > p,
.contact-inner > p {
  margin: 0;
  color: rgba(203, 220, 198, 0.71);
  font-size: 0.97rem;
  line-height: 1.75;
}

.text-link {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  margin-top: 27px;
  color: var(--acid);
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.11em;
  text-transform: uppercase;
}

.text-link svg {
  transition: transform 180ms ease;
}

.text-link:hover svg {
  transform: translateX(4px);
}

.defense-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  margin-top: clamp(60px, 9vw, 132px);
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
}

.defense-item {
  position: relative;
  min-height: 307px;
  padding: 24px clamp(20px, 2.3vw, 40px) 31px;
  overflow: hidden;
  border-right: 1px solid var(--line);
  background:
    radial-gradient(circle at 80% 0%, rgba(165, 239, 102, 0.1), transparent 30%),
    rgba(11, 17, 11, 0.23);
  transition: background 220ms ease, transform 220ms ease;
}

.defense-item:last-child {
  border-right: 0;
}

.defense-item::after {
  position: absolute;
  right: -34px;
  bottom: -64px;
  width: 190px;
  height: 190px;
  border: 1px solid rgba(186, 255, 137, 0.13);
  border-radius: 50%;
  content: "";
  transition: transform 400ms ease;
}

.defense-item:hover {
  background:
    radial-gradient(circle at 80% 0%, rgba(165, 239, 102, 0.16), transparent 34%),
    rgba(21, 34, 20, 0.65);
}

.defense-item:hover::after {
  transform: scale(1.22);
}

.defense-number {
  display: block;
  color: rgba(221, 244, 212, 0.39);
  font-size: 0.67rem;
  font-weight: 700;
  letter-spacing: 0.13em;
}

.defense-item > div {
  position: absolute;
  right: clamp(20px, 2.3vw, 40px);
  bottom: 32px;
  left: clamp(20px, 2.3vw, 40px);
}

.defense-eyebrow {
  color: var(--acid);
}

.defense-item h3 {
  margin: 10px 0 12px;
  font-family: var(--serif);
  font-size: clamp(1.63rem, 2.1vw, 2.2rem);
  font-weight: 400;
  letter-spacing: -0.04em;
}

.defense-item p {
  max-width: 275px;
  margin: 0;
  color: rgba(207, 226, 200, 0.61);
  font-size: 0.82rem;
  line-height: 1.65;
}

.defense-arrow {
  position: absolute;
  top: 21px;
  right: clamp(20px, 2.3vw, 40px);
  color: var(--acid);
  font-size: 1.12rem;
  transition: transform 200ms ease;
}

.defense-item:hover .defense-arrow {
  transform: translate(3px, -3px);
}

.signal-section {
  position: relative;
  min-height: 800px;
  padding: clamp(90px, 12vw, 180px) clamp(22px, 7.2vw, 116px);
  overflow: hidden;
  border-top: 1px solid rgba(221, 255, 207, 0.12);
  border-bottom: 1px solid rgba(221, 255, 207, 0.12);
  background:
    radial-gradient(circle at 50% 63%, rgba(157, 242, 87, 0.1), transparent 30%),
    #081008;
}

.signal-backdrop,
.signal-grid,
.signal-ring,
.signal-pulse {
  position: absolute;
  pointer-events: none;
}

.signal-backdrop {
  inset: 0;
  overflow: hidden;
}

.signal-grid {
  inset: 0;
  opacity: 0.25;
  background-image:
    linear-gradient(rgba(208, 255, 185, 0.08) 1px, transparent 1px),
    linear-gradient(90deg, rgba(208, 255, 185, 0.08) 1px, transparent 1px);
  background-size: 46px 46px;
  mask-image: linear-gradient(90deg, transparent 0, #000 25%, #000 75%, transparent 100%);
}

.signal-ring {
  top: 50%;
  left: 50%;
  border: 1px solid rgba(209, 255, 179, 0.11);
  border-radius: 50%;
  transform: translate(-50%, -38%);
}

.ring-a {
  width: min(80vw, 1100px);
  aspect-ratio: 1;
}

.ring-b {
  width: min(56vw, 720px);
  aspect-ratio: 1;
  border-color: rgba(209, 255, 179, 0.18);
}

.signal-pulse {
  top: 50%;
  left: 50%;
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background: var(--acid);
  box-shadow: 0 0 0 15px rgba(188, 246, 109, 0.07), 0 0 55px rgba(188, 246, 109, 0.7);
  transform: translate(-50%, -38%);
  animation: ping 3.6s ease-out infinite;
}

.signal-header,
.signal-console {
  position: relative;
  z-index: 1;
  max-width: 1268px;
  margin: 0 auto;
}

.section-marker-light span:first-child,
.section-marker-light span:last-child {
  color: rgba(230, 249, 222, 0.75);
}

.signal-header h2 {
  max-width: 1000px;
  margin-top: clamp(34px, 4.6vw, 70px);
}

.signal-console {
  margin-top: clamp(64px, 9vw, 130px);
  border: 1px solid rgba(210, 255, 183, 0.26);
  background: rgba(5, 12, 6, 0.53);
  box-shadow: 0 32px 95px rgba(0, 0, 0, 0.36), inset 0 0 65px rgba(161, 237, 96, 0.035);
  backdrop-filter: blur(18px);
}

.console-topbar,
.console-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 14px 18px;
  color: rgba(220, 242, 210, 0.6);
}

.console-topbar {
  border-bottom: 1px solid rgba(210, 255, 183, 0.16);
}

.console-title {
  display: flex;
  align-items: center;
  gap: 9px;
}

.console-orb {
  width: 5px;
  height: 5px;
}

.console-time {
  color: rgba(217, 247, 205, 0.41);
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 0.67rem;
  letter-spacing: 0.12em;
}

.console-body {
  display: flex;
  height: clamp(190px, 22vw, 282px);
}

.console-index {
  display: flex;
  width: 49px;
  flex-direction: column;
  justify-content: space-between;
  padding: 20px 14px;
  border-right: 1px solid rgba(210, 255, 183, 0.1);
  color: rgba(217, 247, 205, 0.35);
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 0.58rem;
}

.console-trace {
  position: relative;
  flex: 1;
  overflow: hidden;
}

.console-trace::before,
.console-trace::after {
  position: absolute;
  z-index: 1;
  right: 0;
  left: 0;
  height: 1px;
  background: rgba(209, 255, 183, 0.08);
  content: "";
}

.console-trace::before {
  top: 33.333%;
}

.console-trace::after {
  top: 66.666%;
}

.console-trace svg {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  overflow: visible;
}

.console-trace path {
  fill: none;
  stroke: var(--acid);
  stroke-width: 1.8;
  filter: drop-shadow(0 0 5px rgba(188, 246, 109, 0.72));
  stroke-dasharray: 1250;
  stroke-dashoffset: 1250;
  animation: trace-draw 4.5s ease-in-out infinite alternate;
}

.console-trace path.trace-soft {
  opacity: 0.33;
  stroke: #c9f5a3;
  stroke-width: 1;
  animation-delay: -1.4s;
}

.console-footer {
  border-top: 1px solid rgba(210, 255, 183, 0.16);
  font-size: 0.59rem;
}

.console-status {
  display: flex;
  align-items: center;
  gap: 8px;
  color: var(--acid);
}

.console-status i {
  width: 5px;
  height: 5px;
}

.method-section {
  padding-bottom: clamp(91px, 13vw, 190px);
}

.method-head {
  display: grid;
  align-items: end;
  grid-template-columns: 1fr minmax(260px, 390px);
  gap: 60px;
}

.method-head > p {
  padding-bottom: 3px;
}

.method-section h2 {
  margin-top: clamp(45px, 7vw, 102px);
}

.method-list {
  margin: clamp(62px, 8vw, 120px) 0 0;
  padding: 0;
  border-top: 1px solid var(--line);
  list-style: none;
}

.method-list li {
  display: grid;
  grid-template-columns: minmax(70px, 0.35fr) minmax(0, 1.15fr) minmax(240px, 0.7fr);
  gap: clamp(18px, 3vw, 48px);
  align-items: center;
  min-height: 145px;
  padding: 22px 0;
  border-bottom: 1px solid var(--line);
  transition: padding 200ms ease, background 200ms ease;
}

.method-list li::after {
  grid-column: 3;
  justify-self: end;
  color: var(--acid);
  font-size: 1.1rem;
  content: "↗";
  transition: transform 200ms ease;
}

.method-list li:hover {
  padding-right: 18px;
  padding-left: 18px;
  background: rgba(165, 231, 106, 0.035);
}

.method-list li:hover::after {
  transform: translate(3px, -3px);
}

.method-index {
  color: var(--acid);
}

.method-list li > div {
  grid-column: 2;
}

.method-list h3 {
  margin: 0;
  font-family: var(--serif);
  font-size: clamp(1.55rem, 2.3vw, 2.4rem);
  font-weight: 400;
  letter-spacing: -0.045em;
}

.method-list p {
  grid-column: 3;
  margin: 0;
  color: rgba(204, 225, 198, 0.63);
  font-size: 0.84rem;
  line-height: 1.62;
}

.contact-section {
  position: relative;
  min-height: min(820px, 92svh);
  overflow: hidden;
  border-top: 1px solid rgba(220, 255, 204, 0.11);
  background:
    linear-gradient(110deg, rgba(3, 9, 4, 0.91) 0%, rgba(3, 9, 4, 0.64) 50%, rgba(14, 41, 16, 0.45) 100%),
    #081007;
}

.contact-section::before,
.contact-section::after {
  position: absolute;
  border-radius: 50%;
  content: "";
  pointer-events: none;
}

.contact-section::before {
  width: min(88vw, 1090px);
  aspect-ratio: 1;
  top: -46%;
  right: -14%;
  border: 1px solid rgba(204, 255, 173, 0.14);
  box-shadow: 0 0 0 70px rgba(176, 238, 111, 0.025), 0 0 0 140px rgba(176, 238, 111, 0.012);
}

.contact-section::after {
  width: min(69vw, 880px);
  aspect-ratio: 1;
  right: 5%;
  bottom: -59%;
  border: 1px solid rgba(204, 255, 173, 0.12);
}

.contact-glow {
  position: absolute;
  width: min(70vw, 900px);
  aspect-ratio: 1.5;
  top: -20%;
  right: -4%;
  background: radial-gradient(ellipse, rgba(168, 246, 91, 0.25), rgba(105, 183, 64, 0.08) 35%, transparent 67%);
  filter: blur(22px);
  pointer-events: none;
}

.contact-inner {
  position: relative;
  z-index: 1;
  max-width: 1500px;
  padding: clamp(102px, 15vw, 194px) clamp(22px, 7.2vw, 116px);
}

.contact-logo {
  position: absolute;
  z-index: -1;
  top: clamp(28px, 9vw, 126px);
  right: max(4vw, 28px);
  width: min(40vw, 550px);
  opacity: 0.52;
  filter: drop-shadow(0 0 28px rgba(184, 250, 109, 0.32));
}

.contact-label {
  margin: 0 0 16px;
}

.contact-section h2 {
  position: relative;
  max-width: 750px;
  font-size: clamp(3.15rem, 7vw, 7rem);
}

.contact-inner > p {
  max-width: 410px;
  margin-top: 24px;
}

.contact-button {
  margin-top: 35px;
  padding: 15px 19px;
  border-color: rgba(218, 255, 194, 0.44);
  background: rgba(169, 238, 104, 0.12);
  font-size: 0.71rem;
  font-weight: 800;
  letter-spacing: 0.11em;
  text-transform: uppercase;
}

.site-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  padding: 25px clamp(22px, 4.3vw, 72px);
  border-top: 1px solid rgba(220, 255, 204, 0.12);
  background: #050806;
}

.footer-brand .brand-icon {
  width: 28px;
  height: 28px;
}

.footer-brand .brand-icon img {
  width: 50px;
}

.footer-brand .brand-name {
  font-size: 0.66rem;
}

.site-footer p {
  margin: 0;
  color: rgba(218, 240, 209, 0.35);
}

.site-footer > a:last-child {
  color: rgba(224, 244, 216, 0.7);
  font-size: 0.67rem;
  font-weight: 750;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

.site-footer > a:last-child span {
  padding-left: 4px;
  color: var(--acid);
}

.hero {
  min-height: max(760px, 100svh);
  background: #000000;
  border-bottom-color: rgba(238, 205, 150, 0.13);
}

.hero-grid,
.hero-aura,
.hero-orbit {
  display: none;
}

.hero-grain {
  z-index: 1;
  opacity: 0.06;
}

.hero-shadow {
  position: absolute;
  z-index: -3;
  inset: 0;
  pointer-events: none;
  background:
    radial-gradient(ellipse at 14% 64%, rgba(109, 38, 12, 0.44), transparent 24%),
    linear-gradient(180deg, #010201 0%, #030303 44%, #090503 100%);
}

.hero-beam {
  z-index: -1;
  width: min(81vw, 1190px);
  height: min(20vw, 250px);
  top: 53%;
  left: 75%;
  opacity: 0.85;
  transform: translate(-50%, -50%) rotate(-3deg);
  background:
    linear-gradient(
      90deg,
      transparent 0%,
      rgba(126, 43, 16, 0.05) 14%,
      rgba(232, 183, 121, 0.2) 39%,
      rgba(255, 245, 222, 0.92) 72%,
      rgba(224, 237, 255, 0.55) 87%,
      transparent 100%
    );
  clip-path: polygon(0 47%, 100% 15%, 100% 83%, 0 62%);
  filter: blur(9px);
  mix-blend-mode: screen;
}

.hero-beam::after {
  position: absolute;
  inset: 25% -3% 25% 38%;
  border-radius: 50%;
  background: rgba(255, 245, 219, 0.47);
  content: "";
  filter: blur(36px);
}

.hero-platform {
  position: absolute;
  z-index: -1;
  width: min(84vw, 1210px);
  height: min(45vw, 590px);
  bottom: min(-30vw, -370px);
  left: min(-16vw, -170px);
  overflow: hidden;
  border-radius: 50%;
  background:
    radial-gradient(ellipse at 60% 17%, rgba(209, 82, 29, 0.76) 0%, rgba(102, 33, 10, 0.79) 27%, rgba(31, 10, 5, 0.96) 49%, #050404 71%);
  box-shadow:
    inset -42px 32px 96px rgba(255, 145, 68, 0.11),
    inset 0 -105px 130px rgba(0, 0, 0, 0.88),
    0 -19px 52px rgba(181, 61, 18, 0.22);
  transform: rotate(-5deg);
}

.hero-platform::before {
  position: absolute;
  top: 64%;
  right: 6%;
  bottom: -12%;
  left: 6%;
  border: 1px solid rgba(255, 206, 114, 0.88);
  border-top-color: rgba(255, 220, 151, 0.62);
  border-radius: 50%;
  content: "";
  filter: blur(0.2px);
  box-shadow: 0 0 9px rgba(255, 166, 70, 0.38);
}

.hero-platform::after {
  position: absolute;
  top: 49%;
  right: 0;
  bottom: -1px;
  left: 0;
  background: linear-gradient(180deg, rgba(0, 0, 0, 0.03), rgba(0, 0, 0, 0.9) 74%, #010101);
  content: "";
}

.hero-visual {
  z-index: 0;
  overflow: visible;
}

.logo-halo {
  position: absolute;
  width: clamp(168px, 22vw, 326px);
  aspect-ratio: 1;
  top: 59%;
  left: clamp(26%, 33vw, 38%);
  border-radius: 50%;
  background: radial-gradient(circle, rgba(209, 255, 155, 0.28), rgba(134, 215, 79, 0.09) 36%, transparent 71%);
  transform: translate(-50%, -50%);
  filter: blur(14px);
}

.hero-logo {
  z-index: 1;
  width: clamp(168px, 22vw, 326px);
  top: 59%;
  left: clamp(26%, 33vw, 38%);
  opacity: 0.98;
  transform: translate(-50%, -50%) rotate(-2deg);
  filter:
    drop-shadow(0 0 3px rgba(255, 247, 221, 0.86))
    drop-shadow(0 0 17px rgba(191, 247, 112, 0.78))
    drop-shadow(0 0 42px rgba(155, 220, 82, 0.52));
  animation: minimalist-logo-glow 5.2s ease-in-out infinite;
}

.hero-content {
  z-index: 2;
  min-height: max(760px, 100svh);
  padding: 0 clamp(22px, 4.3vw, 72px);
  align-items: center;
  justify-content: center;
}

.hero-copy {
  width: 100%;
  max-width: none;
  margin: 0;
  padding-left: clamp(140px, 20vw, 315px);
  text-align: center;
}

.hero h1 {
  max-width: none;
  color: rgba(251, 250, 246, 0.96);
  font-family: var(--sans);
  font-size: clamp(1.65rem, 3.2vw, 3.25rem);
  font-weight: 380;
  letter-spacing: -0.035em;
  line-height: 1.08;
  text-shadow: 0 2px 26px rgba(0, 0, 0, 0.58);
}

.hero-scroll {
  position: absolute;
  z-index: 3;
  right: clamp(22px, 4.3vw, 72px);
  bottom: 29px;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  color: rgba(245, 236, 218, 0.48);
  font-size: 0.61rem;
  font-weight: 700;
  letter-spacing: 0.13em;
  text-transform: uppercase;
  transition: color 180ms ease;
}

.hero-scroll span {
  width: 31px;
  height: 1px;
  background: rgba(251, 210, 130, 0.7);
  transition: width 180ms ease;
}

.hero-scroll:hover {
  color: #fff8e9;
}

.hero-scroll:hover span {
  width: 45px;
}

@keyframes minimalist-logo-glow {
  0%,
  100% {
    opacity: 0.86;
    transform: translate(-50%, -50%) rotate(-2deg) scale(0.98);
  }
  50% {
    opacity: 1;
    transform: translate(-50%, -50%) rotate(1deg) scale(1.025);
  }
}

.reveal {
  opacity: 0;
  transform: translateY(28px);
  transition: opacity 650ms ease, transform 650ms cubic-bezier(0.2, 0.7, 0.2, 1);
}

.reveal.is-visible {
  opacity: 1;
  transform: translateY(0);
}

@keyframes logo-float {
  0%,
  100% {
    transform: translateX(-50%) rotate(-1.8deg) translateY(0);
  }
  50% {
    transform: translateX(-50%) rotate(1deg) translateY(-12px);
  }
}

@keyframes signal-breathe {
  0%,
  100% {
    opacity: 0.72;
    transform: translateX(-50%) scale(0.97);
  }
  50% {
    opacity: 1;
    transform: translateX(-50%) scale(1.04);
  }
}

@keyframes trace-draw {
  0% {
    stroke-dashoffset: 1250;
    opacity: 0.38;
  }
  100% {
    stroke-dashoffset: 0;
    opacity: 0.98;
  }
}

@keyframes blink {
  0%,
  100% {
    opacity: 1;
  }
  50% {
    opacity: 0.2;
  }
}

@keyframes ping {
  0% {
    box-shadow: 0 0 0 0 rgba(188, 246, 109, 0.23), 0 0 55px rgba(188, 246, 109, 0.72);
  }
  70%,
  100% {
    box-shadow: 0 0 0 66px rgba(188, 246, 109, 0), 0 0 18px rgba(188, 246, 109, 0.25);
  }
}

@media (max-width: 860px) {
  .site-header {
    padding: 18px 20px;
  }

  .header-inner {
    position: relative;
  }

  .menu-toggle {
    display: block;
    order: 2;
    margin-left: auto;
  }

  .primary-nav {
    position: absolute;
    top: calc(100% + 13px);
    right: 0;
    left: 0;
    display: grid;
    gap: 0;
    margin: 0;
    padding: 8px;
    border: 1px solid rgba(220, 255, 204, 0.17);
    border-radius: 12px;
    background: rgba(7, 13, 8, 0.92);
    box-shadow: 0 20px 48px rgba(0, 0, 0, 0.31);
    opacity: 0;
    pointer-events: none;
    transform: translateY(-8px);
    transition: opacity 180ms ease, transform 180ms ease;
    backdrop-filter: blur(18px);
  }

  .primary-nav.is-open {
    opacity: 1;
    pointer-events: auto;
    transform: translateY(0);
  }

  .primary-nav a {
    padding: 14px 12px;
  }

  .primary-nav a::after {
    display: none;
  }

  .header-cta {
    display: none;
  }

  .hero {
    min-height: 820px;
  }

  .hero-content {
    min-height: 820px;
    padding: 111px 22px 115px;
  }

  .hero-logo {
    top: 115px;
    width: min(76vw, 475px);
  }

  .logo-signal {
    top: 74px;
    width: min(84vw, 540px);
  }

  .hero-word {
    bottom: 196px;
    font-size: clamp(4.7rem, 18vw, 10rem);
  }

  .visual-caption {
    bottom: 169px;
    font-size: 0.47rem;
  }

  .visual-coordinate,
  .visual-rule {
    display: none;
  }

  .hero-bottom {
    grid-template-columns: 1fr 1fr;
    padding-top: 17px;
    border-top: 1px solid rgba(227, 255, 215, 0.13);
  }

  .hero-bottom p {
    display: none;
  }

  .scroll-cue {
    grid-column: 2;
  }

  .intro-layout,
  .method-head {
    grid-template-columns: 1fr;
    gap: 30px;
  }

  .defense-grid {
    grid-template-columns: 1fr;
  }

  .defense-item {
    min-height: 236px;
    border-right: 0;
    border-bottom: 1px solid var(--line);
  }

  .defense-item:last-child {
    border-bottom: 0;
  }

  .method-list li {
    grid-template-columns: 54px 1fr 22px;
    gap: 14px;
    min-height: 128px;
  }

  .method-list li > div {
    grid-column: 2;
  }

  .method-list li::after {
    grid-column: 3;
    grid-row: 1;
  }

  .method-list p {
    display: none;
  }

  .contact-section {
    min-height: 720px;
  }

  .contact-logo {
    top: 70px;
    right: -12%;
    width: min(68vw, 430px);
    opacity: 0.39;
  }
}

@media (max-width: 520px) {
  .brand-name {
    font-size: 0.67rem;
  }

  .brand-icon {
    width: 31px;
    height: 31px;
  }

  .hero {
    min-height: 760px;
  }

  .hero-content {
    min-height: 760px;
    padding-bottom: 104px;
  }

  .hero-copy {
    margin-top: auto;
    padding-top: 246px;
  }

  .hero h1 {
    font-size: clamp(2.78rem, 12vw, 3.7rem);
  }

  .hero-description {
    margin-top: 18px;
    font-size: 0.86rem;
  }

  .signal-form {
    margin-top: 23px;
  }

  .signal-input-wrap input {
    padding: 14px 0 14px 14px;
    font-size: 0.75rem;
  }

  .signal-input-wrap button {
    width: 37px;
    height: 37px;
  }

  .hero-logo {
    top: 85px;
  }

  .logo-signal {
    top: 57px;
  }

  .hero-word {
    bottom: 134px;
    font-size: 23vw;
  }

  .visual-caption {
    bottom: 116px;
    max-width: 260px;
    overflow: hidden;
    font-size: 0.42rem;
    text-align: center;
    text-overflow: clip;
  }

  .hero-bottom {
    bottom: 19px;
  }

  .intro-section,
  .method-section,
  .signal-section {
    padding-right: 22px;
    padding-left: 22px;
  }

  .intro-section h2,
  .signal-section h2,
  .method-section h2,
  .contact-section h2 {
    font-size: clamp(2.67rem, 12.5vw, 4rem);
  }

  .defense-item {
    min-height: 232px;
  }

  .defense-item p {
    font-size: 0.78rem;
  }

  .console-topbar,
  .console-footer {
    padding: 11px 12px;
  }

  .console-footer span:first-child {
    display: none;
  }

  .console-body {
    height: 168px;
  }

  .console-index {
    width: 38px;
    padding: 14px 10px;
  }

  .contact-inner {
    padding: 109px 22px;
  }

  .contact-inner > p {
    max-width: 340px;
    font-size: 0.88rem;
  }

  .site-footer {
    flex-wrap: wrap;
    padding: 22px;
  }

  .site-footer p {
    width: 100%;
    order: 3;
    font-size: 0.54rem;
  }
}

@media (max-width: 860px) {
  .hero {
    min-height: 760px;
  }

  .hero-content {
    min-height: 760px;
    padding: 0 22px;
  }

  .hero-platform {
    width: 116vw;
    height: 64vw;
    bottom: -35vw;
    left: -36vw;
  }

  .hero-beam {
    width: 115vw;
    height: 34vw;
    top: 54%;
    left: 78%;
    filter: blur(9px);
  }

  .hero-logo,
  .logo-halo {
    top: 60%;
    left: 34%;
  }

  .hero-logo {
    width: clamp(145px, 32vw, 245px);
  }

  .logo-halo {
    width: clamp(170px, 37vw, 284px);
  }

  .hero-copy {
    padding-top: 16px;
    padding-left: 23vw;
  }

  .hero h1 {
    font-size: clamp(1.42rem, 4.4vw, 2.15rem);
  }
}

@media (max-width: 520px) {
  .hero {
    min-height: 670px;
  }

  .hero-content {
    min-height: 670px;
  }

  .hero-platform {
    width: 147vw;
    height: 82vw;
    bottom: -43vw;
    left: -64vw;
  }

  .hero-beam {
    width: 142vw;
    height: 46vw;
    top: 55%;
    left: 86%;
  }

  .hero-logo,
  .logo-halo {
    top: 61%;
    left: 35%;
  }

  .hero-logo {
    width: 138px;
  }

  .logo-halo {
    width: 176px;
  }

  .hero-copy {
    padding-top: 0;
    padding-left: 25vw;
  }

  .hero h1 {
    max-width: 250px;
    margin-left: auto;
    font-size: clamp(1.26rem, 5.2vw, 1.7rem);
    line-height: 1.16;
  }

  .hero-scroll {
    bottom: 20px;
    font-size: 0.55rem;
  }
}

.site-header {
  transition: opacity 180ms ease, background 240ms ease, padding 240ms ease, border-color 240ms ease;
}

.hero {
  min-height: 100svh;
  background: #000;
}

.hero-ocean {
  position: absolute;
  z-index: -2;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  pointer-events: none;
  opacity: 1;
  mix-blend-mode: screen;
  mask-image: linear-gradient(180deg, transparent 0%, #000 8%, #000 76%, transparent 100%);
}

.hero-terrain-source {
  display: none;
}

.hero-security-field {
  position: absolute;
  z-index: -2;
  inset: 0;
  pointer-events: none;
  overflow: hidden;
  background:
    radial-gradient(ellipse 32% 22% at 50% 43%, rgba(57, 154, 91, 0.075), transparent 75%),
    radial-gradient(circle, rgba(247, 255, 249, 0.28) 0 0.55px, transparent 0.75px) center / 18px 18px;
  -webkit-mask-image: radial-gradient(ellipse 60% 38% at 50% 43%, #000 0%, rgba(0, 0, 0, 0.48) 58%, transparent 100%);
  mask-image: radial-gradient(ellipse 60% 38% at 50% 43%, #000 0%, rgba(0, 0, 0, 0.48) 58%, transparent 100%);
}

.hero-security-field::before {
  position: absolute;
  top: 43%;
  left: 50%;
  width: min(52vw, 640px);
  height: 1px;
  content: "";
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.16) 18%, rgba(229, 255, 235, 0.7) 50%, rgba(255, 255, 255, 0.16) 82%, transparent);
  box-shadow: 0 0 12px rgba(118, 255, 165, 0.18);
  transform: translateX(-50%);
}

body:not(.is-ready) .hero-beam,
body:not(.is-ready) .hero-ocean,
body:not(.is-ready) .hero-security-field,
body:not(.is-ready) .hero-logo {
  opacity: 0;
}

body.is-ready .hero-beam {
  animation: aurora-awaken 2.4s cubic-bezier(0.16, 0.9, 0.22, 1) forwards;
}

body.is-ready .hero-ocean {
  animation: points-awaken 2.1s ease-out 180ms both;
}

body.is-ready .hero-security-field {
  animation: security-field-awaken 1.65s cubic-bezier(0.16, 0.9, 0.22, 1) 90ms both;
}

body.is-ready .hero-logo {
  animation: mark-awaken 1.45s ease-out 390ms both;
}

@keyframes aurora-awaken {
  from { opacity: 0; transform: translate(-50%, -50%) rotate(-2deg) scale(0.92); }
  to { opacity: 0.08; transform: translate(-50%, -50%) rotate(-2deg) scale(1); }
}

@keyframes points-awaken {
  from { opacity: 0; }
  to { opacity: 1; }
}

@keyframes mark-awaken {
  from { opacity: 0; transform: translate(-50%, -42%); }
  to { opacity: 1; transform: translate(-50%, -50%); }
}

@keyframes security-field-awaken {
  from { opacity: 0; transform: scale(0.985); }
  to { opacity: 1; transform: scale(1); }
}

.stack-section {
  position: relative;
  overflow: hidden;
  padding: clamp(92px, 12vw, 176px) var(--page-padding);
  border-top: 1px solid rgba(230, 255, 239, 0.1);
  border-bottom: 1px solid rgba(230, 255, 239, 0.1);
  background:
    radial-gradient(ellipse at 78% 45%, rgba(59, 181, 114, 0.08), transparent 34%),
    #030604;
}

.stack-section::before {
  position: absolute;
  inset: 0;
  opacity: 0.18;
  background-image: radial-gradient(rgba(255, 255, 255, 0.8) 0.7px, transparent 0.8px);
  background-size: 24px 24px;
  mask-image: linear-gradient(90deg, transparent, #000 28%, #000 72%, transparent);
  content: "";
  pointer-events: none;
}

.stack-heading,
.toolmarks {
  position: relative;
  z-index: 1;
}

.stack-heading {
  display: grid;
  grid-template-columns: minmax(0, 1.3fr) minmax(230px, 0.7fr);
  column-gap: 9vw;
  align-items: end;
}

.stack-heading .section-marker {
  grid-column: 1 / -1;
  margin-bottom: 30px;
}

.stack-heading h2 {
  margin: 0;
  color: #f5faf6;
  font-size: clamp(2.4rem, 5.4vw, 6rem);
  font-weight: 470;
  letter-spacing: -0.065em;
  line-height: 0.92;
}

.stack-heading h2 em {
  color: #8ee2ab;
  font-style: normal;
}

.stack-heading p {
  max-width: 360px;
  margin: 0 0 4px;
  color: rgba(232, 244, 235, 0.63);
  font-size: 0.95rem;
  line-height: 1.7;
}

.toolmarks {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1px;
  margin-top: clamp(56px, 8vw, 108px);
  border: 1px solid rgba(232, 255, 240, 0.13);
  background: rgba(232, 255, 240, 0.13);
}

.toolmark {
  display: flex;
  min-height: clamp(190px, 22vw, 285px);
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 20px;
  padding: 30px;
  background: rgba(2, 6, 4, 0.94);
  color: #f9fffb;
  transition: background 280ms ease, color 280ms ease;
}

.toolmark:hover {
  background: rgba(14, 38, 24, 0.9);
  color: #9df1b8;
}

.toolmark > img,
.toolmark .arch-mark {
  display: block;
  width: min(72%, 188px);
  height: 94px;
  object-fit: contain;
}

.toolmark-kali > img {
  width: min(92%, 295px);
  height: 108px;
  object-fit: cover;
}

.toolmark .arch-mark {
  fill: currentColor;
}

.toolmark .alcaox-white {
  filter: brightness(0) invert(1);
}

.toolmark span {
  color: currentColor;
  font-size: 0.66rem;
  font-weight: 700;
  letter-spacing: 0.18em;
}

.hero-shadow {
  z-index: -3;
  background: linear-gradient(180deg, #010101 0%, #020202 61%, #030201 100%);
}

.hero-grain {
  opacity: 0.035;
}

.hero-beam {
  display: none;
  z-index: -1;
  width: min(111vw, 1520px);
  height: min(28vw, 355px);
  top: 51%;
  left: 61%;
  opacity: 0.86;
  transform: translate(-50%, -50%) rotate(-2deg);
  background:
    radial-gradient(
      ellipse 48% 66% at 80% 48%,
      rgba(255, 255, 255, 0.88) 0%,
      rgba(240, 247, 243, 0.47) 29%,
      rgba(184, 202, 191, 0.16) 56%,
      transparent 91%
    ),
    radial-gradient(ellipse 38% 76% at 58% 54%, rgba(255, 255, 255, 0.15), transparent 78%),
    linear-gradient(90deg, transparent 0%, rgba(232, 243, 236, 0.09) 27%, rgba(255, 255, 255, 0.16) 55%, transparent 82%);
  clip-path: none;
  filter: blur(22px);
  mix-blend-mode: normal;
}

.hero-beam::after {
  inset: 21% -7% 24% 45%;
  background: linear-gradient(100deg, rgba(255, 255, 255, 0.04), rgba(255, 255, 255, 0.34), rgba(255, 255, 255, 0.16));
  filter: blur(46px);
}

.hero-platform {
  display: none;
}

.logo-halo {
  display: none;
}

body:not(.is-ready) .logo-halo {
  opacity: 0;
}

body.is-ready .logo-halo {
  animation: logo-light-awaken 1.9s ease-out 250ms both;
}

@keyframes logo-light-awaken {
  from { opacity: 0; transform: translate(-50%, -50%) scale(0.7); }
  to { opacity: 0.78; transform: translate(-50%, -50%) scale(1); }
}

.hero-logo {
  z-index: 1;
  width: clamp(112px, 12vw, 184px);
  top: 30%;
  left: 50%;
  opacity: 1;
  transform: translate(-50%, -50%);
  filter: none;
  animation: none;
}

body,
button,
input,
textarea,
h1,
h2,
h3,
h4,
p,
a,
span,
li {
  font-family: "Inter Variable", "Inter", sans-serif;
  font-weight: 510;
  letter-spacing: -0.022em;
}

.hero-content {
  min-height: 100svh;
  padding: 0;
}

.hero-copy {
  position: absolute;
  top: 51%;
  left: 50%;
  width: 100%;
  margin: 0;
  padding: 0;
  text-align: center;
  transform: translate(-50%, -50%);
}

.hero h1 {
  margin: 0;
  color: #f7f4ef;
  font-size: clamp(1.65rem, 3.75vw, 3.65rem);
  font-weight: 500;
  letter-spacing: -0.02em;
  line-height: 1.1;
  text-shadow: none;
}

.hero-scroll {
  display: none;
}

@media (max-width: 860px) {
  .hero-beam {
    width: 145vw;
    height: 41vw;
    top: 52%;
    left: 62%;
  }

  .hero-platform {
    width: 98vw;
    height: 37vw;
    bottom: -7vw;
    left: -16vw;
  }

  .hero-logo {
    width: clamp(88px, 14vw, 132px);
    top: 30%;
    left: 50%;
  }

  .hero-copy {
    top: 51%;
  }

  .hero h1 {
    font-size: clamp(1.42rem, 4vw, 2.35rem);
  }
}

@media (max-width: 520px) {
  .hero {
    min-height: 670px;
  }

  .hero-content {
    min-height: 670px;
  }

  .hero-beam {
    width: 178vw;
    height: 56vw;
    top: 51%;
    left: 61%;
    filter: blur(13px);
  }

  .hero-platform {
    width: 132vw;
    height: 52vw;
    bottom: -10vw;
    left: -29vw;
  }

  .hero-logo {
    width: 94px;
    top: 29%;
    left: 50%;
  }

  .hero-copy {
    top: 52%;
  }

  .hero h1 {
    max-width: 360px;
    margin: 0 auto;
    font-size: clamp(1.28rem, 5.3vw, 1.72rem);
    line-height: 1.13;
  }
}

.site-shell,
.intro-section,
.method-section,
.signal-section,
.stack-section,
.contact-section,
.site-footer {
  background: #020302;
}

.intro-section,
.method-section,
.signal-section,
.stack-section,
.contact-section {
  border-color: rgba(238, 246, 240, 0.1);
}

.intro-section,
.method-section {
  max-width: none;
}

.hero h1,
.intro-section h2,
.stack-heading h2,
.signal-section h2,
.method-section h2,
.contact-section h2,
.defense-item h3,
.method-list h3 {
  font-family: "Inter Variable", "Inter", sans-serif;
  font-weight: 510;
  letter-spacing: -0.022em;
}

.intro-section h2,
.stack-heading h2,
.signal-section h2,
.method-section h2,
.contact-section h2,
.defense-item h3,
.method-list h3 {
  color: #edf2ee;
}

.intro-section h2 em,
.stack-heading h2 em,
.signal-section h2 em,
.method-section h2 em,
.contact-section h2 em {
  color: #a8d9b7;
  font-style: normal;
}

.section-marker span:first-child,
.section-marker span:last-child,
.section-marker-light span:first-child,
.section-marker-light span:last-child {
  color: rgba(210, 226, 215, 0.62);
}

.intro-copy p,
.method-head > p,
.contact-inner > p,
.stack-heading p,
.defense-item p,
.method-list p {
  color: rgba(224, 234, 227, 0.62);
}

.text-link,
.defense-eyebrow,
.defense-arrow,
.method-index,
.console-status,
.site-footer > a:last-child span {
  color: #a8d9b7;
}

.defense-grid,
.method-list,
.toolmarks {
  border-color: rgba(238, 246, 240, 0.11);
  background: rgba(238, 246, 240, 0.11);
}

.defense-item {
  min-height: 250px;
  border-color: rgba(238, 246, 240, 0.11);
  background: #030403;
}

.defense-item::after {
  display: none;
}

.defense-item:hover {
  background: #08100a;
}

.defense-item h3,
.method-list h3 {
  font-style: normal;
}

.signal-section {
  min-height: 0;
}

.signal-backdrop,
.signal-grid,
.signal-ring,
.signal-pulse {
  display: none;
}

.section-marker-light span:first-child,
.section-marker-light span:last-child {
  color: rgba(210, 226, 215, 0.62);
}

.signal-console {
  border-color: rgba(238, 246, 240, 0.13);
  background: #030403;
  box-shadow: none;
  backdrop-filter: none;
}

.console-topbar,
.console-footer {
  color: rgba(224, 234, 227, 0.54);
  border-color: rgba(238, 246, 240, 0.1);
}

.console-index,
.console-trace::before,
.console-trace::after {
  border-color: rgba(238, 246, 240, 0.08);
}

.console-trace::before,
.console-trace::after {
  background: rgba(238, 246, 240, 0.08);
}

.console-trace path {
  stroke: #b3dfc0;
  filter: none;
}

.console-trace path.trace-soft {
  stroke: rgba(240, 246, 241, 0.52);
}

.contact-section {
  min-height: min(680px, 88svh);
}

.contact-section::before,
.contact-section::after,
.contact-glow {
  display: none;
}

.contact-logo {
  width: min(23vw, 260px);
  opacity: 0.2;
  filter: none;
}

.contact-button {
  border-color: rgba(238, 246, 240, 0.26);
  background: transparent;
  color: #edf2ee;
}

.contact-button:hover {
  border-color: #a8d9b7;
  background: rgba(168, 217, 183, 0.07);
}

@media (max-width: 760px) {
  .intro-section,
  .method-section,
  .signal-section,
  .stack-section {
    padding: 72px 22px;
  }

  .intro-layout,
  .stack-heading,
  .method-head {
    grid-template-columns: 1fr;
    gap: 28px;
  }

  .defense-grid,
  .toolmarks {
    grid-template-columns: 1fr;
  }

  .defense-item {
    min-height: 214px;
    border-right: 0;
    border-bottom: 1px solid rgba(238, 246, 240, 0.11);
  }

  .defense-item:last-child {
    border-bottom: 0;
  }

  .signal-console {
    margin-top: 48px;
  }

  .console-body {
    height: 170px;
  }

  .contact-inner {
    padding: 92px 22px;
  }

  .contact-logo {
    top: 32px;
    right: 22px;
    width: 108px;
    opacity: 0.17;
  }
}

.hero {
  min-height: 100svh;
  border-bottom-color: rgba(255, 255, 255, 0.08);
  background: #000;
}

.hero-grain {
  display: none;
}

.hero-space-backdrop {
  position: absolute;
  z-index: -2;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 60% center;
  opacity: 0.92;
  pointer-events: none;
  filter: none;
  -webkit-mask-image: none;
  mask-image: none;
}

.hero-black-hole {
  position: absolute;
  z-index: 0;
  top: 17%;
  right: -24vw;
  width: min(70vw, 970px);
  height: min(52vw, 720px);
  overflow: hidden;
  pointer-events: none;
  opacity: 0.88;
  transform: rotate(-12deg);
}

.black-hole-core {
  position: absolute;
  top: 20%;
  right: 16%;
  width: 41%;
  aspect-ratio: 1;
  border-radius: 50%;
  background:
    radial-gradient(circle, #000 0 51%, rgba(0, 0, 0, 0.98) 60%, transparent 61%),
    radial-gradient(ellipse, transparent 50%, rgba(255, 247, 220, 0.94) 53%, rgba(255, 188, 66, 0.62) 56%, rgba(218, 74, 20, 0.28) 61%, transparent 69%);
  box-shadow: 0 0 36px rgba(255, 188, 66, 0.12);
}

.black-hole-stream {
  position: absolute;
  right: 5%;
  width: 102%;
  height: 24%;
  border: 1px solid transparent;
  border-radius: 50%;
  mix-blend-mode: screen;
  transform-origin: 72% 50%;
}

.stream-one {
  top: 24%;
  border-top-color: rgba(255, 249, 224, 0.75);
  box-shadow: 0 -3px 15px rgba(255, 241, 197, 0.24);
  transform: rotate(-10deg) scaleX(1.05);
}

.stream-two {
  top: 32%;
  height: 34%;
  border-top-color: rgba(255, 192, 74, 0.54);
  border-bottom-color: rgba(196, 55, 18, 0.24);
  box-shadow: 0 -4px 20px rgba(255, 153, 41, 0.16);
  transform: rotate(4deg) scaleX(1.12);
}

.stream-three {
  top: 42%;
  height: 45%;
  border-top-color: rgba(255, 234, 181, 0.38);
  border-bottom-color: rgba(248, 126, 30, 0.2);
  filter: blur(1.2px);
  transform: rotate(12deg) scaleX(1.08);
}

.stream-four {
  top: 51%;
  height: 54%;
  border-top-color: rgba(255, 247, 222, 0.24);
  border-bottom-color: rgba(201, 51, 18, 0.18);
  filter: blur(2.5px);
  transform: rotate(19deg) scaleX(1.05);
}

body:not(.is-ready) .hero-black-hole {
  opacity: 0;
}

body.is-ready .hero-black-hole {
  animation: black-hole-lines-awaken 2.2s cubic-bezier(0.16, 0.9, 0.22, 1) 280ms both;
}

body.is-ready .black-hole-stream {
  animation: black-hole-lines-drift 8s ease-in-out 2.1s infinite alternate;
}

.stream-two { animation-delay: -1.6s !important; }
.stream-three { animation-delay: -3.3s !important; }
.stream-four { animation-delay: -5.1s !important; }

@keyframes black-hole-lines-awaken {
  from { opacity: 0; transform: translateX(36px) rotate(-12deg); }
  to { opacity: 0.88; transform: translateX(0) rotate(-12deg); }
}

@keyframes black-hole-lines-drift {
  from { opacity: 0.62; }
  to { opacity: 1; }
}

.hero-security-field {
  display: none;
}

.hero-satellite {
  --satellite-scale: 1;
  position: absolute;
  z-index: 1;
  top: 18%;
  left: clamp(-26px, 3vw, 62px);
  width: clamp(230px, 26vw, 390px);
  aspect-ratio: 1.5;
  opacity: 0.78;
  pointer-events: none;
  transform: scale(var(--satellite-scale)) rotate(-13deg);
  transform-origin: left center;
  filter: drop-shadow(0 3px 15px rgba(255, 255, 255, 0.18));
}

.satellite-art {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
  mix-blend-mode: screen;
}

.satellite-emblem {
  position: relative;
  position: absolute;
  top: 49%;
  left: 58%;
  width: 17%;
  height: 25.5%;
  object-fit: contain;
  filter: none;
  transform: translate(-50%, -50%);
}

body:not(.is-ready) .hero-satellite {
  opacity: 0;
}

body.is-ready .hero-satellite {
  animation: satellite-arrival 1.5s cubic-bezier(0.16, 0.9, 0.22, 1) 470ms both;
}

@keyframes satellite-arrival {
  from { opacity: 0; transform: translate(-18px, 10px) scale(var(--satellite-scale)) rotate(-13deg); }
  to { opacity: 0.78; transform: translate(0, 0) scale(var(--satellite-scale)) rotate(-13deg); }
}

.hero-security-field::before {
  top: 37%;
  left: -8%;
  width: 116%;
  height: 22%;
  background:
    radial-gradient(ellipse 26% 32% at 62% 48%, rgba(255, 255, 255, 0.42), transparent 73%),
    linear-gradient(174deg, transparent 13%, rgba(226, 233, 231, 0.05) 27%, rgba(248, 250, 250, 0.25) 46%, rgba(207, 216, 213, 0.08) 62%, transparent 82%);
  box-shadow: none;
  filter: blur(13px);
  transform: rotate(-0.45deg);
}

.hero-security-field::after {
  position: absolute;
  top: 41%;
  left: -3%;
  width: 106%;
  height: 11%;
  content: "";
  background:
    linear-gradient(178deg, transparent 27%, rgba(255, 255, 255, 0.06) 34%, rgba(255, 255, 255, 0.64) 43%, rgba(255, 255, 255, 0.14) 47%, transparent 54%),
    linear-gradient(171deg, transparent 37%, rgba(230, 235, 233, 0.16) 49%, transparent 67%);
  filter: blur(3.5px);
  transform: rotate(0.25deg);
}

.hero-logo {
  width: clamp(58px, 5.4vw, 86px);
  top: 26%;
  left: 50%;
  opacity: 1;
  transform: translate(-50%, -50%);
  filter: none;
}

.hero-copy {
  top: 44%;
}

.hero h1 {
  color: #f5f7f6;
  font-size: clamp(1.1rem, 1.85vw, 1.7rem);
  font-family: "Inter Variable", "Inter", sans-serif;
  font-weight: 510;
  letter-spacing: -0.022em;
  line-height: 1;
  padding-left: 0;
  text-shadow: 0 2px 12px rgba(0, 0, 0, 0.92);
}

.hero-prism-label {
  margin: clamp(18px, 2vw, 28px) 0 0;
  color: rgba(255, 255, 255, 0.96);
  font-size: clamp(0.56rem, 0.78vw, 0.7rem);
  font-family: "Inter Variable", "Inter", sans-serif;
  font-weight: 510;
  letter-spacing: -0.022em;
  line-height: 1;
  padding-left: 0;
  text-transform: uppercase;
  text-shadow: 0 2px 9px rgba(0, 0, 0, 0.96);
}

body.is-ready .hero-security-field::after {
  animation: prism-scan 2.8s cubic-bezier(0.16, 0.9, 0.22, 1) 220ms both;
}

body:not(.is-ready) .hero-space-backdrop {
  opacity: 0;
}

body.is-ready .hero-space-backdrop {
  animation: black-hole-reveal 1.9s ease-out 160ms both;
}

@keyframes black-hole-reveal {
  from { opacity: 0; transform: scale(1.025); }
  to { opacity: 0.92; transform: scale(1); }
}

@keyframes prism-scan {
  from { opacity: 0; transform: translateX(-3%) rotate(0.45deg); }
  58% { opacity: 1; }
  to { opacity: 0.86; transform: translateX(0) rotate(0.45deg); }
}

@media (max-width: 860px) {
  .hero-logo {
    width: clamp(56px, 9vw, 76px);
    top: 26%;
  }

  .hero-copy {
    top: 44%;
  }
}

@media (max-width: 520px) {
  .hero-space-backdrop {
    object-position: 78% center;
  }

  .hero-logo {
    width: 64px;
    top: 26%;
  }

  .hero-satellite {
    --satellite-scale: 0.68;
    top: 20%;
    left: -12%;
    opacity: 0.8;
  }

  .hero-copy {
    top: 44%;
  }

  .hero h1 {
    font-size: 1.18rem;
    letter-spacing: -0.022em;
    padding-left: 0;
  }

  .hero-prism-label {
    margin-top: 18px;
    font-size: 0.53rem;
    letter-spacing: -0.022em;
    padding-left: 0;
  }

  .hero-security-field::before {
    top: 36%;
    left: -24%;
    width: 148%;
    height: 24%;
  }

  .hero-security-field::after {
    top: 41%;
    left: -24%;
    width: 148%;
  }
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    scroll-behavior: auto !important;
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }

  .reveal {
    opacity: 1;
    transform: none;
  }
}

.hero-black-hole {
  top: 11%;
  right: -19vw;
  width: min(72vw, 980px);
  height: min(58vw, 760px);
  overflow: visible;
  opacity: 0.96;
  transform: none;
}

.black-hole-lines {
  width: 100%;
  height: 100%;
  overflow: visible;
}

.accretion-shadow {
  fill: #000;
  opacity: 0.94;
}

.accretion-line {
  stroke-linecap: round;
  stroke-dasharray: 10 16;
  animation: accretion-flow 13s linear infinite;
}

.line-gold { animation-duration: 17s; animation-direction: reverse; }
.line-ember { animation-duration: 20s; }
.line-faint { animation-duration: 24s; opacity: 0.75; }

body.is-ready .hero-black-hole {
  animation: accretion-reveal 1.6s cubic-bezier(0.16, 0.9, 0.22, 1) 240ms both;
}

body.is-ready .black-hole-stream {
  animation: none;
}

@keyframes accretion-flow {
  to { stroke-dashoffset: -156; }
}

@keyframes accretion-reveal {
  from { opacity: 0; transform: translateX(42px); }
  to { opacity: 0.96; transform: translateX(0); }
}

@media (max-width: 520px) {
  .hero-black-hole {
    top: 13%;
    right: -33vw;
    width: 108vw;
    height: 78vw;
  }

  .accretion-shadow {
    opacity: 0.9;
  }
}

.hero-black-hole {
  display: none;
}

.hero-security-world {
  position: absolute;
  z-index: 0;
  top: 26%;
  left: 50%;
  width: clamp(230px, 27vw, 430px);
  aspect-ratio: 1;
  pointer-events: none;
  opacity: 0;
  transform: translate(-50%, -50%);
}

.security-world-grid {
  width: 100%;
  height: 100%;
  overflow: visible;
}

.world-shell,
.world-latitude,
.world-meridian {
  stroke: rgba(247, 249, 248, 0.34);
  stroke-width: 1.35;
}

.world-latitude,
.world-meridian {
  stroke: rgba(210, 216, 214, 0.14);
  stroke-width: 1;
}

.world-latitude-two,
.world-meridian-two {
  stroke: rgba(247, 249, 248, 0.08);
}

.guardian-thread {
  stroke: rgba(255, 255, 255, 0.28);
  stroke-width: 1.1;
  stroke-dasharray: 3 11;
  stroke-linecap: round;
}

.world-node {
  fill: #f8faf9;
  filter: drop-shadow(0 0 7px rgba(255, 255, 255, 0.8));
}

.hero-logo {
  z-index: 1;
  width: clamp(82px, 8vw, 126px);
  opacity: 0.96;
  filter: grayscale(1) brightness(3.1) contrast(0.8);
}

body.is-ready .hero-security-world {
  animation: security-world-reveal 1.7s cubic-bezier(0.16, 0.9, 0.22, 1) 180ms both;
}

body.is-ready .security-world-grid {
  animation: security-world-breathe 8s ease-in-out 1.8s infinite alternate;
}

body.is-ready .guardian-thread {
  animation: guardian-signal 5s linear 1.8s infinite;
}

@keyframes security-world-reveal {
  from { opacity: 0; transform: translate(-50%, -50%) scale(0.92); }
  to { opacity: 0.72; transform: translate(-50%, -50%) scale(1); }
}

@keyframes security-world-breathe {
  from { opacity: 0.74; transform: scale(0.985); }
  to { opacity: 1; transform: scale(1.015); }
}

@keyframes guardian-signal {
  to { stroke-dashoffset: -56; }
}

@media (max-width: 520px) {
  .hero-security-world {
    width: 244px;
    top: 26%;
  }

  .hero-logo {
    width: 92px;
  }
}

.hero-security-world,
.hero-black-hole {
  display: none;
}

.hero-planet-arc {
  position: absolute;
  z-index: 0;
  top: -24vw;
  right: -20vw;
  width: min(82vw, 1180px);
  aspect-ratio: 1;
  overflow: hidden;
  border: 1px solid rgba(144, 255, 180, 0.38);
  border-radius: 50%;
  background:
    radial-gradient(circle at 31% 55%, rgba(127, 255, 172, 0.16), transparent 20%),
    radial-gradient(circle at 32% 54%, rgba(36, 122, 69, 0.26), transparent 38%),
    radial-gradient(circle at 45% 48%, rgba(16, 47, 28, 0.38), transparent 64%);
  box-shadow:
    inset 24px 0 60px rgba(136, 255, 173, 0.14),
    inset 2px 0 3px rgba(220, 255, 226, 0.72),
    0 0 54px rgba(74, 241, 124, 0.11);
  opacity: 0;
}

.hero-planet-arc::before {
  position: absolute;
  inset: 0;
  content: "";
  background:
    repeating-linear-gradient(90deg, transparent 0 22px, rgba(128, 255, 166, 0.09) 23px 24px, transparent 25px 42px),
    radial-gradient(ellipse at 31% 57%, rgba(166, 255, 191, 0.2) 0 1px, transparent 2px);
  mask-image: linear-gradient(90deg, rgba(0, 0, 0, 0.96), transparent 48%);
  opacity: 0.62;
}

.hero-planet-arc::after {
  position: absolute;
  top: 18%;
  left: 8%;
  width: 3px;
  height: 54%;
  content: "";
  background: linear-gradient(to bottom, transparent, rgba(201, 255, 211, 0.92) 22%, rgba(109, 255, 152, 0.8) 66%, transparent);
  box-shadow: -10px 0 28px rgba(82, 255, 129, 0.31), 14px 0 38px rgba(60, 237, 111, 0.16);
  opacity: 0.8;
}

.hero-signal-spine {
  position: absolute;
  z-index: 1;
  top: 15%;
  left: 50%;
  width: 1px;
  height: 61%;
  pointer-events: none;
  background: linear-gradient(to bottom, transparent, rgba(201, 255, 211, 0.78) 19%, rgba(77, 244, 122, 0.76) 50%, rgba(201, 255, 211, 0.2) 82%, transparent);
  box-shadow: 0 0 19px rgba(91, 255, 136, 0.3);
  opacity: 0;
}

.hero-visual {
  z-index: 1;
}

.hero-visual::before {
  position: absolute;
  top: 19%;
  left: 50%;
  width: clamp(160px, 19vw, 300px);
  height: clamp(220px, 27vw, 390px);
  content: "";
  pointer-events: none;
  background: radial-gradient(ellipse at 63% 48%, rgba(93, 255, 139, 0.3), transparent 62%);
  transform: translate(-50%, -50%);
  filter: blur(19px);
  opacity: 0;
}

.hero-logo {
  z-index: 2;
  top: 31%;
  width: clamp(118px, 13vw, 204px);
  opacity: 1;
  filter: none;
  text-shadow: 0 0 18px rgba(117, 255, 159, 0.28);
}

.hero-copy {
  top: 50%;
}

body.is-ready .hero-planet-arc {
  animation: planet-arc-awaken 2.1s cubic-bezier(0.16, 0.9, 0.22, 1) 160ms both;
}

body.is-ready .hero-signal-spine,
body.is-ready .hero-visual::before {
  animation: signal-spine-awaken 1.8s ease-out 520ms both;
}

body.is-ready .hero-planet-arc::after {
  animation: orbital-scan 6s ease-in-out 1.8s infinite alternate;
}

@keyframes planet-arc-awaken {
  from { opacity: 0; transform: scale(1.025); }
  to { opacity: 0.92; transform: scale(1); }
}

@keyframes signal-spine-awaken {
  from { opacity: 0; }
  to { opacity: 0.88; }
}

@keyframes orbital-scan {
  from { transform: translateY(-2%); opacity: 0.48; }
  to { transform: translateY(4%); opacity: 0.88; }
}

@media (max-width: 520px) {
  .hero-planet-arc {
    top: -6vw;
    right: -47vw;
    width: 122vw;
  }

  .hero-logo {
    top: 31%;
    width: 132px;
  }

  .hero-copy {
    top: 51%;
  }

  .hero-signal-spine {
    top: 17%;
    height: 56%;
  }
}

.hero-art-backdrop {
  z-index: 0;
  object-position: 75% center;
  opacity: 0;
  filter: none;
}

.hero-planet-arc,
.hero-planet-arc {
  display: none;
}

.hero-signal-spine {
  z-index: 2;
  display: block;
  top: 13%;
  height: 70%;
  background: linear-gradient(to bottom, transparent, rgba(176, 255, 200, 0.54) 18%, rgba(80, 245, 130, 0.72) 48%, rgba(176, 255, 200, 0.26) 80%, transparent);
  box-shadow: 0 0 22px rgba(76, 255, 129, 0.34);
}

.hero-visual {
  z-index: 3;
}

.hero-logo {
  filter: none;
}

body.is-ready .hero-art-backdrop {
  animation: orbital-art-reveal 1.7s ease-out 120ms both;
}

@keyframes orbital-art-reveal {
  from { opacity: 0; transform: scale(1.018); }
  to { opacity: 0.94; transform: scale(1); }
}

@media (max-width: 520px) {
  .hero-art-backdrop {
    object-position: 76% center;
  }
}

.hero-art-backdrop {
  filter: grayscale(1) contrast(1.22) brightness(1.16);
}

.hero-signal-spine {
  background: linear-gradient(to bottom, transparent, rgba(255, 255, 255, 0.46) 18%, rgba(255, 255, 255, 0.78) 48%, rgba(222, 222, 222, 0.2) 80%, transparent);
  box-shadow: 0 0 22px rgba(255, 255, 255, 0.25);
}

.hero-visual::before {
  background: radial-gradient(ellipse at 58% 48%, rgba(255, 255, 255, 0.17), transparent 62%);
}

.hero-logo-split {
  position: absolute;
  z-index: 2;
  top: 31%;
  left: 50%;
  width: clamp(154px, 17vw, 266px);
  aspect-ratio: 1.3;
  transform: translate(-50%, -50%);
}

.hero-logo {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: contain;
  opacity: 1;
  transform: none;
  filter: grayscale(1) contrast(1.1) brightness(1.35);
}

.hero-logo-left {
  clip-path: inset(0 50% 0 0);
  opacity: 0.72;
  filter: grayscale(1) contrast(1.12) brightness(4.6) !important;
  mix-blend-mode: screen;
}

.hero-logo-right {
  clip-path: inset(0 0 0 50%);
  filter: grayscale(1) contrast(1.28) brightness(8) !important;
  mix-blend-mode: screen;
  transform: translateX(1px);
}

body:not(.is-ready) .hero-logo {
  opacity: 0;
}

body.is-ready .hero-logo {
  opacity: 1;
  animation: none;
}

body.is-ready .hero-logo-split {
  animation: split-mark-awaken 1.25s ease-out 420ms both;
}

@keyframes split-mark-awaken {
  from { opacity: 0; transform: translate(-50%, -50%) scale(0.82); }
  to { opacity: 1; transform: translate(-50%, -50%) scale(1); }
}

.hero h1 {
  color: #f5f5f3;
  font-family: "Inter Variable", "Inter", sans-serif;
  font-size: clamp(2rem, 5.1vw, 5.5rem);
  font-weight: 510;
  letter-spacing: 0.16em;
  padding-left: 0.16em;
  text-shadow: 0 3px 20px rgba(0, 0, 0, 0.82);
}

.hero-prism-label {
  color: rgba(255, 255, 255, 0.62);
  letter-spacing: 0.12em;
  padding-left: 0.12em;
}

@media (max-width: 520px) {
  .hero-logo-split {
    top: 31%;
    width: 182px;
  }

  .hero h1 {
    font-size: 1.88rem;
    letter-spacing: 0.13em;
    padding-left: 0.13em;
  }
}

.hero-art-backdrop {
  filter: grayscale(1) contrast(1.04) brightness(0.62);
}

.hero-visual::before {
  background: radial-gradient(ellipse at 50% 48%, rgba(255, 255, 255, 0.1), transparent 63%);
}

.hero-content {
  z-index: 4;
}

.hero-copy {
  top: 47%;
}

.hero-logo-split {
  width: clamp(142px, 14vw, 222px);
}

.hero h1 {
  font-size: clamp(1.8rem, 4.35vw, 4.8rem);
  letter-spacing: 0.13em;
  padding-left: 0.13em;
}

.hero-prism-label {
  margin-top: 14px;
}

@media (max-width: 520px) {
  .hero-copy {
    top: 47%;
  }

  .hero-logo-split {
    width: 158px;
  }

  .hero h1 {
    font-size: 1.65rem;
    letter-spacing: 0.11em;
    padding-left: 0.11em;
  }
}

.hero {
  background: #000;
}

.hero-space-backdrop,
.hero-art-backdrop,
.hero-planet-arc,
.hero-signal-spine,
.hero-security-field,
.hero-grain,
.hero-shadow,
.hero-beam,
.hero-platform,
.hero-visual::before,
.logo-halo {
  display: none !important;
}

.hero-visual {
  z-index: 1;
  overflow: visible;
}

.hero-logo-simple {
  position: absolute;
  top: 34%;
  left: 50%;
  width: clamp(156px, 16vw, 250px);
  height: auto;
  opacity: 1;
  transform: translate(-50%, -50%);
  filter: none;
}

.hero-content {
  z-index: 2;
}

.hero-copy {
  top: 54%;
}

.hero h1 {
  color: #f5f5f3;
  font-size: clamp(2.3rem, 4.8vw, 5.3rem);
  font-weight: 510;
  letter-spacing: 0.1em;
  padding-left: 0.1em;
  text-shadow: none;
}

.hero-prism-label {
  color: rgba(255, 255, 255, 0.56);
  font-size: clamp(0.65rem, 0.9vw, 0.82rem);
  letter-spacing: 0.08em;
  padding-left: 0.08em;
}

@media (max-width: 520px) {
  .hero-logo-simple {
    top: 34%;
    width: 178px;
  }

  .hero-copy {
    top: 54%;
  }

  .hero h1 {
    font-size: 2.28rem;
    letter-spacing: 0.08em;
    padding-left: 0.08em;
  }
}

.hero::after {
  position: absolute;
  z-index: 0;
  inset: 0;
  content: "";
  pointer-events: none;
  background:
    radial-gradient(ellipse 42% 30% at 12% 37%, rgba(160, 255, 183, 0.16), rgba(70, 192, 102, 0.07) 34%, transparent 71%),
    linear-gradient(90deg, rgba(134, 255, 164, 0.035), transparent 38%);
  mix-blend-mode: screen;
}

.hero-logo-simple {
  filter: drop-shadow(-12px 0 20px rgba(163, 255, 185, 0.32));
}

@media (max-width: 520px) {
  .hero::after {
    background:
      radial-gradient(ellipse 58% 31% at -6% 36%, rgba(160, 255, 183, 0.18), rgba(70, 192, 102, 0.08) 37%, transparent 72%),
      linear-gradient(90deg, rgba(134, 255, 164, 0.04), transparent 48%);
  }
}

.hero-eclipse-backdrop {
  display: block !important;
  z-index: 0;
  object-position: 74% center;
  opacity: 0;
  filter: none;
}

.hero::after {
  display: none;
}

body.is-ready .hero-eclipse-backdrop {
  animation: eclipse-reveal 1.9s ease-out 140ms both;
}

@keyframes eclipse-reveal {
  from { opacity: 0; transform: scale(1.018); }
  to { opacity: 0.94; transform: scale(1); }
}

@media (max-width: 520px) {
  .hero-eclipse-backdrop {
    object-position: 74% center;
  }
}

.hero-galaxy-backdrop {
  display: block !important;
  z-index: 0;
  object-position: 62% center;
  opacity: 0;
  filter: none;
}

body.is-ready .hero-galaxy-backdrop {
  animation: galaxy-reveal 1.75s ease-out 120ms both;
}

@keyframes galaxy-reveal {
  from { opacity: 0; transform: scale(1.014); }
  to { opacity: 0.9; transform: scale(1); }
}

@media (max-width: 520px) {
  .hero-galaxy-backdrop {
    object-position: 62% center;
  }
}

.hero-galaxy-backdrop {
  display: none !important;
}

.hero {
  background: #050806;
}

.hero-logo-simple {
  filter: none;
}

.site-header:not(.is-scrolled) .brand-name,
.site-header:not(.is-scrolled) .primary-nav a {
  color: rgba(246, 250, 247, 0.9);
}

.site-header:not(.is-scrolled) .menu-toggle {
  border-color: rgba(16, 20, 23, 0.24);
  background: rgba(255, 255, 255, 0.6);
}

.site-header:not(.is-scrolled) .menu-toggle span:not(.sr-only) {
  background: #101417;
}

.site-header:not(.is-scrolled) .brand-icon {
  border-color: rgba(47, 86, 52, 0.22);
  background: rgba(130, 183, 113, 0.08);
  box-shadow: none;
}

.site-header:not(.is-scrolled) .brand-icon img {
  filter: none;
}

.site-header {
  padding-left: 0;
}

@media (max-width: 520px) {
  .site-header {
    padding-left: 0;
    padding-right: 12px;
  }
}

.hero-logo-simple {
  position: static;
  display: block;
  width: clamp(210px, 18vw, 300px);
  height: auto;
  margin: 0 0 18px -12px;
  opacity: 1;
  transform: none;
}

.mobile-break {
  display: none;
}

.hero-content {
  align-items: flex-start;
  justify-content: flex-start;
  padding: clamp(150px, 19vh, 210px) clamp(28px, 4.3vw, 72px) 86px;
}

.hero-copy {
  position: static;
  left: auto;
  top: auto;
  width: min(100%, 660px);
  margin: 0;
  transform: none;
  text-align: left;
}

.hero-brand-word {
  margin: clamp(58px, 9vh, 96px) 0 18px;
  color: #172018;
  font-size: 0.72rem;
  font-weight: 510;
  letter-spacing: 0.18em;
}

.hero h1 {
  max-width: 650px;
  color: #111512;
  font-family: "Inter Variable", "Inter", sans-serif;
  font-size: clamp(2.35rem, 4.5vw, 5.25rem);
  font-weight: 510;
  letter-spacing: -0.022em;
  line-height: 0.98;
  padding: 0;
  text-shadow: none;
  text-transform: none;
}

.hero-description {
  max-width: 520px;
  margin: 24px 0 0;
  color: rgba(17, 21, 18, 0.64);
  font-family: "Inter Variable", "Inter", sans-serif;
  font-size: clamp(0.92rem, 1.1vw, 1.05rem);
  font-weight: 510;
  letter-spacing: -0.022em;
  line-height: 1.62;
}

.hero-prism-label {
  display: none;
}

@media (max-width: 520px) {
  .hero-logo-simple {
    width: 170px;
    margin: 0 0 16px -10px;
  }

  .hero-content {
    align-items: flex-start;
    justify-content: flex-start;
    padding: 150px 18px 90px 24px;
  }

  .hero-copy {
    position: static;
    left: auto;
    top: auto;
    margin: 0;
    transform: none;
    text-align: left;
  }

  .hero-brand-word {
    margin: 58px 0 14px;
    font-size: 0.64rem;
  }

  .hero h1 {
    font-size: clamp(2.25rem, 10vw, 3.05rem);
    letter-spacing: -0.032em;
    padding: 0;
  }

  .mobile-break {
    display: inline;
  }

  .hero-description {
    margin-top: 18px;
    font-size: 0.87rem;
  }
}

.hero-black-hole {
  position: absolute;
  z-index: 1;
  top: 55%;
  left: 47%;
  right: auto;
  display: block;
  width: min(58vw, 900px);
  max-width: none;
  height: auto;
  pointer-events: none;
  opacity: 0.92;
  transform: translate(0, -50%) rotate(-1deg);
  transform-origin: center;
  animation: black-hole-float 16s ease-in-out infinite alternate;
}

.hero-black-hole img {
  display: block;
  width: 100%;
  height: auto;
  filter: drop-shadow(0 26px 34px rgba(20, 90, 130, 0.18)) saturate(0.94);
}

@keyframes black-hole-float {
  from { transform: translate3d(0, -50%, 0) rotate(-1deg) scale(0.985); }
  to { transform: translate3d(-1.5%, -52%, 0) rotate(1deg) scale(1.015); }
}

@media (max-width: 900px) {
  .hero-black-hole {
    top: 55%;
    left: 43%;
    right: auto;
    width: min(72vw, 760px);
    opacity: 0.8;
  }
}

@media (max-width: 520px) {
  .hero-black-hole {
    top: 38%;
    left: 22%;
    right: auto;
    width: 112vw;
    opacity: 0.62;
  }
}

.hero-content {
  align-items: center;
  justify-content: center;
  padding: 120px clamp(22px, 4.3vw, 72px) 86px;
}

.hero-copy {
  width: min(100%, 820px);
  text-align: center;
  transform: translateY(68px);
}

.hero-logo-simple {
  position: relative;
  top: auto;
  left: auto;
  right: auto;
  bottom: auto;
  z-index: 3;
  width: clamp(154px, 13vw, 210px);
  margin: 0 auto 14px;
  transform: none;
  filter: none;
}

.hero-brand-word {
  margin: 0 0 10px;
}

.hero h1,
.hero-description {
  margin-left: auto;
  margin-right: auto;
}

.hero-description {
  margin-top: 18px;
  font-size: clamp(0.86rem, 1vw, 0.98rem);
}

.hero h1 {
  font-size: clamp(2.05rem, 3.9vw, 4.45rem);
}

.hero-contact-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 13px;
  margin-top: 18px;
  padding: 14px 19px 14px 21px;
  border: 1px solid #173c25;
  border-radius: 999px;
  background: #173c25;
  color: #fff;
  cursor: pointer;
  font-family: "Inter Variable", "Inter", sans-serif;
  font-size: 0.68rem;
  font-weight: 750;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  transition: background 180ms ease, border-color 180ms ease, color 180ms ease, transform 180ms ease;
}

.hero-contact-button svg {
  width: 17px;
  height: 17px;
  fill: none;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 1.35;
}

.hero-contact-button:hover,
.hero-contact-button:focus-visible {
  border-color: #91c77e;
  background: #91c77e;
  color: #102316;
  transform: translateY(-2px);
}

@media (max-width: 520px) {
  .hero-content {
    align-items: center;
    justify-content: center;
    padding: 130px 18px 90px;
  }

  .hero-copy {
    text-align: center;
    transform: translateY(34px);
  }

  .hero-logo-simple {
    width: 150px;
    margin: 0 auto 12px;
  }

  .hero-brand-word {
    margin: 0 0 14px;
  }

  .hero-description {
    margin-top: 14px;
    font-size: 0.82rem;
  }

  .hero h1 {
    font-size: clamp(2rem, 8.5vw, 2.75rem);
  }

  .hero-contact-button {
    margin-top: 18px;
  }
}

.site-header .brand {
  gap: 9px;
}

.site-header .brand-icon {
  width: 32px;
  height: 32px;
  overflow: visible;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

.site-header .brand-icon img {
  width: 37px;
  max-width: none;
  transform: none;
  filter: none;
}

.site-header .brand-name {
  font-size: 0.7rem;
  font-weight: 750;
  letter-spacing: 0.14em;
}

.site-header:not(.is-scrolled) .header-cta {
  border-color: rgba(210, 255, 220, 0.36);
  background: rgba(210, 255, 220, 0.08);
  color: rgba(246, 250, 247, 0.94);
}

.site-header:not(.is-scrolled) .header-cta:hover,
.site-header:not(.is-scrolled) .header-cta:focus-visible {
  border-color: #a8d9b7;
  background: #a8d9b7;
  color: #102316;
}

.site-header.is-scrolled .brand-icon img {
  filter: brightness(1.34) saturate(0.92) drop-shadow(0 0 8px rgba(151, 239, 174, 0.3));
}

.site-header.is-scrolled .brand-name {
  color: rgba(246, 250, 247, 0.92);
}

.site-header.is-scrolled .header-cta {
  border-color: rgba(210, 255, 220, 0.36);
  background: rgba(210, 255, 220, 0.08);
  color: rgba(246, 250, 247, 0.94);
}

.hero {
  background: #050806;
}

.hero-brand-word {
  color: rgba(218, 245, 224, 0.78);
}

.hero h1 {
  color: #f4f7f5;
}

.hero-description {
  color: rgba(224, 235, 227, 0.68);
}

.hero {
  background: #000;
}

.hero-horizon {
  position: absolute;
  z-index: 0;
  top: 54%;
  left: -26%;
  width: 152%;
  height: 25%;
  pointer-events: none;
  opacity: 0.88;
  transform: rotate(36deg);
  transform-origin: center;
  background:
    linear-gradient(
      180deg,
      transparent 0%,
      rgba(28, 72, 139, 0.05) 29%,
      rgba(73, 146, 239, 0.24) 41%,
      rgba(234, 246, 255, 0.88) 49%,
      rgba(84, 157, 247, 0.42) 57%,
      rgba(16, 49, 96, 0.08) 78%,
      transparent 100%
    );
  filter: blur(12px);
  mix-blend-mode: screen;
  animation: horizon-drift 18s ease-in-out infinite alternate;
}

.hero-horizon::before,
.hero-horizon::after {
  position: absolute;
  left: 0;
  width: 100%;
  content: "";
  pointer-events: none;
}

.hero-horizon::before {
  top: 49%;
  height: 3px;
  background: linear-gradient(
    90deg,
    transparent 0%,
    rgba(82, 157, 255, 0.42) 18%,
    rgba(246, 251, 255, 0.98) 49%,
    rgba(105, 177, 255, 0.55) 76%,
    transparent 100%
  );
  box-shadow:
    0 0 10px rgba(155, 207, 255, 0.9),
    0 0 34px rgba(32, 116, 240, 0.55),
    0 0 80px rgba(21, 76, 165, 0.35);
}

.hero-horizon::after {
  top: 35%;
  height: 44%;
  background: linear-gradient(90deg, transparent, rgba(29, 91, 177, 0.22) 48%, transparent);
  filter: blur(28px);
}

@keyframes horizon-drift {
  0% {
    opacity: 0.68;
    transform: translate3d(-1.8%, 1%, 0) rotate(35.7deg) scale(1);
  }
  100% {
    opacity: 0.94;
    transform: translate3d(1.8%, -1%, 0) rotate(36.3deg) scale(1.018);
  }
}

@media (max-width: 520px) {
  .hero-horizon {
    top: 57%;
    left: -58%;
    width: 196%;
    height: 24%;
    opacity: 0.82;
  }
}

@media (prefers-reduced-motion: reduce) {
  .hero-horizon {
    animation: none;
  }
}

.hero-eclipse-backdrop {
  position: absolute;
  z-index: 0;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 100%;
  --eclipse-shift-x: 0.7vw;
  --eclipse-lift: -10vh;
  opacity: 0.92;
  pointer-events: none;
  filter: brightness(0.82) contrast(1.05);
  animation: none;
  transform: translate3d(var(--eclipse-shift-x), var(--eclipse-lift), 0) scale(1.08);
}

.hero-star-layer {
  position: absolute;
  z-index: 1;
  inset: -4%;
  width: 108%;
  height: 108%;
  object-fit: cover;
  opacity: 0.58;
  pointer-events: none;
  filter: blur(0.35px) drop-shadow(0 0 7px rgba(205, 226, 255, 0.18));
  mix-blend-mode: screen;
  animation: star-layer-drift 42s ease-in-out infinite alternate;
}

@keyframes star-layer-drift {
  0% {
    transform: translate3d(-0.25vw, -0.12vh, 0) scale(1);
    opacity: 0.38;
  }
  50% {
    opacity: 0.66;
  }
  100% {
    transform: translate3d(0.45vw, 0.22vh, 0) scale(1.012);
    opacity: 0.54;
  }
}

@keyframes eclipse-background-breathe {
  0%,
  100% { opacity: 0.86; transform: translate3d(calc(var(--eclipse-shift-x) * -0.43), var(--eclipse-lift), 0) scale(1.08); }
  50% { opacity: 0.98; transform: translate3d(var(--eclipse-shift-x), calc(var(--eclipse-lift) + 1.1vh), 0) scale(1.1); }
}

@media (max-width: 720px) {
  .hero-eclipse-backdrop {
    object-position: center 90%;
    --eclipse-shift-x: 0.35vw;
    --eclipse-lift: -8vh;
    opacity: 0.84;
  }
}

.hero-ground-code {
  position: absolute;
  z-index: 2;
  right: 0;
  bottom: 0;
  left: 0;
  width: 100%;
  height: clamp(126px, 18vh, 190px);
  overflow: visible;
  pointer-events: none;
  opacity: 0.7;
}

.ground-code-fill {
  fill: url(#groundCodeGradient);
  opacity: 0.08;
}

.ground-code-grid,
.ground-code-grass {
  fill: none;
  stroke: rgba(191, 238, 205, 0.42);
  stroke-width: 0.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.ground-code-grid {
  opacity: 0.45;
  stroke-dasharray: 3 13;
  animation: ground-grid-flow 18s linear infinite;
}

.ground-code-grass {
  stroke: rgba(202, 246, 213, 0.66);
  stroke-width: 1.1;
  opacity: 0.72;
}

.ground-code-glow {
  fill: none;
  stroke: url(#groundCodeGradient);
  stroke-width: 2;
  stroke-linecap: round;
  filter: url(#groundCodeGlow);
  opacity: 0.8;
  animation: ground-horizon-breathe 6s ease-in-out infinite alternate;
}

@keyframes ground-grid-flow {
  to { stroke-dashoffset: -120; }
}

@keyframes ground-horizon-breathe {
  from { opacity: 0.42; }
  to { opacity: 0.92; }
}

@media (max-width: 720px) {
  .hero-ground-code {
    height: 118px;
    opacity: 0.56;
  }
}

.hero-ground-image {
  position: absolute;
  z-index: 2;
  right: 0;
  bottom: 0;
  left: 0;
  width: 100%;
  height: clamp(132px, 18vh, 190px);
  object-fit: cover;
  object-position: center bottom;
  opacity: 0.86;
  pointer-events: none;
  filter: saturate(0.9) contrast(1.08) drop-shadow(0 -8px 20px rgba(104, 208, 135, 0.14));
  -webkit-mask-image: linear-gradient(to bottom, transparent 0%, rgba(0, 0, 0, 0.46) 24%, #000 54%);
  mask-image: linear-gradient(to bottom, transparent 0%, rgba(0, 0, 0, 0.46) 24%, #000 54%);
}

.site-shell {
  will-change: opacity;
}

body.is-ready .site-shell {
  animation: page-lift-in 720ms cubic-bezier(0.22, 1, 0.36, 1) both;
}

@keyframes page-lift-in {
  0% {
    opacity: 0;
  }
  62% {
    opacity: 0.78;
  }
  100% {
    opacity: 1;
  }
}

@media (max-width: 720px) {
  .hero-ground-image {
    height: 122px;
    opacity: 0.78;
  }
}

@media (prefers-reduced-motion: reduce) {
  body.is-ready .site-shell {
    animation: none;
  }
}

@media (prefers-reduced-motion: reduce) {
  .hero-eclipse-backdrop {
    animation: none;
  }
}

body,
body .site-shell * {
  font-family: "Plus Jakarta Sans", sans-serif;
}

.site-header {
  position: fixed;
  top: 0;
  padding-top: 16px;
  padding-bottom: 16px;
  border-bottom: 1px solid rgba(221, 255, 207, 0.1);
  background: rgba(5, 8, 6, 0.74);
  backdrop-filter: blur(18px);
  transition: none;
}

.hero-brand-word {
  margin: 0 0 16px;
  color: rgba(218, 245, 224, 0.9);
  font-size: clamp(0.92rem, 1.45vw, 1.3rem);
  font-weight: 800;
  letter-spacing: 0.3em;
  text-transform: uppercase;
}

@media (max-width: 720px) {
  .hero-brand-word {
    margin-bottom: 14px;
    font-size: 1rem;
    letter-spacing: 0.24em;
  }
}


.hero-strength,
.hero-integrity {
  position: absolute;
  z-index: 3;
  bottom: clamp(76px, 10vh, 108px);
  color: rgba(224, 236, 230, 0.58);
  font-size: 0.57rem;
  letter-spacing: 0.16em;
  line-height: 1.3;
  text-transform: uppercase;
}

.hero-strength {
  left: clamp(24px, 6vw, 96px);
  width: 176px;
}

.hero-metric-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  border-bottom: 1px solid rgba(204, 231, 216, 0.16);
  padding-bottom: 7px;
}

.hero-metric-heading strong,
.hero-integrity strong {
  color: rgba(207, 242, 218, 0.88);
  font-size: 0.53rem;
  font-weight: 700;
  letter-spacing: 0.18em;
}

.hero-strength-bars {
  display: flex;
  align-items: end;
  gap: 4px;
  height: 19px;
  margin-top: 9px;
}

.hero-strength-bars i {
  display: block;
  width: 19px;
  height: 5px;
  background: rgba(154, 207, 255, 0.24);
  box-shadow: 0 0 8px rgba(78, 151, 255, 0.14);
}

.hero-strength-bars i:nth-child(2) { height: 8px; }
.hero-strength-bars i:nth-child(3) { height: 11px; }
.hero-strength-bars i:nth-child(4) { height: 14px; }
.hero-strength-bars i:nth-child(5) { height: 17px; }
.hero-strength-bars i:nth-child(6) {
  height: 19px;
  background: rgba(211, 239, 255, 0.8);
  box-shadow: 0 0 12px rgba(126, 190, 255, 0.7);
  animation: strength-pulse 2.8s ease-in-out infinite;
}

.hero-integrity {
  right: clamp(24px, 6vw, 96px);
  display: flex;
  align-items: center;
  gap: 10px;
  min-width: 165px;
}

.hero-integrity-dot {
  width: 5px;
  height: 5px;
  flex: 0 0 auto;
  border-radius: 50%;
  background: #d9f7e0;
  box-shadow: 0 0 0 4px rgba(134, 214, 157, 0.08), 0 0 14px rgba(132, 244, 166, 0.9);
  animation: integrity-pulse 2.8s ease-in-out infinite;
}

.hero-integrity > div {
  display: grid;
  gap: 4px;
}

.hero-metric-label {
  color: rgba(224, 236, 230, 0.58);
}

.hero-integrity small {
  align-self: end;
  color: rgba(207, 221, 215, 0.35);
  font-size: 0.5rem;
  letter-spacing: 0.12em;
}

@keyframes strength-pulse {
  0%,
  100% { opacity: 0.48; }
  50% { opacity: 1; }
}

@keyframes integrity-pulse {
  0%,
  100% { opacity: 0.55; transform: scale(0.88); }
  50% { opacity: 1; transform: scale(1.12); }
}

@media (max-width: 620px) {
  .hero-strength,
  .hero-integrity {
    bottom: 76px;
    font-size: 0.5rem;
  }

  .hero-strength {
    left: 18px;
    width: 142px;
  }

  .hero-integrity {
    right: 18px;
    min-width: 132px;
  }

  .hero-strength-bars {
    gap: 3px;
    height: 15px;
  }

  .hero-strength-bars i {
    width: 14px;
  }

  .hero-strength-bars i:nth-child(2) { height: 7px; }
  .hero-strength-bars i:nth-child(3) { height: 9px; }
  .hero-strength-bars i:nth-child(4) { height: 11px; }
  .hero-strength-bars i:nth-child(5) { height: 13px; }
  .hero-strength-bars i:nth-child(6) { height: 15px; }
}

.hero-copy {
  position: relative;
  z-index: 3;
  isolation: isolate;
}

.hero-copy::before {
  position: absolute;
  z-index: -1;
  inset: -58px -92px;
  border-radius: 50%;
  background: radial-gradient(
    ellipse at center,
    rgba(0, 0, 0, 0.54) 0%,
    rgba(0, 0, 0, 0.3) 38%,
    transparent 74%
  );
  content: "";
  filter: blur(16px);
  pointer-events: none;
}

@media (max-width: 520px) {
  .hero-copy::before {
    inset: -36px -28px;
    filter: blur(12px);
  }
}

.hero-copy > * {
  opacity: 0;
  transform: translateY(26px);
}

body.is-ready .hero-copy > * {
  animation: hero-rise-in 560ms cubic-bezier(0.22, 1, 0.36, 1) both;
}

body.is-ready .hero-copy > .hero-logo-simple {
  animation-delay: 20ms;
}

body.is-ready .hero-copy > .hero-brand-word {
  animation-delay: 70ms;
}

body.is-ready .hero-copy > h1 {
  animation-delay: 130ms;
}

body.is-ready .hero-copy > .hero-description {
  animation-delay: 220ms;
}

body.is-ready .hero-eclipse-backdrop {
  animation: none !important;
}

body.is-ready .hero-star-layer {
  animation: star-layer-drift 42s ease-in-out infinite alternate;
}

.hero-star-layer,
.hero-visual::after {
  display: none !important;
  animation: none !important;
}

.hero-star-canvas {
  position: absolute;
  z-index: 2;
  inset: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  opacity: 0.72;
  mix-blend-mode: screen;
}

.hero-light-bloom {
  position: absolute;
  z-index: 1;
  top: calc(50% - 10vh);
  left: 50%;
  width: min(64vw, 920px);
  height: min(64vw, 920px);
  transform: translate(-50%, -50%);
  border-radius: 50%;
  background: radial-gradient(
    circle,
    transparent 0 35%,
    rgba(255, 255, 255, 0.16) 43%,
    rgba(255, 255, 255, 0.08) 52%,
    transparent 68%
  );
  filter: blur(18px);
  opacity: 0.34;
  pointer-events: none;
  mix-blend-mode: screen;
  animation: light-bloom-breathe 18s ease-in-out infinite;
}

@keyframes light-bloom-breathe {
  0%,
  100% {
    opacity: 0.24;
    transform: translate(-50%, -50%) scale(0.98);
  }
  50% {
    opacity: 0.46;
    transform: translate(-50%, -50%) scale(1.035);
  }
}

@media (max-width: 720px) {
  .hero-light-bloom {
    top: calc(50% - 8vh);
    width: 88vw;
    height: 88vw;
  }
}

@media (prefers-reduced-motion: reduce) {
  .hero-light-bloom {
    animation: none;
  }
}

body:not(.is-ready) .hero-copy > * {
  opacity: 1;
  transform: none;
  clip-path: none;
}

@keyframes hero-rise-in {
  from {
    opacity: 0;
    transform: translateY(26px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.reveal {
  opacity: 0;
  transform: translateY(30px);
  transition: opacity 760ms ease, transform 760ms cubic-bezier(0.22, 1, 0.36, 1);
}

.reveal.is-visible {
  opacity: 1;
  transform: translateY(0);
}

@media (prefers-reduced-motion: reduce) {
  .hero-copy > *,
  .reveal,
  .reveal.is-visible {
    opacity: 1;
    transform: none;
    clip-path: none;
    animation: none;
    transition: none;
  }

  body.is-ready .hero-eclipse-backdrop {
    animation: none !important;
  }

  .hero-star-layer {
    animation: none !important;
  }
}

.hero-visual::after {
  position: absolute;
  z-index: 1;
  inset: -8%;
  display: none;
  content: "";
  pointer-events: none;
  opacity: 0.62;
  background-image:
    radial-gradient(circle at 8% 18%, rgba(255, 255, 255, 0.9) 0 1px, transparent 1.8px),
    radial-gradient(circle at 19% 67%, rgba(208, 226, 255, 0.72) 0 1px, transparent 1.7px),
    radial-gradient(circle at 34% 28%, rgba(255, 255, 255, 0.82) 0 0.8px, transparent 1.6px),
    radial-gradient(circle at 53% 14%, rgba(210, 237, 255, 0.7) 0 1px, transparent 1.8px),
    radial-gradient(circle at 72% 34%, rgba(255, 255, 255, 0.86) 0 1px, transparent 1.8px),
    radial-gradient(circle at 88% 20%, rgba(208, 229, 255, 0.72) 0 0.8px, transparent 1.7px),
    radial-gradient(circle at 82% 78%, rgba(255, 255, 255, 0.76) 0 1px, transparent 1.8px),
    radial-gradient(circle at 42% 84%, rgba(223, 240, 255, 0.65) 0 0.8px, transparent 1.6px);
  mix-blend-mode: screen;
  will-change: transform, opacity;
  animation: none;
}

@keyframes starfield-drift {
  0% {
    transform: translate3d(-2.4%, -1.1%, 0) scale(1);
    opacity: 0.42;
  }
  50% {
    opacity: 0.76;
  }
  100% {
    transform: translate3d(2.8%, 1.3%, 0) scale(1.055);
    opacity: 0.58;
  }
}

@media (prefers-reduced-motion: reduce) {
  .hero-visual::after {
    animation: none;
  }
}

.hero-bottom-glow {
  position: absolute;
  z-index: 2;
  right: 7%;
  bottom: 24px;
  left: 7%;
  height: 54px;
  pointer-events: none;
}

.hero-bottom-glow::before {
  position: absolute;
  right: 0;
  bottom: 24px;
  left: 0;
  height: 1px;
  content: "";
  background:
    repeating-linear-gradient(90deg, transparent 0 68px, rgba(219, 244, 226, 0.3) 68px 70px, transparent 70px 132px),
    linear-gradient(
    90deg,
    transparent,
    rgba(159, 229, 175, 0.35) 14%,
    rgba(239, 255, 243, 0.9) 42%,
    rgba(173, 226, 255, 0.82) 58%,
    rgba(159, 229, 175, 0.35) 86%,
    transparent
  );
  box-shadow: 0 0 18px rgba(190, 235, 211, 0.32);
}

.hero-bottom-glow::after {
  position: absolute;
  bottom: 16px;
  left: 0;
  width: 22%;
  height: 17px;
  border-radius: 50%;
  content: "";
  background: radial-gradient(ellipse, rgba(221, 249, 229, 0.54), transparent 70%);
  filter: blur(6px);
  animation: bottom-glow-sweep 8s ease-in-out infinite alternate;
}

.hero-tech-node,
.hero-tech-tick {
  position: absolute;
  z-index: 2;
  display: block;
  pointer-events: none;
}

.hero-tech-node {
  top: 23px;
  width: 5px;
  height: 5px;
  border: 1px solid rgba(235, 255, 240, 0.86);
  border-radius: 50%;
  background: #c9f2d1;
  box-shadow: 0 0 10px rgba(190, 245, 206, 0.72);
  animation: tech-node-pulse 3.8s ease-in-out infinite;
}

.hero-tech-node-a { left: 18%; }
.hero-tech-node-b { left: 50%; animation-delay: -1.4s; }
.hero-tech-node-c { left: 82%; animation-delay: -2.6s; }

.hero-tech-tick {
  top: 16px;
  width: 1px;
  height: 16px;
  background: linear-gradient(to bottom, transparent, rgba(171, 222, 255, 0.78), transparent);
  opacity: 0.72;
}

.hero-tech-tick-a { left: 31%; }
.hero-tech-tick-b { left: 67%; height: 22px; top: 10px; }
.hero-tech-tick-c { left: 91%; height: 12px; top: 20px; }

@keyframes tech-node-pulse {
  0%,
  100% { transform: scale(0.78); opacity: 0.52; }
  50% { transform: scale(1.25); opacity: 1; }
}

@keyframes bottom-glow-sweep {
  from { transform: translateX(0); opacity: 0.36; }
  to { transform: translateX(355%); opacity: 0.72; }
}

.hero-corner-lines circle {
  fill: rgba(230, 247, 234, 0.78);
  stroke: none;
}

@media (max-width: 720px) {
  .hero-bottom-glow {
    right: 5%;
    bottom: 22px;
    left: 5%;
    height: 44px;
  }
}

.focus-section {
  position: relative;
  display: grid;
  grid-template-columns: minmax(360px, 0.95fr) minmax(0, 1.25fr);
  gap: clamp(42px, 6vw, 90px);
  padding: clamp(92px, 12vw, 170px) clamp(22px, 7.2vw, 116px);
  overflow: hidden;
  border-top: 1px solid rgba(238, 246, 240, 0.1);
  border-bottom: 1px solid rgba(238, 246, 240, 0.1);
  background: #020302;
}

.focus-section::before {
  position: absolute;
  inset: 0;
  background-image: linear-gradient(rgba(224, 246, 228, 0.035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(224, 246, 228, 0.035) 1px, transparent 1px);
  background-size: 84px 84px;
  content: "";
  opacity: 0.35;
  pointer-events: none;
  mask-image: linear-gradient(90deg, #000, transparent 78%);
}

.focus-intro,
.focus-panels {
  position: relative;
  z-index: 1;
}

.focus-intro h2 {
  max-width: 900px;
  margin: clamp(40px, 5vw, 70px) 0 0;
  color: #edf2ee;
  font-family: "Inter Variable", "Inter", sans-serif;
  font-size: clamp(2.65rem, 4.6vw, 5.25rem);
  font-weight: 510;
  letter-spacing: -0.065em;
  line-height: 0.92;
}

.focus-intro h2 em {
  color: #a8d9b7;
  font-style: normal;
}

.focus-panels {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-self: end;
  border-top: 1px solid rgba(238, 246, 240, 0.17);
  border-bottom: 1px solid rgba(238, 246, 240, 0.17);
}

.focus-panel {
  position: relative;
  min-height: 355px;
  padding: 24px clamp(20px, 2.5vw, 38px) 30px;
  overflow: hidden;
  border-right: 1px solid rgba(238, 246, 240, 0.13);
  background: linear-gradient(145deg, rgba(221, 247, 225, 0.045), transparent 58%);
  transition: background 260ms ease, border-color 260ms ease;
}

.focus-panel:last-child {
  border-right: 0;
}

.focus-panel::after {
  position: absolute;
  right: -58px;
  bottom: -68px;
  width: 190px;
  height: 190px;
  border: 1px solid rgba(168, 217, 183, 0.18);
  border-radius: 50%;
  content: "";
  transition: transform 420ms ease, border-color 420ms ease;
}

.focus-panel:hover {
  background: linear-gradient(145deg, rgba(221, 247, 225, 0.085), transparent 64%);
  border-color: rgba(168, 217, 183, 0.27);
}

.focus-panel:hover::after {
  border-color: rgba(168, 217, 183, 0.34);
  transform: scale(1.16);
}

.focus-index {
  color: rgba(210, 226, 215, 0.62);
  font-size: 0.66rem;
  font-weight: 750;
  letter-spacing: 0.13em;
}

.focus-panel h3 {
  max-width: 265px;
  margin: 96px 0 16px;
  color: #edf2ee;
  font-family: "Inter Variable", "Inter", sans-serif;
  font-size: clamp(1.55rem, 2.4vw, 2.35rem);
  font-weight: 510;
  letter-spacing: -0.045em;
  line-height: 1.03;
}

.focus-panel p {
  position: relative;
  z-index: 1;
  max-width: 300px;
  margin: 0;
  color: rgba(204, 225, 198, 0.68);
  font-size: 0.86rem;
  line-height: 1.7;
}

.focus-panel-accent h3 {
  color: #b7e7c4;
}

.focus-scan {
  position: absolute;
  right: 28px;
  bottom: 33px;
  left: 28px;
  height: 1px;
  overflow: hidden;
  background: rgba(168, 217, 183, 0.18);
}

.focus-scan span {
  position: absolute;
  top: 0;
  left: -24%;
  width: 24%;
  height: 1px;
  background: #b7e7c4;
  box-shadow: 0 0 12px rgba(183, 231, 196, 0.82);
  animation: focus-scan-line 3.8s ease-in-out infinite;
}

.focus-readout {
  position: absolute;
  right: 28px;
  bottom: 27px;
  display: flex;
  flex-direction: column;
  gap: 5px;
  color: rgba(210, 226, 215, 0.55);
  font-size: 0.6rem;
  letter-spacing: 0.12em;
}

.focus-readout strong {
  color: #b7e7c4;
  font-size: 0.72rem;
  font-weight: 750;
  letter-spacing: 0.17em;
}

@keyframes focus-scan-line {
  0%, 100% { transform: translateX(0); opacity: 0.2; }
  45%, 62% { transform: translateX(515%); opacity: 1; }
}

@media (max-width: 900px) {
  .focus-section {
    grid-template-columns: 1fr;
  }

  .focus-intro h2 {
    margin-top: 38px;
  }
}

@media (max-width: 620px) {
  .focus-panels {
    display: flex;
    gap: 12px;
    overflow-x: auto;
    overflow-y: hidden;
    padding-bottom: 12px;
    scroll-snap-type: x mandatory;
    overscroll-behavior-x: contain;
    scrollbar-width: thin;
    scrollbar-color: rgba(168, 217, 183, 0.5) transparent;
  }

  .focus-panels::-webkit-scrollbar {
    height: 4px;
  }

  .focus-panels::-webkit-scrollbar-track {
    background: transparent;
  }

  .focus-panels::-webkit-scrollbar-thumb {
    background: rgba(168, 217, 183, 0.5);
  }

  .focus-panel {
    flex: 0 0 min(84vw, 360px);
    min-height: 300px;
    scroll-snap-align: start;
    border-right: 1px solid rgba(238, 246, 240, 0.13);
  }

  .focus-panel + .focus-panel {
    border-top: 0;
  }

  .focus-panel h3 {
    margin-top: 72px;
  }
}

.focus-section {
  background: #020302;
}

.focus-section::after {
  position: absolute;
  top: 0;
  right: 14%;
  width: 1px;
  height: 100%;
  background: linear-gradient(to bottom, transparent, rgba(188, 246, 109, 0.18), transparent);
  content: "";
  opacity: 0.42;
  pointer-events: none;
}

.focus-section .section-marker span:first-child,
.focus-section .section-marker span:last-child,
.focus-intro h2,
.focus-intro h2 em,
.focus-panel h3,
.focus-panel-accent h3,
.focus-index,
.focus-panel p,
.focus-readout,
.focus-readout strong {
  color: #ffffff;
}

.focus-section .section-marker span:first-child,
.focus-index,
.focus-panel p,
.focus-readout {
  color: rgba(255, 255, 255, 0.68);
}

.focus-section .section-marker span:last-child,
.focus-readout strong {
  color: rgba(255, 255, 255, 0.9);
}

.focus-panel {
  isolation: isolate;
  background:
    radial-gradient(circle at 16% 0%, rgba(255, 255, 255, 0.08), transparent 34%),
    linear-gradient(145deg, rgba(255, 255, 255, 0.052), rgba(255, 255, 255, 0.012) 48%, rgba(0, 0, 0, 0.22)),
    repeating-linear-gradient(118deg, rgba(255, 255, 255, 0.018) 0 1px, transparent 1px 8px);
  background-blend-mode: screen, normal, soft-light;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.08), inset 0 -30px 60px rgba(0, 0, 0, 0.16);
}

.focus-panel::before {
  position: absolute;
  inset: 0;
  z-index: -1;
  background-image:
    radial-gradient(circle at 15% 22%, rgba(255, 255, 255, 0.12) 0 0.6px, transparent 0.8px),
    radial-gradient(circle at 71% 61%, rgba(188, 246, 109, 0.1) 0 0.7px, transparent 0.9px),
    radial-gradient(circle at 42% 84%, rgba(255, 255, 255, 0.08) 0 0.55px, transparent 0.75px);
  background-size: 23px 23px, 31px 31px, 19px 19px;
  content: "";
  opacity: 0.25;
  pointer-events: none;
}

.focus-section .focus-intro,
.focus-section .focus-panel {
  opacity: 0;
  transform: translateY(24px);
  transition: opacity 640ms cubic-bezier(0.22, 1, 0.36, 1),
    transform 640ms cubic-bezier(0.22, 1, 0.36, 1);
}

.focus-section.is-visible .focus-intro,
.focus-section.is-visible .focus-panel {
  opacity: 1;
  transform: translateY(0);
}

.focus-section.is-visible .focus-intro {
  transition-delay: 40ms;
}

.focus-section.is-visible .focus-panel:first-child {
  transition-delay: 120ms;
}

.focus-section.is-visible .focus-panel:last-child {
  transition-delay: 200ms;
}

@media (prefers-reduced-motion: reduce) {
  .focus-section .focus-intro,
  .focus-section .focus-panel,
  .focus-section.is-visible .focus-intro,
  .focus-section.is-visible .focus-panel {
    opacity: 1;
    transform: none;
    transition: none;
  }

  .focus-scan span {
    animation: none;
  }
}

.focus-section {
  background-color: #020302;
  background-image: none;
}

.focus-section::before {
  background-image: none;
  opacity: 0;
}

.focus-section::after {
  display: none;
}

.focus-panel {
  background-image:
    linear-gradient(145deg, rgba(8, 11, 9, 0.48), rgba(2, 3, 2, 0.72)),
    url("assets/focus-film-grain.webp");
  background-position: center, center;
  background-repeat: no-repeat, repeat;
  background-size: cover, 680px auto;
  background-blend-mode: normal, soft-light;
}

.focus-panel::before {
  background-image: none;
  opacity: 0;
}

.focus-panel:hover {
  background-image:
    linear-gradient(145deg, rgba(14, 18, 15, 0.34), rgba(2, 3, 2, 0.64)),
    url("assets/focus-film-grain.webp");
  background-position: center, center;
  background-repeat: no-repeat, repeat;
  background-size: cover, 680px auto;
  background-blend-mode: normal, soft-light;
}

.focus-panel::after {
  border-color: rgba(255, 255, 255, 0.14);
}

.focus-panel:hover::after {
  border-color: rgba(255, 255, 255, 0.24);
}

.focus-panel::after {
  right: -78px;
  bottom: -76px;
  width: 255px;
  height: 165px;
  border: 0;
  border-radius: 50%;
  background: radial-gradient(ellipse, rgba(242, 247, 243, 0.15), transparent 70%);
  filter: blur(17px);
  opacity: 0.24;
  transform: none;
  transition: opacity 300ms ease;
}

.focus-panel:hover::after {
  border: 0;
  opacity: 0.34;
  transform: none;
}

.focus-scan,
.focus-scan span {
  display: none;
  animation: none;
}

.contact-section.contact-cta-light {
  min-height: 0;
  border-top: 1px solid rgba(12, 17, 13, 0.16);
  border-bottom: 1px solid rgba(12, 17, 13, 0.16);
  background-color: #f5f6f2;
  background-image: url("assets/contact-paper-grain.webp");
  background-position: center;
  background-repeat: repeat;
  background-size: 920px auto;
  color: #0b100c;
}

.contact-cta-light .contact-glow {
  display: none;
}

.contact-cta-light .contact-inner {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  column-gap: clamp(34px, 8vw, 150px);
  max-width: 1500px;
  padding: clamp(24px, 3vw, 40px) clamp(22px, 7.2vw, 116px);
}

.contact-cta-light .contact-logo {
  top: 50%;
  right: clamp(22px, 7vw, 116px);
  width: min(18vw, 230px);
  opacity: 0.1;
  filter: grayscale(1) contrast(1.5);
  transform: translateY(-50%);
}

.contact-cta-light .contact-label,
.contact-cta-light h2,
.contact-cta-light .contact-inner > p,
.contact-cta-light .contact-button {
  position: relative;
  z-index: 1;
}

.contact-cta-light .contact-label {
  grid-column: 1;
  margin: 0 0 9px;
  color: rgba(11, 16, 12, 0.56);
  font-size: 0.62rem;
  font-weight: 800;
  letter-spacing: 0.14em;
}

.contact-cta-light h2 {
  grid-column: 1;
  max-width: 720px;
  margin: 0;
  color: #0b100c;
  font-size: clamp(1.75rem, 3.2vw, 3.35rem);
  letter-spacing: -0.065em;
  line-height: 0.98;
}

.contact-cta-light h2 em {
  color: #0b100c;
  font-style: normal;
}

.contact-cta-light .contact-inner > p {
  grid-column: 1;
  max-width: 470px;
  margin: 10px 0 0;
  color: rgba(11, 16, 12, 0.66);
  font-size: 0.8rem;
  line-height: 1.65;
}

.contact-cta-light .contact-button {
  grid-column: 2;
  grid-row: 1 / span 4;
  align-self: center;
  margin-top: 0;
  padding: 12px 16px;
  border: 1px solid #0b100c;
  background: #0b100c;
  color: #ffffff;
  box-shadow: 0 12px 26px rgba(11, 16, 12, 0.12);
}

.contact-cta-light .contact-button:hover,
.contact-cta-light .contact-button:focus-visible {
  border-color: #0b100c;
  background: #ffffff;
  color: #0b100c;
  transform: translateY(-2px);
}

@media (max-width: 760px) {
  .contact-cta-light .contact-inner {
    display: block;
  }

  .contact-cta-light .contact-logo {
    width: 130px;
  }

  .contact-cta-light .contact-button {
    margin-top: 28px;
  }
}

.contact-section.contact-cta-light {
  border-top-color: rgba(244, 248, 244, 0.14);
  border-bottom-color: rgba(244, 248, 244, 0.14);
  background-color: #252627;
  background-image:
    linear-gradient(rgba(37, 38, 39, 0.86), rgba(37, 38, 39, 0.86)),
    url("assets/focus-film-grain.webp");
  background-blend-mode: normal, soft-light;
  background-size: auto, 720px auto;
  color: #f4f7f3;
}

.contact-cta-light .contact-logo {
  opacity: 0.14;
  filter: grayscale(1) brightness(0) invert(1);
}

.contact-cta-light .contact-label {
  color: rgba(244, 248, 244, 0.58);
}

.contact-cta-light h2,
.contact-cta-light h2 em {
  color: #f4f7f3;
}

.contact-cta-light .contact-inner > p {
  color: rgba(244, 248, 244, 0.66);
}

.contact-cta-light .contact-button {
  border-color: #f4f7f3;
  background: #f4f7f3;
  color: #0b100c;
  box-shadow: 0 12px 26px rgba(0, 0, 0, 0.2);
}

.contact-cta-light .contact-button:hover,
.contact-cta-light .contact-button:focus-visible {
  border-color: #ffffff;
  background: #ffffff;
  color: #0b100c;
}

.proof-section {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 32px;
  padding: clamp(42px, 5vw, 70px) clamp(22px, 7.2vw, 116px);
  overflow: hidden;
  border-bottom: 1px solid rgba(238, 246, 240, 0.1);
  background: #020302;
}

.proof-section::before {
  position: absolute;
  inset: 0;
  background: url("assets/focus-film-grain.webp") center / 720px auto repeat;
  content: "";
  opacity: 0.1;
  pointer-events: none;
}

.proof-copy,
.proof-client-button {
  position: relative;
  z-index: 1;
}

.proof-label {
  display: block;
  color: rgba(244, 248, 244, 0.52);
  font-size: 0.64rem;
  font-weight: 800;
  letter-spacing: 0.14em;
}

.proof-stat {
  display: flex;
  align-items: baseline;
  gap: clamp(16px, 2.5vw, 34px);
  margin-top: 15px;
}

.proof-stat strong {
  color: #f4f7f3;
  font-size: clamp(3rem, 6vw, 6.4rem);
  font-weight: 520;
  letter-spacing: -0.08em;
  line-height: 0.84;
}

.proof-stat span {
  color: rgba(244, 248, 244, 0.78);
  font-size: clamp(0.9rem, 1.3vw, 1.15rem);
  line-height: 1.15;
}

.proof-client-button {
  padding: 14px 20px;
  border: 1px solid rgba(244, 248, 244, 0.46);
  border-radius: 999px;
  background: transparent;
  color: #f4f7f3;
  cursor: pointer;
  font-size: 0.7rem;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  transition: background 220ms ease, color 220ms ease, transform 220ms ease;
}

.proof-client-button:hover,
.proof-client-button:focus-visible {
  background: #f4f7f3;
  color: #0b100c;
  transform: translateY(-2px);
}

html {
  scrollbar-gutter: stable;
}

body.modal-open {
  overflow: visible;
  padding-right: 0;
}

.client-modal[hidden] {
  display: none;
}

.client-modal {
  position: fixed;
  z-index: 200;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 100dvh;
  padding: 24px;
  opacity: 0;
  pointer-events: none;
  overscroll-behavior: contain;
  transition: opacity 220ms ease;
}

.client-modal.is-open {
  opacity: 1;
  pointer-events: auto;
}

.client-modal-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.72);
  backdrop-filter: blur(8px);
}

.client-modal-card {
  position: relative;
  z-index: 1;
  margin: auto;
  width: min(100%, 720px);
  padding: clamp(34px, 5vw, 68px);
  overflow: hidden;
  border: 1px solid rgba(244, 248, 244, 0.18);
  background-color: #252627;
  background-image:
    linear-gradient(rgba(37, 38, 39, 0.88), rgba(37, 38, 39, 0.88)),
    url("assets/focus-film-grain.webp");
  background-blend-mode: normal, soft-light;
  background-size: auto, 720px auto;
  box-shadow: 0 24px 90px rgba(0, 0, 0, 0.48);
  transform: translateY(18px) scale(0.98);
  transition: transform 300ms cubic-bezier(0.22, 1, 0.36, 1);
}

.client-modal.is-open .client-modal-card {
  transform: translateY(0) scale(1);
}

.client-modal-close {
  position: absolute;
  top: 18px;
  right: 20px;
  width: 34px;
  height: 34px;
  border: 1px solid rgba(244, 248, 244, 0.22);
  border-radius: 50%;
  background: transparent;
  color: #f4f7f3;
  cursor: pointer;
  font-size: 1.35rem;
  line-height: 1;
}

.client-modal-card h2 {
  max-width: 590px;
  margin: 25px 0 18px;
  color: #f4f7f3;
  font-size: clamp(2rem, 4.4vw, 4.5rem);
  letter-spacing: -0.065em;
  line-height: 0.98;
}

.client-modal-card h2 em {
  color: #f4f7f3;
  font-style: normal;
}

.client-modal-card p {
  max-width: 480px;
  margin: 0;
  color: rgba(244, 248, 244, 0.7);
  font-size: 0.94rem;
  line-height: 1.7;
}

@media (max-width: 620px) {
  .proof-section {
    grid-template-columns: 1fr;
    gap: 26px;
  }

  .proof-client-button {
    justify-self: start;
  }
}

@media (prefers-reduced-motion: reduce) {
  .proof-client-button,
  .client-modal,
  .client-modal-card {
    transition: none;
  }
}

.proof-section {
  grid-template-columns: minmax(0, 1fr) auto;
  min-height: 250px;
  padding-top: clamp(48px, 6vw, 78px);
  padding-bottom: clamp(48px, 6vw, 78px);
  background: #090a0a;
}

.proof-section::before {
  opacity: 0.07;
}

.proof-copy {
  max-width: 780px;
}

.proof-overline {
  display: flex;
  align-items: center;
  gap: 12px;
  color: rgba(244, 248, 244, 0.52);
  font-size: 0.63rem;
  font-weight: 800;
  letter-spacing: 0.14em;
}

.proof-overline::before {
  width: 34px;
  height: 1px;
  background: rgba(244, 248, 244, 0.46);
  content: "";
}

.proof-overline span:first-child {
  color: rgba(244, 248, 244, 0.34);
}

.proof-section h2 {
  margin: 24px 0 0;
  color: #f4f7f3;
  font-size: clamp(2.45rem, 5.2vw, 5.65rem);
  font-weight: 520;
  letter-spacing: -0.075em;
  line-height: 0.92;
}

.proof-section h2 strong {
  color: #ffffff;
  font-weight: 520;
}

.proof-section h2 em {
  color: rgba(244, 248, 244, 0.58);
  font-style: normal;
}

.proof-section .proof-copy > p {
  max-width: 410px;
  margin: 22px 0 0;
  color: rgba(244, 248, 244, 0.62);
  font-size: 0.88rem;
  line-height: 1.6;
}

.proof-client-button {
  display: inline-flex;
  align-items: center;
  gap: 18px;
  min-width: 164px;
  justify-content: space-between;
  padding: 16px 17px;
  border: 1px solid rgba(244, 248, 244, 0.26);
  border-radius: 4px;
  background: rgba(244, 248, 244, 0.04);
  color: #f4f7f3;
  text-align: left;
}

.proof-client-button i {
  display: block;
  width: 20px;
  height: 20px;
  border: 1px solid rgba(244, 248, 244, 0.6);
  border-radius: 50%;
  box-shadow: inset 0 0 0 4px #090a0a;
}

.proof-client-button:hover,
.proof-client-button:focus-visible {
  border-color: rgba(244, 248, 244, 0.72);
  background: rgba(244, 248, 244, 0.12);
  color: #ffffff;
  transform: translateY(-2px);
}

.client-modal-card {
  border-radius: 4px;
  background-color: #202122;
  background-image:
    linear-gradient(rgba(32, 33, 34, 0.9), rgba(32, 33, 34, 0.9)),
    url("assets/focus-film-grain.webp");
}

@media (max-width: 620px) {
  .proof-section {
    min-height: 0;
  }

  .proof-section h2 {
    font-size: clamp(2.25rem, 12vw, 3.8rem);
  }
}

.proof-client-button {
  display: grid;
  grid-template-columns: 42px minmax(100px, 1fr) 8px;
  align-items: center;
  gap: 13px;
  min-width: 255px;
  padding: 15px 16px;
  border-color: rgba(244, 248, 244, 0.24);
  border-radius: 6px;
  background: #1a1b1c;
  color: #f4f7f3;
}

.proof-lock-icon {
  display: grid;
  place-items: center;
  width: 42px;
  height: 42px;
  border: 1px solid rgba(244, 248, 244, 0.2);
  border-radius: 4px;
  background: rgba(244, 248, 244, 0.035);
}

.proof-lock-icon svg {
  width: 25px;
  height: 25px;
  fill: none;
  stroke: #f4f7f3;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 1.35;
}

.proof-lock-icon .lock-shackle {
  transform-origin: 16px 14px;
  animation: lock-seal 3.8s cubic-bezier(0.22, 1, 0.36, 1) infinite;
}

.proof-client-copy {
  display: grid;
  gap: 5px;
  text-align: left;
}

.proof-client-copy small {
  color: rgba(244, 248, 244, 0.45);
  font-size: 0.52rem;
  font-weight: 800;
  letter-spacing: 0.12em;
}

.proof-client-copy strong {
  color: #f4f7f3;
  font-size: 0.84rem;
  font-weight: 650;
  letter-spacing: -0.02em;
}

.proof-client-button > i {
  width: 6px;
  height: 6px;
  border: 0;
  border-radius: 50%;
  background: #f4f7f3;
  box-shadow: none;
}

.proof-client-button:hover,
.proof-client-button:focus-visible {
  border-color: rgba(244, 248, 244, 0.65);
  background: #252627;
}

@keyframes lock-seal {
  0%, 22% { transform: translateY(-2px) rotate(-2deg); }
  35%, 100% { transform: translateY(0) rotate(0); }
}

@media (max-width: 620px) {
  .proof-client-button {
    min-width: min(100%, 255px);
  }
}

@media (prefers-reduced-motion: reduce) {
  .proof-lock-icon .lock-shackle {
    animation: none;
  }
}

body .site-shell > main > * {
  filter: grayscale(1);
}

body .site-shell > header,
body .site-shell > footer,
body .site-shell > main > .hero,
body .site-shell > main > .contact-section {
  filter: none;
}

body .site-shell > main > .hero > .hero-eclipse-backdrop,
body .site-shell > main > .hero > .hero-ground-image {
  filter: grayscale(1);
}

.site-header:not(.is-scrolled) .header-cta,
.site-header.is-scrolled .header-cta {
  border-color: rgba(244, 248, 244, 0.3);
  background: rgba(244, 248, 244, 0.06);
  color: rgba(246, 250, 247, 0.94);
}

.site-header:not(.is-scrolled) .header-cta:hover,
.site-header:not(.is-scrolled) .header-cta:focus-visible {
  border-color: #f4f8f4;
  background: #f4f8f4;
  color: #0b100c;
}

.site-footer {
  border-top-color: rgba(244, 248, 244, 0.12);
  background: #050505;
}

.site-footer p {
  color: rgba(244, 248, 244, 0.35);
}

.site-footer > a:last-child {
  color: rgba(244, 248, 244, 0.7);
}

.contact-cta-light .contact-logo {
  filter: none;
}

.site-header .brand-icon img,
.site-header.is-scrolled .brand-icon img {
  filter: none;
}

.server-page {
  position: relative;
  display: grid;
  align-content: center;
  min-height: 100svh;
  padding: clamp(86px, 10vw, 150px) clamp(22px, 7.2vw, 116px);
  overflow: hidden;
  border-top: 1px solid rgba(244, 248, 244, 0.12);
  background: #070808;
}

.server-page::before {
  position: absolute;
  inset: 0;
  background:
    linear-gradient(90deg, rgba(244, 248, 244, 0.045) 1px, transparent 1px) 0 0 / 72px 100%,
    linear-gradient(rgba(244, 248, 244, 0.035) 1px, transparent 1px) 0 0 / 100% 72px;
  content: "";
  opacity: 0.35;
  pointer-events: none;
}

.server-page-heading,
.server-page-stage {
  position: relative;
  z-index: 1;
}

.server-page-heading {
  max-width: 820px;
}

.server-page-heading h2 {
  max-width: 850px;
  margin: clamp(24px, 3.5vw, 42px) 0 0;
  color: #f4f7f3;
  font-size: clamp(3rem, 6vw, 7rem);
  font-weight: 520;
  letter-spacing: -0.08em;
  line-height: 0.86;
}

.server-page-heading h2 em {
  color: rgba(244, 248, 244, 0.52);
  font-style: normal;
}

.server-page-heading p {
  max-width: 470px;
  margin: clamp(26px, 3vw, 36px) 0 0;
  color: rgba(244, 248, 244, 0.62);
  font-size: 0.94rem;
  line-height: 1.7;
}

.server-page-stage {
  display: grid;
  grid-template-columns: minmax(300px, 1fr) minmax(130px, 0.38fr) minmax(250px, 0.65fr);
  gap: clamp(16px, 2vw, 34px);
  align-items: center;
  margin-top: clamp(60px, 8vw, 112px);
}

.server-code-panel,
.database-panel {
  min-width: 0;
  border: 1px solid rgba(244, 248, 244, 0.22);
  background: rgba(22, 23, 24, 0.78);
  box-shadow: 0 22px 70px rgba(0, 0, 0, 0.24);
}

.server-code-panel {
  overflow: hidden;
}

.server-panel-topbar,
.database-panel-topbar,
.server-panel-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding: 13px 15px;
  color: rgba(244, 248, 244, 0.48);
  font-size: 0.57rem;
  font-weight: 800;
  letter-spacing: 0.12em;
}

.server-panel-topbar,
.database-panel-topbar {
  border-bottom: 1px solid rgba(244, 248, 244, 0.12);
}

.server-code-stream {
  display: grid;
  gap: 21px;
  min-height: 190px;
  padding: 30px 0;
  overflow: hidden;
  mask-image: linear-gradient(90deg, transparent, #000 12%, #000 88%, transparent);
}

.server-code-line {
  display: block;
  width: max-content;
  color: rgba(244, 248, 244, 0.75);
  font-family: "JetBrains Mono", "SFMono-Regular", Consolas, monospace;
  font-size: clamp(0.62rem, 1vw, 0.78rem);
  letter-spacing: 0.03em;
  white-space: nowrap;
  animation: server-code-drift 10s linear infinite;
}

.code-line-a {
  animation-delay: -1.8s;
}

.code-line-b {
  color: rgba(244, 248, 244, 0.52);
  animation-delay: -5.2s;
}

.code-line-c {
  color: rgba(244, 248, 244, 0.86);
  animation-delay: -7.4s;
}

.code-line-d {
  color: rgba(244, 248, 244, 0.42);
  animation-delay: -3.1s;
}

.server-panel-footer {
  border-top: 1px solid rgba(244, 248, 244, 0.12);
  color: rgba(244, 248, 244, 0.38);
}

.server-panel-footer span:last-child,
.database-panel-topbar span:last-child {
  display: inline-flex;
  align-items: center;
  gap: 7px;
}

.server-panel-footer i,
.database-panel-topbar i {
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: #f4f8f4;
}

.server-attack-route {
  position: relative;
  height: 88px;
}

.server-attack-route svg {
  display: block;
  width: 100%;
  height: 100%;
  overflow: visible;
  fill: none;
  stroke: rgba(244, 248, 244, 0.38);
  stroke-width: 1;
  vector-effect: non-scaling-stroke;
}

.server-attack-route .route-branch {
  stroke: rgba(244, 248, 244, 0.18);
  stroke-dasharray: 3 6;
}

.route-packet {
  position: absolute;
  top: calc(50% - 3px);
  left: 0;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #f4f8f4;
  box-shadow: 0 0 16px rgba(244, 248, 244, 0.75);
  animation: server-packet-flow 3.8s linear infinite;
}

.packet-b {
  animation-delay: -1.9s;
}

.database-panel {
  padding-bottom: 18px;
  overflow: hidden;
}

.database-visual {
  position: relative;
  display: grid;
  place-items: center;
  min-height: 230px;
  overflow: hidden;
}

.database-mark {
  position: relative;
  z-index: 2;
  width: 126px;
  height: 126px;
  fill: none;
  stroke: #f4f7f3;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 1.15;
}

.database-scan {
  stroke: rgba(244, 248, 244, 0.5);
  stroke-dasharray: 48;
  animation: database-scan 2.8s ease-in-out infinite;
}

.database-ring {
  position: absolute;
  width: 160px;
  height: 160px;
  border: 1px solid rgba(244, 248, 244, 0.13);
  border-radius: 50%;
  animation: database-ring 4s ease-in-out infinite;
}

.ring-two {
  width: 218px;
  height: 218px;
  border-color: rgba(244, 248, 244, 0.07);
  animation-delay: -1.6s;
}

.database-panel > strong,
.database-panel > small {
  display: block;
  padding: 0 18px;
}

.database-panel > strong {
  color: #f4f7f3;
  font-size: 0.73rem;
  font-weight: 800;
  letter-spacing: 0.12em;
}

.database-panel > small {
  margin-top: 8px;
  color: rgba(244, 248, 244, 0.42);
  font-size: 0.58rem;
  font-weight: 700;
  letter-spacing: 0.1em;
}

@keyframes server-code-drift {
  0% { transform: translateX(-34%); }
  100% { transform: translateX(9%); }
}

@keyframes server-packet-flow {
  0% { left: 0; opacity: 0; transform: scale(0.6); }
  10% { opacity: 1; }
  90% { opacity: 1; }
  100% { left: calc(100% - 6px); opacity: 0; transform: scale(1); }
}

@keyframes database-scan {
  0%, 100% { opacity: 0.28; transform: translateX(-14px); }
  50% { opacity: 1; transform: translateX(14px); }
}

@keyframes database-ring {
  0%, 100% { opacity: 0.45; transform: scale(0.94); }
  50% { opacity: 1; transform: scale(1); }
}

@media (max-width: 900px) {
  .server-page-stage {
    grid-template-columns: minmax(0, 1fr) minmax(220px, 0.7fr);
  }

  .server-code-panel {
    grid-column: 1 / -1;
  }

  .server-attack-route {
    grid-column: 1;
    grid-row: 2;
  }

  .database-panel {
    grid-column: 2;
    grid-row: 2;
  }
}

@media (max-width: 620px) {
  .server-page {
    min-height: auto;
    padding-top: 76px;
    padding-bottom: 86px;
  }

  .server-page-stage {
    grid-template-columns: 1fr;
    gap: 20px;
    margin-top: 54px;
  }

  .server-attack-route,
  .database-panel {
    grid-column: auto;
    grid-row: auto;
  }

  .server-attack-route {
    height: 58px;
  }

  .database-visual {
    min-height: 190px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .server-code-line,
  .route-packet,
  .database-scan,
  .database-ring {
    animation: none;
  }
}

.server-page-stage {
  grid-template-columns: minmax(260px, 0.72fr) minmax(240px, 1.16fr) minmax(230px, 0.62fr);
}

.server-code-panel {
  border-color: rgba(244, 248, 244, 0.16);
  background: rgba(13, 14, 15, 0.64);
  box-shadow: none;
}

.server-code-stream {
  min-height: 174px;
  gap: 25px;
  padding: 27px 0;
}

.server-attack-route {
  min-width: 0;
  height: 118px;
}

.server-attack-route svg {
  stroke: rgba(244, 248, 244, 0.64);
  stroke-width: 1.25;
}

.server-attack-route .route-branch {
  stroke: rgba(244, 248, 244, 0.25);
  stroke-dasharray: 2 7;
}

.route-label {
  position: absolute;
  top: calc(50% - 31px);
  display: block;
  padding: 5px 8px;
  border: 1px solid rgba(244, 248, 244, 0.18);
  background: rgba(7, 8, 8, 0.92);
  color: rgba(244, 248, 244, 0.72);
  font-family: "JetBrains Mono", "SFMono-Regular", Consolas, monospace;
  font-size: 0.52rem;
  letter-spacing: 0.08em;
  white-space: nowrap;
  animation: route-code-flow 5.8s linear infinite;
}

.route-label-a {
  animation-delay: -2.1s;
}

.route-label-b {
  top: calc(50% + 17px);
  color: rgba(244, 248, 244, 0.48);
  animation-delay: -4.2s;
}

.database-panel {
  border-color: rgba(244, 248, 244, 0.3);
  background: rgba(18, 19, 20, 0.82);
}

.database-visual {
  min-height: 248px;
}

.database-mark {
  width: 164px;
  height: 164px;
  stroke-width: 0.95;
}

.database-data {
  stroke: rgba(244, 248, 244, 0.38);
  stroke-dasharray: 5 5;
  animation: database-data-pulse 2.2s linear infinite;
}

.database-core {
  fill: #f4f7f3;
  stroke: none;
  animation: database-core-pulse 2.2s ease-in-out infinite;
}

.database-scan {
  stroke: #f4f7f3;
  stroke-dasharray: 18 12;
  animation: database-scan-linear 2.4s linear infinite;
}

@keyframes route-code-flow {
  0% { left: -12%; opacity: 0; transform: translateX(-8px); }
  12% { opacity: 1; }
  82% { opacity: 1; }
  100% { left: 88%; opacity: 0; transform: translateX(8px); }
}

@keyframes database-data-pulse {
  0% { stroke-dashoffset: 0; opacity: 0.35; }
  50% { opacity: 1; }
  100% { stroke-dashoffset: -20; opacity: 0.35; }
}

@keyframes database-core-pulse {
  0%, 100% { opacity: 0.45; transform: scale(0.8); transform-origin: 58px 56px; }
  50% { opacity: 1; transform: scale(1.2); transform-origin: 58px 56px; }
}

@keyframes database-scan-linear {
  0% { stroke-dashoffset: 64; opacity: 0.2; }
  50% { opacity: 1; }
  100% { stroke-dashoffset: 0; opacity: 0.2; }
}

@media (max-width: 900px) {
  .server-page-stage {
    grid-template-columns: minmax(0, 1fr) minmax(220px, 0.7fr);
  }
}

@media (max-width: 620px) {
  .server-page-stage {
    grid-template-columns: 1fr;
  }

  .server-attack-route {
    height: 72px;
  }

  .database-visual {
    min-height: 210px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .route-label,
  .database-data,
  .database-core,
  .database-scan {
    animation: none;
  }
}

.server-page-stage {
  grid-template-columns: minmax(250px, 0.72fr) minmax(240px, 1.05fr) minmax(230px, 0.62fr);
}

.server-code-bridge {
  position: relative;
  display: flex;
  min-width: 0;
  height: 174px;
  flex-direction: column;
  justify-content: space-around;
  overflow: hidden;
  mask-image: linear-gradient(90deg, transparent, #000 10%, #000 90%, transparent);
}

.bridge-code {
  display: block;
  width: max-content;
  color: rgba(244, 248, 244, 0.7);
  font-family: "JetBrains Mono", "SFMono-Regular", Consolas, monospace;
  font-size: 0.58rem;
  letter-spacing: 0.06em;
  white-space: nowrap;
  animation: bridge-code-to-database 7.5s linear infinite;
}

.bridge-code-a {
  animation-delay: -2.4s;
}

.bridge-code-b {
  color: rgba(244, 248, 244, 0.45);
  animation-delay: -5.1s;
}

.bridge-code-c {
  color: rgba(244, 248, 244, 0.58);
  animation-delay: -7s;
}

.database-visual {
  min-height: 248px;
}

.database-mark {
  width: min(100%, 204px);
  height: auto;
  overflow: visible;
  fill: none;
  stroke: none;
}

.database-layer {
  fill: rgba(244, 248, 244, 0.035);
  stroke: rgba(244, 248, 244, 0.45);
  stroke-width: 1;
}

.layer-middle {
  fill: rgba(244, 248, 244, 0.06);
}

.layer-front {
  fill: rgba(244, 248, 244, 0.095);
  stroke: rgba(244, 248, 244, 0.76);
}

.database-data {
  fill: none;
  stroke: rgba(244, 248, 244, 0.6);
  stroke-width: 1.4;
  stroke-linecap: round;
  stroke-dasharray: 5 5;
  animation: database-data-pulse 2.2s linear infinite;
}

.database-core {
  fill: #f4f7f3;
  stroke: none;
  animation: database-core-pulse 2.2s ease-in-out infinite;
}

.database-scan {
  fill: none;
  stroke: rgba(244, 248, 244, 0.8);
  stroke-width: 1;
  stroke-dasharray: 12 15;
  animation: database-scan-linear 2.4s linear infinite;
}

@keyframes bridge-code-to-database {
  0% { transform: translateX(-32%); opacity: 0; }
  12% { opacity: 1; }
  86% { opacity: 1; }
  100% { transform: translateX(92%); opacity: 0; }
}

@media (max-width: 900px) {
  .server-page-stage {
    grid-template-columns: minmax(0, 1fr) minmax(220px, 0.7fr);
  }

  .server-code-bridge {
    grid-column: 1;
    grid-row: 2;
  }

  .database-panel {
    grid-column: 2;
    grid-row: 2;
  }
}

@media (max-width: 620px) {
  .server-page-stage {
    grid-template-columns: 1fr;
  }

  .server-code-bridge,
  .database-panel {
    grid-column: auto;
    grid-row: auto;
  }

  .server-code-bridge {
    height: 86px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .bridge-code,
  .database-data,
  .database-core,
  .database-scan {
    animation: none;
  }
}

.database-visual {
  min-height: 282px;
  padding: 5px 6px 0;
}

.database-mark {
  width: min(100%, 242px);
  height: auto;
  overflow: visible;
}

.database-shadow,
.database-top,
.database-face,
.database-side {
  stroke-linejoin: round;
  stroke-width: 1;
}

.database-shadow {
  fill: rgba(244, 248, 244, 0.025);
  stroke: rgba(244, 248, 244, 0.18);
}

.database-top {
  fill: rgba(244, 248, 244, 0.11);
  stroke: rgba(244, 248, 244, 0.72);
}

.database-face {
  fill: rgba(244, 248, 244, 0.065);
  stroke: rgba(244, 248, 244, 0.48);
}

.database-side {
  fill: rgba(244, 248, 244, 0.035);
  stroke: rgba(244, 248, 244, 0.3);
}

.database-data {
  fill: none;
  stroke: rgba(244, 248, 244, 0.65);
  stroke-linecap: round;
  stroke-width: 1.8;
  stroke-dasharray: 32 10;
  animation: database-data-pulse 2.8s linear infinite;
}

.database-core {
  fill: #f4f7f3;
  stroke: none;
  transform-box: fill-box;
  transform-origin: center;
  animation: database-node-pulse 2.8s ease-in-out infinite;
}

.database-core:nth-of-type(2) {
  animation-delay: -0.6s;
}

.database-core:nth-of-type(3) {
  animation-delay: -1.2s;
}

.database-scan {
  fill: none;
  stroke: rgba(244, 248, 244, 0.92);
  stroke-linecap: round;
  stroke-width: 1;
  stroke-dasharray: 24 20;
  animation: database-scan-linear 2.6s linear infinite;
}

@keyframes database-node-pulse {
  0%, 100% { opacity: 0.35; transform: scale(0.72); }
  50% { opacity: 1; transform: scale(1.18); }
}

@media (max-width: 620px) {
  .database-visual {
    min-height: 242px;
  }
}

.database-panel {
  position: relative;
  align-self: center;
  padding: 0;
  overflow: visible;
  border: 0;
  background: transparent;
  box-shadow: none;
}

.database-label {
  display: block;
  margin-bottom: 14px;
  color: rgba(244, 248, 244, 0.46);
  font-size: 0.58rem;
  font-weight: 800;
  letter-spacing: 0.14em;
  text-align: center;
}

.database-visual {
  min-height: 338px;
  padding: 0;
}

.database-mark {
  width: min(100%, 340px);
  height: auto;
  overflow: visible;
}

.data-tray {
  transform-box: fill-box;
  transform-origin: center;
}

.data-tray-top {
  animation: data-tray-top-float 5.4s ease-in-out infinite;
}

.data-tray-middle {
  animation: data-tray-middle-float 5.4s ease-in-out -1.8s infinite;
}

.data-tray-bottom {
  animation: data-tray-bottom-float 5.4s ease-in-out -3.4s infinite;
}

.tray-top,
.tray-left,
.tray-right {
  stroke-linejoin: round;
  stroke-width: 1;
}

.tray-top {
  fill: rgba(244, 248, 244, 0.1);
  stroke: rgba(244, 248, 244, 0.76);
}

.tray-left {
  fill: rgba(244, 248, 244, 0.035);
  stroke: rgba(244, 248, 244, 0.31);
}

.tray-right {
  fill: rgba(244, 248, 244, 0.07);
  stroke: rgba(244, 248, 244, 0.48);
}

.tray-slot {
  fill: none;
  stroke: rgba(244, 248, 244, 0.46);
  stroke-linecap: round;
  stroke-width: 1.4;
  stroke-dasharray: 36 7;
  animation: data-slot-flow 3.6s linear infinite;
}

.tray-light {
  fill: #f4f7f3;
  stroke: none;
  transform-box: fill-box;
  transform-origin: center;
  animation: tray-light-pulse 2.4s ease-in-out infinite;
}

.data-spine {
  fill: none;
  stroke: rgba(244, 248, 244, 0.26);
  stroke-dasharray: 4 8;
  stroke-linecap: round;
  stroke-width: 1;
  animation: data-spine-flow 4s linear infinite;
}

@keyframes data-tray-top-float {
  0%, 100% { transform: translateY(-3px); }
  50% { transform: translateY(-12px); }
}

@keyframes data-tray-middle-float {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-7px); }
}

@keyframes data-tray-bottom-float {
  0%, 100% { transform: translateY(2px); }
  50% { transform: translateY(-3px); }
}

@keyframes data-slot-flow {
  from { stroke-dashoffset: 0; }
  to { stroke-dashoffset: -43; }
}

@keyframes tray-light-pulse {
  0%, 100% { opacity: 0.35; transform: scale(0.72); }
  50% { opacity: 1; transform: scale(1.28); }
}

@keyframes data-spine-flow {
  from { stroke-dashoffset: 0; }
  to { stroke-dashoffset: -36; }
}

@media (max-width: 620px) {
  .database-visual {
    min-height: 286px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .data-tray,
  .tray-slot,
  .tray-light,
  .data-spine {
    animation: none;
  }
}

.server-page-stage {
  grid-template-columns: minmax(240px, 0.7fr) minmax(170px, 0.5fr) minmax(280px, 0.88fr);
}

.database-panel {
  display: grid;
  min-height: 340px;
  place-items: center;
  isolation: isolate;
}

.database-panel::before {
  position: absolute;
  z-index: -1;
  width: min(92%, 340px);
  aspect-ratio: 1;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(244, 248, 244, 0.12), transparent 67%);
  content: "";
  filter: blur(18px);
  opacity: 0.52;
}

.database-server-asset {
  position: relative;
  z-index: 1;
  display: block;
  width: min(100%, 370px);
  height: auto;
  filter: grayscale(1) contrast(1.08) brightness(0.94);
  object-fit: contain;
  transform-origin: center bottom;
  animation: data-core-breathe 7.2s ease-in-out infinite;
  will-change: transform, filter;
}

@keyframes data-core-breathe {
  0%, 100% {
    filter: grayscale(1) contrast(1.08) brightness(0.92);
    transform: translateY(3px) scale(0.985);
  }
  50% {
    filter: grayscale(1) contrast(1.12) brightness(1.02);
    transform: translateY(-6px) scale(1);
  }
}

@media (max-width: 900px) {
  .server-page-stage {
    grid-template-columns: minmax(0, 1fr) minmax(230px, 0.78fr);
  }
}

@media (max-width: 620px) {
  .server-page-stage {
    grid-template-columns: 1fr;
  }

  .database-panel {
    min-height: 290px;
  }

  .database-server-asset {
    width: min(100%, 310px);
  }
}

@media (prefers-reduced-motion: reduce) {
  .database-server-asset {
    animation: none;
  }
}

.deliverables-section {
  position: relative;
  display: grid;
  grid-template-columns: minmax(260px, 0.72fr) minmax(0, 1.28fr);
  gap: clamp(44px, 9vw, 150px);
  align-items: start;
  padding: clamp(92px, 11vw, 168px) clamp(22px, 7.2vw, 116px);
  overflow: hidden;
  border-top: 1px solid rgba(244, 248, 244, 0.11);
  background: #0a0b0b;
}

.deliverables-section::before {
  position: absolute;
  inset: 0;
  background:
    linear-gradient(90deg, rgba(244, 248, 244, 0.045) 1px, transparent 1px) 0 0 / 72px 100%,
    url("assets/focus-film-grain.webp") center / 720px auto repeat;
  content: "";
  opacity: 0.08;
  pointer-events: none;
}

.deliverables-heading,
.deliverables-list {
  position: relative;
  z-index: 1;
}

.deliverables-heading {
  position: sticky;
  top: 110px;
  max-width: 560px;
}

.deliverables-heading h2 {
  max-width: 530px;
  margin: clamp(24px, 3.5vw, 42px) 0 0;
  color: #f4f7f3;
  font-size: clamp(3rem, 5.7vw, 6.8rem);
  font-weight: 520;
  letter-spacing: -0.08em;
  line-height: 0.87;
}

.deliverables-heading h2 em {
  color: rgba(244, 248, 244, 0.48);
  font-style: normal;
}

.deliverables-heading p {
  max-width: 410px;
  margin: clamp(26px, 3.4vw, 42px) 0 0;
  color: rgba(244, 248, 244, 0.6);
  font-size: 0.92rem;
  line-height: 1.75;
}

.deliverables-list {
  border-top: 1px solid rgba(244, 248, 244, 0.22);
}

.deliverable-row {
  position: relative;
  display: grid;
  grid-template-columns: 38px 42px minmax(0, 1fr) auto;
  gap: 17px;
  align-items: center;
  min-height: 142px;
  padding: 25px 0;
  border-bottom: 1px solid rgba(244, 248, 244, 0.14);
  opacity: 0;
  transform: translateY(22px);
  transition: opacity 620ms ease, transform 620ms cubic-bezier(0.22, 1, 0.36, 1), background 260ms ease, padding 260ms ease, border-color 260ms ease;
}

.deliverable-row.is-visible {
  opacity: 1;
  transform: translateY(0);
}

.deliverable-row:nth-child(2) {
  transition-delay: 70ms;
}

.deliverable-row:nth-child(3) {
  transition-delay: 140ms;
}

.deliverable-row:nth-child(4) {
  transition-delay: 210ms;
}

.deliverable-row::after {
  position: absolute;
  right: 0;
  bottom: -1px;
  left: 0;
  height: 1px;
  background: #f4f8f4;
  content: "";
  opacity: 0;
  transform: scaleX(0);
  transform-origin: left;
  transition: opacity 260ms ease, transform 420ms cubic-bezier(0.22, 1, 0.36, 1);
}

.deliverable-row:hover,
.deliverable-row:focus-within {
  padding-right: 12px;
  padding-left: 12px;
  border-color: rgba(244, 248, 244, 0.3);
  background: rgba(244, 248, 244, 0.035);
}

.deliverable-row:hover::after,
.deliverable-row:focus-within::after {
  opacity: 0.72;
  transform: scaleX(1);
}

.deliverable-index,
.deliverable-status,
.deliverable-kicker {
  color: rgba(244, 248, 244, 0.42);
  font-size: 0.58rem;
  font-weight: 800;
  letter-spacing: 0.13em;
}

.deliverable-index {
  align-self: start;
  padding-top: 5px;
}

.deliverable-icon {
  display: grid;
  width: 38px;
  height: 38px;
  place-items: center;
  border: 1px solid rgba(244, 248, 244, 0.25);
  border-radius: 50%;
  color: rgba(244, 248, 244, 0.78);
  transition: border-color 260ms ease, color 260ms ease, transform 260ms ease;
}

.deliverable-icon svg {
  width: 19px;
  height: 19px;
  fill: none;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 1.15;
}

.deliverable-row:hover .deliverable-icon,
.deliverable-row:focus-within .deliverable-icon {
  border-color: rgba(244, 248, 244, 0.74);
  color: #ffffff;
  transform: translateY(-2px);
}

.deliverable-kicker {
  display: block;
  margin-bottom: 8px;
}

.deliverable-copy h3 {
  margin: 0;
  color: #f4f7f3;
  font-size: clamp(1.15rem, 1.8vw, 1.65rem);
  font-weight: 520;
  letter-spacing: -0.045em;
  line-height: 1;
}

.deliverable-copy p {
  max-width: 470px;
  margin: 10px 0 0;
  color: rgba(244, 248, 244, 0.55);
  font-size: 0.78rem;
  line-height: 1.55;
}

.deliverable-status {
  align-self: start;
  padding-top: 5px;
  color: rgba(244, 248, 244, 0.62);
  white-space: nowrap;
}

@media (max-width: 900px) {
  .deliverables-section {
    grid-template-columns: 1fr;
    gap: 56px;
  }

  .deliverables-heading {
    position: relative;
    top: auto;
  }
}

@media (max-width: 620px) {
  .deliverables-section {
    padding-top: 86px;
    padding-bottom: 96px;
  }

  .deliverable-row {
    grid-template-columns: 30px 38px minmax(0, 1fr);
    gap: 12px;
    align-items: start;
    min-height: 0;
    padding: 22px 0;
  }

  .deliverable-icon {
    width: 34px;
    height: 34px;
  }

  .deliverable-status {
    display: none;
  }
}

@media (prefers-reduced-motion: reduce) {
  .deliverable-row,
  .deliverable-row::after,
  .deliverable-icon {
    transition: none;
  }

  .deliverable-row,
  .deliverable-row.is-visible {
    opacity: 1;
    transform: none;
  }
}

.proof-client-button.is-locking .proof-lock-icon {
  animation: lock-emerge-close 620ms cubic-bezier(0.22, 1, 0.36, 1) both;
  will-change: transform, opacity;
}

.proof-client-button.is-locking .proof-lock-icon .lock-shackle {
  animation: lock-open-close 620ms cubic-bezier(0.22, 1, 0.36, 1) both;
  will-change: transform;
}

@keyframes lock-emerge-close {
  0% {
    opacity: 0.25;
    transform: translateY(10px) scale(0.7);
  }
  24% {
    opacity: 1;
    transform: translateY(-9px) scale(1.16);
  }
  50% {
    transform: translateY(-3px) scale(1.04);
  }
  76%, 100% {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}

@keyframes lock-open-close {
  0%, 14% {
    opacity: 0.6;
    transform: translateY(3px) rotate(-28deg);
  }
  38% {
    opacity: 1;
    transform: translateY(-2px) rotate(-28deg);
  }
  68%, 100% {
    opacity: 1;
    transform: translateY(0) rotate(0);
  }
}

@media (prefers-reduced-motion: reduce) {
  .proof-client-button.is-locking .proof-lock-icon,
  .proof-client-button.is-locking .proof-lock-icon .lock-shackle {
    animation: none;
  }
}

.proof-section {
  display: grid;
  grid-template-columns: minmax(0, 1.08fr) minmax(320px, 0.92fr);
  gap: clamp(42px, 8vw, 150px);
  align-items: center;
  min-height: clamp(380px, 40vw, 560px);
  padding-top: clamp(72px, 9vw, 132px);
  padding-bottom: clamp(72px, 9vw, 132px);
}

.proof-copy {
  max-width: 760px;
}

.proof-section h2 {
  max-width: 820px;
  margin-top: clamp(22px, 3vw, 34px);
  font-size: clamp(3rem, 6.4vw, 7.25rem);
  line-height: 0.88;
}

.proof-section .proof-copy > p {
  max-width: 470px;
  margin-top: clamp(24px, 3vw, 34px);
  font-size: 0.94rem;
  line-height: 1.7;
}

.proof-client-card {
  position: relative;
  isolation: isolate;
  justify-self: end;
  width: min(100%, 430px);
  padding: 19px;
  overflow: hidden;
  border: 1px solid rgba(244, 248, 244, 0.23);
  background: linear-gradient(180deg, #202023 0%, #151518 34%, #09090b 67%, #030303 100%);
  box-shadow: 18px 18px 0 rgba(244, 248, 244, 0.035);
}

.proof-client-card::before,
.proof-client-card::after {
  position: absolute;
  z-index: -1;
  content: "";
  pointer-events: none;
}

.proof-client-card::before {
  inset: 0;
  background: linear-gradient(110deg, transparent 18%, rgba(255, 255, 255, 0.08) 18.2%, transparent 18.5%);
  opacity: 0.65;
}

.proof-client-card::after {
  right: -28px;
  bottom: -28px;
  width: 122px;
  height: 122px;
  border: 1px solid rgba(244, 248, 244, 0.16);
  border-radius: 50%;
  box-shadow: 0 0 0 15px rgba(244, 248, 244, 0.025), 0 0 0 30px rgba(244, 248, 244, 0.018);
}

.proof-client-card-main {
  display: flex;
  min-height: 174px;
  align-items: center;
  padding: 28px 0 31px;
}

.proof-client-card h3 {
  margin: 0;
  color: #f4f7f3;
  font-size: clamp(1.55rem, 2.4vw, 2.3rem);
  font-weight: 520;
  letter-spacing: 0.015em;
  line-height: 0.98;
}

.proof-client-card-main p {
  max-width: 240px;
  margin: 14px 0 0;
  color: rgba(244, 248, 244, 0.58);
  font-size: 0.78rem;
  line-height: 1.55;
}

.proof-client-card .proof-client-button {
  width: 100%;
  min-width: 0;
  padding: 13px 14px;
  border-color: rgba(244, 248, 244, 0.3);
  background: rgba(244, 248, 244, 0.06);
}

.proof-client-card .proof-client-button:hover,
.proof-client-card .proof-client-button:focus-visible {
  border-color: rgba(244, 248, 244, 0.74);
  background: rgba(244, 248, 244, 0.13);
  transform: translateY(-2px);
}

.proof-client-card .proof-client-button > i {
  display: grid;
  place-items: center;
  width: 27px;
  height: 27px;
  border: 1px solid rgba(244, 248, 244, 0.4);
  border-radius: 50%;
  background: transparent;
  color: #f4f8f4;
  font-size: 1rem;
  font-style: normal;
  line-height: 1;
}

@media (max-width: 760px) {
  .proof-section {
    grid-template-columns: 1fr;
    gap: 42px;
  }

  .proof-client-card {
    justify-self: stretch;
    width: 100%;
  }
}

.hero.hero-halftone {
  isolation: isolate;
  background:
    radial-gradient(ellipse 44% 42% at 76% 37%, rgba(244, 248, 244, 0.075), transparent 70%),
    #020302;
}

.hero-halftone-canvas {
  position: absolute;
  z-index: 0;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  opacity: 0.94;
  pointer-events: none;
}

.hero.hero-halftone .hero-eclipse-backdrop,
.hero.hero-halftone .hero-ground-image {
  display: none !important;
}

.hero.hero-halftone .hero-content,
.hero.hero-halftone .hero-scroll {
  position: relative;
  z-index: 3;
}

.hero.hero-halftone .hero-copy::before {
  inset: -72px -112px;
  background: radial-gradient(ellipse at center, rgba(2, 3, 2, 0.76), rgba(2, 3, 2, 0.38) 44%, transparent 75%);
  filter: blur(18px);
}

.hero.hero-halftone .hero-scroll {
  color: rgba(244, 248, 244, 0.62);
}

.hero.hero-halftone .hero-scroll span {
  border-color: rgba(244, 248, 244, 0.48);
}

@media (max-width: 720px) {
  .hero.hero-halftone .hero-copy::before {
    inset: -46px -30px;
    filter: blur(14px);
  }
}

@media (prefers-reduced-motion: reduce) {
  .hero-halftone-canvas {
    opacity: 0.86;
  }
}

.server-page {
  min-height: 0;
  padding: clamp(78px, 8vw, 116px) clamp(22px, 7.2vw, 116px);
  background: #080909;
}

.server-page::before {
  background:
    linear-gradient(90deg, rgba(244, 248, 244, 0.035) 1px, transparent 1px) 0 0 / 96px 100%,
    linear-gradient(rgba(244, 248, 244, 0.028) 1px, transparent 1px) 0 0 / 100% 96px;
  opacity: 0.24;
}

.server-page-heading {
  max-width: 730px;
}

.server-page-heading h2 {
  margin-top: clamp(22px, 3vw, 34px);
  font-size: clamp(2.7rem, 5.25vw, 5.85rem);
  line-height: 0.9;
}

.server-page-heading p {
  max-width: 540px;
  margin-top: 23px;
}

.server-page-stage {
  grid-template-columns: minmax(250px, 0.78fr) minmax(360px, 1.22fr);
  gap: clamp(24px, 4.3vw, 72px);
  max-width: 1410px;
  margin-top: clamp(46px, 6vw, 76px);
}

.server-code-panel,
.server-map-panel {
  min-width: 0;
  overflow: hidden;
  border: 1px solid rgba(244, 248, 244, 0.18);
  background:
    linear-gradient(145deg, rgba(255, 255, 255, 0.05), transparent 46%),
    rgba(13, 14, 14, 0.82);
  box-shadow: none;
}

.server-code-stream {
  min-height: 262px;
  gap: 23px;
  padding: 30px 0;
}

.server-code-line {
  color: rgba(244, 248, 244, 0.68);
  font-size: clamp(0.59rem, 0.88vw, 0.72rem);
}

.server-map-panel {
  position: relative;
  isolation: isolate;
}

.server-map-panel::before {
  position: absolute;
  z-index: -1;
  inset: 0;
  background:
    radial-gradient(circle at 52% 52%, rgba(244, 248, 244, 0.06), transparent 40%),
    url("assets/focus-film-grain.webp") center / 720px auto repeat;
  content: "";
  opacity: 0.5;
  pointer-events: none;
}

.server-map-topbar,
.server-map-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding: 13px 15px;
  color: rgba(244, 248, 244, 0.48);
  font-size: 0.57rem;
  font-weight: 800;
  letter-spacing: 0.12em;
}

.server-map-topbar {
  border-bottom: 1px solid rgba(244, 248, 244, 0.12);
}

.server-map-footer {
  border-top: 1px solid rgba(244, 248, 244, 0.12);
}

.server-map-footer span:last-child {
  display: inline-flex;
  align-items: center;
  gap: 7px;
}

.server-map-footer i {
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: #f4f8f4;
  box-shadow: 0 0 9px rgba(244, 248, 244, 0.72);
}

.server-attack-map {
  position: relative;
  min-height: clamp(292px, 28vw, 362px);
  overflow: hidden;
}

.attack-map-routes {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  overflow: visible;
  fill: none;
}

.attack-map-route {
  fill: none;
  stroke: rgba(244, 248, 244, 0.24);
  stroke-linecap: round;
  stroke-width: 1.25;
  vector-effect: non-scaling-stroke;
}

.attack-map-route.route-main {
  stroke: rgba(244, 248, 244, 0.56);
  stroke-dasharray: 4 9;
  animation: attack-map-route-flow 6.4s linear infinite;
}

.attack-map-route.route-alt {
  stroke-dasharray: 2 9;
  opacity: 0.72;
}

.route-delay-a { animation-delay: -1.6s; }
.route-delay-b { animation-delay: -3.4s; }
.route-delay-c { animation-delay: -4.8s; }

#attackMapArrow path {
  fill: rgba(244, 248, 244, 0.65);
}

.attack-map-code rect {
  fill: rgba(8, 9, 9, 0.94);
  stroke: rgba(244, 248, 244, 0.34);
  stroke-width: 0.8;
}

.attack-map-code text {
  fill: rgba(244, 248, 244, 0.86);
  font-family: "JetBrains Mono", "SFMono-Regular", Consolas, monospace;
  font-size: 8px;
  font-weight: 700;
  letter-spacing: 0.5px;
}

.attack-map-node {
  position: absolute;
  display: grid;
  grid-template-columns: 16px auto;
  grid-template-rows: 10px 12px;
  column-gap: 8px;
  align-items: center;
  color: #f4f7f3;
  pointer-events: none;
  transform: translate(-50%, -50%);
}

.attack-map-node i {
  grid-row: 1 / span 2;
  width: 12px;
  height: 12px;
  border: 1px solid rgba(244, 248, 244, 0.76);
  border-radius: 50%;
  background: #080909;
  box-shadow: 0 0 0 5px rgba(244, 248, 244, 0.045), 0 0 15px rgba(244, 248, 244, 0.25);
  animation: attack-map-node-pulse 4.4s ease-in-out infinite;
}

.attack-map-node small,
.attack-map-node strong {
  grid-column: 2;
  white-space: nowrap;
}

.attack-map-node small {
  align-self: end;
  color: rgba(244, 248, 244, 0.38);
  font-size: 0.48rem;
  font-weight: 800;
  letter-spacing: 0.12em;
}

.attack-map-node strong {
  align-self: start;
  color: rgba(244, 248, 244, 0.8);
  font-size: 0.55rem;
  font-weight: 800;
  letter-spacing: 0.1em;
}

.node-entry { top: 52.5%; left: 12.2%; }
.node-auth { top: 29.7%; left: 31.9%; }
.node-api { top: 52.5%; left: 52.8%; }
.node-core { top: 24%; left: 73.6%; }
.node-data { top: 65.5%; left: 87.7%; }
.node-auth i { animation-delay: -0.8s; }
.node-api i { animation-delay: -1.7s; }
.node-core i { animation-delay: -2.4s; }
.node-data i { animation-delay: -3.1s; }

@keyframes attack-map-route-flow {
  to { stroke-dashoffset: -78; }
}

@keyframes attack-map-node-pulse {
  0%, 100% { box-shadow: 0 0 0 5px rgba(244, 248, 244, 0.035), 0 0 10px rgba(244, 248, 244, 0.14); }
  50% { box-shadow: 0 0 0 8px rgba(244, 248, 244, 0.055), 0 0 20px rgba(244, 248, 244, 0.34); }
}

@media (max-width: 900px) {
  .server-page-stage {
    grid-template-columns: 1fr;
    gap: 24px;
  }

  .server-code-stream {
    min-height: 210px;
  }
}

@media (max-width: 560px) {
  .server-page {
    padding-top: 76px;
    padding-bottom: 82px;
  }

  .server-attack-map {
    min-height: 310px;
  }

  .attack-map-node {
    column-gap: 5px;
  }

  .attack-map-node i {
    width: 10px;
    height: 10px;
  }

  .attack-map-node small {
    font-size: 0.42rem;
  }

  .attack-map-node strong {
    font-size: 0.48rem;
    letter-spacing: 0.06em;
  }

  .node-entry { left: 13%; }
  .node-auth { left: 31%; }
  .node-api { left: 52%; }
  .node-core { left: 72%; }
  .node-data { left: 83%; }
}

@media (prefers-reduced-motion: reduce) {
  .server-code-line,
  .attack-map-route.route-main,
  .attack-map-node i {
    animation: none;
  }

  .attack-map-code animateMotion {
    display: none;
  }
}

.server-page {
  padding-top: clamp(58px, 6vw, 82px);
  padding-bottom: clamp(62px, 6vw, 86px);
}

.server-page-heading,
.server-page-stage {
  width: min(100%, 940px);
  margin-right: auto;
  margin-left: auto;
}

.server-page-heading h2 {
  max-width: 660px;
  font-size: clamp(2.3rem, 4.3vw, 4.8rem);
}

.server-page-heading p {
  max-width: 570px;
  margin-top: 18px;
  font-size: 0.88rem;
}

.server-page-stage {
  display: block;
  margin-top: clamp(34px, 4vw, 48px);
}

.server-code-panel {
  width: 100%;
}

.server-code-stream {
  position: relative;
  min-height: 218px;
  gap: 19px;
  padding: 27px 0;
  mask-image: none;
}

.server-code-line {
  width: auto;
  padding: 0 clamp(18px, 3vw, 30px);
  animation: none !important;
  color: rgba(244, 248, 244, 0.68);
  font-size: clamp(0.62rem, 0.88vw, 0.76rem);
  transform: none !important;
}

.server-code-line:first-child {
  color: rgba(244, 248, 244, 0.94);
}

@media (max-width: 560px) {
  .server-page {
    padding-top: 58px;
    padding-bottom: 64px;
  }

  .server-code-stream {
    min-height: 204px;
    gap: 17px;
    padding: 24px 0;
  }

  .server-panel-topbar,
  .server-panel-footer {
    font-size: 0.5rem;
  }
}

.server-code-stream {
  min-height: 156px;
  gap: 12px;
  padding-top: 20px;
  padding-bottom: 20px;
}

.terminal-review {
  display: grid;
  grid-template-columns: 132px minmax(0, 1fr);
  column-gap: clamp(18px, 3vw, 34px);
  align-items: center;
  margin: 0 clamp(18px, 3vw, 30px) 20px;
  padding: 15px 17px 13px;
  border: 1px solid rgba(244, 248, 244, 0.12);
  background: rgba(244, 248, 244, 0.025);
}

.review-loader {
  position: relative;
  width: 118px;
  height: 48px;
  perspective: 260px;
}

.review-box {
  position: absolute;
  width: 20px;
  height: 20px;
  transform-style: preserve-3d;
  animation: review-box-cycle 4.8s cubic-bezier(0.45, 0.05, 0.55, 0.95) infinite;
}

.review-box-1 { bottom: 4px; left: 2px; animation-delay: -0.2s; }
.review-box-2 { bottom: 18px; left: 29px; animation-delay: -1.15s; }
.review-box-3 { bottom: 6px; left: 57px; animation-delay: -2.1s; }
.review-box-4 { bottom: 20px; left: 85px; animation-delay: -3.05s; }

.review-face {
  position: absolute;
  display: block;
  width: 20px;
  height: 20px;
  border: 1px solid rgba(244, 248, 244, 0.42);
  background: rgba(244, 248, 244, 0.1);
  backface-visibility: hidden;
}

.review-face-front {
  transform: translateZ(10px);
}

.review-face-right {
  background: rgba(244, 248, 244, 0.055);
  transform: rotateY(90deg) translateZ(10px);
}

.review-face-top {
  background: rgba(244, 248, 244, 0.22);
  transform: rotateX(90deg) translateZ(10px);
}

.review-face-back {
  background: rgba(244, 248, 244, 0.025);
  transform: rotateY(180deg) translateZ(10px);
}

.terminal-review-copy span {
  display: block;
  color: rgba(244, 248, 244, 0.43);
  font-size: 0.56rem;
  font-weight: 800;
  letter-spacing: 0.13em;
}

.terminal-review-copy strong {
  display: block;
  max-width: 340px;
  margin-top: 6px;
  color: rgba(244, 248, 244, 0.84);
  font-size: clamp(0.76rem, 1vw, 0.86rem);
  font-weight: 520;
  letter-spacing: -0.022em;
  line-height: 1.35;
}

.terminal-review-steps {
  display: grid;
  grid-column: 1 / -1;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  margin-top: 12px;
  border-top: 1px solid rgba(244, 248, 244, 0.11);
}

.terminal-review-steps span {
  position: relative;
  padding-top: 9px;
  color: rgba(244, 248, 244, 0.42);
  font-size: 0.5rem;
  font-weight: 800;
  letter-spacing: 0.1em;
}

.terminal-review-steps span::before {
  display: inline-block;
  width: 4px;
  height: 4px;
  margin: 0 6px 1px 0;
  border-radius: 50%;
  background: rgba(244, 248, 244, 0.55);
  content: "";
}

.terminal-review-steps span:nth-child(2) { color: rgba(244, 248, 244, 0.56); }
.terminal-review-steps span:nth-child(3) { color: rgba(244, 248, 244, 0.7); }
.terminal-review-steps span:nth-child(4) { color: rgba(244, 248, 244, 0.9); }

@keyframes review-box-cycle {
  0%, 100% {
    opacity: 0.45;
    transform: translate3d(0, 3px, 0) rotateX(-24deg) rotateY(36deg);
  }
  28% {
    opacity: 1;
    transform: translate3d(0, -8px, 10px) rotateX(-24deg) rotateY(36deg);
  }
  48% {
    opacity: 0.9;
    transform: translate3d(0, -3px, 3px) rotateX(-24deg) rotateY(36deg);
  }
  66% {
    opacity: 0.58;
    transform: translate3d(0, 1px, 0) rotateX(-24deg) rotateY(36deg);
  }
}

@media (max-width: 560px) {
  .server-code-stream {
    min-height: 154px;
  }

  .terminal-review {
    grid-template-columns: 1fr;
    gap: 10px;
  }

  .review-loader {
    margin: 0 auto;
  }

  .terminal-review-copy {
    text-align: center;
  }

  .terminal-review-copy strong {
    margin-right: auto;
    margin-left: auto;
  }

  .terminal-review-steps span {
    font-size: 0.44rem;
    letter-spacing: 0.05em;
    text-align: center;
  }

  .terminal-review-steps span::before {
    display: none;
  }
}

@media (prefers-reduced-motion: reduce) {
  .review-box {
    animation: none;
    opacity: 0.82;
    transform: rotateX(-24deg) rotateY(36deg);
  }
}

.threat-news-section {
  position: relative;
  display: grid;
  grid-template-columns: minmax(240px, 0.64fr) minmax(0, 1.36fr);
  gap: clamp(44px, 8vw, 136px);
  align-items: start;
  padding: clamp(88px, 10vw, 142px) clamp(22px, 7.2vw, 116px);
  overflow: hidden;
  border-top: 1px solid rgba(244, 248, 244, 0.11);
  border-bottom: 1px solid rgba(244, 248, 244, 0.11);
  background: #070808;
}

.threat-news-section::before {
  position: absolute;
  inset: 0;
  background:
    linear-gradient(90deg, rgba(244, 248, 244, 0.04) 1px, transparent 1px) 0 0 / 88px 100%,
    url("assets/focus-film-grain.webp") center / 720px auto repeat;
  content: "";
  opacity: 0.09;
  pointer-events: none;
}

.threat-news-heading,
.threat-news-feed {
  position: relative;
  z-index: 1;
}

.threat-news-heading {
  position: sticky;
  top: 108px;
}

.threat-news-heading h2 {
  max-width: 510px;
  margin: clamp(24px, 3.5vw, 40px) 0 0;
  color: #f4f7f3;
  font-size: clamp(2.6rem, 4.8vw, 5.5rem);
  font-weight: 520;
  letter-spacing: -0.075em;
  line-height: 0.89;
}

.threat-news-heading h2 em {
  color: rgba(244, 248, 244, 0.48);
  font-style: normal;
}

.threat-news-heading > p {
  max-width: 390px;
  margin: 24px 0 0;
  color: rgba(244, 248, 244, 0.59);
  font-size: 0.9rem;
  line-height: 1.7;
}

.threat-news-feed {
  min-width: 0;
}

.threat-news-status {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 0 0 14px;
  border-bottom: 1px solid rgba(244, 248, 244, 0.18);
  color: rgba(244, 248, 244, 0.45);
  font-size: 0.56rem;
  font-weight: 800;
  letter-spacing: 0.12em;
}

.threat-news-status span:last-child {
  color: rgba(244, 248, 244, 0.74);
  text-align: right;
}

.threat-news-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1px;
  margin-top: 1px;
  overflow: hidden;
  background: rgba(244, 248, 244, 0.14);
}

.threat-news-card {
  display: flex;
  min-width: 0;
  min-height: 356px;
  flex-direction: column;
  padding: 20px;
  background: #101111;
  color: #f4f7f3;
  text-decoration: none;
  transition: background 220ms ease, transform 220ms ease;
}

.threat-news-card:hover,
.threat-news-card:focus-visible {
  background: #181919;
  outline: 0;
  transform: translateY(-3px);
}

.threat-news-card-media {
  position: relative;
  height: 128px;
  margin: -20px -20px 20px;
  overflow: hidden;
  background: #090a0a;
}

.threat-news-card-media::after {
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(7, 8, 8, 0.04), rgba(16, 17, 17, 0.92));
  content: "";
  pointer-events: none;
}

.threat-news-card-media img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 50% 46%;
  filter: grayscale(0.2) brightness(0.66) contrast(1.06);
  opacity: 0.9;
  transform: scale(1.03);
  transition: transform 700ms cubic-bezier(0.16, 1, 0.3, 1), filter 380ms ease, opacity 380ms ease;
}

.threat-news-card.is-news-variant-1 .threat-news-card-media img {
  object-position: 24% 54%;
}

.threat-news-card.is-news-variant-2 .threat-news-card-media img {
  object-position: 78% 42%;
}

.threat-news-card:hover .threat-news-card-media img,
.threat-news-card:focus-visible .threat-news-card-media img {
  filter: grayscale(0.05) brightness(0.84) contrast(1.08);
  opacity: 1;
  transform: scale(1.09);
}

.threat-news-card-header,
.threat-news-card-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  color: rgba(244, 248, 244, 0.46);
  font-size: 0.53rem;
  font-weight: 800;
  letter-spacing: 0.11em;
}

.threat-news-card h3 {
  display: -webkit-box;
  margin: 20px 0 0;
  overflow: hidden;
  color: #f4f7f3;
  font-size: clamp(1.05rem, 1.45vw, 1.42rem);
  font-weight: 520;
  letter-spacing: -0.045em;
  line-height: 1.07;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 4;
}

.threat-news-card p {
  display: -webkit-box;
  margin: 15px 0 0;
  overflow: hidden;
  color: rgba(244, 248, 244, 0.56);
  font-size: 0.76rem;
  line-height: 1.55;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
}

.threat-news-card-footer {
  margin-top: auto;
  padding-top: 19px;
  border-top: 1px solid rgba(244, 248, 244, 0.1);
}

.threat-news-action {
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  gap: 7px;
  color: #f4f7f3;
  font-size: 0.53rem;
  letter-spacing: 0.12em;
  white-space: nowrap;
}

.threat-news-action::after {
  font-size: 0.8rem;
  line-height: 0;
  content: "↗";
  transition: transform 220ms ease;
}

.threat-news-card:hover .threat-news-action::after,
.threat-news-card:focus-visible .threat-news-action::after {
  transform: translate(2px, -2px);
}

.threat-news-card.has-missing-image .threat-news-card-media {
  display: none;
}

.threat-news-empty {
  grid-column: 1 / -1;
  min-height: 198px;
  padding: 30px;
  background: #101111;
}

.threat-news-empty strong {
  display: block;
  color: #f4f7f3;
  font-size: 1.05rem;
  font-weight: 520;
}

.threat-news-empty p {
  max-width: 430px;
  margin: 9px 0 0;
  color: rgba(244, 248, 244, 0.56);
  font-size: 0.8rem;
  line-height: 1.6;
}

.threat-news-note {
  margin: 14px 0 0;
  color: rgba(244, 248, 244, 0.38);
  font-size: 0.62rem;
  letter-spacing: 0.03em;
  line-height: 1.55;
}

.threat-news-skeleton {
  justify-content: flex-start;
  gap: 16px;
}

.threat-news-skeleton i {
  display: block;
  height: 9px;
  background: linear-gradient(90deg, rgba(244, 248, 244, 0.05), rgba(244, 248, 244, 0.12), rgba(244, 248, 244, 0.05));
  background-size: 200% 100%;
  animation: threat-news-shimmer 1.8s linear infinite;
}

.threat-news-skeleton i:first-child { width: 42%; }
.threat-news-skeleton i:nth-child(2) { width: 88%; height: 42px; }
.threat-news-skeleton i:last-child { width: 67%; }

@keyframes threat-news-shimmer {
  to { background-position: -200% 0; }
}

@media (max-width: 1040px) {
  .threat-news-section {
    grid-template-columns: 1fr;
    gap: 54px;
  }

  .threat-news-heading {
    position: relative;
    top: auto;
  }
}

@media (max-width: 760px) {
  .threat-news-section {
    padding-top: 82px;
    padding-bottom: 94px;
  }

  .threat-news-grid {
    grid-template-columns: 1fr;
  }

  .threat-news-card {
    min-height: 218px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .threat-news-card,
  .threat-news-skeleton i {
    animation: none;
    transition: none;
  }
}

.intake-page {
  display: block;
  padding: clamp(64px, 8vw, 112px) clamp(22px, 7.2vw, 116px);
}

.intake-page::before {
  opacity: 0;
}

.intake-shell {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 0.9fr) minmax(360px, 1.1fr);
  min-height: 384px;
  overflow: hidden;
  border: 1px solid rgba(244, 248, 244, 0.13);
  background: #0b0b0f;
}

.intake-shell::before {
  position: absolute;
  inset: 0;
  background:
    linear-gradient(90deg, rgba(244, 248, 244, 0.045) 1px, transparent 1px) 0 0 / 72px 100%,
    url("assets/focus-film-grain.webp") center / 620px auto repeat;
  content: "";
  opacity: 0.08;
  pointer-events: none;
}

.intake-copy,
.intake-visual {
  position: relative;
  z-index: 1;
}

.intake-copy {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  padding: clamp(38px, 5vw, 68px);
}

.intake-copy h2 {
  max-width: 510px;
  margin: 26px 0 0;
  color: #f4f7f3;
  font-size: clamp(2.35rem, 4vw, 4.8rem);
  font-weight: 520;
  letter-spacing: -0.075em;
  line-height: 0.92;
}

.intake-copy h2 em {
  background: linear-gradient(100deg, #4d8dff 0%, #ca82ff 88%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  font-style: normal;
}

.intake-copy > p {
  max-width: 410px;
  margin: 21px 0 0;
  color: rgba(244, 248, 244, 0.58);
  font-size: 0.88rem;
  line-height: 1.65;
}

.intake-copy-status {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-top: 26px;
  color: rgba(244, 248, 244, 0.62);
  font-size: 0.54rem;
  font-weight: 800;
  letter-spacing: 0.13em;
}

.intake-copy-status i {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #8a75ff;
  box-shadow: 0 0 12px rgba(138, 117, 255, 0.72);
}

.intake-process {
  display: flex;
  flex-wrap: wrap;
  gap: 11px 20px;
  margin-top: 32px;
}

.intake-process span {
  color: rgba(244, 248, 244, 0.39);
  font-size: 0.52rem;
  font-weight: 800;
  letter-spacing: 0.1em;
}

.intake-process b {
  margin-right: 5px;
  color: rgba(244, 248, 244, 0.8);
  font-weight: 800;
}

.intake-visual {
  min-height: 384px;
  border-left: 1px solid rgba(244, 248, 244, 0.1);
  background: radial-gradient(circle at 51% 54%, rgba(99, 106, 255, 0.12), transparent 48%);
}

.intake-visual-topbar,
.intake-visual-footer {
  position: absolute;
  right: clamp(20px, 4vw, 36px);
  left: clamp(20px, 4vw, 36px);
  display: flex;
  align-items: center;
  justify-content: space-between;
  color: rgba(244, 248, 244, 0.43);
  font-size: 0.52rem;
  font-weight: 800;
  letter-spacing: 0.13em;
}

.intake-visual-topbar {
  top: 24px;
  padding-bottom: 13px;
  border-bottom: 1px solid rgba(244, 248, 244, 0.11);
}

.intake-visual-topbar span:last-child::before {
  display: inline-block;
  width: 5px;
  height: 5px;
  margin: 0 7px 1px 0;
  border-radius: 50%;
  background: #5d9cff;
  box-shadow: 0 0 10px rgba(93, 156, 255, 0.7);
  content: "";
}

.intake-visual-footer {
  bottom: 22px;
}

.intake-visual-footer span {
  flex: 1;
}

.intake-visual-footer span:nth-child(2) {
  text-align: center;
}

.intake-visual-footer span:last-child {
  text-align: right;
}

.intake-stack {
  position: absolute;
  top: 50%;
  left: 50%;
  width: min(82%, 420px);
  height: 244px;
  transform: translate(-50%, -44%);
}

.intake-plane {
  position: absolute;
  left: 50%;
  width: min(100%, 388px);
  aspect-ratio: 1.92 / 0.64;
  clip-path: polygon(50% 0, 100% 50%, 50% 100%, 0 50%);
  transform: translateX(-50%);
}

.intake-plane-top {
  top: 1px;
  display: grid;
  place-items: center;
  border: 1px solid rgba(128, 157, 255, 0.78);
  background:
    radial-gradient(circle, rgba(178, 205, 255, 0.72) 1px, transparent 1.7px) center / 17px 17px,
    rgba(11, 12, 19, 0.8);
  color: rgba(227, 236, 255, 0.88);
  font-family: "IBM Plex Mono", "SFMono-Regular", Consolas, monospace;
  font-size: clamp(0.52rem, 0.78vw, 0.64rem);
  letter-spacing: 0.13em;
}

.intake-plane-top span {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 5px 8px;
  background: rgba(11, 12, 19, 0.88);
}

.intake-plane-core {
  top: 71px;
  background: linear-gradient(125deg, #3085f8 4%, #776ff3 49%, #ca7cff 100%);
  box-shadow: 0 16px 32px rgba(87, 92, 255, 0.24);
}

.intake-plane-core::before {
  position: absolute;
  inset: 1px;
  clip-path: inherit;
  background: linear-gradient(125deg, rgba(244, 248, 255, 0.2), transparent 42%);
  content: "";
}

.intake-plane-core i {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 42px;
  height: 42px;
  border: 1px solid rgba(255, 255, 255, 0.64);
  transform: translate(-50%, -50%) rotate(45deg);
}

.intake-plane-base {
  top: 150px;
  border: 1px dashed rgba(185, 195, 255, 0.46);
  background: rgba(12, 13, 20, 0.36);
}

.intake-link {
  position: absolute;
  z-index: -1;
  top: 62px;
  width: 1px;
  height: 115px;
  border-left: 1px dashed rgba(209, 215, 255, 0.5);
}

.intake-link-left { left: 22%; }
.intake-link-right { right: 22%; }

.intake-packet {
  position: absolute;
  z-index: 2;
  width: 7px;
  height: 7px;
  background: #b6d0ff;
  box-shadow: 0 0 11px rgba(182, 208, 255, 0.92);
  animation: intake-packet-travel 3.6s ease-in-out infinite;
}

.intake-packet-one { top: 63px; left: 21.3%; }
.intake-packet-two { top: 63px; right: 21.3%; animation-delay: -1.8s; }

@keyframes intake-packet-travel {
  0%, 100% { opacity: 0.3; transform: translateY(0); }
  50% { opacity: 1; transform: translateY(112px); }
}

body .site-shell > main > .threat-news-section {
  filter: none;
}

.threat-news-card {
  min-height: 258px;
  padding: 16px;
}

.threat-news-card-media {
  height: 96px;
  margin: -16px -16px 15px;
}

.threat-news-card-media img {
  filter: none;
  opacity: 1;
}

.threat-news-card:hover .threat-news-card-media img,
.threat-news-card:focus-visible .threat-news-card-media img {
  filter: none;
}

.threat-news-card-media::after {
  background: linear-gradient(180deg, rgba(11, 11, 15, 0.04), rgba(11, 11, 15, 0.25));
}

.threat-news-card h3 {
  margin-top: 14px;
  -webkit-line-clamp: 3;
}

.threat-news-card p {
  margin-top: 10px;
  -webkit-line-clamp: 2;
}

.threat-news-card-footer {
  padding-top: 13px;
}

@media (max-width: 900px) {
  .intake-shell {
    grid-template-columns: 1fr;
  }

  .intake-visual {
    min-height: 344px;
    border-top: 1px solid rgba(244, 248, 244, 0.1);
    border-left: 0;
  }
}

@media (max-width: 760px) {
  .intake-page {
    padding-top: 64px;
    padding-bottom: 70px;
  }

  .intake-copy {
    padding: 36px 26px 34px;
  }

  .intake-copy h2 {
    font-size: clamp(2.35rem, 12vw, 3.35rem);
  }

  .intake-process {
    gap: 11px 14px;
  }

  .intake-visual {
    min-height: 316px;
  }

  .intake-stack {
    width: min(88%, 380px);
    transform: translate(-50%, -42%) scale(0.88);
  }

  .threat-news-card {
    min-height: 258px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .intake-packet {
    animation: none;
  }
}

.datacenter-visual {
  background:
    radial-gradient(circle at 71% 45%, rgba(83, 128, 255, 0.16), transparent 43%),
    radial-gradient(circle at 47% 64%, rgba(182, 109, 255, 0.1), transparent 45%),
    #0b0b0f;
}

.datacenter-svg {
  position: absolute;
  top: 54px;
  right: clamp(14px, 2vw, 28px);
  bottom: 47px;
  left: clamp(14px, 2vw, 28px);
  width: calc(100% - clamp(28px, 4vw, 56px));
  height: calc(100% - 101px);
  overflow: visible;
}

.data-grid {
  fill: url(#dataGrid);
  stroke: rgba(210, 221, 255, 0.12);
  stroke-width: 0.8;
}

.data-floor {
  fill: url(#dataFloor);
  stroke: rgba(155, 178, 255, 0.2);
  stroke-width: 0.9;
}

.data-floor-line {
  fill: none;
  stroke: rgba(174, 191, 255, 0.13);
  stroke-width: 0.75;
}

.data-route {
  fill: none;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.data-route-muted {
  stroke: rgba(184, 200, 255, 0.24);
  stroke-dasharray: 3 6;
  stroke-width: 1.1;
}

.data-route-active {
  stroke: url(#dataSignal);
  stroke-dasharray: 14 72;
  stroke-width: 2.1;
  filter: url(#dataGlow);
  animation: datacenter-code-flow 3.4s linear infinite;
}

.data-route-two { animation-delay: -1.15s; }
.data-route-three { animation-delay: -2.3s; }
.data-route-response { animation-delay: -1.7s; }

.data-code-labels text,
.data-result-label {
  fill: rgba(222, 231, 255, 0.74);
  font-family: "IBM Plex Mono", "SFMono-Regular", Consolas, monospace;
  font-size: 10px;
  letter-spacing: 0.5px;
}

.data-code-labels text {
  animation: datacenter-code-breathe 4s ease-in-out infinite;
}

.data-code-labels text:nth-child(2) { animation-delay: -1.35s; }
.data-code-labels text:nth-child(3) { animation-delay: -2.7s; }

.data-rack-front {
  fill: url(#dataRackFront);
  stroke: rgba(207, 220, 255, 0.62);
  stroke-width: 1.1;
}

.data-rack-side {
  fill: url(#dataRackSide);
  stroke: rgba(183, 201, 255, 0.38);
  stroke-width: 1;
}

.data-rack-top {
  fill: url(#dataRackTop);
  stroke: rgba(220, 229, 255, 0.48);
  stroke-width: 0.8;
}

.data-rack-panel {
  fill: rgba(216, 229, 255, 0.065);
  stroke: rgba(201, 216, 255, 0.28);
  stroke-width: 0.8;
}

.data-rack-slots {
  fill: none;
  stroke: rgba(190, 208, 255, 0.28);
  stroke-width: 1.1;
}

.data-rack circle {
  fill: #68a4ff;
  filter: url(#dataGlow);
  animation: datacenter-led 2.1s ease-in-out infinite alternate;
}

.data-rack-main circle {
  fill: #f4f7f3;
  animation-delay: -0.8s;
}

.data-rack-right circle {
  animation-delay: -1.45s;
}

.data-scan-window {
  fill: rgba(117, 149, 255, 0.22);
  stroke: rgba(201, 168, 255, 0.78);
  stroke-width: 0.9;
  filter: url(#dataGlow);
  animation: datacenter-scan 2.9s cubic-bezier(0.5, 0, 0.5, 1) infinite;
}

.data-route-output {
  stroke: rgba(195, 175, 255, 0.34);
  stroke-dasharray: 3 6;
  stroke-width: 1.1;
}

.data-output-node {
  fill: #f4f7f3;
  filter: url(#dataGlow);
  animation: datacenter-output 2s ease-in-out infinite alternate;
}

.data-result-label {
  fill: rgba(210, 196, 255, 0.76);
  font-size: 9px;
  letter-spacing: 0.95px;
}

@keyframes datacenter-code-flow {
  to { stroke-dashoffset: -86; }
}

@keyframes datacenter-code-breathe {
  0%, 100% { opacity: 0.38; }
  50% { opacity: 0.92; }
}

@keyframes datacenter-led {
  from { opacity: 0.32; }
  to { opacity: 1; }
}

@keyframes datacenter-scan {
  0%, 100% { opacity: 0.22; transform: translateY(0); }
  48% { opacity: 1; transform: translateY(103px); }
}

@keyframes datacenter-output {
  from { opacity: 0.38; r: 3px; }
  to { opacity: 1; r: 5px; }
}

@media (max-width: 760px) {
  .datacenter-svg {
    top: 50px;
    bottom: 42px;
    height: calc(100% - 92px);
  }

  .data-code-labels text {
    font-size: 9px;
  }

  .data-result-label {
    font-size: 8px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .data-route-active,
  .data-code-labels text,
  .data-rack circle,
  .data-scan-window,
  .data-output-node {
    animation: none;
  }
}

.impact-section {
  position: relative;
  display: grid;
  grid-template-columns: minmax(240px, 0.72fr) minmax(0, 1.28fr);
  gap: clamp(42px, 7vw, 108px);
  align-items: end;
  padding: clamp(78px, 9vw, 126px) clamp(22px, 7.2vw, 116px);
  overflow: hidden;
  border-top: 1px solid rgba(244, 248, 244, 0.12);
  border-bottom: 1px solid rgba(244, 248, 244, 0.12);
  background: #090a0a;
}

.impact-section::before {
  position: absolute;
  inset: 0;
  background:
    linear-gradient(90deg, rgba(244, 248, 244, 0.045) 1px, transparent 1px) 0 0 / 92px 100%,
    url("assets/focus-film-grain.webp") center / 720px auto repeat;
  content: "";
  opacity: 0.08;
  pointer-events: none;
}

.impact-intro,
.impact-metrics {
  position: relative;
  z-index: 1;
}

.impact-intro h2 {
  max-width: 530px;
  margin: 25px 0 0;
  color: #f4f7f3;
  font-size: clamp(2.45rem, 4.65vw, 5.2rem);
  font-weight: 520;
  letter-spacing: -0.078em;
  line-height: 0.9;
}

.impact-intro h2 em {
  color: rgba(244, 248, 244, 0.48);
  font-style: normal;
}

.impact-metrics {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1px;
  border: 1px solid rgba(244, 248, 244, 0.15);
  background: rgba(244, 248, 244, 0.15);
}

.impact-metric {
  position: relative;
  display: flex;
  min-height: 270px;
  flex-direction: column;
  justify-content: flex-end;
  padding: clamp(23px, 3vw, 38px);
  overflow: hidden;
  background: #111212;
}

.impact-metric::before {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 1px;
  background: rgba(244, 248, 244, 0.76);
  content: "";
  transform: scaleX(0.28);
  transform-origin: left;
}

.impact-metric-kicker,
.impact-metric-detail {
  color: rgba(244, 248, 244, 0.45);
  font-size: 0.54rem;
  font-weight: 800;
  letter-spacing: 0.13em;
}

.impact-metric-kicker {
  position: absolute;
  top: 24px;
  left: clamp(23px, 3vw, 38px);
}

.impact-metric strong {
  color: #f4f7f3;
  font-size: clamp(3.4rem, 5.6vw, 6.7rem);
  font-weight: 500;
  letter-spacing: -0.1em;
  line-height: 0.8;
}

.impact-metric p {
  margin: 12px 0 0;
  color: rgba(244, 248, 244, 0.75);
  font-size: clamp(0.95rem, 1.2vw, 1.15rem);
  font-weight: 520;
  letter-spacing: -0.035em;
}

.impact-metric-detail {
  margin-top: 29px;
  padding-top: 13px;
  border-top: 1px solid rgba(244, 248, 244, 0.11);
}

.intake-copy h2 em {
  background: none;
  color: rgba(244, 248, 244, 0.62);
}

.intake-copy-status i {
  background: #d7e0e5;
  box-shadow: 0 0 10px rgba(215, 224, 229, 0.5);
}

.datacenter-visual {
  background: radial-gradient(circle at 63% 50%, rgba(225, 234, 240, 0.1), transparent 49%), #0b0b0f;
}

.intake-visual-topbar span:last-child::before {
  background: #d7e0e5;
  box-shadow: 0 0 8px rgba(215, 224, 229, 0.48);
}

.data-rack circle,
.data-rack-main circle,
.data-output-node {
  fill: #d7e0e5;
}

@media (max-width: 900px) {
  .impact-section {
    grid-template-columns: 1fr;
    gap: 48px;
  }
}

@media (max-width: 620px) {
  .impact-section {
    padding-top: 72px;
    padding-bottom: 76px;
  }

  .impact-metrics {
    grid-template-columns: 1fr;
  }

  .impact-metric {
    min-height: 224px;
  }
}

.impact-section {
  min-height: 590px;
  align-items: stretch;
}

.impact-intro {
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 18px 0;
}

.impact-intro h2 {
  max-width: 470px;
  font-size: clamp(3rem, 5vw, 5.7rem);
}

.impact-metrics {
  min-height: 432px;
}

.impact-metric {
  min-height: 0;
  padding: clamp(28px, 3.4vw, 46px);
}

.impact-metric-kicker {
  top: clamp(28px, 3.4vw, 46px);
  left: clamp(28px, 3.4vw, 46px);
}

.impact-metric strong {
  font-size: clamp(4.7rem, 7.2vw, 8.7rem);
  line-height: 0.76;
}

.impact-metric p {
  margin-top: 17px;
  font-size: clamp(1rem, 1.35vw, 1.3rem);
}

.impact-metric-detail {
  margin-top: 37px;
  padding-top: 16px;
}

@media (max-width: 900px) {
  .impact-section {
    min-height: 0;
  }

  .impact-metrics {
    min-height: 0;
  }

  .impact-metric {
    min-height: 292px;
  }
}

@media (max-width: 620px) {
  .impact-metric {
    min-height: 254px;
  }

  .impact-metric strong {
    font-size: clamp(4.6rem, 20vw, 6.2rem);
  }
}

.impact-cta .contact-logo {
  opacity: 0.08;
}

.impact-cta h2 strong {
  color: #f4f7f3;
  font: inherit;
  font-weight: 520;
}

.impact-compact-values {
  position: relative;
  z-index: 1;
  display: grid;
  grid-column: 2;
  grid-row: 1 / span 3;
  grid-template-columns: repeat(2, auto);
  gap: clamp(14px, 2vw, 28px);
  align-items: center;
}

.impact-compact-values span {
  display: grid;
  gap: 4px;
  padding-left: clamp(14px, 2vw, 25px);
  border-left: 1px solid rgba(244, 248, 244, 0.26);
  color: rgba(244, 248, 244, 0.46);
  font-size: 0.52rem;
  font-weight: 800;
  letter-spacing: 0.11em;
  line-height: 1.2;
}

.impact-compact-values strong {
  color: #f4f7f3;
  font-size: clamp(1.45rem, 2.3vw, 2.25rem);
  font-weight: 520;
  letter-spacing: -0.07em;
}

@media (max-width: 760px) {
  .impact-compact-values {
    grid-column: 1;
    grid-row: auto;
    width: fit-content;
    margin-top: 26px;
  }
}

.impact-cta {
  display: grid;
  place-items: center;
  min-height: 0;
  padding: clamp(30px, 3.5vw, 44px) clamp(22px, 7.2vw, 116px);
  border-color: rgba(255, 255, 255, 0.14);
  background-color: #030303;
  background-image:
    linear-gradient(rgba(3, 3, 3, 0.8), rgba(3, 3, 3, 0.8)),
    url("assets/impact-black-grain-v1.webp");
  background-position: center, center;
  background-repeat: no-repeat, repeat;
  background-size: cover, 680px auto;
  background-blend-mode: normal, screen;
}

.impact-cta .contact-glow {
  display: none;
}

.impact-center-metrics {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  width: min(100%, 820px);
  align-items: center;
}

.impact-center-metric {
  display: grid;
  gap: 11px;
  justify-items: center;
  padding: 0 clamp(26px, 5vw, 74px);
  text-align: center;
}

.impact-center-metric + .impact-center-metric {
  border-left: 1px solid rgba(244, 248, 244, 0.24);
}

.impact-center-metric strong {
  color: #f4f7f3;
  font-size: clamp(3.25rem, 5.3vw, 5.7rem);
  font-weight: 500;
  letter-spacing: -0.095em;
  line-height: 0.78;
}

.impact-center-metric span {
  color: rgba(244, 248, 244, 0.62);
  font-size: clamp(0.76rem, 1vw, 0.93rem);
  font-weight: 520;
  letter-spacing: -0.025em;
}

@media (max-width: 600px) {
  .impact-cta {
    padding-top: 36px;
    padding-bottom: 36px;
  }

  .impact-center-metrics {
    grid-template-columns: 1fr;
    gap: 26px;
  }

  .impact-center-metric {
    padding: 0;
  }

  .impact-center-metric + .impact-center-metric {
    padding-top: 26px;
    border-top: 1px solid rgba(244, 248, 244, 0.18);
    border-left: 0;
  }

  .impact-center-metric strong {
    font-size: clamp(3.4rem, 16vw, 5.5rem);
  }
}

.intake-visual.datacenter-visual {
  min-height: 330px;
  border-left: 0;
  background: transparent;
}

.datacenter-single-server {
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

@media (max-width: 760px) {
  .intake-visual.datacenter-visual {
    min-height: 286px;
  }

  .datacenter-single-server {
    top: 0;
    bottom: 0;
    height: 100%;
  }
}

.data-code-copy {
  fill: rgba(244, 248, 244, 0.54);
  font-family: "IBM Plex Mono", "SFMono-Regular", Consolas, monospace;
  font-size: 9px;
  letter-spacing: 0.42px;
}

.data-code-track,
.data-code-flow {
  fill: none;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.data-code-track {
  stroke: rgba(229, 237, 242, 0.16);
  stroke-dasharray: 2 7;
  stroke-width: 1;
}

.data-code-flow {
  stroke: url(#dataSignal);
  stroke-dasharray: 12 88;
  stroke-width: 1.8;
  filter: url(#dataGlow);
  animation: datacenter-code-into-server 3.2s linear infinite;
}

.data-code-flow-two {
  animation-delay: -1.07s;
}

.data-code-flow-three {
  animation-delay: -2.14s;
}

.data-server-frame {
  fill: rgba(236, 242, 246, 0.025);
  stroke: rgba(223, 233, 240, 0.24);
  stroke-width: 0.65;
}

.data-server-label {
  fill: rgba(236, 242, 246, 0.62);
  font-family: "IBM Plex Mono", "SFMono-Regular", Consolas, monospace;
  font-size: 5.9px;
  font-weight: 700;
  letter-spacing: 0.42px;
}

.datacenter-single-server .data-scan-window {
  fill: rgba(219, 231, 238, 0.12);
  stroke: rgba(237, 243, 246, 0.78);
}

.data-server-process {
  fill: none;
  stroke: rgba(237, 243, 246, 0.48);
  stroke-dasharray: 5 18;
  stroke-linecap: round;
  stroke-width: 1.25;
  animation: datacenter-server-process 2.15s linear infinite;
}

@keyframes datacenter-code-into-server {
  to { stroke-dashoffset: -100; }
}

@keyframes datacenter-server-process {
  to { stroke-dashoffset: -46; }
}

@media (prefers-reduced-motion: reduce) {
  .data-code-flow,
  .data-server-process {
    animation: none;
  }
}

.datacenter-single-server .data-rack-front {
  stroke: rgba(248, 250, 246, 0.7);
}

.datacenter-single-server .data-rack-side {
  stroke: rgba(248, 250, 246, 0.27);
}

.datacenter-single-server .data-rack-top {
  stroke: rgba(248, 250, 246, 0.44);
}

.datacenter-single-server .data-rack-panel {
  fill: rgba(248, 250, 246, 0.035);
  stroke: rgba(248, 250, 246, 0.3);
}

.datacenter-single-server .data-rack-slots {
  stroke: rgba(248, 250, 246, 0.24);
}

.datacenter-single-server .data-rack circle {
  fill: #f4f7f3;
  filter: drop-shadow(0 0 4px rgba(244, 247, 243, 0.66));
}

.datacenter-single-server .data-server-frame {
  fill: rgba(248, 250, 246, 0.018);
  stroke: rgba(248, 250, 246, 0.2);
}

.datacenter-single-server .data-code-copy,
.datacenter-single-server .data-server-label {
  fill: rgba(244, 247, 243, 0.58);
}

.datacenter-single-server .data-code-track {
  stroke: rgba(244, 247, 243, 0.15);
}

.datacenter-single-server .data-scan-window {
  fill: rgba(244, 247, 243, 0.1);
  stroke: rgba(255, 255, 255, 0.82);
}

.datacenter-single-server .data-server-process {
  stroke: rgba(244, 247, 243, 0.45);
}

.datacenter-single-server .data-code-packet text {
  fill: #f4f7f3;
  font-family: "IBM Plex Mono", "SFMono-Regular", Consolas, monospace;
  font-size: 9px;
  font-weight: 600;
  letter-spacing: 0.12px;
  filter: drop-shadow(0 0 5px rgba(244, 247, 243, 0.34));
}

.datacenter-single-server .data-code-packet {
  animation: datacenter-code-packet 4.8s linear infinite;
}

.datacenter-single-server .data-code-packet-two {
  animation-delay: -1.6s;
}

.datacenter-single-server .data-code-packet-three {
  animation-delay: -3.2s;
}

.datacenter-single-server .data-server-core {
  fill: rgba(244, 247, 243, 0.09);
  stroke: rgba(244, 247, 243, 0.42);
  stroke-width: 0.65;
  filter: url(#dataGlow);
  animation: datacenter-core-pulse 2.4s ease-in-out infinite;
}

.datacenter-single-server .data-server-core-copy {
  fill: rgba(244, 247, 243, 0.84);
  font-family: "IBM Plex Mono", "SFMono-Regular", Consolas, monospace;
  font-size: 6.6px;
  font-weight: 700;
  letter-spacing: 0.3px;
}

@keyframes datacenter-code-packet {
  0%, 7%, 94%, 100% { opacity: 0; }
  15%, 84% { opacity: 1; }
}

@keyframes datacenter-core-pulse {
  0%, 100% { opacity: 0.38; }
  50% { opacity: 1; }
}

@media (prefers-reduced-motion: reduce) {
  .datacenter-single-server .data-code-packet,
  .datacenter-single-server .data-server-core {
    animation: none;
  }
}

.datacenter-single-server .data-code-transfer text {
  fill: #f4f7f3;
  font-family: "IBM Plex Mono", "SFMono-Regular", Consolas, monospace;
  font-size: 9.4px;
  font-weight: 600;
  letter-spacing: 0.04px;
  filter: drop-shadow(0 0 5px rgba(244, 247, 243, 0.28));
}

.datacenter-single-server .data-server-port {
  fill: #050505;
  stroke: rgba(244, 247, 243, 0.6);
  stroke-width: 0.7;
}

.datacenter-single-server .data-server-reflection {
  fill: rgba(244, 247, 243, 0.055);
  pointer-events: none;
}

.datacenter-single-server .data-server-core {
  animation: datacenter-core-ingest 5.4s ease-in-out infinite;
}

@keyframes datacenter-core-ingest {
  0%, 69%, 100% { opacity: 0.3; }
  77% { opacity: 0.38; }
  84% { opacity: 1; }
  92% { opacity: 0.52; }
}

@media (prefers-reduced-motion: reduce) {
  .datacenter-single-server .data-server-core {
    animation: none;
  }
}

.verification-section {
  display: grid;
  grid-template-columns: minmax(0, 0.9fr) minmax(320px, 1.1fr);
  gap: clamp(46px, 9vw, 156px);
  align-items: end;
  padding: clamp(72px, 10vw, 150px) clamp(22px, 7.2vw, 116px);
  border-top: 1px solid rgba(244, 247, 243, 0.14);
  border-bottom: 1px solid rgba(244, 247, 243, 0.11);
  background: #050505;
}

.verification-heading .section-marker {
  margin-bottom: 28px;
}

.verification-heading h2 {
  max-width: 620px;
  margin: 0;
  color: #f4f7f3;
  font-size: clamp(3.2rem, 6.3vw, 7rem);
  font-weight: 500;
  letter-spacing: -0.085em;
  line-height: 0.84;
}

.verification-heading h2 em {
  color: rgba(244, 247, 243, 0.5);
  font-style: normal;
}

.verification-heading p {
  max-width: 420px;
  margin: 26px 0 0;
  color: rgba(244, 247, 243, 0.62);
  font-size: clamp(0.95rem, 1.2vw, 1.13rem);
  line-height: 1.55;
}

.verification-scope {
  display: grid;
  border-top: 1px solid rgba(244, 247, 243, 0.2);
}

.verification-scope-item {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 22px;
  padding: clamp(18px, 2.4vw, 31px) 0;
  border-bottom: 1px solid rgba(244, 247, 243, 0.16);
}

.verification-scope-item strong {
  color: #f4f7f3;
  font-size: clamp(2.1rem, 4.5vw, 4.7rem);
  font-weight: 520;
  letter-spacing: -0.085em;
  line-height: 0.8;
}

.verification-scope-item span {
  color: rgba(244, 247, 243, 0.46);
  font-size: 0.68rem;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-align: right;
  text-transform: uppercase;
}

.primary-nav {
  margin-right: 0;
}

@media (max-width: 820px) {
  .verification-section {
    grid-template-columns: 1fr;
    gap: 52px;
  }
}

@media (max-width: 520px) {
  .verification-section {
    padding-top: 76px;
    padding-bottom: 76px;
  }

  .verification-scope-item {
    gap: 14px;
  }
}

.offensive-services-section {
  padding: clamp(38px, 5vw, 82px) clamp(18px, 3.1vw, 48px) clamp(70px, 8vw, 122px);
  background: #000;
}

body .site-shell > main > .offensive-services-section {
  filter: none;
}

.offensive-services-heading {
  display: grid;
  gap: 13px;
  justify-items: center;
  margin: 0 auto clamp(34px, 4.4vw, 64px);
  text-align: center;
}

.offensive-services-heading > span {
  color: rgba(255, 248, 236, 0.54);
  font-size: 0.63rem;
  font-weight: 800;
  letter-spacing: 0.14em;
}

.offensive-services-heading h2 {
  margin: 0;
  color: #fffdf9;
  font-size: clamp(2.6rem, 5.2vw, 5.5rem);
  font-weight: 500;
  letter-spacing: -0.085em;
  line-height: 0.86;
}

.offensive-services-heading h2 em {
  color: rgba(255, 247, 234, 0.55);
  font-style: normal;
}

.offensive-services-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: clamp(11px, 1.25vw, 20px);
  width: min(100%, 1180px);
  margin: 0 auto;
}

.offensive-service-card {
  position: relative;
  isolation: isolate;
  display: flex;
  height: clamp(410px, 37vw, 470px);
  min-height: 0;
  aspect-ratio: auto;
  overflow: hidden;
  border: 1px solid rgba(244, 247, 243, 0.15);
  border-radius: 7px;
  background-color: #090908;
  background-image: url("assets/pentest-services-amber-v1.webp");
  background-repeat: no-repeat;
  background-size: cover;
  box-shadow: 0 16px 42px rgba(0, 0, 0, 0.25);
  transition: transform 420ms cubic-bezier(0.16, 1, 0.3, 1), border-color 420ms ease, box-shadow 420ms ease;
}

.offensive-service-card::before {
  position: absolute;
  z-index: -1;
  inset: 0;
  background: linear-gradient(180deg, rgba(0, 0, 0, 0.24) 0%, rgba(0, 0, 0, 0.04) 40%, rgba(0, 0, 0, 0.68) 100%);
  content: "";
}

.offensive-service-card::after {
  position: absolute;
  z-index: -1;
  inset: 0;
  background-image: radial-gradient(circle at 50% 56%, rgba(255, 211, 135, 0.24), transparent 54%), linear-gradient(rgba(255, 237, 203, 0.034) 1px, transparent 1px), linear-gradient(90deg, rgba(255, 237, 203, 0.025) 1px, transparent 1px);
  background-size: auto, 18px 18px, 18px 18px;
  mix-blend-mode: screen;
  opacity: 0.45;
  transform: scale(1.04);
  transition: opacity 420ms ease, transform 620ms cubic-bezier(0.16, 1, 0.3, 1);
  content: "";
}

@media (hover: hover) and (pointer: fine) {
  .offensive-service-card:hover {
    z-index: 1;
    border-color: rgba(255, 245, 224, 0.52);
    box-shadow: 0 28px 54px rgba(0, 0, 0, 0.48), 0 0 34px rgba(218, 133, 45, 0.14);
    transform: translateY(-7px);
  }

  .offensive-service-card:hover::after {
    opacity: 0.88;
    transform: scale(1.13);
  }
}

.offensive-service-network {
  background-position: 4% 58%;
}

.offensive-service-ddos {
  align-items: center;
  justify-content: center;
  background-position: 49% 50%;
}

.offensive-service-ddos::before {
  background: linear-gradient(180deg, rgba(0, 0, 0, 0.35) 0%, rgba(0, 0, 0, 0.08) 45%, rgba(0, 0, 0, 0.46) 100%);
}

.offensive-service-redteam {
  background-position: 98% 49%;
}

.offensive-service-redteam::before {
  background: linear-gradient(180deg, rgba(0, 0, 0, 0.25) 0%, rgba(0, 0, 0, 0.12) 42%, rgba(0, 0, 0, 0.82) 100%);
}

.offensive-service-index,
.offensive-service-brand,
.offensive-service-caption {
  position: absolute;
  color: rgba(255, 251, 243, 0.92);
}

.offensive-service-index {
  top: clamp(20px, 2.2vw, 30px);
  left: clamp(20px, 2.2vw, 30px);
  font-size: clamp(0.51rem, 0.68vw, 0.63rem);
  font-weight: 800;
  letter-spacing: 0.12em;
}

.offensive-service-copy {
  position: absolute;
  top: clamp(58px, 7vw, 84px);
  right: clamp(22px, 2.7vw, 36px);
  left: clamp(22px, 2.7vw, 36px);
}

.offensive-service-redteam .offensive-service-copy {
  top: auto;
  bottom: clamp(70px, 8vw, 102px);
}

.offensive-service-copy h3 {
  margin: 0;
  color: #fffdf9;
  font-size: clamp(2.4rem, 4.25vw, 4.6rem);
  font-weight: 500;
  letter-spacing: -0.09em;
  line-height: 0.92;
}

.offensive-service-copy p {
  max-width: 290px;
  margin: 24px 0 0;
  color: rgba(255, 251, 243, 0.84);
  font-size: clamp(0.73rem, 0.95vw, 0.9rem);
  letter-spacing: -0.025em;
  line-height: 1.37;
}

.offensive-service-mark {
  color: #fffdf9;
  font-size: clamp(3.4rem, 6vw, 6.5rem);
  font-weight: 500;
  letter-spacing: -0.12em;
  line-height: 0.8;
  text-shadow: 0 8px 32px rgba(0, 0, 0, 0.32);
}

.offensive-service-caption {
  right: clamp(22px, 2.7vw, 36px);
  bottom: clamp(28px, 3vw, 42px);
  left: clamp(22px, 2.7vw, 36px);
  font-size: clamp(0.72rem, 0.92vw, 0.88rem);
  font-style: italic;
  line-height: 1.25;
}

.offensive-service-brand {
  bottom: clamp(24px, 2.9vw, 39px);
  left: clamp(22px, 2.7vw, 36px);
  font-size: clamp(0.67rem, 0.86vw, 0.82rem);
  font-weight: 800;
  letter-spacing: 0.08em;
}

@media (max-width: 760px) {
  .offensive-services-grid {
    grid-template-columns: 1fr;
    width: min(100%, 460px);
  }

  .offensive-service-card {
    height: 460px;
  }
}

.validation-map-section {
  position: relative;
  display: grid;
  grid-template-columns: minmax(260px, 0.8fr) minmax(420px, 1.2fr);
  min-height: clamp(430px, 40vw, 500px);
  overflow: hidden;
  padding: clamp(58px, 6vw, 82px) clamp(22px, 7.2vw, 116px);
  background: #000;
}

.validation-map-copy {
  position: relative;
  z-index: 2;
  align-self: center;
  max-width: 460px;
}

.validation-map-copy .section-marker {
  margin-bottom: 30px;
}

.validation-map-copy h2 {
  margin: 0;
  color: #f4f7f3;
  font-size: clamp(2.9rem, 4.9vw, 5.25rem);
  font-weight: 500;
  letter-spacing: -0.09em;
  line-height: 0.86;
}

.validation-map-copy h2 em {
  color: rgba(244, 247, 243, 0.58);
  font-style: normal;
}

.validation-map-copy p {
  max-width: 410px;
  margin: 27px 0 0;
  color: rgba(244, 247, 243, 0.65);
  font-size: clamp(0.9rem, 1.2vw, 1.12rem);
  letter-spacing: -0.025em;
  line-height: 1.52;
}

.validation-eyebrow {
  display: block;
  margin: 0 0 18px;
  color: rgba(244, 247, 243, 0.47);
  font-size: 0.62rem;
  font-weight: 760;
  letter-spacing: 0.15em;
  line-height: 1.2;
}

.validation-map-visual {
  position: absolute;
  top: 0;
  right: min(-4vw, -30px);
  bottom: 0;
  width: min(61vw, 790px);
}

.validation-map-visual svg {
  display: block;
  width: 100%;
  height: 100%;
  overflow: visible;
}

.validation-arcs use {
  fill: none;
  stroke: rgba(244, 247, 243, 0.75);
  stroke-linecap: round;
  stroke-width: 1.15;
}

.validation-arcs use:nth-child(2n) {
  stroke: rgba(244, 247, 243, 0.48);
}

.validation-label line {
  stroke: rgba(244, 247, 243, 0.55);
  stroke-width: 1;
}

.validation-label circle,
.validation-moving-node {
  fill: #f4f7f3;
}

.validation-label circle {
  filter: drop-shadow(0 0 5px rgba(244, 247, 243, 0.72));
}

.validation-label text {
  fill: rgba(244, 247, 243, 0.76);
  font-family: "IBM Plex Mono", "SFMono-Regular", Consolas, monospace;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.48px;
}

.validation-moving-node {
  filter: drop-shadow(0 0 5px rgba(244, 247, 243, 0.76));
}

.validation-globe-fill {
  fill: url(#validationGlobeShade);
}

.validation-globe-grid ellipse {
  fill: none;
  stroke: rgba(244, 247, 243, 0.42);
  stroke-width: 1.05;
}

.validation-globe-outline {
  fill: none;
  stroke: rgba(244, 247, 243, 0.78);
  stroke-width: 1.25;
}

.validation-globe-pin line {
  stroke: rgba(244, 247, 243, 0.58);
  stroke-width: 1;
}

.validation-globe-pin text {
  fill: rgba(244, 247, 243, 0.8);
  font-family: "IBM Plex Mono", "SFMono-Regular", Consolas, monospace;
  font-size: 9.4px;
  font-weight: 700;
  letter-spacing: 0.42px;
}

.validation-globe-dot {
  fill: #f4f7f3;
  filter: drop-shadow(0 0 5px rgba(244, 247, 243, 0.8));
}

.validation-globe-pulse {
  fill: rgba(244, 247, 243, 0.13);
  transform-box: fill-box;
  transform-origin: center;
  animation: validation-globe-pulse 3.8s ease-out infinite;
}

.validation-globe-pin-api .validation-globe-pulse {
  animation-delay: -1.25s;
}

.validation-globe-pin-config .validation-globe-pulse {
  animation-delay: -2.5s;
}

@keyframes validation-globe-pulse {
  0%, 100% { opacity: 0.2; transform: scale(0.7); }
  48% { opacity: 0.78; transform: scale(1); }
}

@media (max-width: 900px) {
  .validation-map-section {
    grid-template-columns: 1fr;
    min-height: 530px;
  }

  .validation-map-copy {
    align-self: start;
  }

  .validation-map-visual {
    top: auto;
    right: -13vw;
    bottom: -7vw;
    width: min(108vw, 800px);
    height: 340px;
  }
}

@media (max-width: 560px) {
  .validation-map-section {
    min-height: 500px;
    padding-top: 60px;
    padding-bottom: 46px;
  }

  .validation-map-visual {
    right: -57vw;
    bottom: -5vw;
    width: 148vw;
    height: 280px;
  }

  .validation-label text {
    font-size: 8px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .validation-moving-node {
    display: none;
  }

  .validation-globe-pulse {
    animation: none;
  }
}

.validation-server-visual {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 22px 0 14px;
  background:
    radial-gradient(ellipse at 58% 52%, rgba(94, 236, 149, 0.1), transparent 38%),
    linear-gradient(180deg, transparent 0%, rgba(255, 255, 255, 0.025) 100%);
}

.validation-server-meta,
.validation-server-figure figcaption {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  color: rgba(244, 247, 243, 0.5);
  font-family: "IBM Plex Mono", "SFMono-Regular", Consolas, monospace;
  font-size: 0.53rem;
  font-weight: 700;
  letter-spacing: 0.13em;
  text-transform: uppercase;
}

.validation-server-meta {
  width: min(100%, 760px);
  margin: 0 auto;
  padding: 11px 0;
  border-top: 1px solid rgba(244, 247, 243, 0.16);
  border-bottom: 1px solid rgba(244, 247, 243, 0.12);
}

.validation-server-meta span:last-child {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  color: rgba(151, 245, 171, 0.72);
}

.validation-server-meta i {
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: #8df09b;
  box-shadow: 0 0 10px rgba(126, 246, 151, 0.9);
}

.validation-server-figure {
  position: relative;
  width: min(100%, 820px);
  margin: 12px auto 10px;
}

.validation-server-stage {
  position: relative;
  display: flex;
  align-items: center;
  width: min(100%, 820px);
  min-height: 208px;
  margin: 10px auto 0;
}

.validation-code-column {
  position: relative;
  z-index: 3;
  display: flex;
  flex: 0 0 34%;
  flex-direction: column;
  justify-content: center;
  gap: 9px;
  align-self: stretch;
  padding: 20px 0;
}

.validation-code-column::after {
  position: absolute;
  z-index: 1;
  top: 50%;
  right: -32%;
  width: 42%;
  height: 1px;
  background: linear-gradient(90deg, rgba(141, 240, 155, 0.7), rgba(141, 240, 155, 0));
  box-shadow: 0 0 10px rgba(126, 246, 151, 0.55);
  content: "";
  animation: validation-code-bridge 2.8s ease-in-out infinite;
}

.validation-code-title,
.validation-code-line {
  display: block;
  width: max-content;
  max-width: 100%;
  color: rgba(244, 247, 243, 0.55);
  font-family: "IBM Plex Mono", "SFMono-Regular", Consolas, monospace;
  font-size: 0.52rem;
  font-weight: 700;
  letter-spacing: 0.05em;
  white-space: nowrap;
}

.validation-code-title {
  margin-bottom: 3px;
  color: rgba(244, 247, 243, 0.34);
  font-size: 0.45rem;
  letter-spacing: 0.13em;
}

.validation-code-line {
  position: relative;
  padding-left: 12px;
  animation: validation-code-to-server 4.8s cubic-bezier(0.22, 0.8, 0.32, 1) infinite;
}

.validation-code-line::before {
  position: absolute;
  top: 50%;
  left: 0;
  width: 5px;
  height: 1px;
  background: rgba(141, 240, 155, 0.75);
  box-shadow: 0 0 8px rgba(126, 246, 151, 0.8);
  content: "";
}

.validation-code-line b {
  color: rgba(141, 240, 155, 0.9);
  font-weight: 700;
}

.validation-code-line-two { animation-delay: -1.2s; }
.validation-code-line-three { animation-delay: -2.4s; }
.validation-code-line-four { animation-delay: -3.6s; }

.validation-server-stage .validation-server-figure {
  z-index: 2;
  flex: 1 1 auto;
  width: auto;
  min-width: 0;
  margin: 0 0 0 -8%;
}

@keyframes validation-code-to-server {
  0%, 10% { opacity: 0.15; transform: translateX(0); }
  24%, 58% { opacity: 1; transform: translateX(14px); }
  92%, 100% { opacity: 0; transform: translateX(126px); }
}

@keyframes validation-code-bridge {
  0%, 100% { opacity: 0.3; }
  50% { opacity: 1; }
}

.validation-server-figure img {
  display: block;
  width: 100%;
  height: auto;
  filter: drop-shadow(0 22px 24px rgba(0, 0, 0, 0.58));
}

.validation-server-figure figcaption {
  position: absolute;
  right: 22%;
  bottom: 3%;
  left: 4%;
  color: rgba(244, 247, 243, 0.63);
}

.validation-server-meta-bottom {
  margin-top: auto;
  border-top: 0;
  border-bottom: 0;
}

.validation-purpose-line {
  display: flex;
  align-items: baseline;
  gap: 11px;
  width: min(100%, 820px);
  margin: 0 auto;
  padding: 0 0 7px;
  border-bottom: 1px solid rgba(244, 247, 243, 0.12);
}

.validation-purpose-line strong {
  color: #f4f7f3;
  font-size: clamp(1.35rem, 2vw, 2.2rem);
  font-weight: 500;
  letter-spacing: -0.075em;
  line-height: 0.9;
}

.validation-purpose-line span {
  color: rgba(244, 247, 243, 0.46);
  font-family: "IBM Plex Mono", "SFMono-Regular", Consolas, monospace;
  font-size: 0.5rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

@media (max-width: 900px) {
  .validation-server-visual {
    padding: 18px 0 10px;
  }

  .validation-server-meta,
  .validation-server-figure,
  .validation-server-stage,
  .validation-purpose-line {
    width: min(100%, 760px);
  }
}

@media (max-width: 560px) {
  .validation-map-section {
    min-height: 0;
  }

  .validation-map-section .validation-map-visual {
    position: relative;
    top: auto;
    right: auto;
    bottom: auto;
    width: calc(100% + 20px);
    height: 276px;
    margin: 30px -10px 0;
  }

  .validation-server-visual {
    position: relative;
    padding: 10px 0 4px;
  }

  .validation-server-stage {
    display: block;
    width: 100%;
    min-height: 0;
    margin-top: 8px;
  }

  .validation-code-column {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 7px 10px;
    min-height: 55px;
    padding: 7px 0 2px;
  }

  .validation-code-column::after {
    top: auto;
    right: auto;
    bottom: -13px;
    left: 50%;
    width: 1px;
    height: 18px;
    background: linear-gradient(180deg, rgba(141, 240, 155, 0.75), rgba(141, 240, 155, 0));
  }

  .validation-code-title {
    grid-column: 1 / -1;
    margin-bottom: -1px;
  }

  .validation-code-line {
    font-size: 0.48rem;
    animation: none;
    opacity: 0.84;
    transform: none;
  }

  .validation-code-line:nth-of-type(3),
  .validation-code-line:nth-of-type(5) {
    text-align: right;
  }

  .validation-server-stage .validation-server-figure {
    width: 100%;
    margin: 4px auto 6px;
  }

  .validation-server-meta {
    width: 100%;
  }

  .validation-server-figure {
    width: 100%;
  }

  .validation-server-meta {
    font-size: 0.45rem;
  }

  .validation-server-figure {
    margin-top: 8px;
    margin-bottom: 6px;
  }

  .validation-server-figure figcaption {
    font-size: 0.42rem;
  }

  .validation-purpose-line {
    width: 100%;
    gap: 8px;
    padding-bottom: 6px;
  }

  .validation-purpose-line strong {
    font-size: 1.25rem;
  }

  .validation-purpose-line span {
    font-size: 0.38rem;
  }
}

@media (prefers-reduced-motion: reduce) {
  .validation-code-line {
    animation: none;
  }
}

.validation-map-section {
  grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.2fr);
}

.validation-map-section .validation-server-visual {
  position: relative;
  inset: auto;
  display: block;
  width: 100%;
  height: 100%;
  padding: 0;
  background: transparent;
  border: 0;
  box-shadow: none;
}

.validation-map-section .validation-map-visual {
  position: absolute;
  top: 0;
  right: 16%;
  bottom: 0;
  grid-column: auto;
  align-self: auto;
  width: min(28%, 460px);
  min-width: 0;
  height: 100%;
}

.validation-visual-meta {
  position: absolute;
  z-index: 4;
  top: clamp(16px, 2.5vw, 30px);
  right: clamp(14px, 2.2vw, 28px);
  left: clamp(14px, 2.2vw, 28px);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  color: rgba(238, 243, 239, 0.46);
  font-family: "IBM Plex Mono", "SFMono-Regular", Consolas, monospace;
  font-size: 0.54rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  line-height: 1;
  pointer-events: none;
  text-transform: uppercase;
  white-space: nowrap;
}

.validation-visual-kicker,
.validation-visual-status {
  display: inline-flex;
  align-items: center;
  gap: 9px;
}

.validation-visual-kicker::before {
  width: 28px;
  height: 1px;
  background: var(--acid);
  content: "";
}

.validation-visual-kicker b {
  color: rgba(238, 243, 239, 0.52);
  font-weight: 700;
}

.validation-visual-kicker span {
  color: var(--acid);
}

.validation-visual-status {
  color: rgba(238, 243, 239, 0.42);
}

.validation-visual-status i {
  display: inline-block;
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: var(--acid);
  box-shadow: 0 0 0 3px rgba(188, 246, 109, 0.08);
  animation: validation-status-pulse 1.8s ease-in-out infinite;
}

@keyframes validation-status-pulse {
  0%, 100% { opacity: 0.45; transform: scale(0.8); }
  50% { opacity: 1; transform: scale(1); }
}

.validation-stack-stage {
  position: relative;
  display: grid;
  width: 100%;
  min-height: clamp(430px, 42vw, 560px);
  margin: 0;
  place-items: center;
  isolation: isolate;
  outline: none;
  cursor: crosshair;
}

.validation-stack-svg {
  display: block;
  width: min(100%, 760px);
  height: auto;
  overflow: visible;
}

.validation-stack-art {
  transform: perspective(1100px) rotateX(var(--stack-tilt-x, 0deg)) rotateY(var(--stack-tilt-y, 0deg));
  transform-origin: 50% 50%;
  transition: transform 420ms cubic-bezier(0.16, 1, 0.3, 1);
}

.stack-slice,
.stack-top-face {
  fill: url(#validationStackLayerGradient);
  stroke: rgba(231, 235, 232, 0.72);
  stroke-linejoin: round;
  stroke-width: 1.15;
  vector-effect: non-scaling-stroke;
}

.stack-top-face {
  fill: url(#validationStackTopGradient);
  filter: url(#validationStackShadow);
  stroke: rgba(238, 241, 239, 0.84);
}

.stack-top-seam,
.stack-inner-lines {
  fill: none;
  stroke-linecap: round;
  stroke-linejoin: round;
  vector-effect: non-scaling-stroke;
}

.stack-top-seam {
  stroke: rgba(231, 235, 232, 0.38);
  stroke-width: 0.95;
}

.stack-top-surface {
  fill: rgba(255, 255, 255, 0.018);
  stroke: rgba(237, 242, 238, 0.13);
  stroke-width: 0.75;
  vector-effect: non-scaling-stroke;
}

.stack-top-edge-highlight {
  fill: none;
  stroke: rgba(247, 250, 247, 0.48);
  stroke-linecap: round;
  stroke-width: 0.72;
  vector-effect: non-scaling-stroke;
}

.stack-inner-lines {
  stroke: rgba(224, 229, 226, 0.22);
  stroke-width: 0.85;
}

.stack-support-dash {
  fill: none;
  stroke: rgba(221, 226, 223, 0.35);
  stroke-dasharray: 2 8;
  stroke-linecap: round;
  stroke-width: 1;
  vector-effect: non-scaling-stroke;
}

.validation-stack-layer,
.validation-stack-top {
  transform-box: fill-box;
  transform-origin: center;
  transition: transform 520ms cubic-bezier(0.16, 1, 0.3, 1), opacity 420ms ease;
}

.validation-stack-layer-four { transform: translateY(0); }
.validation-stack-layer-three { transform: translateY(0); }
.validation-stack-layer-two { transform: translateY(0); }
.validation-stack-layer-one { transform: translateY(0); }
.validation-stack-top { transform: translateY(0); }

.validation-stack-stage.is-hovering .validation-stack-layer-three,
.validation-stack-stage:focus-visible .validation-stack-layer-three {
  transform: translateY(2px);
}

.validation-stack-stage.is-hovering .validation-stack-layer-two,
.validation-stack-stage:focus-visible .validation-stack-layer-two {
  transform: translateY(5px);
}

.validation-stack-stage.is-hovering .validation-stack-layer-one,
.validation-stack-stage:focus-visible .validation-stack-layer-one {
  transform: translateY(8px);
}

.validation-stack-stage.is-hovering .validation-stack-top,
.validation-stack-stage:focus-visible .validation-stack-top {
  transform: translateY(-7px);
}

.validation-stack-stage.is-hovering .stack-top-edge-highlight,
.validation-stack-stage:focus-visible .stack-top-edge-highlight {
  stroke: rgba(247, 250, 247, 0.76);
}

.validation-stack-stage.is-hovering .stack-support-dash,
.validation-stack-stage:focus-visible .stack-support-dash {
  stroke: rgba(238, 243, 240, 0.7);
}

.stack-code-lanes {
  pointer-events: none;
}

.stack-code-lane {
  fill: rgba(226, 241, 219, 0.8);
  font-family: "IBM Plex Mono", "SFMono-Regular", Consolas, monospace;
  font-size: 7.2px;
  font-weight: 600;
  letter-spacing: 0.04em;
}

.stack-code-flow {
  animation: code-lane-flow 2.65s linear infinite;
  will-change: transform;
}

.stack-code-lane-two .stack-code-flow {
  animation-delay: -0.86s;
}

.stack-code-lane-two {
  fill: rgba(226, 241, 219, 0.68);
}

.stack-code-lane-three .stack-code-flow {
  animation-delay: -1.72s;
}

.stack-code-lane-three {
  fill: rgba(226, 241, 219, 0.56);
}

@keyframes code-lane-flow {
  from { transform: translate(0, 0); }
  to { transform: translate(156px, 42px); }
}

@media (max-width: 900px) {
  .validation-map-section {
    grid-template-columns: 1fr;
    min-height: 0;
  }

  .validation-map-section .validation-map-visual {
    position: relative;
    top: auto;
    right: auto;
    bottom: auto;
    grid-column: 1;
    width: 100%;
    height: clamp(360px, 58vw, 520px);
    margin-top: 18px;
  }

  .validation-stack-stage {
    min-height: 0;
    height: 100%;
  }
}

@media (min-width: 901px) and (max-width: 1200px) {
  .validation-map-section .validation-map-visual {
    right: 16%;
    width: min(28%, 460px);
  }
}

@media (max-width: 560px) {
  .validation-map-section .validation-map-visual {
    height: 330px;
    margin-top: 22px;
  }

  .validation-stack-svg {
    width: 112%;
    max-width: none;
    transform: translateX(-2%);
  }

  .validation-visual-meta {
    top: 14px;
    right: 18px;
    left: 18px;
    gap: 10px;
    font-size: 0.42rem;
  }

  .validation-visual-status {
    display: none;
  }
}

@media (prefers-reduced-motion: reduce) {
  .validation-stack-art,
  .validation-stack-layer,
  .validation-stack-top {
    transition: none;
  }

  .stack-code-flow,
  .validation-visual-status i {
    animation: none;
  }
}

.validation-map-section {
  grid-template-columns: minmax(0, 0.84fr) minmax(460px, 1.16fr);
  min-height: clamp(480px, 43vw, 560px);
  align-items: center;
}

.validation-map-section .validation-map-visual.validation-monitor-shell {
  position: relative;
  top: auto;
  right: auto;
  bottom: auto;
  grid-column: 2;
  align-self: center;
  justify-self: end;
  width: min(100%, 620px);
  height: auto;
  min-width: 0;
}

.validation-monitor-shell .validation-visual-meta {
  position: relative;
  z-index: 1;
  top: auto;
  right: auto;
  left: auto;
  margin: 0 2px 13px;
}

.validation-monitor-frame {
  position: relative;
  padding-right: 25px;
  perspective: 1200px;
}

.validation-monitor {
  position: relative;
  z-index: 1;
  overflow: hidden;
  border: 1px solid rgba(225, 245, 216, 0.2);
  background:
    linear-gradient(135deg, rgba(188, 246, 109, 0.045), transparent 30%),
    linear-gradient(180deg, rgba(14, 22, 15, 0.96), rgba(5, 8, 6, 0.98));
  box-shadow: 18px 22px 52px rgba(0, 0, 0, 0.33), inset 0 1px rgba(239, 250, 235, 0.04);
  transform: rotateY(-14deg) rotateX(1deg);
  transform-origin: right center;
  transform-style: preserve-3d;
}

.validation-monitor-side {
  position: absolute;
  z-index: 0;
  top: 10px;
  right: 0;
  bottom: 10px;
  width: 25px;
  border: 1px solid rgba(225, 245, 216, 0.15);
  background: linear-gradient(90deg, #0b100d, #030504);
  clip-path: polygon(0 2%, 100% 9%, 100% 91%, 0 98%);
  box-shadow: 9px 10px 22px rgba(0, 0, 0, 0.28);
}

.validation-monitor::before,
.validation-monitor::after {
  position: absolute;
  z-index: 2;
  width: 21px;
  height: 21px;
  border-color: rgba(188, 246, 109, 0.72);
  content: "";
  pointer-events: none;
}

.validation-monitor::before {
  top: -1px;
  left: -1px;
  border-top: 1px solid;
  border-left: 1px solid;
}

.validation-monitor::after {
  right: -1px;
  bottom: -1px;
  border-right: 1px solid;
  border-bottom: 1px solid;
}

.validation-monitor-bar,
.validation-monitor-footer,
.validation-panel-heading,
.validation-chart-meta,
.validation-chart-scale,
.validation-code-lines p {
  font-family: "IBM Plex Mono", "SFMono-Regular", Consolas, monospace;
}

.validation-monitor-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 47px;
  padding: 0 19px;
  border-bottom: 1px solid rgba(225, 245, 216, 0.13);
  color: rgba(238, 243, 239, 0.5);
  font-size: 0.59rem;
  font-weight: 700;
  letter-spacing: 0.08em;
}

.validation-monitor-file,
.validation-monitor-state,
.validation-safe-state {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  text-transform: uppercase;
}

.validation-monitor-file i {
  width: 7px;
  height: 7px;
  border: 1px solid rgba(238, 243, 239, 0.5);
}

.validation-monitor-state,
.validation-safe-state {
  color: var(--acid);
}

.validation-monitor-state i,
.validation-safe-state i {
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: var(--acid);
  box-shadow: 0 0 0 3px rgba(188, 246, 109, 0.08);
  animation: validation-monitor-pulse 2.2s ease-in-out infinite;
}

.validation-monitor-main {
  display: grid;
  grid-template-columns: minmax(0, 0.95fr) minmax(0, 1.12fr);
  min-height: 270px;
}

.validation-code-panel,
.validation-performance-panel {
  padding: 22px 20px 18px;
}

.validation-code-panel {
  border-right: 1px solid rgba(225, 245, 216, 0.12);
}

.validation-panel-heading {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  color: rgba(238, 243, 239, 0.48);
  font-size: 0.56rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  line-height: 1;
}

.validation-panel-heading > span:last-child {
  color: var(--acid);
  font-size: 0.5rem;
}

.validation-panel-heading strong {
  color: var(--paper);
  font-family: "Inter Variable", "Inter", sans-serif;
  font-size: 1.24rem;
  font-weight: 570;
  letter-spacing: -0.06em;
}

.validation-code-lines {
  display: grid;
  gap: 13px;
  margin-top: 31px;
}

.validation-code-lines p {
  display: grid;
  grid-template-columns: 18px minmax(0, 1fr) auto;
  gap: 8px;
  align-items: center;
  margin: 0;
  color: rgba(238, 243, 239, 0.63);
  font-size: clamp(0.52rem, 0.74vw, 0.61rem);
  letter-spacing: -0.03em;
  white-space: nowrap;
}

.validation-code-lines b {
  color: rgba(238, 243, 239, 0.28);
  font-size: 0.48rem;
  font-weight: 600;
}

.validation-code-lines code {
  overflow: hidden;
  color: inherit;
  font: inherit;
  text-overflow: ellipsis;
}

.validation-code-lines p > span {
  color: rgba(188, 246, 109, 0.64);
  font-size: 0.47rem;
  font-weight: 800;
  letter-spacing: 0.08em;
}

.validation-code-lines .validation-code-current {
  position: relative;
  color: var(--paper);
}

.validation-code-lines .validation-code-current::before {
  position: absolute;
  top: -7px;
  bottom: -7px;
  left: -9px;
  width: 1px;
  background: var(--acid);
  content: "";
}

.validation-code-current > span {
  color: var(--acid) !important;
}

.validation-chart-meta {
  display: flex;
  justify-content: space-between;
  margin-top: 12px;
  color: rgba(238, 243, 239, 0.31);
  font-size: 0.46rem;
  font-weight: 700;
  letter-spacing: 0.09em;
}

.validation-line-chart {
  display: block;
  width: 100%;
  height: auto;
  margin-top: 13px;
  overflow: visible;
}

.validation-chart-grid {
  fill: none;
  stroke: rgba(225, 245, 216, 0.1);
  stroke-width: 1;
  vector-effect: non-scaling-stroke;
}

.validation-chart-area {
  fill: url(#validationChartArea);
}

.validation-chart-line {
  fill: none;
  stroke: var(--acid);
  stroke-linecap: square;
  stroke-linejoin: round;
  stroke-width: 1.5;
  vector-effect: non-scaling-stroke;
  stroke-dasharray: 760;
  stroke-dashoffset: 760;
  animation: validation-chart-trace 1.35s 240ms cubic-bezier(0.16, 1, 0.3, 1) both;
}

.validation-chart-marker {
  fill: none;
  stroke: rgba(188, 246, 109, 0.45);
  stroke-dasharray: 2 4;
  stroke-width: 1;
  vector-effect: non-scaling-stroke;
}

.validation-chart-scale {
  display: flex;
  justify-content: space-between;
  margin-top: 3px;
  color: rgba(238, 243, 239, 0.28);
  font-size: 0.45rem;
  font-weight: 700;
  letter-spacing: 0.07em;
}

.validation-chart-scale span:last-child {
  color: rgba(188, 246, 109, 0.74);
}

.validation-monitor-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  min-height: 50px;
  padding: 0 19px;
  border-top: 1px solid rgba(225, 245, 216, 0.13);
  color: rgba(238, 243, 239, 0.43);
  font-size: 0.51rem;
  font-weight: 700;
  letter-spacing: 0.08em;
}

.validation-monitor-footer b {
  color: var(--paper);
  font-weight: 700;
}

@keyframes validation-chart-trace {
  to { stroke-dashoffset: 0; }
}

@keyframes validation-monitor-pulse {
  0%, 100% { opacity: 0.55; transform: scale(0.82); }
  50% { opacity: 1; transform: scale(1); }
}

@media (max-width: 1200px) and (min-width: 901px) {
  .validation-map-section {
    grid-template-columns: minmax(230px, 0.72fr) minmax(380px, 1.28fr);
  }

  .validation-map-section .validation-map-visual.validation-monitor-shell {
    width: min(100%, 555px);
  }
}

@media (max-width: 900px) {
  .validation-map-section {
    grid-template-columns: 1fr;
    min-height: 0;
  }

  .validation-map-section .validation-map-visual.validation-monitor-shell {
    grid-column: 1;
    width: 100%;
    margin-top: 30px;
  }

  .validation-monitor-frame {
    padding-right: 0;
  }

  .validation-monitor {
    transform: none;
  }

  .validation-monitor-side {
    display: none;
  }
}

@media (max-width: 560px) {
  .validation-monitor-shell .validation-visual-meta {
    margin-bottom: 11px;
  }

  .validation-monitor-bar,
  .validation-monitor-footer {
    padding-right: 14px;
    padding-left: 14px;
  }

  .validation-monitor-main {
    grid-template-columns: 1fr;
  }

  .validation-code-panel,
  .validation-performance-panel {
    padding: 20px 16px;
  }

  .validation-code-panel {
    border-right: 0;
    border-bottom: 1px solid rgba(225, 245, 216, 0.12);
  }

  .validation-code-lines {
    gap: 11px;
    margin-top: 24px;
  }

  .validation-monitor-footer {
    flex-wrap: wrap;
    justify-content: flex-start;
    column-gap: 17px;
    row-gap: 8px;
    padding-top: 12px;
    padding-bottom: 12px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .validation-monitor-state i,
  .validation-safe-state i,
  .validation-chart-line {
    animation: none;
  }

  .validation-chart-line {
    stroke-dashoffset: 0;
  }
}

.vulnerability-dashboard-section {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  padding: clamp(82px, 9vw, 136px) clamp(22px, 7.2vw, 116px) clamp(92px, 10vw, 150px);
  border-top: 1px solid rgba(225, 245, 216, 0.1);
  background:
    radial-gradient(ellipse at 76% 112%, rgba(112, 184, 85, 0.13), transparent 38%),
    linear-gradient(180deg, #000 0%, #020302 58%, #071108 100%);
}

.vulnerability-dashboard-section::before {
  position: absolute;
  z-index: -1;
  inset: 0;
  background:
    linear-gradient(90deg, rgba(225, 245, 216, 0.025) 1px, transparent 1px) 0 0 / 116px 100%,
    linear-gradient(rgba(225, 245, 216, 0.018) 1px, transparent 1px) 0 0 / 100% 116px;
  content: "";
  opacity: 0.55;
}

.vulnerability-dashboard-section::after {
  position: absolute;
  right: -10%;
  bottom: -42%;
  left: -10%;
  height: 70%;
  border-top: 1px solid rgba(188, 246, 109, 0.16);
  background: linear-gradient(180deg, rgba(188, 246, 109, 0.035), transparent 70%);
  content: "";
  pointer-events: none;
}

.vulnerability-dashboard-heading,
.vulnerability-dashboard-shell {
  width: min(100%, 1220px);
  margin-right: auto;
  margin-left: auto;
}

.vulnerability-dashboard-heading {
  display: grid;
  grid-template-columns: minmax(180px, 0.55fr) minmax(0, 1.45fr);
  gap: clamp(30px, 6vw, 110px);
  align-items: end;
}

.vulnerability-dashboard-heading .section-marker {
  align-self: start;
  margin-top: 8px;
}

.vulnerability-dashboard-heading h2 {
  max-width: 860px;
  margin: 0;
  color: #edf2ee;
  font-size: clamp(2.35rem, 4.55vw, 5.15rem);
  font-weight: 510;
  letter-spacing: -0.085em;
  line-height: 0.9;
}

.vulnerability-dashboard-heading h2 em {
  color: #a8d9b7;
  font-style: normal;
}

.vulnerability-dashboard-heading p {
  max-width: 590px;
  margin: 26px 0 0;
  color: rgba(224, 234, 227, 0.64);
  font-size: 1rem;
  letter-spacing: -0.025em;
  line-height: 1.55;
}

.vulnerability-dashboard-shell {
  position: relative;
  margin-top: clamp(46px, 6vw, 78px);
  border: 1px solid rgba(225, 245, 216, 0.17);
  background:
    linear-gradient(135deg, rgba(188, 246, 109, 0.04), transparent 35%),
    rgba(5, 8, 6, 0.84);
  box-shadow: 0 30px 70px rgba(0, 0, 0, 0.28), inset 0 1px rgba(238, 247, 232, 0.035);
}

.vulnerability-dashboard-topbar,
.vulnerability-dashboard-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  min-height: 50px;
  padding: 0 clamp(16px, 2vw, 26px);
  color: rgba(224, 234, 227, 0.47);
  font-family: "IBM Plex Mono", "SFMono-Regular", Consolas, monospace;
  font-size: 0.66rem;
  font-weight: 700;
  letter-spacing: 0.09em;
  text-transform: uppercase;
}

.vulnerability-dashboard-topbar {
  border-bottom: 1px solid rgba(225, 245, 216, 0.12);
}

.vulnerability-dashboard-route,
.vulnerability-dashboard-live,
.vulnerability-footer-track {
  display: inline-flex;
  align-items: center;
  gap: 9px;
}

.vulnerability-dashboard-route i {
  width: 7px;
  height: 7px;
  border: 1px solid rgba(224, 234, 227, 0.58);
}

.vulnerability-dashboard-live,
.vulnerability-footer-track {
  color: var(--acid);
}

.vulnerability-dashboard-live i,
.vulnerability-footer-track b {
  display: inline-block;
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: var(--acid);
  box-shadow: 0 0 0 4px rgba(188, 246, 109, 0.08), 0 0 12px rgba(188, 246, 109, 0.36);
  animation: vulnerability-status-pulse 2.1s ease-in-out infinite;
}

.vulnerability-dashboard-grid {
  display: grid;
  grid-template-columns: minmax(190px, 0.64fr) minmax(360px, 1.46fr) minmax(250px, 0.9fr);
}

.vulnerability-risk-panel,
.vulnerability-chart-panel,
.vulnerability-findings-panel {
  min-width: 0;
  padding: clamp(24px, 2.8vw, 36px) clamp(18px, 2.5vw, 32px);
}

.vulnerability-risk-panel,
.vulnerability-chart-panel {
  border-right: 1px solid rgba(225, 245, 216, 0.11);
}

.vulnerability-panel-label,
.vulnerability-panel-heading {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 16px;
  color: rgba(224, 234, 227, 0.45);
  font-family: "IBM Plex Mono", "SFMono-Regular", Consolas, monospace;
  font-size: 0.65rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  line-height: 1.2;
  text-transform: uppercase;
}

.vulnerability-panel-label span:last-child,
.vulnerability-panel-heading > b {
  color: rgba(168, 217, 183, 0.62);
  font-size: 0.59rem;
  font-weight: 700;
}

.vulnerability-risk-score {
  display: block;
  margin-top: 28px;
  color: #edf2ee;
  font-family: "Inter Variable", "Inter", sans-serif;
  font-size: clamp(3rem, 5vw, 5.3rem);
  font-weight: 520;
  letter-spacing: -0.1em;
  line-height: 0.82;
}

.vulnerability-risk-state {
  display: block;
  margin-top: 14px;
  color: var(--acid);
  font-family: "IBM Plex Mono", "SFMono-Regular", Consolas, monospace;
  font-size: 0.65rem;
  font-weight: 700;
  letter-spacing: 0.1em;
}

.vulnerability-risk-meter {
  position: relative;
  height: 2px;
  margin-top: 28px;
  overflow: hidden;
  background: rgba(225, 245, 216, 0.13);
}

.vulnerability-risk-meter span {
  display: block;
  width: 28%;
  height: 100%;
  background: var(--acid);
  box-shadow: 0 0 14px rgba(188, 246, 109, 0.42);
  animation: vulnerability-meter-drift 3.6s ease-in-out infinite;
}

.vulnerability-metric-list {
  display: grid;
  gap: 0;
  margin-top: clamp(38px, 5vw, 66px);
}

.vulnerability-metric-list div {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 14px;
  padding: 12px 0;
  border-top: 1px solid rgba(225, 245, 216, 0.11);
  color: rgba(224, 234, 227, 0.51);
  font-size: 0.74rem;
}

.vulnerability-metric-list strong {
  color: #edf2ee;
  font-size: 1.05rem;
  font-weight: 520;
  letter-spacing: -0.05em;
}

.vulnerability-panel-heading > div {
  display: grid;
  gap: 8px;
}

.vulnerability-panel-heading > div > span {
  color: rgba(224, 234, 227, 0.45);
  font-size: 0.65rem;
  font-weight: 700;
  letter-spacing: 0.1em;
}

.vulnerability-panel-heading strong {
  color: #edf2ee;
  font-family: "Inter Variable", "Inter", sans-serif;
  font-size: 1.05rem;
  font-weight: 520;
  letter-spacing: -0.04em;
}

.vulnerability-chart-wrap {
  position: relative;
  margin-top: 27px;
  overflow: hidden;
}

.vulnerability-chart-scan {
  position: absolute;
  z-index: 2;
  top: 2px;
  bottom: 24px;
  left: -6%;
  width: 1px;
  background: linear-gradient(180deg, transparent, rgba(188, 246, 109, 0.74) 50%, transparent);
  box-shadow: 0 0 18px rgba(188, 246, 109, 0.45);
  animation: vulnerability-chart-scan 5.8s cubic-bezier(0.45, 0.05, 0.55, 0.95) infinite;
  pointer-events: none;
}

.vulnerability-chart {
  display: block;
  width: 100%;
  height: auto;
  overflow: visible;
}

.vulnerability-chart-grid {
  fill: none;
  stroke: rgba(225, 245, 216, 0.1);
  stroke-width: 1;
  vector-effect: non-scaling-stroke;
}

.vulnerability-chart-area {
  fill: url(#vulnerabilityChartFill);
}

.vulnerability-chart-line {
  fill: none;
  stroke: var(--acid);
  stroke-linecap: square;
  stroke-linejoin: round;
  stroke-width: 1.7;
  stroke-dasharray: 1200;
  stroke-dashoffset: 1200;
  vector-effect: non-scaling-stroke;
  animation: vulnerability-chart-trace 1.8s 180ms cubic-bezier(0.16, 0.9, 0.24, 1) both;
}

.vulnerability-chart-point {
  fill: var(--acid);
  filter: drop-shadow(0 0 6px rgba(188, 246, 109, 0.7));
  transform-box: fill-box;
  transform-origin: center;
  animation: vulnerability-point-pulse 2.2s ease-in-out infinite;
}

.vulnerability-chart-axis {
  display: flex;
  justify-content: space-between;
  padding-top: 4px;
  color: rgba(224, 234, 227, 0.28);
  font-family: "IBM Plex Mono", "SFMono-Regular", Consolas, monospace;
  font-size: 0.59rem;
  font-weight: 700;
  letter-spacing: 0.08em;
}

.vulnerability-chart-axis span:last-child {
  color: rgba(188, 246, 109, 0.72);
}

.vulnerability-findings-list {
  display: grid;
  gap: 0;
  margin: 24px 0 0;
  padding: 0;
  list-style: none;
}

.vulnerability-finding {
  display: grid;
  grid-template-columns: 8px minmax(0, 1fr) auto;
  gap: 10px;
  align-items: center;
  min-height: 57px;
  border-top: 1px solid rgba(225, 245, 216, 0.11);
  opacity: 0;
  transform: translateY(8px);
}

.vulnerability-dashboard-section.is-visible .vulnerability-finding {
  animation: vulnerability-finding-in 520ms cubic-bezier(0.16, 1, 0.3, 1) forwards;
}

.vulnerability-dashboard-section.is-visible .vulnerability-finding:nth-child(2) { animation-delay: 90ms; }
.vulnerability-dashboard-section.is-visible .vulnerability-finding:nth-child(3) { animation-delay: 180ms; }
.vulnerability-dashboard-section.is-visible .vulnerability-finding:nth-child(4) { animation-delay: 270ms; }
.vulnerability-dashboard-section.is-visible .vulnerability-finding-fixed {
  animation-name: vulnerability-finding-fixed-in;
}

.vulnerability-finding-dot {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: rgba(224, 234, 227, 0.58);
}

.vulnerability-finding-critical .vulnerability-finding-dot,
.vulnerability-finding-high .vulnerability-finding-dot {
  background: #e9b46d;
  box-shadow: 0 0 9px rgba(233, 180, 109, 0.44);
}

.vulnerability-finding-medium .vulnerability-finding-dot {
  background: var(--acid-soft);
}

.vulnerability-finding-fixed {
  opacity: 0.54;
}

.vulnerability-finding-fixed .vulnerability-finding-dot {
  background: var(--acid);
}

.vulnerability-finding div {
  display: grid;
  gap: 4px;
  min-width: 0;
}

.vulnerability-finding strong {
  overflow: hidden;
  color: rgba(238, 243, 239, 0.86);
  font-size: 0.78rem;
  font-weight: 570;
  letter-spacing: -0.02em;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.vulnerability-finding small {
  color: rgba(224, 234, 227, 0.38);
  font-family: "IBM Plex Mono", "SFMono-Regular", Consolas, monospace;
  font-size: 0.61rem;
  font-weight: 700;
  letter-spacing: 0.06em;
}

.vulnerability-finding-status {
  color: rgba(168, 217, 183, 0.66);
  font-family: "IBM Plex Mono", "SFMono-Regular", Consolas, monospace;
  font-size: 0.58rem;
  font-weight: 700;
  letter-spacing: 0.08em;
}

.vulnerability-finding-critical .vulnerability-finding-status,
.vulnerability-finding-high .vulnerability-finding-status {
  color: #e9b46d;
}

.vulnerability-finding-fixed .vulnerability-finding-status {
  color: var(--acid);
}

.vulnerability-dashboard-footer {
  min-height: 44px;
  border-top: 1px solid rgba(225, 245, 216, 0.12);
  color: rgba(224, 234, 227, 0.38);
  font-size: 0.61rem;
}

.vulnerability-dashboard-footer i {
  display: inline-block;
  width: 5px;
  height: 5px;
  margin-right: 6px;
  border-radius: 50%;
  background: rgba(188, 246, 109, 0.8);
}

@keyframes vulnerability-status-pulse {
  0%, 100% { opacity: 0.48; transform: scale(0.82); }
  50% { opacity: 1; transform: scale(1); }
}

@keyframes vulnerability-meter-drift {
  0%, 100% { width: 24%; opacity: 0.72; }
  50% { width: 31%; opacity: 1; }
}

@keyframes vulnerability-chart-scan {
  0%, 12% { left: -6%; opacity: 0; }
  22%, 74% { opacity: 1; }
  86%, 100% { left: 106%; opacity: 0; }
}

@keyframes vulnerability-chart-trace {
  to { stroke-dashoffset: 0; }
}

@keyframes vulnerability-point-pulse {
  0%, 100% { opacity: 0.66; transform: scale(0.78); }
  50% { opacity: 1; transform: scale(1.18); }
}

@keyframes vulnerability-finding-in {
  to { opacity: 1; transform: translateY(0); }
}

@keyframes vulnerability-finding-fixed-in {
  to { opacity: 0.54; transform: translateY(0); }
}

@media (max-width: 1000px) {
  .vulnerability-dashboard-grid {
    grid-template-columns: minmax(190px, 0.64fr) minmax(0, 1.36fr);
  }

  .vulnerability-risk-panel {
    border-bottom: 1px solid rgba(225, 245, 216, 0.11);
  }

  .vulnerability-chart-panel {
    border-right: 0;
    border-bottom: 1px solid rgba(225, 245, 216, 0.11);
  }

  .vulnerability-findings-panel {
    grid-column: 1 / -1;
  }

  .vulnerability-findings-list {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    column-gap: 26px;
  }
}

@media (max-width: 680px) {
  .vulnerability-dashboard-section {
    padding-top: 72px;
    padding-bottom: 90px;
  }

  .vulnerability-dashboard-heading {
    grid-template-columns: 1fr;
    gap: 26px;
  }

  .vulnerability-dashboard-heading .section-marker {
    margin-top: 0;
  }

  .vulnerability-dashboard-heading h2 {
    font-size: clamp(2.2rem, 10vw, 3.5rem);
  }

  .vulnerability-dashboard-grid {
    grid-template-columns: 1fr;
  }

  .vulnerability-risk-panel,
  .vulnerability-chart-panel {
    border-right: 0;
    border-bottom: 1px solid rgba(225, 245, 216, 0.11);
  }

  .vulnerability-metric-list {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    column-gap: 14px;
    margin-top: 31px;
  }

  .vulnerability-metric-list div {
    display: grid;
    gap: 7px;
  }

  .vulnerability-findings-panel {
    grid-column: auto;
  }

  .vulnerability-findings-list {
    grid-template-columns: 1fr;
  }

  .vulnerability-dashboard-topbar,
  .vulnerability-dashboard-footer {
    min-height: 48px;
    padding-right: 15px;
    padding-left: 15px;
    font-size: 0.57rem;
  }

  .vulnerability-dashboard-topbar,
  .vulnerability-dashboard-footer {
    flex-wrap: wrap;
    align-content: center;
    row-gap: 5px;
  }

  .vulnerability-dashboard-live {
    margin-left: auto;
  }

  .vulnerability-dashboard-footer {
    padding-top: 10px;
    padding-bottom: 10px;
  }

  .vulnerability-dashboard-footer > span:nth-child(2) {
    display: none;
  }
}

@media (prefers-reduced-motion: reduce) {
  .vulnerability-dashboard-live i,
  .vulnerability-footer-track b,
  .vulnerability-risk-meter span,
  .vulnerability-chart-scan,
  .vulnerability-chart-line,
  .vulnerability-chart-point {
    animation: none;
  }

  .vulnerability-chart-line {
    stroke-dashoffset: 0;
  }

  .vulnerability-finding {
    opacity: 1;
    transform: none;
  }
}

.analyzer-section {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  padding: clamp(86px, 9vw, 138px) clamp(22px, 7.2vw, 116px) clamp(96px, 10vw, 150px);
  border-top: 1px solid rgba(225, 245, 216, 0.1);
  background:
    radial-gradient(ellipse at 53% 112%, rgba(66, 116, 78, 0.18), transparent 45%),
    linear-gradient(180deg, #000 0%, #020403 67%, #071009 100%);
}

.analyzer-section::before {
  position: absolute;
  z-index: -1;
  inset: 0;
  background:
    linear-gradient(90deg, rgba(225, 245, 216, 0.026) 1px, transparent 1px) 0 0 / 128px 100%,
    linear-gradient(rgba(225, 245, 216, 0.018) 1px, transparent 1px) 0 0 / 100% 128px;
  content: "";
  opacity: 0.48;
}

.analyzer-section::after {
  position: absolute;
  right: -15%;
  bottom: -45%;
  left: -15%;
  height: 70%;
  border-top: 1px solid rgba(188, 246, 109, 0.14);
  background: linear-gradient(180deg, rgba(188, 246, 109, 0.04), transparent 68%);
  content: "";
  pointer-events: none;
}

.analyzer-heading,
.analyzer-workbench {
  width: min(100%, 1280px);
  margin-right: auto;
  margin-left: auto;
}

.analyzer-heading {
  display: grid;
  grid-template-columns: minmax(190px, 0.52fr) minmax(0, 1.48fr);
  gap: clamp(30px, 6vw, 104px);
  align-items: end;
}

.analyzer-heading .section-marker {
  align-self: start;
  margin-top: 8px;
}

.analyzer-heading h2 {
  max-width: 820px;
  margin: 0;
  color: #eef4ef;
  font-size: clamp(2.4rem, 4.6vw, 5.2rem);
  font-weight: 510;
  letter-spacing: -0.09em;
  line-height: 0.9;
}

.analyzer-heading h2 em {
  color: #a8d9b7;
  font-style: normal;
}

.analyzer-heading p {
  max-width: 620px;
  margin: 26px 0 0;
  color: rgba(224, 234, 227, 0.64);
  font-size: 1rem;
  line-height: 1.55;
}

.analyzer-workbench {
  position: relative;
  margin-top: clamp(46px, 6vw, 78px);
  overflow: hidden;
  border: 1px solid rgba(225, 245, 216, 0.2);
  background: #080c0a;
  box-shadow: 0 28px 72px rgba(0, 0, 0, 0.38), inset 0 1px rgba(242, 249, 239, 0.05);
  color: rgba(237, 244, 238, 0.82);
  font-family: "IBM Plex Mono", "SFMono-Regular", Consolas, monospace;
}

.analyzer-toolbar,
.analyzer-filter-row,
.analyzer-statusbar {
  display: flex;
  align-items: center;
  min-height: 50px;
  padding: 0 clamp(14px, 2vw, 24px);
}

.analyzer-toolbar {
  justify-content: space-between;
  gap: 20px;
  border-bottom: 1px solid rgba(225, 245, 216, 0.12);
  background: #0d130f;
  color: rgba(225, 238, 226, 0.62);
  font-size: 0.66rem;
  font-weight: 700;
  letter-spacing: 0.1em;
}

.analyzer-brandmark,
.analyzer-session,
.analyzer-session em {
  display: inline-flex;
  align-items: center;
  gap: 9px;
}

.analyzer-brandmark i {
  width: 8px;
  height: 8px;
  border: 1px solid rgba(188, 246, 109, 0.88);
  background: rgba(188, 246, 109, 0.13);
  box-shadow: 0 0 13px rgba(188, 246, 109, 0.32);
}

.analyzer-session {
  gap: 17px;
  color: rgba(225, 238, 226, 0.37);
}

.analyzer-session b {
  color: rgba(225, 238, 226, 0.7);
  font-weight: 700;
}

.analyzer-session em {
  color: #bcf66d;
  font-style: normal;
}

.analyzer-session em i,
.analyzer-statusbar > strong i {
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: #bcf66d;
  box-shadow: 0 0 0 3px rgba(188, 246, 109, 0.08), 0 0 12px rgba(188, 246, 109, 0.38);
  animation: analyzer-live-pulse 1.8s ease-in-out infinite;
}

.analyzer-filter-row {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto auto;
  gap: 12px;
  min-height: 58px;
  border-bottom: 1px solid rgba(225, 245, 216, 0.12);
  background: #080d0a;
}

.analyzer-filter-label,
.analyzer-filter-hint {
  color: rgba(225, 238, 226, 0.42);
  font-size: 0.61rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  white-space: nowrap;
}

.analyzer-filter-input {
  display: flex;
  align-items: center;
  min-width: 0;
  height: 34px;
  padding: 0 10px;
  border: 1px solid rgba(188, 246, 109, 0.36);
  background: #0d1911;
  box-shadow: inset 0 0 0 1px rgba(188, 246, 109, 0.035), 0 0 18px rgba(188, 246, 109, 0.035);
}

.analyzer-filter-input code {
  overflow: hidden;
  color: rgba(220, 249, 196, 0.84);
  font: inherit;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.analyzer-filter-valid {
  margin-right: 9px;
  color: #bcf66d;
  font-size: 0.8rem;
  font-weight: 700;
}

.analyzer-filter-cursor {
  flex: 0 0 1px;
  height: 15px;
  margin-left: 5px;
  background: #bcf66d;
  animation: analyzer-cursor-blink 1s steps(1, end) infinite;
}

.analyzer-filter-hint {
  color: rgba(188, 246, 109, 0.72);
}

.analyzer-filter-button {
  min-height: 34px;
  padding: 0 13px;
  border: 1px solid rgba(225, 245, 216, 0.24);
  background: transparent;
  color: rgba(237, 244, 238, 0.74);
  cursor: default;
  font: inherit;
  font-size: 0.6rem;
  font-weight: 700;
  letter-spacing: 0.1em;
}

.analyzer-filter-button:hover {
  border-color: rgba(188, 246, 109, 0.68);
  color: #bcf66d;
}

.analyzer-packet-pane {
  position: relative;
  border-bottom: 1px solid rgba(225, 245, 216, 0.12);
}

.analyzer-pane-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  min-height: 41px;
  padding: 0 clamp(14px, 2vw, 24px);
  border-bottom: 1px solid rgba(225, 245, 216, 0.09);
  color: rgba(225, 238, 226, 0.43);
  font-size: 0.61rem;
  font-weight: 700;
  letter-spacing: 0.1em;
}

.analyzer-pane-header > span:last-child {
  color: rgba(225, 238, 226, 0.3);
  font-size: 0.57rem;
}

.analyzer-pane-header b {
  color: rgba(188, 246, 109, 0.75);
  font-weight: 700;
}

.analyzer-table-wrap {
  position: relative;
  overflow: hidden;
  min-height: 302px;
  background: #070a08;
}

.analyzer-packet-table {
  width: 100%;
  border-collapse: collapse;
  table-layout: fixed;
  color: rgba(225, 238, 226, 0.68);
  font-size: 0.68rem;
  text-align: left;
  white-space: nowrap;
}

.analyzer-packet-table th,
.analyzer-packet-table td {
  overflow: hidden;
  padding: 0 11px;
  text-overflow: ellipsis;
}

.analyzer-packet-table th {
  height: 34px;
  border-bottom: 1px solid rgba(225, 245, 216, 0.1);
  color: rgba(225, 238, 226, 0.37);
  font-size: 0.57rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.analyzer-packet-table td {
  height: 33px;
  border-top: 1px solid rgba(225, 245, 216, 0.045);
}

.analyzer-packet-table th:nth-child(1),
.analyzer-packet-table td:nth-child(1) { width: 55px; color: rgba(225, 238, 226, 0.34); }
.analyzer-packet-table th:nth-child(2),
.analyzer-packet-table td:nth-child(2) { width: 118px; }
.analyzer-packet-table th:nth-child(3),
.analyzer-packet-table td:nth-child(3),
.analyzer-packet-table th:nth-child(4),
.analyzer-packet-table td:nth-child(4) { width: 112px; }
.analyzer-packet-table th:nth-child(5),
.analyzer-packet-table td:nth-child(5) { width: 90px; }
.analyzer-packet-table th:nth-child(6),
.analyzer-packet-table td:nth-child(6) { width: 70px; }

.analyzer-packet-row {
  position: relative;
  background: rgba(225, 245, 216, 0.012);
  transition: background 180ms ease, color 180ms ease;
}

.analyzer-packet-row:nth-child(2n) {
  background: rgba(225, 245, 216, 0.026);
}

.analyzer-packet-row-tls {
  background: rgba(91, 149, 117, 0.065);
}

.analyzer-packet-row-dns {
  background: rgba(77, 118, 151, 0.07);
}

.analyzer-packet-row-alert {
  background: rgba(202, 133, 66, 0.08);
}

.analyzer-packet-row-selected {
  background: rgba(50, 116, 137, 0.45) !important;
  box-shadow: inset 3px 0 #a3e7ec;
  color: #f2fbfa;
}

.analyzer-packet-row-selected td:last-child {
  color: #e5ffff;
  animation: analyzer-selected-signal 2.4s ease-in-out infinite;
}

.analyzer-protocol {
  display: inline-block;
  padding-left: 6px;
  border-left: 2px solid currentColor;
  font-size: 0.61rem;
  font-weight: 700;
}

.analyzer-protocol-tcp { color: #b6d981; }
.analyzer-protocol-tls { color: #8bd8a8; }
.analyzer-protocol-dns { color: #9bc4ee; }
.analyzer-protocol-http { color: #f0b778; }
.analyzer-protocol-ssh { color: #cbb2ef; }

.analyzer-table-scan {
  position: absolute;
  z-index: 2;
  top: 35px;
  bottom: 0;
  left: -20%;
  width: 1px;
  background: linear-gradient(180deg, transparent, rgba(188, 246, 109, 0.75) 46%, transparent);
  box-shadow: 0 0 18px rgba(188, 246, 109, 0.46);
  animation: analyzer-table-sweep 6.8s cubic-bezier(0.45, 0.05, 0.55, 0.95) infinite;
  pointer-events: none;
}

.analyzer-detail-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.18fr) minmax(0, 0.82fr);
  min-height: 210px;
  border-bottom: 1px solid rgba(225, 245, 216, 0.12);
}

.analyzer-details-pane {
  border-right: 1px solid rgba(225, 245, 216, 0.11);
}

.analyzer-tree {
  display: grid;
  gap: 0;
  margin: 0;
  padding: 14px clamp(14px, 2vw, 24px) 18px;
  list-style: none;
  color: rgba(225, 238, 226, 0.6);
  font-size: 0.7rem;
}

.analyzer-tree li {
  display: grid;
  grid-template-columns: 15px minmax(0, 1fr) auto;
  gap: 8px;
  align-items: baseline;
  min-height: 32px;
  border-bottom: 1px solid rgba(225, 245, 216, 0.05);
}

.analyzer-tree li > span {
  color: rgba(188, 246, 109, 0.66);
  font-size: 0.9rem;
}

.analyzer-tree strong {
  color: rgba(238, 246, 239, 0.76);
  font-weight: 500;
}

.analyzer-tree small {
  color: rgba(225, 238, 226, 0.32);
  font-size: 0.61rem;
}

.analyzer-tree-alert strong,
.analyzer-tree-alert small {
  color: #efb36b;
}

.analyzer-bytes-pane {
  min-width: 0;
}

.analyzer-bytes-grid {
  display: grid;
  grid-template-columns: repeat(8, minmax(0, 1fr));
  gap: 8px 12px;
  margin: 17px clamp(14px, 2vw, 24px) 15px;
  color: rgba(159, 217, 164, 0.74);
  font-size: 0.68rem;
}

.analyzer-ascii {
  display: block;
  margin: 0 clamp(14px, 2vw, 24px);
  color: rgba(225, 238, 226, 0.43);
  font: inherit;
  font-size: 0.67rem;
  line-height: 1.8;
  white-space: nowrap;
}

.analyzer-statusbar {
  justify-content: flex-start;
  gap: clamp(17px, 3vw, 42px);
  min-height: 45px;
  color: rgba(225, 238, 226, 0.32);
  font-size: 0.59rem;
  font-weight: 700;
  letter-spacing: 0.08em;
}

.analyzer-statusbar > span:first-child i,
.analyzer-statusbar > strong i {
  display: inline-block;
  margin-right: 7px;
}

.analyzer-statusbar > strong {
  display: inline-flex;
  align-items: center;
  margin-left: auto;
  color: #bcf66d;
  font-weight: 700;
}

@keyframes analyzer-live-pulse {
  0%, 100% { opacity: 0.48; transform: scale(0.82); }
  50% { opacity: 1; transform: scale(1); }
}

@keyframes analyzer-cursor-blink {
  0%, 48% { opacity: 1; }
  49%, 100% { opacity: 0; }
}

@keyframes analyzer-table-sweep {
  0%, 14% { left: -20%; opacity: 0; }
  24%, 76% { opacity: 1; }
  88%, 100% { left: 120%; opacity: 0; }
}

@keyframes analyzer-selected-signal {
  0%, 100% { color: #e5ffff; }
  50% { color: #bcf66d; }
}

@media (max-width: 950px) {
  .analyzer-heading {
    grid-template-columns: minmax(170px, 0.62fr) minmax(0, 1.38fr);
  }

  .analyzer-filter-row {
    grid-template-columns: auto minmax(0, 1fr) auto;
  }

  .analyzer-filter-hint {
    display: none;
  }

  .analyzer-packet-table {
    min-width: 780px;
  }

  .analyzer-table-wrap {
    overflow-x: auto;
  }

  .analyzer-table-scan {
    display: none;
  }
}

@media (max-width: 680px) {
  .analyzer-section {
    padding-top: 72px;
    padding-bottom: 92px;
  }

  .analyzer-heading {
    grid-template-columns: 1fr;
    gap: 26px;
  }

  .analyzer-heading .section-marker {
    margin-top: 0;
  }

  .analyzer-heading h2 {
    font-size: clamp(2.2rem, 10vw, 3.5rem);
  }

  .analyzer-toolbar,
  .analyzer-filter-row,
  .analyzer-statusbar {
    padding-right: 14px;
    padding-left: 14px;
  }

  .analyzer-toolbar {
    align-items: flex-start;
    flex-direction: column;
    justify-content: center;
    gap: 7px;
    min-height: 68px;
  }

  .analyzer-session {
    gap: 13px;
  }

  .analyzer-filter-row {
    grid-template-columns: 1fr auto;
    gap: 8px;
    padding-top: 10px;
    padding-bottom: 10px;
  }

  .analyzer-filter-label {
    grid-column: 1 / -1;
  }

  .analyzer-filter-input {
    grid-column: 1;
  }

  .analyzer-filter-button {
    grid-column: 2;
  }

  .analyzer-detail-grid {
    grid-template-columns: 1fr;
  }

  .analyzer-details-pane {
    border-right: 0;
    border-bottom: 1px solid rgba(225, 245, 216, 0.11);
  }

  .analyzer-statusbar {
    flex-wrap: wrap;
    row-gap: 7px;
    padding-top: 11px;
    padding-bottom: 11px;
  }

  .analyzer-statusbar > span:nth-child(2) {
    display: none;
  }

  .analyzer-statusbar > strong {
    margin-left: auto;
  }
}

@media (prefers-reduced-motion: reduce) {
  .analyzer-session em i,
  .analyzer-statusbar > strong i,
  .analyzer-filter-cursor,
  .analyzer-table-scan,
  .analyzer-packet-row-selected td:last-child {
    animation: none;
  }
}

.validation-monitor-main {
  min-height: 310px;
  overflow: hidden;
}

.validation-target-panel {
  position: relative;
  min-width: 0;
  padding: 22px 20px 16px;
}

.validation-target-panel .validation-panel-heading > span:last-child {
  color: var(--acid);
}

.validation-target-system {
  position: relative;
  min-height: 112px;
  margin-top: 15px;
  border-top: 1px solid rgba(225, 245, 216, 0.12);
  border-bottom: 1px solid rgba(225, 245, 216, 0.12);
}

.validation-target-route {
  position: absolute;
  top: 14px;
  left: 0;
  color: rgba(238, 243, 239, 0.38);
  font-family: "IBM Plex Mono", "SFMono-Regular", Consolas, monospace;
  font-size: 0.46rem;
  font-weight: 700;
  letter-spacing: 0.04em;
}

.validation-target-node {
  position: absolute;
  top: 18px;
  right: 9px;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 3px;
  width: 67px;
  height: 67px;
  padding: 8px;
  border: 1px solid rgba(188, 246, 109, 0.76);
  background: rgba(188, 246, 109, 0.035);
  box-shadow: inset 0 0 0 1px rgba(188, 246, 109, 0.06), 0 0 24px rgba(188, 246, 109, 0.08);
}

.validation-target-node::before,
.validation-target-node::after {
  position: absolute;
  width: 8px;
  height: 8px;
  border-color: var(--acid);
  content: "";
}

.validation-target-node::before {
  top: -1px;
  left: -1px;
  border-top: 1px solid;
  border-left: 1px solid;
}

.validation-target-node::after {
  right: -1px;
  bottom: -1px;
  border-right: 1px solid;
  border-bottom: 1px solid;
}

.validation-target-node i {
  display: block;
  min-width: 0;
  background: rgba(188, 246, 109, 0.2);
  animation: validation-target-cells 2.8s steps(1, end) infinite;
}

.validation-target-node i:nth-child(2),
.validation-target-node i:nth-child(5),
.validation-target-node i:nth-child(8) {
  animation-delay: -0.65s;
}

.validation-target-node i:nth-child(3),
.validation-target-node i:nth-child(6),
.validation-target-node i:nth-child(9) {
  animation-delay: -1.3s;
}

.validation-target-result {
  position: absolute;
  bottom: 14px;
  left: 0;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  color: var(--acid);
  font-family: "IBM Plex Mono", "SFMono-Regular", Consolas, monospace;
  font-size: 0.49rem;
  font-weight: 800;
  letter-spacing: 0.09em;
}

.validation-target-result i {
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: var(--acid);
  box-shadow: 0 0 0 3px rgba(188, 246, 109, 0.08);
  animation: validation-monitor-pulse 2.2s ease-in-out infinite;
}

.validation-performance-strip {
  margin-top: 14px;
}

.validation-performance-strip .validation-chart-meta {
  align-items: baseline;
  margin-top: 0;
}

.validation-performance-strip .validation-chart-meta strong {
  color: var(--paper);
  font-family: "Inter Variable", "Inter", sans-serif;
  font-size: 0.96rem;
  font-weight: 570;
  letter-spacing: -0.055em;
}

.validation-performance-strip .validation-line-chart {
  margin-top: 8px;
}

.validation-code-streams {
  position: absolute;
  z-index: 3;
  top: 89px;
  right: 15%;
  left: 27%;
  height: 56px;
  overflow: hidden;
  pointer-events: none;
  mask-image: linear-gradient(90deg, transparent 0%, #000 7%, #000 92%, transparent 100%);
}

.validation-code-streams::before,
.validation-code-streams::after {
  position: absolute;
  right: 0;
  left: 0;
  height: 1px;
  background: rgba(188, 246, 109, 0.14);
  content: "";
}

.validation-code-streams::before { top: 10px; }
.validation-code-streams::after { bottom: 10px; }

.validation-code-stream {
  position: absolute;
  left: -118%;
  display: block;
  color: rgba(188, 246, 109, 0.86);
  font-family: "IBM Plex Mono", "SFMono-Regular", Consolas, monospace;
  font-size: 0.41rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  line-height: 1;
  white-space: nowrap;
  animation: validation-pentest-stream 3.3s linear infinite;
}

.validation-code-stream-one { top: 4px; }
.validation-code-stream-two {
  top: 23px;
  color: rgba(188, 246, 109, 0.64);
  animation-delay: -1.1s;
}

.validation-code-stream-three {
  top: 42px;
  color: rgba(238, 243, 239, 0.5);
  animation-delay: -2.2s;
}

@keyframes validation-pentest-stream {
  from { transform: translateX(0); }
  to { transform: translateX(235%); }
}

@keyframes validation-target-cells {
  0%, 100% { opacity: 0.32; transform: scale(0.82); }
  40% { opacity: 1; transform: scale(1); background: var(--acid); }
}

@media (max-width: 560px) {
  .validation-monitor-main {
    min-height: 0;
  }

  .validation-target-panel {
    padding: 20px 16px;
  }

  .validation-target-system {
    min-height: 104px;
  }

  .validation-code-streams {
    display: none;
  }
}

@media (prefers-reduced-motion: reduce) {
  .validation-target-node i,
  .validation-target-result i,
  .validation-code-stream {
    animation: none;
  }
}

.validation-monitor-main {
  min-height: 328px;
}

.validation-target-panel {
  padding-top: 22px;
}

.validation-pentest-device-scene {
  position: relative;
  height: 133px;
  margin-top: 14px;
  border-top: 1px solid rgba(225, 245, 216, 0.13);
  border-bottom: 1px solid rgba(225, 245, 216, 0.13);
}

.validation-device-route {
  position: absolute;
  top: 12px;
  left: 0;
  color: rgba(238, 243, 239, 0.37);
  font-family: "IBM Plex Mono", "SFMono-Regular", Consolas, monospace;
  font-size: 0.44rem;
  font-weight: 700;
  letter-spacing: 0.045em;
}

.validation-pentest-device {
  position: absolute;
  top: 27px;
  right: 7px;
  width: min(74%, 190px);
  height: 73px;
  border: 1px solid rgba(225, 245, 216, 0.42);
  background: linear-gradient(180deg, rgba(29, 41, 30, 0.95), rgba(7, 11, 8, 0.98));
  box-shadow: inset 0 1px rgba(238, 243, 239, 0.07), 0 10px 20px rgba(0, 0, 0, 0.2);
}

.validation-pentest-device::before,
.validation-pentest-device::after {
  position: absolute;
  content: "";
  pointer-events: none;
}

.validation-pentest-device::before {
  top: -1px;
  left: -1px;
  width: 16px;
  height: 16px;
  border-top: 1px solid var(--acid);
  border-left: 1px solid var(--acid);
}

.validation-pentest-device::after {
  right: -1px;
  bottom: -1px;
  width: 16px;
  height: 16px;
  border-right: 1px solid rgba(188, 246, 109, 0.78);
  border-bottom: 1px solid rgba(188, 246, 109, 0.78);
}

.validation-device-input {
  position: absolute;
  z-index: 2;
  top: 9px;
  left: -14px;
  width: 14px;
  height: 55px;
  border: 1px solid var(--acid);
  background: rgba(188, 246, 109, 0.12);
  box-shadow: -9px 0 15px rgba(188, 246, 109, 0.14), inset 0 0 8px rgba(188, 246, 109, 0.3);
  animation: validation-device-port 3.3s ease-in-out infinite;
}

.validation-device-screen {
  position: absolute;
  top: 12px;
  left: 15px;
  width: 88px;
  min-height: 47px;
  padding: 7px 8px;
  border: 1px solid rgba(188, 246, 109, 0.32);
  background: rgba(3, 7, 4, 0.8);
  color: var(--acid);
  font-family: "IBM Plex Mono", "SFMono-Regular", Consolas, monospace;
  animation: validation-device-screen 3.3s steps(1, end) infinite;
}

.validation-device-screen span {
  display: block;
  color: rgba(238, 243, 239, 0.42);
  font-size: 0.36rem;
  font-weight: 700;
  letter-spacing: 0.09em;
}

.validation-device-screen strong {
  display: block;
  margin-top: 4px;
  font-size: 0.49rem;
  font-weight: 800;
  letter-spacing: 0.045em;
  line-height: 1.2;
}

.validation-device-slots {
  position: absolute;
  right: 24px;
  bottom: 13px;
  display: flex;
  gap: 4px;
}

.validation-device-slots i {
  display: block;
  width: 10px;
  height: 3px;
  background: rgba(238, 243, 239, 0.2);
}

.validation-device-slots i:nth-child(2),
.validation-device-slots i:nth-child(3) {
  background: rgba(188, 246, 109, 0.75);
  animation: validation-device-slots 1.4s steps(1, end) infinite;
}

.validation-device-slots i:nth-child(3) { animation-delay: -0.6s; }

.validation-device-led {
  position: absolute;
  top: 15px;
  right: 14px;
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: var(--acid);
  box-shadow: 0 0 0 3px rgba(188, 246, 109, 0.08), 0 0 11px rgba(188, 246, 109, 0.5);
}

.validation-device-result {
  position: absolute;
  bottom: 13px;
  left: 0;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  color: var(--acid);
  font-family: "IBM Plex Mono", "SFMono-Regular", Consolas, monospace;
  font-size: 0.47rem;
  font-weight: 800;
  letter-spacing: 0.08em;
}

.validation-device-result i {
  width: 5px;
  height: 5px;
  border: 1px solid var(--acid);
  background: rgba(188, 246, 109, 0.18);
}

.validation-code-streams {
  z-index: 5;
  top: 77px;
  right: 7%;
  left: 37%;
  height: 69px;
  mask-image: linear-gradient(90deg, transparent 0%, #000 5%, #000 97%, transparent 100%);
}

.validation-code-streams::before,
.validation-code-streams::after {
  background: rgba(188, 246, 109, 0.18);
}

.validation-code-streams::before { top: 8px; }
.validation-code-streams::after { bottom: 8px; }

.validation-code-stream {
  left: -78%;
  color: rgba(188, 246, 109, 0.92);
  font-size: 0.5rem;
  letter-spacing: 0.025em;
  animation-duration: 3.3s;
}

.validation-code-stream-one { top: 3px; }
.validation-code-stream-two { top: 27px; }
.validation-code-stream-three { top: 51px; }

@keyframes validation-device-port {
  0%, 28%, 100% { border-color: rgba(188, 246, 109, 0.45); background: rgba(188, 246, 109, 0.05); box-shadow: -5px 0 8px rgba(188, 246, 109, 0.05); }
  42%, 72% { border-color: var(--acid); background: rgba(188, 246, 109, 0.3); box-shadow: -12px 0 22px rgba(188, 246, 109, 0.42), inset 0 0 10px rgba(188, 246, 109, 0.58); }
}

@keyframes validation-device-screen {
  0%, 31%, 100% { box-shadow: none; }
  43%, 72% { box-shadow: inset 0 0 16px rgba(188, 246, 109, 0.2), 0 0 16px rgba(188, 246, 109, 0.1); }
}

@keyframes validation-device-slots {
  0%, 100% { opacity: 0.34; }
  50% { opacity: 1; }
}

@media (max-width: 560px) {
  .validation-pentest-device-scene {
    height: 126px;
  }

  .validation-pentest-device {
    width: 178px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .validation-device-input,
  .validation-device-screen,
  .validation-device-slots i {
    animation: none;
  }
}

.validation-monitor-main {
  display: block;
  min-height: 0;
  overflow: hidden;
}

.pentest-attack-stage {
  position: relative;
  min-height: 338px;
  padding: 17px 21px 12px;
  overflow: hidden;
}

.pentest-stage-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  color: rgba(238, 243, 239, 0.42);
  font-family: "IBM Plex Mono", "SFMono-Regular", Consolas, monospace;
  font-size: 0.49rem;
  font-weight: 700;
  letter-spacing: 0.085em;
}

.pentest-stage-header span:first-child {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  color: var(--acid);
}

.pentest-stage-header i {
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: var(--acid);
  box-shadow: 0 0 0 3px rgba(188, 246, 109, 0.08);
  animation: validation-monitor-pulse 2.2s ease-in-out infinite;
}

.pentest-source {
  position: absolute;
  top: 59px;
  left: 21px;
  width: 30%;
  min-width: 142px;
  color: rgba(238, 243, 239, 0.64);
  font-family: "IBM Plex Mono", "SFMono-Regular", Consolas, monospace;
}

.pentest-source::before {
  position: absolute;
  top: -15px;
  left: 0;
  width: 31px;
  height: 1px;
  background: var(--acid);
  content: "";
}

.pentest-source-label {
  display: block;
  margin-bottom: 18px;
  color: rgba(238, 243, 239, 0.36);
  font-size: 0.44rem;
  font-weight: 700;
  letter-spacing: 0.1em;
}

.pentest-source p {
  margin: 0 0 10px;
  overflow: hidden;
  font-size: clamp(0.45rem, 0.7vw, 0.56rem);
  letter-spacing: -0.035em;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.pentest-source b {
  display: inline-block;
  width: 13px;
  color: var(--acid);
  font-weight: 700;
}

.pentest-source-active {
  color: var(--paper);
}

.pentest-source-active b {
  animation: pentest-source-cursor 850ms steps(1, end) infinite;
}

.pentest-code-rail {
  position: absolute;
  z-index: 3;
  top: 117px;
  right: 32%;
  left: 31%;
  height: 59px;
  overflow: hidden;
  border-top: 1px solid rgba(188, 246, 109, 0.24);
  border-bottom: 1px solid rgba(188, 246, 109, 0.13);
  background: linear-gradient(90deg, rgba(188, 246, 109, 0.045), transparent 90%);
  mask-image: linear-gradient(90deg, transparent 0%, #000 6%, #000 94%, transparent 100%);
}

.pentest-code-rail::after {
  position: absolute;
  top: 50%;
  right: -1px;
  width: 7px;
  height: 7px;
  border-top: 1px solid var(--acid);
  border-right: 1px solid var(--acid);
  content: "";
  transform: translateY(-50%) rotate(45deg);
}

.pentest-code-flow {
  position: absolute;
  left: -130%;
  color: rgba(188, 246, 109, 0.92);
  font-family: "IBM Plex Mono", "SFMono-Regular", Consolas, monospace;
  font-size: clamp(0.42rem, 0.66vw, 0.54rem);
  font-weight: 700;
  letter-spacing: 0.02em;
  line-height: 1;
  white-space: nowrap;
  animation: pentest-code-enter 3.7s linear infinite;
}

.pentest-code-flow-one { top: 12px; }

.pentest-code-flow-two {
  top: 36px;
  color: rgba(238, 243, 239, 0.52);
  animation-delay: -1.85s;
}

.pentest-target {
  position: absolute;
  top: 43px;
  right: 8px;
  width: min(39%, 248px);
  min-width: 184px;
  height: 205px;
}

.pentest-target-machine {
  display: block;
  width: 100%;
  height: auto;
  overflow: visible;
}

.pentest-device-side {
  fill: url(#pentestDeviceSide);
  stroke: rgba(225, 245, 216, 0.2);
  stroke-linejoin: round;
}

.pentest-device-body {
  fill: url(#pentestDeviceFace);
  stroke: rgba(225, 245, 216, 0.48);
  stroke-linejoin: round;
  stroke-width: 1.15;
}

.pentest-device-edge {
  fill: none;
  stroke: rgba(188, 246, 109, 0.45);
  stroke-width: 1;
}

.pentest-device-input {
  fill: rgba(188, 246, 109, 0.1);
  stroke: var(--acid);
  stroke-width: 1.4;
  animation: pentest-device-ingest 3.7s ease-in-out infinite;
}

.pentest-device-channel {
  fill: rgba(188, 246, 109, 0.08);
  stroke: rgba(188, 246, 109, 0.38);
  stroke-width: 1;
  animation: pentest-device-channel 3.7s linear infinite;
}

.pentest-device-display {
  fill: rgba(2, 7, 3, 0.78);
  stroke: rgba(188, 246, 109, 0.45);
  stroke-width: 1;
  animation: pentest-device-display 3.7s steps(1, end) infinite;
}

.pentest-device-display-line,
.pentest-device-slots,
.pentest-device-status {
  fill: none;
  stroke-linecap: square;
  vector-effect: non-scaling-stroke;
}

.pentest-device-display-line {
  stroke: rgba(188, 246, 109, 0.66);
  stroke-width: 1;
  animation: pentest-device-lines 3.7s steps(1, end) infinite;
}

.pentest-device-slots {
  stroke: rgba(238, 243, 239, 0.25);
  stroke-width: 2;
}

.pentest-device-status {
  stroke: var(--acid);
  stroke-width: 3;
  animation: pentest-device-status 1.4s steps(1, end) infinite;
}

.pentest-target-caption {
  position: absolute;
  top: 76px;
  left: 32%;
  color: rgba(238, 243, 239, 0.48);
  font-family: "IBM Plex Mono", "SFMono-Regular", Consolas, monospace;
  font-size: clamp(0.36rem, 0.57vw, 0.48rem);
  font-weight: 700;
  letter-spacing: 0.075em;
  line-height: 1.18;
}

.pentest-target-caption b {
  color: var(--acid);
  font-weight: 800;
}

.pentest-target-state {
  position: absolute;
  bottom: 3px;
  left: 8%;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: var(--acid);
  font-family: "IBM Plex Mono", "SFMono-Regular", Consolas, monospace;
  font-size: 0.45rem;
  font-weight: 800;
  letter-spacing: 0.1em;
}

.pentest-target-state i {
  width: 5px;
  height: 5px;
  border: 1px solid var(--acid);
  background: rgba(188, 246, 109, 0.28);
}

.pentest-performance {
  position: absolute;
  right: 21px;
  bottom: 14px;
  left: 21px;
  display: grid;
  grid-template-columns: 94px minmax(0, 1fr);
  gap: 14px;
  align-items: center;
  height: 44px;
  border-top: 1px solid rgba(225, 245, 216, 0.13);
  color: rgba(238, 243, 239, 0.37);
  font-family: "IBM Plex Mono", "SFMono-Regular", Consolas, monospace;
  font-size: 0.44rem;
  font-weight: 700;
  letter-spacing: 0.08em;
}

.pentest-performance b {
  display: block;
  margin-top: 4px;
  color: var(--paper);
  font-family: "Inter Variable", "Inter", sans-serif;
  font-size: 0.85rem;
  font-weight: 560;
  letter-spacing: -0.05em;
}

.pentest-performance svg {
  display: block;
  width: 100%;
  height: 31px;
  overflow: visible;
}

.pentest-performance-grid {
  fill: none;
  stroke: rgba(225, 245, 216, 0.1);
  stroke-width: 1;
  vector-effect: non-scaling-stroke;
}

.pentest-performance-line {
  fill: none;
  stroke: var(--acid);
  stroke-linecap: square;
  stroke-linejoin: round;
  stroke-width: 1.4;
  vector-effect: non-scaling-stroke;
  stroke-dasharray: 570;
  stroke-dashoffset: 570;
  animation: pentest-performance-trace 1.2s 200ms cubic-bezier(0.16, 1, 0.3, 1) both;
}

@keyframes pentest-code-enter {
  from { transform: translateX(0); }
  to { transform: translateX(320%); }
}

@keyframes pentest-source-cursor {
  0%, 45% { opacity: 1; }
  46%, 100% { opacity: 0.22; }
}

@keyframes pentest-device-ingest {
  0%, 29%, 100% { fill: rgba(188, 246, 109, 0.08); filter: none; }
  44%, 75% { fill: rgba(188, 246, 109, 0.45); filter: drop-shadow(0 0 7px rgba(188, 246, 109, 0.8)); }
}

@keyframes pentest-device-channel {
  0%, 31%, 100% { fill: rgba(188, 246, 109, 0.05); }
  43%, 76% { fill: rgba(188, 246, 109, 0.52); }
}

@keyframes pentest-device-display {
  0%, 31%, 100% { fill: rgba(2, 7, 3, 0.78); }
  43%, 76% { fill: rgba(188, 246, 109, 0.13); }
}

@keyframes pentest-device-lines {
  0%, 31%, 100% { stroke: rgba(188, 246, 109, 0.45); }
  43%, 76% { stroke: var(--acid); }
}

@keyframes pentest-device-status {
  0%, 100% { opacity: 0.36; }
  50% { opacity: 1; }
}

@keyframes pentest-performance-trace {
  to { stroke-dashoffset: 0; }
}

@media (max-width: 560px) {
  .pentest-attack-stage {
    min-height: 350px;
    padding-right: 15px;
    padding-left: 15px;
  }

  .pentest-stage-header {
    font-size: 0.4rem;
  }

  .pentest-source {
    left: 15px;
    width: 43%;
    min-width: 0;
  }

  .pentest-source p {
    font-size: 0.43rem;
  }

  .pentest-target {
    right: -3px;
    width: 54%;
    min-width: 0;
  }

  .pentest-code-rail {
    top: 120px;
    right: 42%;
    left: 38%;
  }

  .pentest-code-flow {
    font-size: 0.39rem;
  }

  .pentest-performance {
    right: 15px;
    bottom: 12px;
    left: 15px;
    grid-template-columns: 80px minmax(0, 1fr);
    gap: 8px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .pentest-stage-header i,
  .pentest-source-active b,
  .pentest-code-flow,
  .pentest-device-input,
  .pentest-device-channel,
  .pentest-device-display,
  .pentest-device-display-line,
  .pentest-device-status,
  .pentest-performance-line {
    animation: none;
  }

  .pentest-performance-line {
    stroke-dashoffset: 0;
  }
}

.validation-monitor-main {
  min-height: 0;
}

.pentest-image-stage {
  position: relative;
  aspect-ratio: 16 / 9;
  overflow: hidden;
  background: #050806;
}

.pentest-appliance-image {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

.pentest-image-stage::after {
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, rgba(2, 5, 3, 0.08), transparent 48%, rgba(2, 5, 3, 0.1));
  content: "";
  pointer-events: none;
}

.pentest-image-code {
  position: absolute;
  z-index: 2;
  top: 13%;
  left: 5.5%;
  width: 40%;
  color: rgba(238, 243, 239, 0.72);
  font-family: "IBM Plex Mono", "SFMono-Regular", Consolas, monospace;
}

.pentest-image-code-label {
  display: block;
  margin-bottom: clamp(10px, 1.4vw, 16px);
  color: rgba(188, 246, 109, 0.82);
  font-size: clamp(0.4rem, 0.67vw, 0.54rem);
  font-weight: 800;
  letter-spacing: 0.105em;
}

.pentest-image-code p {
  margin: 0 0 clamp(7px, 1vw, 11px);
  overflow: hidden;
  font-size: clamp(0.43rem, 0.76vw, 0.62rem);
  font-weight: 600;
  letter-spacing: -0.035em;
  line-height: 1.1;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.pentest-image-code b {
  display: inline-block;
  width: 20px;
  color: rgba(188, 246, 109, 0.48);
  font-size: 0.82em;
  font-weight: 700;
}

.pentest-image-code-active {
  position: relative;
  color: var(--paper);
}

.pentest-image-code-active::before {
  position: absolute;
  top: -4px;
  bottom: -4px;
  left: -10px;
  width: 1px;
  background: var(--acid);
  content: "";
}

.pentest-image-code-active b {
  color: var(--acid);
}

.pentest-image-flow {
  position: absolute;
  z-index: 2;
  top: 54%;
  left: -1%;
  width: 55%;
  height: clamp(16px, 2.1vw, 23px);
  overflow: hidden;
  border-top: 1px solid rgba(188, 246, 109, 0.38);
  border-bottom: 1px solid rgba(188, 246, 109, 0.13);
  background: linear-gradient(90deg, rgba(188, 246, 109, 0.08), rgba(188, 246, 109, 0.01));
  transform: rotate(-8.5deg);
  transform-origin: left center;
  mask-image: linear-gradient(90deg, transparent 0%, #000 7%, #000 95%, transparent 100%);
}

.pentest-image-flow span {
  position: absolute;
  top: 50%;
  left: -130%;
  color: var(--acid);
  font-family: "IBM Plex Mono", "SFMono-Regular", Consolas, monospace;
  font-size: clamp(0.35rem, 0.6vw, 0.48rem);
  font-weight: 800;
  letter-spacing: 0.03em;
  line-height: 1;
  text-shadow: 0 0 9px rgba(188, 246, 109, 0.72);
  white-space: nowrap;
  transform: translateY(-50%);
  animation: pentest-image-code-travel 3.4s linear infinite;
}

.pentest-image-state {
  position: absolute;
  z-index: 2;
  bottom: 9%;
  left: 5.5%;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  color: rgba(188, 246, 109, 0.82);
  font-family: "IBM Plex Mono", "SFMono-Regular", Consolas, monospace;
  font-size: clamp(0.39rem, 0.61vw, 0.51rem);
  font-weight: 800;
  letter-spacing: 0.1em;
}

.pentest-image-state i {
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: var(--acid);
  box-shadow: 0 0 0 3px rgba(188, 246, 109, 0.08);
  animation: validation-monitor-pulse 2s ease-in-out infinite;
}

@keyframes pentest-image-code-travel {
  from { transform: translate(-2%, -50%); }
  to { transform: translate(315%, -50%); }
}

@media (max-width: 560px) {
  .pentest-image-code {
    top: 11%;
    left: 5%;
    width: 47%;
  }

  .pentest-image-code p {
    margin-bottom: 6px;
    font-size: 0.4rem;
  }

  .pentest-image-flow {
    top: 57%;
    width: 58%;
  }
}

@media (prefers-reduced-motion: reduce) {
  .pentest-image-flow span,
  .pentest-image-state i {
    animation: none;
  }
}

.reveal {
  will-change: opacity, transform;
  transition-duration: 820ms;
  transition-timing-function: cubic-bezier(0.16, 1, 0.3, 1);
}

.reveal.is-visible {
  will-change: auto;
}

.impact-cta .impact-center-metric,
.validation-map-section .validation-map-copy,
.validation-map-section .validation-monitor-shell,
.proof-section .proof-copy,
.proof-section .proof-client-card,
.offensive-services-section .offensive-services-heading,
.offensive-services-section .offensive-service-card,
.threat-news-section .threat-news-heading,
.threat-news-section .threat-news-feed {
  opacity: 0;
  transform: translateY(22px) scale(0.985);
  transition: opacity 700ms cubic-bezier(0.16, 1, 0.3, 1),
    transform 700ms cubic-bezier(0.16, 1, 0.3, 1);
}

.impact-cta.is-visible .impact-center-metric,
.validation-map-section.is-visible .validation-map-copy,
.validation-map-section.is-visible .validation-monitor-shell,
.proof-section.is-visible .proof-copy,
.proof-section.is-visible .proof-client-card,
.offensive-services-section.is-visible .offensive-services-heading,
.offensive-services-section.is-visible .offensive-service-card,
.threat-news-section.is-visible .threat-news-heading,
.threat-news-section.is-visible .threat-news-feed {
  opacity: 1;
  transform: translateY(0) scale(1);
}

.impact-cta.is-visible .impact-center-metric:first-child,
.validation-map-section.is-visible .validation-map-copy,
.proof-section.is-visible .proof-copy,
.offensive-services-section.is-visible .offensive-services-heading,
.threat-news-section.is-visible .threat-news-heading {
  transition-delay: 70ms;
}

.impact-cta.is-visible .impact-center-metric:last-child,
.validation-map-section.is-visible .validation-monitor-shell,
.proof-section.is-visible .proof-client-card,
.offensive-services-section.is-visible .offensive-service-card:nth-child(1),
.threat-news-section.is-visible .threat-news-feed {
  transition-delay: 180ms;
}

.offensive-services-section.is-visible .offensive-service-card:nth-child(2) {
  transition-delay: 260ms;
}

.offensive-services-section.is-visible .offensive-service-card:nth-child(3) {
  transition-delay: 340ms;
}

@media (prefers-reduced-motion: reduce) {
  .impact-cta .impact-center-metric,
  .validation-map-section .validation-map-copy,
  .validation-map-section .validation-monitor-shell,
  .proof-section .proof-copy,
  .proof-section .proof-client-card,
  .offensive-services-section .offensive-services-heading,
  .offensive-services-section .offensive-service-card,
  .threat-news-section .threat-news-heading,
  .threat-news-section .threat-news-feed {
    opacity: 1;
    transform: none;
    transition: none;
  }
}

.offensive-service-ddos {
  background-color: #0a2ca3;
  background-image: url("assets/ddos-background-v1.jpg");
  background-position: 64% center;
  background-size: cover;
  border-color: rgba(178, 214, 255, 0.38);
  box-shadow: 0 16px 42px rgba(0, 24, 112, 0.32);
}

.offensive-service-ddos::before {
  background:
    linear-gradient(180deg, rgba(3, 24, 101, 0.38) 0%, rgba(9, 67, 191, 0.08) 45%, rgba(2, 19, 90, 0.58) 100%),
    linear-gradient(90deg, rgba(3, 20, 95, 0.18), transparent 52%, rgba(2, 21, 94, 0.12));
}

.offensive-service-ddos::after {
  background-image:
    radial-gradient(circle at 52% 50%, rgba(210, 235, 255, 0.14), transparent 56%),
    linear-gradient(rgba(206, 230, 255, 0.035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(206, 230, 255, 0.028) 1px, transparent 1px);
  background-size: auto, 18px 18px, 18px 18px;
  opacity: 0.32;
}

.offensive-service-ddos .offensive-service-index,
.offensive-service-ddos .offensive-service-caption,
.offensive-service-ddos .offensive-service-mark {
  text-shadow: 0 2px 16px rgba(1, 21, 92, 0.7), 0 1px 3px rgba(0, 0, 0, 0.42);
}

@media (max-width: 760px) {
  .offensive-service-ddos {
    background-position: 64% center;
  }
}

.site-footer {
  position: relative;
  display: block;
  padding: clamp(58px, 7vw, 112px) clamp(22px, 5.1vw, 88px) 22px;
  overflow: hidden;
  border-top: 1px solid rgba(244, 248, 244, 0.14);
  background:
    linear-gradient(115deg, rgba(188, 246, 109, 0.05), transparent 28%),
    #050606;
}

.site-footer::before {
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(188, 246, 109, 0.66), transparent);
  content: "";
}

.footer-main {
  display: grid;
  grid-template-columns: minmax(240px, 1.05fr) minmax(220px, 1fr) minmax(220px, 0.82fr);
  gap: clamp(36px, 6vw, 104px);
  width: min(100%, 1440px);
  margin: 0 auto;
  padding-bottom: clamp(50px, 6vw, 90px);
}

.footer-intro .footer-brand {
  display: inline-flex;
  margin-bottom: 24px;
}

.footer-intro .brand-icon {
  width: 35px;
  height: 35px;
}

.footer-intro .brand-icon img {
  width: 58px;
}

.footer-intro .brand-name {
  font-size: 0.79rem;
  letter-spacing: 0.14em;
}

.footer-intro p {
  max-width: 270px;
  margin: 0;
  color: rgba(233, 241, 235, 0.58);
  font-size: 0.88rem;
  line-height: 1.65;
}

.footer-statement {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  min-height: 145px;
}

.footer-statement > span {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: rgba(188, 246, 109, 0.84);
  font-family: "IBM Plex Mono", "SFMono-Regular", Consolas, monospace;
  font-size: 0.58rem;
  font-weight: 800;
  letter-spacing: 0.12em;
}

.footer-statement > span i {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--acid);
  box-shadow: 0 0 0 4px rgba(188, 246, 109, 0.09);
}

.footer-statement strong {
  color: #f0f4f0;
  font-size: clamp(1.5rem, 2.2vw, 2.25rem);
  font-weight: 560;
  letter-spacing: -0.06em;
  line-height: 0.95;
}

.footer-statement em {
  color: var(--acid);
  font-style: normal;
}

.footer-nav {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: clamp(26px, 4vw, 54px);
}

.footer-nav div {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 11px;
}

.footer-nav span {
  margin-bottom: 5px;
  color: rgba(244, 248, 244, 0.38);
  font-family: "IBM Plex Mono", "SFMono-Regular", Consolas, monospace;
  font-size: 0.57rem;
  font-weight: 800;
  letter-spacing: 0.12em;
}

.footer-nav a {
  color: rgba(244, 248, 244, 0.7);
  font-size: 0.8rem;
  transition: color 180ms ease, transform 180ms ease;
}

.footer-nav a:hover,
.footer-nav a:focus-visible {
  color: var(--acid);
  transform: translateX(3px);
}

.footer-nav b {
  margin-left: 4px;
  color: var(--acid);
  font-weight: 600;
}

.footer-bottom {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  width: min(100%, 1440px);
  margin: 0 auto;
  padding-top: 19px;
  border-top: 1px solid rgba(244, 248, 244, 0.1);
}

.footer-bottom p {
  margin: 0;
  color: rgba(244, 248, 244, 0.34);
  font-family: "IBM Plex Mono", "SFMono-Regular", Consolas, monospace;
  font-size: 0.55rem;
  font-weight: 700;
  letter-spacing: 0.095em;
}

@media (max-width: 820px) {
  .footer-main {
    grid-template-columns: 1fr 1fr;
  }

  .footer-intro {
    grid-column: 1 / -1;
  }

  .footer-intro p {
    max-width: 350px;
  }
}

@media (max-width: 560px) {
  .site-footer {
    padding-top: 52px;
  }

  .footer-main,
  .footer-nav {
    grid-template-columns: 1fr;
  }

  .footer-main {
    gap: 42px;
  }

  .footer-statement {
    gap: 22px;
    min-height: auto;
  }

  .footer-nav {
    gap: 28px;
  }

  .footer-bottom {
    align-items: flex-start;
    flex-direction: column;
    gap: 8px;
  }
}

.site-footer {
  display: block;
  padding: 0 clamp(22px, 5.1vw, 88px) 20px;
  border-top: 0;
  background: #050505;
}

.site-footer::before {
  display: none;
}

.footer-topline,
.footer-hero,
.footer-bottom {
  width: min(100%, 1440px);
  margin: 0 auto;
}

.footer-topline {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  min-height: 70px;
  border-bottom: 1px solid rgba(244, 248, 244, 0.16);
  color: rgba(244, 248, 244, 0.55);
  font-family: "IBM Plex Mono", "SFMono-Regular", Consolas, monospace;
  font-size: 0.58rem;
  font-weight: 800;
  letter-spacing: 0.105em;
}

.footer-topline span,
.footer-topline a {
  display: inline-flex;
  align-items: center;
  gap: 9px;
}

.footer-topline i {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--acid);
  box-shadow: 0 0 0 4px rgba(188, 246, 109, 0.1);
}

.footer-topline a {
  color: #eef4ed;
  transition: color 180ms ease;
}

.footer-topline a:hover,
.footer-topline a:focus-visible {
  color: var(--acid);
}

.footer-topline b,
.footer-nav b {
  color: var(--acid);
  font-weight: 600;
}

.footer-hero {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(190px, 0.48fr);
  align-items: end;
  gap: clamp(42px, 8vw, 136px);
  padding: clamp(70px, 10vw, 154px) 0 clamp(54px, 6.8vw, 106px);
}

.footer-hero h2 {
  max-width: 900px;
  margin: 0;
  color: #f1f4f1;
  font-size: clamp(3.45rem, 7.8vw, 8.7rem);
  font-weight: 520;
  letter-spacing: -0.09em;
  line-height: 0.84;
}

.footer-hero h2 em {
  color: var(--acid);
  font-style: italic;
  font-weight: 480;
}

.footer-nav {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0 24px;
  border-top: 1px solid rgba(244, 248, 244, 0.18);
}

.footer-nav a {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  min-height: 48px;
  border-bottom: 1px solid rgba(244, 248, 244, 0.13);
  color: rgba(244, 248, 244, 0.7);
  font-size: 0.77rem;
  transition: color 180ms ease, padding 180ms ease;
}

.footer-nav a:hover,
.footer-nav a:focus-visible {
  padding-left: 5px;
  color: #f4f7f3;
}

.footer-wordmark {
  width: min(100%, 1510px);
  margin: 0 auto -0.072em;
  overflow: hidden;
  color: #f0f4f0;
  font-size: clamp(5.2rem, 18.4vw, 18.7rem);
  font-weight: 800;
  letter-spacing: -0.128em;
  line-height: 0.72;
  text-align: center;
  white-space: nowrap;
}

.footer-bottom {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  padding-top: 17px;
  border-top: 1px solid rgba(244, 248, 244, 0.15);
}

.footer-bottom p {
  margin: 0;
  color: rgba(244, 248, 244, 0.36);
  font-family: "IBM Plex Mono", "SFMono-Regular", Consolas, monospace;
  font-size: 0.54rem;
  font-weight: 700;
  letter-spacing: 0.085em;
}

@media (max-width: 720px) {
  .footer-hero {
    grid-template-columns: 1fr;
    gap: 48px;
    padding-top: 74px;
  }

  .footer-wordmark {
    font-size: clamp(4.8rem, 18.1vw, 8.3rem);
  }
}

@media (max-width: 500px) {
  .site-footer {
    padding-right: 18px;
    padding-left: 18px;
  }

  .footer-topline {
    min-height: 62px;
    font-size: 0.48rem;
  }

  .footer-topline span {
    max-width: 175px;
    line-height: 1.4;
  }

  .footer-hero h2 {
    font-size: clamp(3.2rem, 15vw, 4.75rem);
  }

  .footer-nav {
    grid-template-columns: 1fr;
  }

  .footer-bottom {
    align-items: flex-start;
    flex-direction: column;
    gap: 7px;
  }
}

.site-footer {
  display: block;
  padding: clamp(54px, 7vw, 94px) clamp(22px, 5.1vw, 88px) 0;
  border-top: 1px solid rgba(244, 248, 244, 0.14);
  background:
    linear-gradient(115deg, rgba(255, 255, 255, 0.025), transparent 34%),
    repeating-linear-gradient(90deg, rgba(255, 255, 255, 0.018) 0 1px, transparent 1px 96px),
    #070707;
}

.footer-cloud-grid,
.footer-cloud-bottom {
  width: min(100%, 1440px);
  margin: 0 auto;
}

.footer-cloud-grid {
  display: grid;
  grid-template-columns: minmax(220px, 1.55fr) repeat(3, minmax(110px, 0.74fr));
  gap: clamp(28px, 4.2vw, 72px);
  padding-bottom: clamp(50px, 6vw, 82px);
}

.footer-cloud-brand .footer-brand {
  display: inline-flex;
  margin-bottom: 22px;
}

.footer-word-label {
  color: #f1f5f0;
  font-size: 0.86rem;
  font-weight: 760;
  letter-spacing: 0.17em;
}

.footer-cloud-brand p {
  max-width: 268px;
  margin: 0 0 24px;
  color: rgba(244, 248, 244, 0.6);
  font-size: 0.83rem;
  line-height: 1.6;
}

.footer-cloud-brand > span {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: rgba(244, 248, 244, 0.58);
  font-family: "IBM Plex Mono", "SFMono-Regular", Consolas, monospace;
  font-size: 0.53rem;
  font-weight: 800;
  letter-spacing: 0.095em;
}

.footer-cloud-brand > span i {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: rgba(244, 248, 244, 0.72);
}

.footer-cloud-group {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 11px;
}

.footer-cloud-group strong {
  margin-bottom: 8px;
  color: rgba(244, 248, 244, 0.42);
  font-family: "IBM Plex Mono", "SFMono-Regular", Consolas, monospace;
  font-size: 0.55rem;
  font-weight: 800;
  letter-spacing: 0.105em;
}

.footer-cloud-group a {
  color: rgba(244, 248, 244, 0.72);
  font-size: 0.77rem;
  line-height: 1.35;
  transition: color 160ms ease;
}

.footer-cloud-group a:hover,
.footer-cloud-group a:focus-visible {
  color: #ffffff;
}

.footer-cloud-bottom b {
  font-size: 0.86rem;
  font-weight: 600;
}

.footer-cloud-bottom {
  display: flex;
  align-items: center;
  gap: 20px;
  min-height: 64px;
  border-top: 1px solid rgba(244, 248, 244, 0.14);
}

.footer-cloud-bottom p,
.footer-cloud-bottom span,
.footer-cloud-bottom a {
  margin: 0;
  color: rgba(244, 248, 244, 0.4);
  font-family: "IBM Plex Mono", "SFMono-Regular", Consolas, monospace;
  font-size: 0.52rem;
  font-weight: 700;
  letter-spacing: 0.09em;
}

.footer-cloud-bottom a {
  margin-left: auto;
  color: rgba(244, 248, 244, 0.78);
  transition: color 160ms ease;
}

.footer-cloud-bottom a:hover,
.footer-cloud-bottom a:focus-visible {
  color: #ffffff;
}

@media (max-width: 1050px) {
  .footer-cloud-grid {
    grid-template-columns: minmax(220px, 1.4fr) repeat(3, minmax(110px, 0.8fr));
  }
}

@media (max-width: 680px) {
  .footer-cloud-grid {
    grid-template-columns: 1fr 1fr;
    gap: 38px 28px;
  }

  .footer-cloud-brand {
    grid-column: 1 / -1;
  }

}

@media (max-width: 460px) {
  .site-footer {
    padding-right: 18px;
    padding-left: 18px;
  }

  .footer-cloud-grid {
    grid-template-columns: 1fr;
  }

  .footer-cloud-bottom {
    align-items: flex-start;
    flex-direction: column;
    gap: 8px;
    padding: 17px 0;
  }

  .footer-cloud-bottom a {
    margin-left: 0;
  }
}

.client-modal-card {
  display: grid;
  grid-template-columns: minmax(180px, 0.62fr) minmax(0, 1.38fr);
  align-items: center;
  gap: clamp(32px, 5vw, 72px);
  width: min(100%, 790px);
  padding: clamp(40px, 5.2vw, 72px);
  border-color: rgba(244, 248, 244, 0.2);
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.055), transparent 45%),
    #171819;
}

.privacy-lock-stage {
  display: grid;
  place-items: center;
  min-height: 230px;
  border-right: 1px solid rgba(244, 248, 244, 0.14);
}

.privacy-lock {
  width: min(100%, 190px);
  overflow: visible;
  stroke: #f4f8f4;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.privacy-lock-halo {
  stroke: rgba(244, 248, 244, 0.12);
  stroke-width: 1;
}

.privacy-lock-orbit {
  stroke: rgba(244, 248, 244, 0.4);
  stroke-width: 1;
  stroke-dasharray: 3 7;
}

.privacy-lock-body {
  transform-origin: 60px 69px;
}

.privacy-lock-shackle,
.privacy-lock-case,
.privacy-lock-keyhole,
.privacy-lock-key {
  stroke-width: 2.5;
}

.privacy-lock-case {
  fill: rgba(244, 248, 244, 0.055);
}

.privacy-lock-keyhole {
  fill: #f4f8f4;
}

.privacy-lock-scan {
  stroke: rgba(244, 248, 244, 0.45);
  stroke-width: 1;
  stroke-dasharray: 78;
  stroke-dashoffset: 78;
}

.client-modal.is-open .privacy-lock-halo {
  animation: privacy-halo 1.2s cubic-bezier(0.16, 1, 0.3, 1) both;
}

.client-modal.is-open .privacy-lock-orbit {
  animation: privacy-orbit 1.1s ease-out 160ms both;
}

.client-modal.is-open .privacy-lock-body {
  animation: privacy-lock-arrive 1.05s cubic-bezier(0.22, 1, 0.36, 1) 90ms both;
}

.client-modal.is-open .privacy-lock-shackle {
  animation: privacy-shackle-close 1.05s cubic-bezier(0.22, 1, 0.36, 1) 140ms both;
  transform-origin: 60px 58px;
}

.client-modal.is-open .privacy-lock-scan {
  animation: privacy-scan 0.75s ease-out 720ms both;
}

.privacy-modal-copy .proof-label {
  margin: 0;
}

.privacy-modal-copy h2 {
  max-width: 470px;
  margin: 20px 0 17px;
  font-size: clamp(2rem, 4vw, 4rem);
}

.privacy-modal-copy h2 em {
  color: #f4f8f4;
}

.privacy-modal-copy p {
  max-width: 440px;
}

.privacy-modal-seal {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-top: 24px;
  color: rgba(244, 248, 244, 0.55);
  font-family: "IBM Plex Mono", "SFMono-Regular", Consolas, monospace;
  font-size: 0.52rem;
  font-weight: 800;
  letter-spacing: 0.09em;
  line-height: 1.45;
}

.privacy-modal-seal i {
  width: 6px;
  height: 6px;
  flex: 0 0 auto;
  border-radius: 50%;
  background: #f4f8f4;
}

@keyframes privacy-halo {
  from { opacity: 0; transform: scale(0.72); }
  to { opacity: 1; transform: scale(1); }
}

@keyframes privacy-orbit {
  from { opacity: 0; stroke-dashoffset: 80; transform: rotate(-52deg); transform-origin: 60px 60px; }
  to { opacity: 1; stroke-dashoffset: 0; transform: rotate(0); transform-origin: 60px 60px; }
}

@keyframes privacy-lock-arrive {
  0% { opacity: 0; transform: translateY(19px) scale(0.82); }
  55% { opacity: 1; transform: translateY(-4px) scale(1.035); }
  100% { opacity: 1; transform: translateY(0) scale(1); }
}

@keyframes privacy-shackle-close {
  0% { transform: translate(9px, -11px) rotate(22deg); }
  65% { transform: translate(-1px, 1px) rotate(-2deg); }
  100% { transform: translate(0) rotate(0); }
}

@keyframes privacy-scan {
  from { stroke-dashoffset: 78; opacity: 0; }
  to { stroke-dashoffset: 0; opacity: 1; }
}

@media (max-width: 620px) {
  .client-modal-card {
    grid-template-columns: 1fr;
    gap: 24px;
  }

  .privacy-lock-stage {
    min-height: 150px;
    border-right: 0;
    border-bottom: 1px solid rgba(244, 248, 244, 0.14);
  }

  .privacy-lock {
    width: 142px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .client-modal.is-open .privacy-lock-halo,
  .client-modal.is-open .privacy-lock-orbit,
  .client-modal.is-open .privacy-lock-body,
  .client-modal.is-open .privacy-lock-shackle,
  .client-modal.is-open .privacy-lock-scan {
    animation: none;
  }
}

.client-modal-card {
  display: block;
  width: min(100%, 590px);
  padding: clamp(38px, 5vw, 62px);
  background: #202122;
}

.privacy-lock-stage {
  min-height: auto;
  margin-bottom: 27px;
  border: 0;
}

.privacy-lock {
  width: 76px;
  height: 76px;
  stroke: #f4f8f4;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.privacy-lock-body,
.privacy-lock-halo,
.privacy-lock-orbit,
.privacy-lock-scan {
  display: none;
}

.privacy-lock-shackle,
.privacy-lock-case,
.privacy-lock-keyhole,
.privacy-lock-key {
  stroke-width: 1.65;
}

.privacy-lock-case {
  fill: rgba(244, 248, 244, 0.035);
}

.privacy-lock-keyhole {
  fill: #f4f8f4;
}

.client-modal.is-open .privacy-lock-shackle {
  animation: privacy-lock-normal 720ms cubic-bezier(0.22, 1, 0.36, 1) 100ms both;
  transform-origin: 12px 10px;
}

.privacy-modal-copy h2 {
  max-width: 490px;
  margin: 0 0 16px;
  font-size: clamp(2rem, 4vw, 3.55rem);
}

.privacy-modal-seal {
  margin-top: 21px;
}

@keyframes privacy-lock-normal {
  0% { opacity: 0; transform: translateY(-8px) rotate(18deg); }
  54% { opacity: 1; transform: translateY(2px) rotate(-2deg); }
  100% { opacity: 1; transform: translateY(0) rotate(0); }
}

@media (max-width: 620px) {
  .client-modal-card {
    display: block;
  }

  .privacy-lock-stage {
    min-height: auto;
    margin-bottom: 24px;
    border: 0;
  }

  .privacy-lock {
    width: 68px;
    height: 68px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .client-modal.is-open .privacy-lock-shackle {
    animation: none;
  }
}

.privacy-lock-stage {
  display: grid;
  place-items: center;
  width: min(100%, 250px);
  aspect-ratio: 1;
  margin: 0 0 31px;
  overflow: hidden;
  border: 1px solid rgba(244, 248, 244, 0.13);
  background:
    radial-gradient(circle at 50% 52%, rgba(255, 255, 255, 0.055), transparent 48%),
    #111212;
}

.privacy-lock-sprite {
  position: relative;
  display: block;
  width: min(74%, 172px);
  aspect-ratio: 3 / 4;
  filter: drop-shadow(0 17px 18px rgba(0, 0, 0, 0.42));
}

.privacy-lock-frame {
  position: absolute;
  inset: 0;
  display: block;
  opacity: 0;
  background-image: url("assets/privacy-lock-sprite-v1.webp");
  background-repeat: no-repeat;
  background-size: 400% 100%;
  transform: scale(0.955);
  will-change: opacity, transform;
}

.privacy-lock-frame-one { opacity: 1; background-position: 0 50%; }
.privacy-lock-frame-two { background-position: 33.333% 50%; }
.privacy-lock-frame-three { background-position: 66.667% 50%; }
.privacy-lock-frame-four { background-position: 100% 50%; }

.client-modal.is-open .privacy-lock-frame-one {
  animation: privacy-lock-frame-one 2.7s cubic-bezier(0.22, 1, 0.36, 1) both;
}

.client-modal.is-open .privacy-lock-frame-two {
  animation: privacy-lock-frame-two 2.7s cubic-bezier(0.22, 1, 0.36, 1) both;
}

.client-modal.is-open .privacy-lock-frame-three {
  animation: privacy-lock-frame-three 2.7s cubic-bezier(0.22, 1, 0.36, 1) both;
}

.client-modal.is-open .privacy-lock-frame-four {
  animation: privacy-lock-frame-four 2.7s cubic-bezier(0.22, 1, 0.36, 1) both;
}

@keyframes privacy-lock-frame-one {
  0%, 19% { opacity: 1; transform: scale(1) translateY(0); }
  32%, 100% { opacity: 0; transform: scale(0.97) translateY(5px); }
}

@keyframes privacy-lock-frame-two {
  0%, 17% { opacity: 0; transform: scale(0.96) translateY(-7px); }
  31%, 45% { opacity: 1; transform: scale(1) translateY(0); }
  58%, 100% { opacity: 0; transform: scale(0.98) translateY(3px); }
}

@keyframes privacy-lock-frame-three {
  0%, 43% { opacity: 0; transform: scale(0.97) translateY(-5px); }
  57%, 72% { opacity: 1; transform: scale(1.015) translateY(0); }
  84%, 100% { opacity: 0; transform: scale(1) translateY(1px); }
}

@keyframes privacy-lock-frame-four {
  0%, 70% { opacity: 0; transform: scale(0.98) translateY(3px); }
  86%, 100% { opacity: 1; transform: scale(1) translateY(0); }
}

@media (max-width: 620px) {
  .privacy-lock-stage {
    width: min(100%, 214px);
    margin-bottom: 27px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .client-modal.is-open .privacy-lock-frame {
    animation: none;
    opacity: 0;
    transform: none;
  }

  .client-modal.is-open .privacy-lock-frame-four {
    opacity: 1;
  }
}

.client-modal-card {
  isolation: isolate;
  width: min(100%, 760px);
  min-height: 510px;
  background: #090a0a;
}

.privacy-hardware-backdrop {
  position: absolute;
  z-index: 0;
  inset: 0;
  opacity: 0;
  background-image:
    linear-gradient(90deg, rgba(9, 10, 10, 0.94) 0%, rgba(9, 10, 10, 0.7) 44%, rgba(9, 10, 10, 0.15) 100%),
    linear-gradient(0deg, rgba(9, 10, 10, 0.68), transparent 52%, rgba(9, 10, 10, 0.22)),
    url("assets/privacy-lock-chamber-v1.webp");
  background-position: center, center, 61% center;
  background-repeat: no-repeat;
  background-size: cover;
  filter: saturate(0.78) contrast(1.06);
  transform: scale(1.045);
}

.privacy-lock-stage,
.privacy-modal-copy {
  position: relative;
  z-index: 1;
}

.client-modal-close {
  z-index: 2;
}

.privacy-lock-stage {
  width: min(100%, 196px);
  margin-bottom: 25px;
  border-color: rgba(244, 248, 244, 0.2);
  background: rgba(8, 9, 9, 0.44);
  box-shadow: 0 20px 52px rgba(0, 0, 0, 0.42);
  backdrop-filter: blur(3px);
}

.privacy-lock-sprite {
  width: min(76%, 148px);
}

.privacy-modal-copy h2,
.privacy-modal-copy p,
.privacy-modal-seal,
.privacy-modal-copy .proof-label {
  text-shadow: 0 2px 20px rgba(0, 0, 0, 0.65);
}

.client-modal.is-open .privacy-hardware-backdrop {
  animation: privacy-hardware-reveal 1.05s cubic-bezier(0.16, 1, 0.3, 1) both;
}

@keyframes privacy-hardware-reveal {
  0% { opacity: 0; transform: scale(1.09) translateX(28px); }
  100% { opacity: 1; transform: scale(1.045) translateX(0); }
}

@media (max-width: 620px) {
  .client-modal-card {
    min-height: 0;
  }

  .privacy-hardware-backdrop {
    background-position: center, center, 66% center;
  }
}

@media (prefers-reduced-motion: reduce) {
  .client-modal.is-open .privacy-hardware-backdrop {
    animation: none;
    opacity: 1;
    transform: none;
  }
}

.client-modal-card {
  display: grid;
  grid-template-columns: minmax(320px, 0.9fr) minmax(0, 1.1fr);
  align-items: stretch;
  column-gap: clamp(64px, 8vw, 112px);
  width: min(calc(100vw - 48px), 1060px);
  min-height: 530px;
  padding: clamp(42px, 5vw, 64px);
  background-color: #050505 !important;
  background-image:
    linear-gradient(145deg, rgba(7, 7, 7, 0.94), rgba(1, 1, 1, 0.98)),
    url("assets/focus-film-grain.webp") !important;
  background-position: center, center;
  background-repeat: no-repeat, repeat;
  background-size: cover, 680px auto;
  background-blend-mode: normal, soft-light;
}

.privacy-hardware-backdrop {
  display: none;
}

.client-vault-lock-stage {
  position: relative;
  display: grid;
  place-items: center;
  width: 100%;
  min-height: 100%;
  padding: clamp(30px, 4vw, 44px);
  margin: 0;
  overflow: hidden;
  border: 1px solid rgba(244, 248, 244, 0.14);
  border-radius: 12px;
  background:
    radial-gradient(circle at 50% 42%, rgba(122, 128, 220, 0.17), transparent 35%),
    linear-gradient(145deg, rgba(255, 255, 255, 0.055), transparent 48%),
    #0b0d0e;
  color: #f4f8f4;
}

.client-vault-lock {
  width: min(100%, 292px);
  overflow: visible;
}

.privacy-modal-copy {
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: clamp(14px, 2vw, 26px) 0;
}

.client-vault-guides {
  stroke-width: 1.2px;
  opacity: 0.3;
}

.client-vault-shadow {
  fill: rgba(0, 0, 0, 0.46);
}

.client-vault-lock-assembly {
  filter: drop-shadow(0 19px 22px rgba(0, 0, 0, 0.42));
}

.client-vault-lock-shackle {
  fill: none;
  stroke: url(#clientVaultSteel);
  stroke-linecap: round;
  stroke-width: 24px;
  transform-box: fill-box;
  transform-origin: center bottom;
}

.client-vault-lock-shackle-inner {
  fill: none;
  stroke: rgba(4, 6, 6, 0.45);
  stroke-linecap: round;
  stroke-width: 5px;
}

.client-vault-lock-body {
  fill: url(#clientVaultBody);
  stroke: rgba(244, 248, 244, 0.48);
  stroke-width: 2px;
}

.client-vault-lock-face {
  fill: url(#clientVaultFace);
  stroke: rgba(244, 248, 244, 0.11);
  stroke-width: 1px;
}

.client-vault-lock-topline {
  fill: none;
  stroke: rgba(244, 248, 244, 0.24);
  stroke-width: 1px;
}

.client-vault-lock-core {
  fill: #07090a;
  stroke: rgba(244, 248, 244, 0.43);
  stroke-width: 2px;
}

.client-vault-lock-core-inner {
  fill: #7a80dc;
  opacity: 0.86;
}

.client-vault-lock-keyhole {
  fill: #f4f8f4;
}

.client-vault-lock-indicator {
  fill: none;
  stroke: #9ea4ff;
  stroke-linecap: round;
  stroke-width: 2px;
  opacity: 0.08;
  transform-box: fill-box;
  transform-origin: center;
}

.privacy-modal-copy h2 {
  max-width: 550px;
  margin: 20px 0 22px;
  font-size: clamp(2.25rem, 3.5vw, 3.7rem);
  letter-spacing: -0.07em;
  line-height: 0.96;
}

.privacy-modal-copy p {
  max-width: 490px;
  color: rgba(244, 248, 244, 0.64);
  font-size: 0.94rem;
  line-height: 1.75;
}

.privacy-modal-principles {
  display: grid;
  gap: 11px;
  max-width: 490px;
  margin: 34px 0 0;
  padding: 0;
  list-style: none;
}

.privacy-modal-principles li {
  display: flex;
  align-items: center;
  gap: 11px;
  padding-top: 11px;
  border-top: 1px solid rgba(244, 248, 244, 0.12);
  color: rgba(244, 248, 244, 0.68);
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.privacy-modal-principles li::before {
  width: 5px;
  height: 5px;
  flex: 0 0 auto;
  border-radius: 50%;
  background: #8b91e8;
  box-shadow: 0 0 0 3px rgba(139, 145, 232, 0.1);
}

.client-modal-close {
  top: 19px;
  right: 22px;
  width: auto;
  height: auto;
  padding: 4px;
  border: 0;
  border-radius: 0;
  color: rgba(244, 248, 244, 0.65);
  font-size: 0.62rem;
  font-weight: 750;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

.client-modal-close:hover,
.client-modal-close:focus-visible {
  color: #ffffff;
  background: transparent;
}

.proof-client-card .proof-client-button {
  width: 100%;
  min-width: 0;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 18px;
  padding: 13px 14px;
  border: 1px solid rgba(244, 248, 244, 0.3);
  border-radius: 6px;
  background: rgba(244, 248, 244, 0.06);
  color: #f4f7f3;
}

.proof-client-arrow {
  color: rgba(244, 248, 244, 0.82);
  font-size: 1.25rem;
  font-weight: 400;
  line-height: 1;
}

.proof-client-copy {
  display: grid;
  gap: 5px;
  text-align: left;
}

.proof-client-copy strong {
  color: #f4f7f3;
  font-size: 0.84rem;
  font-weight: 650;
  letter-spacing: -0.02em;
}

.proof-client-card .proof-client-button:hover,
.proof-client-card .proof-client-button:focus-visible {
  border-color: rgba(244, 248, 244, 0.74);
  background: rgba(244, 248, 244, 0.13);
  color: #ffffff;
  transform: translateY(-2px);
}

.client-modal.is-open .client-vault-lock-assembly {
  animation: client-vault-lock-body-enter 520ms cubic-bezier(0.16, 1, 0.3, 1) both;
}

.client-modal.is-open .client-vault-lock-shackle {
  animation: client-vault-lock-close 680ms cubic-bezier(0.16, 1, 0.3, 1) 80ms both;
}

.client-modal.is-open .client-vault-lock-indicator {
  animation: client-vault-lock-confirm 540ms ease-out 560ms both;
}

@keyframes client-vault-lock-body-enter {
  from { opacity: 0; transform: translateY(18px) scale(0.92); }
  to { opacity: 1; transform: translateY(0) scale(1); }
}

@keyframes client-vault-lock-close {
  0% { transform: translateY(-22px); }
  70% { transform: translateY(2px); }
  100% { transform: translateY(0); }
}

@keyframes client-vault-lock-confirm {
  0% { opacity: 0; transform: scaleX(0.12); }
  65% { opacity: 1; transform: scaleX(1); }
  100% { opacity: 0.58; transform: scaleX(0.74); }
}

@media (max-width: 620px) {
  .client-modal-card {
    display: block;
    width: min(calc(100vw - 28px), 600px);
    min-height: 0;
    padding: 36px 28px 32px;
  }

  .client-vault-lock-stage {
    min-height: 250px;
    margin: 0 0 34px;
    padding: 24px;
  }

}

@media (prefers-reduced-motion: reduce) {
  .client-modal.is-open .client-vault-lock-assembly,
  .client-modal.is-open .client-vault-lock-shackle,
  .client-modal.is-open .client-vault-lock-indicator {
    animation: none;
    transform: none;
  }
}

.proof-client-card::before,
.proof-client-card::after {
  display: none;
}

.focus-carousel {
  position: relative;
  min-width: 0;
  align-self: end;
  z-index: 1;
}

.focus-carousel-controls {
  position: absolute;
  top: 50%;
  right: 10px;
  z-index: 4;
  display: flex;
  justify-content: flex-end;
  margin: 0;
  transform: translateY(-50%);
}

.focus-carousel-next {
  display: grid;
  width: 38px;
  height: 38px;
  place-items: center;
  border: 1px solid rgba(238, 246, 240, 0.24);
  border-radius: 999px;
  color: #edf2ee;
  background: rgba(2, 3, 2, 0.9);
  backdrop-filter: blur(5px);
  cursor: pointer;
  transition: border-color 220ms ease, background 220ms ease, transform 220ms ease;
}

.focus-carousel-next:hover,
.focus-carousel-next:focus-visible {
  border-color: rgba(255, 255, 255, 0.58);
  color: #ffffff;
  background: rgba(255, 255, 255, 0.08);
  outline: none;
  transform: translateX(2px);
}

.focus-carousel-next:active {
  border-color: rgba(255, 255, 255, 0.72);
  background: rgba(255, 255, 255, 0.14);
}

.focus-carousel-next svg {
  width: 18px;
  height: 18px;
  fill: none;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 1.8;
}

.focus-panels {
  display: flex;
  grid-template-columns: none;
  flex-wrap: nowrap;
  gap: 12px;
  overflow-x: hidden;
  overflow-y: hidden;
  padding-bottom: 0;
  scroll-behavior: smooth;
  overscroll-behavior-x: contain;
  scrollbar-width: none;
}

.focus-panels::-webkit-scrollbar {
  display: none;
  width: 0;
  height: 0;
}

.focus-panels::-webkit-scrollbar-track {
  background: transparent;
}

.focus-panels::-webkit-scrollbar-thumb {
  background: rgba(168, 217, 183, 0.5);
}

.focus-panel {
  flex: 0 0 calc((100% - 12px) / 2);
  min-width: 0;
  min-height: 280px;
  border-right: 1px solid rgba(238, 246, 240, 0.13);
}

.focus-panel h3 {
  margin-top: 48px;
}

.focus-panel + .focus-panel {
  border-top: 0;
}

@media (max-width: 620px) {
  .focus-panel {
    flex-basis: calc((100% - 12px) / 2);
    min-width: 0;
    min-height: 280px;
  }
}

.analyzer-section {
  padding-top: clamp(70px, 7vw, 104px);
  padding-bottom: clamp(76px, 8vw, 112px);
  background:
    radial-gradient(ellipse at 55% 112%, rgba(100, 151, 93, 0.13), transparent 42%),
    linear-gradient(180deg, #000 0%, #020403 69%, #060b07 100%);
}

.analyzer-section::before {
  opacity: 0.28;
}

.analyzer-section::after {
  height: 54%;
  border-top-color: rgba(197, 241, 154, 0.12);
  background: linear-gradient(180deg, rgba(197, 241, 154, 0.026), transparent 72%);
}

.analyzer-heading,
.analyzer-workbench {
  width: min(100%, 1080px);
}

.analyzer-heading {
  grid-template-columns: minmax(165px, 0.48fr) minmax(0, 1.52fr);
  gap: clamp(28px, 5.3vw, 84px);
}

.analyzer-heading h2 {
  max-width: 680px;
  font-size: clamp(2.3rem, 4vw, 4.35rem);
  letter-spacing: -0.082em;
}

.analyzer-heading h2 em {
  color: #b8dda7;
}

.analyzer-heading p {
  max-width: 545px;
  margin-top: 20px;
  color: rgba(225, 235, 226, 0.58);
  font-size: 0.94rem;
  line-height: 1.5;
}

.analyzer-workbench {
  margin-top: clamp(35px, 4.3vw, 54px);
  border-color: rgba(221, 240, 221, 0.18);
  background:
    linear-gradient(145deg, rgba(28, 36, 29, 0.76), rgba(7, 10, 8, 0.96) 42%),
    #080c0a;
  box-shadow: 0 22px 58px rgba(0, 0, 0, 0.34), inset 0 1px rgba(246, 252, 244, 0.055);
}

.analyzer-toolbar,
.analyzer-filter-row,
.analyzer-statusbar {
  min-height: 44px;
}

.analyzer-toolbar {
  background: rgba(17, 23, 18, 0.9);
  font-size: 0.62rem;
}

.analyzer-brandmark i {
  width: 7px;
  height: 7px;
  border-color: rgba(205, 245, 166, 0.82);
  background: rgba(194, 239, 149, 0.1);
  box-shadow: 0 0 11px rgba(188, 246, 109, 0.22);
}

.analyzer-session em,
.analyzer-filter-valid,
.analyzer-filter-hint,
.analyzer-statusbar > strong {
  color: #c3ed9a;
}

.analyzer-session em i,
.analyzer-statusbar > strong i {
  background: #c3ed9a;
  box-shadow: 0 0 0 3px rgba(195, 237, 154, 0.07), 0 0 10px rgba(195, 237, 154, 0.28);
}

.analyzer-filter-row {
  min-height: 50px;
  background: rgba(8, 12, 9, 0.82);
}

.analyzer-filter-input {
  height: 30px;
  border-color: rgba(195, 237, 154, 0.28);
  background: rgba(18, 30, 20, 0.78);
  box-shadow: inset 0 0 0 1px rgba(195, 237, 154, 0.025);
}

.analyzer-filter-input code {
  color: rgba(218, 242, 195, 0.78);
}

.analyzer-filter-cursor {
  height: 13px;
  background: #c3ed9a;
}

.analyzer-filter-button {
  min-height: 30px;
  border-color: rgba(220, 236, 220, 0.18);
  color: rgba(235, 244, 235, 0.62);
}

.analyzer-pane-header {
  min-height: 35px;
  background: rgba(13, 18, 14, 0.54);
}

.analyzer-table-wrap {
  min-height: 270px;
  background: rgba(6, 9, 7, 0.84);
}

.analyzer-packet-table {
  font-size: 0.64rem;
}

.analyzer-packet-table th,
.analyzer-packet-table td {
  padding-right: 9px;
  padding-left: 9px;
}

.analyzer-packet-table th {
  height: 29px;
  font-size: 0.54rem;
}

.analyzer-packet-table td {
  height: 29px;
}

.analyzer-packet-row {
  background: rgba(236, 247, 235, 0.008);
}

.analyzer-packet-row:nth-child(2n) {
  background: rgba(236, 247, 235, 0.021);
}

.analyzer-packet-row-tls {
  background: rgba(113, 180, 133, 0.055);
}

.analyzer-packet-row-dns {
  background: rgba(91, 146, 190, 0.062);
}

.analyzer-packet-row-alert {
  background: rgba(206, 150, 79, 0.095);
}

.analyzer-packet-row-selected {
  background: rgba(72, 133, 154, 0.42) !important;
  box-shadow: inset 3px 0 #9ed4df;
}

.analyzer-protocol {
  font-size: 0.58rem;
}

.analyzer-protocol-tcp { color: #b6d98c; }
.analyzer-protocol-tls { color: #91cbaa; }
.analyzer-protocol-dns { color: #9abfe1; }
.analyzer-protocol-http { color: #dbad6d; }
.analyzer-protocol-ssh { color: #c8b4e1; }

.analyzer-table-scan {
  top: 30px;
  background: linear-gradient(180deg, transparent, rgba(195, 237, 154, 0.55) 46%, transparent);
  box-shadow: 0 0 14px rgba(195, 237, 154, 0.28);
  animation-duration: 8.4s;
}

.analyzer-detail-grid {
  min-height: 170px;
}

.analyzer-tree {
  padding-top: 9px;
  padding-bottom: 11px;
  font-size: 0.66rem;
}

.analyzer-tree li {
  min-height: 27px;
}

.analyzer-tree li > span {
  color: rgba(195, 237, 154, 0.58);
  font-size: 0.78rem;
}

.analyzer-tree small,
.analyzer-bytes-grid,
.analyzer-ascii {
  font-size: 0.58rem;
}

.analyzer-bytes-grid {
  gap: 6px 11px;
  margin-top: 12px;
  margin-bottom: 10px;
  color: rgba(170, 210, 174, 0.7);
}

.analyzer-ascii {
  line-height: 1.65;
}

.analyzer-statusbar {
  min-height: 39px;
  color: rgba(225, 238, 226, 0.3);
  font-size: 0.55rem;
}

@media (max-width: 680px) {
  .analyzer-section {
    padding-top: 64px;
    padding-bottom: 78px;
  }

  .analyzer-heading h2 {
    font-size: clamp(2.15rem, 9.5vw, 3.2rem);
  }

  .analyzer-heading p {
    font-size: 0.9rem;
  }

  .analyzer-workbench {
    margin-top: 32px;
  }

  .analyzer-table-wrap {
    min-height: 254px;
  }
}

.analyzer-workbench.threat-surface {
  min-height: clamp(440px, 48vw, 568px);
  isolation: isolate;
  overflow: hidden;
  border-color: rgba(214, 235, 204, 0.2);
  background: #060806;
  box-shadow: 0 30px 74px rgba(0, 0, 0, 0.43), inset 0 1px rgba(239, 250, 232, 0.06);
}

.threat-surface-image {
  position: absolute;
  z-index: 0;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  opacity: 1;
  filter: saturate(1.12) contrast(1.06) brightness(0.94);
  transform: scale(1.045);
  animation: threat-surface-drift 21s ease-in-out infinite alternate;
  will-change: transform;
}

.threat-surface-shade {
  position: absolute;
  z-index: 1;
  inset: 0;
  background:
    linear-gradient(90deg, rgba(4, 7, 5, 0.79) 0%, rgba(4, 7, 5, 0.57) 31%, rgba(4, 7, 5, 0.17) 58%, rgba(3, 5, 4, 0.04) 100%),
    linear-gradient(0deg, rgba(3, 5, 4, 0.75) 0%, rgba(3, 5, 4, 0.27) 17%, transparent 46%),
    linear-gradient(180deg, rgba(3, 5, 4, 0.34) 0%, transparent 22%);
}

.threat-surface::before {
  position: absolute;
  z-index: 1;
  top: 0;
  bottom: 0;
  left: 0;
  width: 24%;
  background: linear-gradient(90deg, transparent, rgba(199, 244, 125, 0.12), transparent);
  content: "";
  opacity: 0;
  transform: translateX(-160%);
  animation: threat-surface-scan 10s ease-in-out infinite;
  pointer-events: none;
}

.threat-surface > :not(.threat-surface-image):not(.threat-surface-shade) {
  position: absolute;
  z-index: 2;
}

.threat-surface-topbar {
  top: 0;
  right: 0;
  left: 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  min-height: 47px;
  padding: 0 clamp(17px, 2.5vw, 28px);
  border-bottom: 1px solid rgba(223, 240, 216, 0.14);
  color: rgba(233, 241, 230, 0.48);
  font-family: "IBM Plex Mono", "SFMono-Regular", Consolas, monospace;
  font-size: 0.6rem;
  font-weight: 600;
  letter-spacing: 0.13em;
}

.threat-surface-topbar > span:last-child {
  display: flex;
  align-items: center;
  gap: 11px;
  text-align: right;
}

.threat-surface-brand,
.threat-surface-topbar b,
.threat-surface-footer {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

.threat-surface-brand {
  color: rgba(239, 247, 236, 0.78);
}

.threat-surface-brand i,
.threat-surface-topbar b i,
.threat-surface-footer i {
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: #c5f58e;
  box-shadow: 0 0 10px rgba(197, 245, 142, 0.74);
}

.threat-surface-topbar b {
  color: #c6ee9d;
  font-size: 0.56rem;
  letter-spacing: 0.12em;
}

.threat-surface-copy {
  top: clamp(88px, 10vw, 112px);
  left: clamp(20px, 4.4vw, 58px);
  max-width: 360px;
  color: #edf3e9;
}

.threat-surface-copy > span,
.threat-surface-formula > span,
.threat-surface-index > span {
  display: block;
  color: rgba(226, 238, 220, 0.48);
  font-family: "IBM Plex Mono", "SFMono-Regular", Consolas, monospace;
  font-size: 0.6rem;
  font-weight: 600;
  letter-spacing: 0.15em;
}

.threat-surface-copy h3 {
  margin: 11px 0 0;
  font-size: clamp(2rem, 3.5vw, 3.35rem);
  font-weight: 430;
  letter-spacing: -0.065em;
  line-height: 0.92;
}

.threat-surface-copy h3 em {
  color: #c8f291;
  font-family: Georgia, "Times New Roman", serif;
  font-weight: 400;
}

.threat-surface-index {
  top: clamp(87px, 9.8vw, 110px);
  right: clamp(20px, 4.4vw, 56px);
  min-width: 112px;
  padding-left: 16px;
  border-left: 1px solid rgba(216, 235, 204, 0.34);
  text-align: left;
}

.threat-surface-index strong {
  display: block;
  margin-top: 5px;
  color: rgba(244, 247, 238, 0.92);
  font-family: "IBM Plex Mono", "SFMono-Regular", Consolas, monospace;
  font-size: clamp(2.2rem, 4vw, 3.55rem);
  font-weight: 400;
  letter-spacing: -0.1em;
  line-height: 1;
}

.threat-surface-index strong small {
  color: #c5ef93;
  font-size: 0.48em;
}

.threat-surface-index em {
  display: block;
  margin-top: 7px;
  color: #c7ee98;
  font-family: "IBM Plex Mono", "SFMono-Regular", Consolas, monospace;
  font-size: 0.58rem;
  font-style: normal;
  letter-spacing: 0.03em;
}

.threat-surface-index em i {
  color: rgba(230, 239, 226, 0.43);
  font-style: normal;
}

.threat-surface-formula {
  bottom: 73px;
  left: clamp(20px, 4.4vw, 58px);
  padding: 12px 16px 13px;
  border: 1px solid rgba(218, 239, 206, 0.16);
  border-left-color: rgba(199, 242, 145, 0.52);
  background: rgba(7, 10, 8, 0.58);
  backdrop-filter: blur(6px);
}

.threat-surface-formula code {
  display: block;
  margin-top: 7px;
  color: rgba(237, 247, 230, 0.9);
  font-family: "IBM Plex Mono", "SFMono-Regular", Consolas, monospace;
  font-size: clamp(1.05rem, 1.5vw, 1.35rem);
  letter-spacing: -0.05em;
}

.threat-surface-formula p {
  margin: 7px 0 0;
  color: rgba(225, 237, 219, 0.4);
  font-family: "IBM Plex Mono", "SFMono-Regular", Consolas, monospace;
  font-size: 0.55rem;
  letter-spacing: 0.035em;
}

.threat-surface-observations {
  right: clamp(20px, 4.4vw, 56px);
  bottom: 70px;
  width: min(270px, 34%);
  margin: 0;
  padding: 0;
  list-style: none;
}

.threat-surface-observations li {
  display: grid;
  grid-template-columns: 28px minmax(0, 1fr);
  gap: 10px;
  align-items: baseline;
  min-height: 34px;
  border-top: 1px solid rgba(225, 240, 218, 0.18);
  color: rgba(230, 240, 225, 0.66);
  font-family: "IBM Plex Mono", "SFMono-Regular", Consolas, monospace;
}

.threat-surface-observations li:last-child {
  border-bottom: 1px solid rgba(225, 240, 218, 0.18);
}

.threat-surface-observations li > span {
  padding-top: 10px;
  color: rgba(202, 242, 149, 0.66);
  font-size: 0.58rem;
}

.threat-surface-observations p {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
  margin: 0;
  padding-top: 9px;
  font-size: 0.59rem;
  letter-spacing: 0.075em;
  white-space: nowrap;
}

.threat-surface-observations b {
  color: #edf5e9;
  font-size: 0.72rem;
  font-weight: 500;
  letter-spacing: -0.03em;
}

.threat-surface-footer {
  right: 0;
  bottom: 0;
  left: 0;
  justify-content: space-between;
  min-height: 43px;
  padding: 0 clamp(17px, 2.5vw, 28px);
  border-top: 1px solid rgba(224, 240, 216, 0.14);
  background: rgba(4, 6, 5, 0.68);
  color: rgba(228, 238, 223, 0.42);
  font-family: "IBM Plex Mono", "SFMono-Regular", Consolas, monospace;
  font-size: 0.55rem;
  font-weight: 600;
  letter-spacing: 0.12em;
}

.threat-surface-footer > span:nth-child(2) {
  color: rgba(204, 239, 158, 0.86);
}

@keyframes threat-surface-drift {
  0% { transform: scale(1.045) translate3d(-0.45%, 0.2%, 0); }
  100% { transform: scale(1.085) translate3d(0.7%, -0.5%, 0); }
}

@keyframes threat-surface-scan {
  0%, 18% { opacity: 0; transform: translateX(-160%); }
  28% { opacity: 0.7; }
  56% { opacity: 0.24; }
  74%, 100% { opacity: 0; transform: translateX(620%); }
}

@media (max-width: 720px) {
  .analyzer-workbench.threat-surface {
    min-height: 568px;
  }

  .threat-surface-image {
    object-position: 64% center;
  }

  .threat-surface-topbar {
    min-height: 43px;
    font-size: 0.53rem;
  }

  .threat-surface-topbar > span:last-child {
    display: none;
  }

  .threat-surface-copy {
    top: 76px;
    left: 20px;
    max-width: 238px;
  }

  .threat-surface-copy h3 {
    font-size: clamp(2.25rem, 10vw, 3rem);
  }

  .threat-surface-index {
    top: 85px;
    right: 20px;
    min-width: 79px;
    padding-left: 10px;
  }

  .threat-surface-index > span {
    font-size: 0.5rem;
  }

  .threat-surface-index strong {
    font-size: 2.35rem;
  }

  .threat-surface-formula {
    right: 20px;
    bottom: 162px;
    left: 20px;
  }

  .threat-surface-observations {
    right: 20px;
    bottom: 60px;
    left: 20px;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    width: auto;
  }

  .threat-surface-observations li {
    display: block;
    min-height: 52px;
    padding: 0 8px;
    border-bottom: 1px solid rgba(225, 240, 218, 0.18);
  }

  .threat-surface-observations li:first-child {
    padding-left: 0;
  }

  .threat-surface-observations li:last-child {
    padding-right: 0;
  }

  .threat-surface-observations p {
    display: block;
    padding-top: 3px;
    font-size: 0.48rem;
    line-height: 1.45;
    white-space: normal;
  }

  .threat-surface-observations b {
    display: block;
    margin-top: 2px;
    font-size: 0.7rem;
  }

  .threat-surface-observations li > span {
    padding-top: 7px;
  }

  .threat-surface-footer {
    min-height: 39px;
    font-size: 0.47rem;
  }

  .threat-surface-footer > span:last-child {
    display: none;
  }
}

@media (prefers-reduced-motion: reduce) {
  .threat-surface-image,
  .threat-surface::before {
    animation: none;
  }
}

.analyzer-topology-pane {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  background: #080b08;
}

.analyzer-topology-image {
  position: absolute;
  z-index: 0;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 63% center;
  opacity: 1;
  filter: none;
  transform: scale(1.04);
  animation: analyzer-topology-drift 18s ease-in-out infinite alternate;
  will-change: transform;
}

.analyzer-topology-pane::before {
  position: absolute;
  z-index: 1;
  inset: 0;
  background:
    linear-gradient(90deg, rgba(4, 7, 5, 0.54) 0%, rgba(4, 7, 5, 0.16) 66%, rgba(4, 7, 5, 0.03) 100%),
    linear-gradient(0deg, rgba(4, 7, 5, 0.44), transparent 58%);
  content: "";
  pointer-events: none;
}

.analyzer-topology-pane .analyzer-pane-header,
.analyzer-topology-pane .analyzer-bytes-grid,
.analyzer-topology-pane .analyzer-ascii {
  position: relative;
  z-index: 2;
}

.analyzer-topology-pane .analyzer-pane-header {
  background: rgba(7, 10, 8, 0.42);
}

.analyzer-topology-pane .analyzer-bytes-grid {
  color: rgba(236, 250, 223, 0.92);
  text-shadow: 0 1px 8px rgba(0, 0, 0, 0.88);
}

.analyzer-topology-pane .analyzer-ascii {
  color: rgba(240, 249, 234, 0.84);
  text-shadow: 0 1px 9px rgba(0, 0, 0, 0.9);
}

@keyframes analyzer-topology-drift {
  0% { transform: scale(1.04) translate3d(-0.4%, 0.3%, 0); }
  100% { transform: scale(1.085) translate3d(0.5%, -0.45%, 0); }
}

@media (prefers-reduced-motion: reduce) {
  .analyzer-topology-image {
    animation: none;
  }
}

.beam-analysis-section {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  padding: clamp(76px, 8vw, 118px) clamp(22px, 7.2vw, 116px) clamp(84px, 9vw, 128px);
  border-top: 1px solid rgba(225, 245, 216, 0.1);
  background:
    radial-gradient(ellipse at 50% 76%, rgba(63, 105, 53, 0.13), transparent 38%),
    linear-gradient(180deg, #020403 0%, #050906 58%, #010201 100%);
}

.beam-analysis-section::before {
  position: absolute;
  z-index: -1;
  inset: 0;
  background:
    linear-gradient(90deg, rgba(225, 245, 216, 0.025) 1px, transparent 1px) 0 0 / 130px 100%,
    linear-gradient(rgba(225, 245, 216, 0.016) 1px, transparent 1px) 0 0 / 100% 130px;
  content: "";
  opacity: 0.58;
}

.beam-analysis-heading,
.beam-network {
  width: min(100%, 1080px);
  margin-right: auto;
  margin-left: auto;
}

.beam-analysis-heading {
  display: grid;
  grid-template-columns: minmax(165px, 0.48fr) minmax(0, 1.52fr);
  gap: clamp(28px, 5vw, 76px);
  align-items: start;
}

.beam-analysis-heading h2 {
  margin: 0;
  color: #f0f4ed;
  font-size: clamp(2.3rem, 4.55vw, 4.35rem);
  font-weight: 400;
  letter-spacing: -0.078em;
  line-height: 0.88;
}

.beam-analysis-heading h2 em {
  color: #c9f095;
  font-family: Georgia, "Times New Roman", serif;
  font-weight: 400;
}

.beam-analysis-heading p {
  max-width: 570px;
  margin: 20px 0 0;
  color: rgba(225, 235, 226, 0.58);
  font-size: 0.94rem;
  line-height: 1.5;
}

.beam-network {
  position: relative;
  min-height: clamp(480px, 50vw, 590px);
  margin-top: clamp(38px, 4.5vw, 56px);
  isolation: isolate;
  overflow: hidden;
  border: 1px solid rgba(221, 240, 221, 0.18);
  background:
    radial-gradient(circle at 50% 50%, rgba(116, 173, 81, 0.13), transparent 19%),
    linear-gradient(140deg, rgba(21, 31, 22, 0.76), rgba(5, 8, 6, 0.96) 46%),
    #060806;
  box-shadow: 0 26px 62px rgba(0, 0, 0, 0.36), inset 0 1px rgba(246, 252, 244, 0.05);
}

.beam-network::before {
  position: absolute;
  z-index: 0;
  inset: 0;
  background:
    linear-gradient(90deg, rgba(226, 245, 218, 0.03) 1px, transparent 1px) 0 0 / 48px 100%,
    linear-gradient(rgba(226, 245, 218, 0.025) 1px, transparent 1px) 0 0 / 100% 48px;
  content: "";
  opacity: 0.65;
  mask-image: linear-gradient(90deg, transparent, #000 14%, #000 86%, transparent);
}

.beam-network::after {
  position: absolute;
  z-index: 0;
  inset: 0;
  border: 1px solid rgba(220, 244, 202, 0.05);
  content: "";
  pointer-events: none;
}

.beam-network-topline,
.beam-network-caption {
  position: absolute;
  right: 0;
  left: 0;
  z-index: 4;
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 43px;
  padding: 0 clamp(16px, 2.2vw, 25px);
  color: rgba(229, 239, 224, 0.43);
  font-family: "IBM Plex Mono", "SFMono-Regular", Consolas, monospace;
  font-size: 0.55rem;
  font-weight: 600;
  letter-spacing: 0.13em;
}

.beam-network-topline {
  top: 0;
  border-bottom: 1px solid rgba(225, 245, 216, 0.11);
  background: rgba(9, 13, 10, 0.52);
}

.beam-network-caption {
  bottom: 0;
  gap: 18px;
  border-top: 1px solid rgba(225, 245, 216, 0.11);
  background: rgba(5, 8, 6, 0.6);
}

.beam-network-caption > span:first-child {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: rgba(201, 240, 149, 0.9);
}

.beam-network-caption i {
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: #c5f58e;
  box-shadow: 0 0 10px rgba(197, 245, 142, 0.74);
}

.beam-network-svg {
  position: absolute;
  z-index: 1;
  top: 43px;
  right: 0;
  bottom: 43px;
  left: 0;
  width: 100%;
  height: calc(100% - 86px);
  overflow: visible;
  pointer-events: none;
}

.beam-network-path {
  fill: none;
  stroke: url(#beamLineGradient);
  stroke-width: 1.2;
  stroke-dasharray: 2 9;
  opacity: 0.92;
}

.beam-network-pulse {
  fill: #d4f8a9;
  filter: drop-shadow(0 0 6px rgba(200, 245, 137, 0.95));
}

.beam-network-pulse-slow {
  fill: #f0d99a;
}

.beam-node {
  position: absolute;
  z-index: 2;
  display: grid;
  width: clamp(82px, 11vw, 126px);
  min-height: clamp(64px, 7vw, 76px);
  align-content: center;
  justify-items: start;
  padding: 10px 11px;
  border: 1px solid rgba(220, 240, 208, 0.22);
  background: rgba(10, 15, 11, 0.76);
  box-shadow: 0 11px 24px rgba(0, 0, 0, 0.22), inset 0 1px rgba(235, 248, 226, 0.045);
  color: rgba(238, 245, 235, 0.86);
  font-family: "IBM Plex Mono", "SFMono-Regular", Consolas, monospace;
  transform: translate(-50%, -50%);
}

.beam-node::before {
  position: absolute;
  top: -1px;
  left: -1px;
  width: 20px;
  height: 1px;
  background: #c7f292;
  content: "";
}

.beam-node > span {
  color: rgba(201, 240, 149, 0.6);
  font-size: 0.52rem;
  letter-spacing: 0.11em;
}

.beam-node strong {
  margin-top: 5px;
  font-size: clamp(0.7rem, 1vw, 0.82rem);
  font-weight: 600;
  letter-spacing: 0.035em;
}

.beam-node small {
  margin-top: 4px;
  color: rgba(228, 238, 223, 0.45);
  font-size: 0.49rem;
  letter-spacing: 0.01em;
}

.beam-node-core {
  top: 50%;
  left: 50%;
  z-index: 3;
  display: grid;
  width: clamp(126px, 16vw, 164px);
  height: clamp(126px, 16vw, 164px);
  place-items: center;
  border: 1px solid rgba(214, 244, 181, 0.34);
  border-radius: 50%;
  background: rgba(7, 11, 8, 0.78);
  box-shadow: 0 0 0 8px rgba(188, 246, 109, 0.035), 0 0 42px rgba(133, 206, 91, 0.14), inset 0 0 26px rgba(188, 246, 109, 0.045);
  transform: translate(-50%, -50%);
}

.beam-node-core-ring {
  position: absolute;
  inset: 8px;
  border: 1px dashed rgba(204, 239, 158, 0.25);
  border-radius: inherit;
  animation: beam-core-rotate 24s linear infinite;
}

.beam-node-core img {
  position: relative;
  z-index: 1;
  width: 58%;
  height: auto;
  object-fit: contain;
  filter: drop-shadow(0 7px 15px rgba(0, 0, 0, 0.5));
}

.beam-node-core-label,
.beam-node-core > strong {
  position: absolute;
  z-index: 2;
  right: 0;
  left: 0;
  color: rgba(231, 243, 224, 0.55);
  font-family: "IBM Plex Mono", "SFMono-Regular", Consolas, monospace;
  font-size: 0.47rem;
  font-weight: 600;
  letter-spacing: 0.12em;
  text-align: center;
}

.beam-node-core-label { bottom: 20px; }

.beam-node-core > strong {
  bottom: 9px;
  color: #c9f098;
  font-size: 0.48rem;
}

.beam-node-sqli { top: 24%; left: 17%; }
.beam-node-dns { top: 50%; left: 11%; }
.beam-node-xss { top: 76%; left: 17%; }
.beam-node-ports { top: 24%; left: 83%; }
.beam-node-auth { top: 50%; left: 89%; }
.beam-node-api { top: 76%; left: 83%; }

@keyframes beam-core-rotate {
  to { transform: rotate(360deg); }
}

@media (max-width: 720px) {
  .beam-analysis-section {
    padding-top: 64px;
    padding-bottom: 78px;
  }

  .beam-analysis-heading {
    grid-template-columns: 1fr;
    gap: 20px;
  }

  .beam-analysis-heading h2 {
    font-size: clamp(2.15rem, 9.5vw, 3.2rem);
  }

  .beam-analysis-heading p {
    font-size: 0.9rem;
  }

  .beam-network {
    min-height: 470px;
    margin-top: 32px;
  }

  .beam-network-topline,
  .beam-network-caption {
    padding-right: 13px;
    padding-left: 13px;
    font-size: 0.46rem;
  }

  .beam-network-topline > span:last-child,
  .beam-network-caption > span:nth-child(2) {
    display: none;
  }

  .beam-network-caption {
    justify-content: space-between;
  }

  .beam-node {
    width: 74px;
    min-height: 56px;
    padding: 7px 8px;
  }

  .beam-node strong { font-size: 0.6rem; }
  .beam-node small { display: none; }
  .beam-node > span { font-size: 0.46rem; }

  .beam-node-core {
    width: 112px;
    height: 112px;
  }

  .beam-node-core-label { bottom: 17px; font-size: 0.4rem; }
  .beam-node-core > strong { bottom: 8px; font-size: 0.4rem; }

  .beam-node-sqli { left: 20%; }
  .beam-node-dns { left: 12%; }
  .beam-node-xss { left: 20%; }
  .beam-node-ports { left: 80%; }
  .beam-node-auth { left: 88%; }
  .beam-node-api { left: 80%; }
}

.radar-analysis-layout {
  display: grid;
  grid-template-columns: minmax(250px, 0.66fr) minmax(0, 1.34fr);
  gap: clamp(28px, 4.5vw, 70px);
  align-items: center;
  width: min(100%, 1080px);
  margin: 0 auto;
}

.radar-analysis-layout > .beam-analysis-heading {
  display: block;
  width: auto;
  margin: 0;
}

.radar-analysis-layout .section-marker {
  margin-bottom: 30px;
}

.radar-analysis-layout .beam-analysis-heading h2 {
  font-size: clamp(2.2rem, 3.35vw, 3.15rem);
}

.radar-analysis-layout .beam-analysis-heading p {
  max-width: 355px;
}

.radar-analysis-figure {
  min-height: clamp(345px, 34vw, 410px);
  width: min(100%, 640px);
  margin: 0 0 0 auto;
  overflow: visible;
  border: 0;
  background: none;
  box-shadow: none;
}

.radar-analysis-figure::before {
  display: none;
}

.radar-analysis-svg {
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 100%;
  transform: none;
}

.radar-analysis-core {
  width: 98px;
  height: 98px;
}

.radar-analysis-core img {
  width: 78%;
  filter: none !important;
}

.radar-analysis-core span {
  display: none;
}

@media (max-width: 720px) {
  .radar-analysis-layout {
    grid-template-columns: 1fr;
    gap: 30px;
  }

  .radar-analysis-layout .section-marker {
    margin-bottom: 19px;
  }

  .radar-analysis-layout .beam-analysis-heading h2 {
    font-size: clamp(2.05rem, 9vw, 2.8rem);
  }

  .radar-analysis-figure {
    min-height: 330px;
    width: min(100%, 490px);
    margin-right: auto;
    margin-left: auto;
  }

  .radar-analysis-core {
    width: 74px;
    height: 74px;
  }
}

.radar-analysis-tag-sqli { top: 17% !important; left: 50% !important; }
.radar-analysis-tag-ports { top: 34% !important; left: 74% !important; }
.radar-analysis-tag-auth { top: 66% !important; left: 74% !important; }
.radar-analysis-tag-api { top: 82% !important; left: 50% !important; }
.radar-analysis-tag-xss { top: 66% !important; left: 26% !important; }
.radar-analysis-tag-dns { top: 34% !important; left: 26% !important; }

@media (max-width: 720px) {
  .radar-analysis-tag-ports,
  .radar-analysis-tag-auth { left: 75% !important; }

  .radar-analysis-tag-xss,
  .radar-analysis-tag-dns { left: 25% !important; }
}

.capability-tree-section {
  position: relative;
  overflow: hidden;
  padding: clamp(92px, 11vw, 142px) max(24px, calc((100vw - 1140px) / 2)) clamp(104px, 11vw, 150px);
  color: #edf1eb;
  background:
    radial-gradient(ellipse 45% 45% at 50% 57%, rgba(244, 247, 240, 0.045), transparent 72%),
    linear-gradient(180deg, #050706 0%, #020302 52%, #000 100%);
}

.capability-tree-section::before {
  position: absolute;
  inset: 0;
  pointer-events: none;
  content: "";
  opacity: 0.32;
  background-image:
    linear-gradient(rgba(242, 245, 239, 0.026) 1px, transparent 1px),
    linear-gradient(90deg, rgba(242, 245, 239, 0.016) 1px, transparent 1px);
  background-size: 100% 5px, 5px 100%;
  mask-image: radial-gradient(ellipse 74% 64% at 50% 53%, black, transparent 88%);
}

.capability-tree-heading {
  position: relative;
  z-index: 1;
  width: min(100%, 1140px);
  margin: 0 auto 42px;
}

.capability-tree-heading .section-marker {
  margin-bottom: 24px;
}

.capability-tree-heading h2 {
  max-width: 600px;
  margin: 0;
  color: #f1f4ef;
  font-family: "Inter Variable", "Inter", sans-serif;
  font-size: clamp(2.5rem, 4.2vw, 4.25rem);
  font-style: normal;
  font-weight: 520;
  letter-spacing: -0.085em;
  line-height: 0.87;
}

.capability-tree-heading h2 em {
  color: rgba(241, 244, 239, 0.58);
  font: inherit;
}

.capability-tree-heading p {
  max-width: 450px;
  margin: 24px 0 0;
  color: rgba(225, 230, 223, 0.55);
  font-family: "Inter Variable", "Inter", sans-serif;
  font-size: 0.88rem;
  line-height: 1.62;
}

.capability-tree-stage {
  position: relative;
  isolation: isolate;
  width: min(100%, 1140px);
  min-height: clamp(570px, 54vw, 660px);
  margin: 0 auto;
  overflow: hidden;
  border-top: 1px solid rgba(239, 244, 237, 0.09);
  border-bottom: 1px solid rgba(239, 244, 237, 0.07);
  cursor: pointer;
}

.capability-tree-stage::before,
.capability-tree-stage::after {
  position: absolute;
  z-index: 0;
  width: 42px;
  height: 42px;
  border: 1px solid rgba(237, 241, 234, 0.2);
  content: "";
}

.capability-tree-stage::before {
  top: -1px;
  left: -1px;
  border-right: 0;
  border-bottom: 0;
}

.capability-tree-stage::after {
  right: -1px;
  bottom: -1px;
  border-top: 0;
  border-left: 0;
}

.capability-tree-canvas {
  position: absolute;
  z-index: 1;
  inset: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
}

.capability-tree-core {
  position: absolute;
  z-index: 3;
  top: 52%;
  left: 50%;
  display: grid;
  width: clamp(112px, 12vw, 148px);
  aspect-ratio: 1;
  transform: translate(-50%, -50%);
  place-items: center;
}

.capability-tree-core::before,
.capability-tree-core::after,
.capability-tree-core-ring {
  position: absolute;
  border: 1px solid rgba(239, 244, 237, 0.24);
  border-radius: 50%;
  content: "";
}

.capability-tree-core::before {
  inset: 4%;
  border-color: rgba(239, 244, 237, 0.15);
}

.capability-tree-core::after {
  inset: 16%;
  border-color: rgba(239, 244, 237, 0.2);
}

.capability-tree-core-ring {
  inset: -17%;
  opacity: 0.56;
  border-style: dashed;
  border-color: rgba(239, 244, 237, 0.16);
  animation: capability-tree-orbit 28s linear infinite;
}

.capability-tree-core img {
  position: relative;
  z-index: 1;
  width: 46%;
  height: auto;
  filter: none !important;
}

.capability-tree-core > span:last-child {
  position: absolute;
  top: calc(100% + 13px);
  left: 50%;
  z-index: 2;
  width: max-content;
  transform: translateX(-50%);
  color: rgba(230, 236, 229, 0.46);
  font-family: "Inter Variable", "Inter", sans-serif;
  font-size: 0.48rem;
  font-weight: 650;
  letter-spacing: 0.09em;
  white-space: nowrap;
}

.capability-tree-branches {
  position: absolute;
  z-index: 2;
  inset: 0;
  padding: 0;
  margin: 0;
  list-style: none;
}

.capability-tree-branch {
  position: absolute;
  width: max-content;
  max-width: 190px;
  padding: 10px 0 10px 15px;
  border-left: 1px solid rgba(238, 242, 235, 0.38);
  opacity: 0;
  color: #edf1eb;
  font-family: "Inter Variable", "Inter", sans-serif;
  transform: translateY(7px);
  transition: opacity 480ms ease, transform 480ms cubic-bezier(0.16, 1, 0.3, 1);
}

.capability-tree-stage.is-grown .capability-tree-branch {
  opacity: 1;
  transform: translateY(0);
}

.capability-tree-stage.is-grown .capability-tree-branch:nth-child(2) { transition-delay: 70ms; }
.capability-tree-stage.is-grown .capability-tree-branch:nth-child(3) { transition-delay: 140ms; }
.capability-tree-stage.is-grown .capability-tree-branch:nth-child(4) { transition-delay: 210ms; }
.capability-tree-stage.is-grown .capability-tree-branch:nth-child(5) { transition-delay: 280ms; }
.capability-tree-stage.is-grown .capability-tree-branch:nth-child(6) { transition-delay: 350ms; }

.capability-tree-branch::before {
  position: absolute;
  top: 17px;
  left: -3px;
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: #f1f4ef;
  box-shadow: 0 0 13px rgba(241, 244, 239, 0.35);
  content: "";
}

.capability-tree-branch > span,
.capability-tree-branch strong,
.capability-tree-branch small {
  display: block;
}

.capability-tree-branch > span {
  color: rgba(224, 230, 222, 0.42);
  font-size: 0.52rem;
  font-weight: 650;
  letter-spacing: 0.075em;
}

.capability-tree-branch strong {
  margin-top: 4px;
  color: rgba(247, 249, 244, 0.94);
  font-size: clamp(0.88rem, 1.18vw, 1.05rem);
  font-weight: 560;
  letter-spacing: -0.035em;
}

.capability-tree-branch small {
  margin-top: 4px;
  color: rgba(222, 229, 220, 0.5);
  font-size: 0.58rem;
  font-weight: 500;
  letter-spacing: 0.01em;
}

.capability-tree-branch-web { top: 12%; left: 12%; }
.capability-tree-branch-api { top: 42%; left: 2%; }
.capability-tree-branch-infra { bottom: 10%; left: 17%; }
.capability-tree-branch-redteam { top: 12%; right: 11%; }
.capability-tree-branch-cloud { top: 43%; right: 0; }
.capability-tree-branch-ddos { right: 17%; bottom: 10%; }

.capability-tree-hint {
  position: absolute;
  z-index: 2;
  bottom: 15px;
  left: 50%;
  color: rgba(226, 232, 224, 0.28);
  font-family: "Inter Variable", "Inter", sans-serif;
  font-size: 0.48rem;
  font-weight: 640;
  letter-spacing: 0.08em;
  transform: translateX(-50%);
  white-space: nowrap;
}

@keyframes capability-tree-orbit {
  to { transform: rotate(360deg); }
}

@media (max-width: 760px) {
  .capability-tree-section {
    padding-right: 19px;
    padding-left: 19px;
  }

  .capability-tree-stage {
    min-height: 675px;
  }

  .capability-tree-core {
    top: 50%;
    width: 100px;
  }

  .capability-tree-branch {
    max-width: 134px;
    padding-top: 7px;
    padding-bottom: 7px;
    padding-left: 10px;
  }

  .capability-tree-branch > span { font-size: 0.43rem; }
  .capability-tree-branch strong { font-size: 0.76rem; }
  .capability-tree-branch small { max-width: 118px; font-size: 0.49rem; line-height: 1.35; }
  .capability-tree-branch::before { top: 13px; }

  .capability-tree-branch-web { top: 8%; left: 4%; }
  .capability-tree-branch-api { top: 31%; left: 0; }
  .capability-tree-branch-infra { bottom: 13%; left: 5%; }
  .capability-tree-branch-redteam { top: 8%; right: 0; }
  .capability-tree-branch-cloud { top: 31%; right: -1%; }
  .capability-tree-branch-ddos { right: 4%; bottom: 13%; }

  .capability-tree-hint { bottom: 11px; font-size: 0.4rem; }
}

@media (prefers-reduced-motion: reduce) {
  .capability-tree-core-ring { animation: none; }
}

.octopus-specialties-section {
  position: relative;
  overflow: hidden;
  padding: clamp(92px, 11vw, 142px) max(24px, calc((100vw - 1140px) / 2)) clamp(104px, 11vw, 150px);
  color: #edf1eb;
  background: #000;
}

.octopus-specialties-heading {
  position: relative;
  z-index: 1;
  width: min(100%, 1140px);
  margin: 0 auto 42px;
}

.octopus-specialties-heading .section-marker {
  margin-bottom: 24px;
}

.octopus-specialties-heading h2 {
  max-width: 620px;
  margin: 0;
  color: #f1f4ef;
  font-family: "Inter Variable", "Inter", sans-serif;
  font-size: clamp(2.5rem, 4.2vw, 4.25rem);
  font-style: normal;
  font-weight: 520;
  letter-spacing: -0.085em;
  line-height: 0.87;
}

.octopus-specialties-heading h2 em {
  color: rgba(241, 244, 239, 0.58);
  font: inherit;
}

.octopus-specialties-heading p {
  max-width: 468px;
  margin: 24px 0 0;
  color: rgba(225, 230, 223, 0.55);
  font-family: "Inter Variable", "Inter", sans-serif;
  font-size: 0.88rem;
  line-height: 1.62;
}

.octopus-specialties-stage {
  position: relative;
  width: min(100%, 1140px);
  min-height: clamp(560px, 53vw, 665px);
  margin: 0 auto;
  overflow: hidden;
  border-top: 1px solid rgba(239, 244, 237, 0.1);
  border-bottom: 1px solid rgba(239, 244, 237, 0.08);
}

.octopus-specialties-stage::before {
  position: absolute;
  inset: 0;
  pointer-events: none;
  content: "";
  opacity: 0.28;
  background-image: linear-gradient(rgba(237, 242, 234, 0.024) 1px, transparent 1px);
  background-size: 100% 5px;
  mask-image: radial-gradient(ellipse 70% 68% at 50% 51%, black, transparent 90%);
}

.octopus-specialties-logo {
  position: absolute;
  z-index: 1;
  top: 51%;
  left: 50%;
  display: block;
  width: min(62%, 680px);
  height: auto;
  transform: translate(-50%, -50%) scale(0.96);
  transform-origin: center;
  filter: none !important;
  opacity: 0;
  transition: opacity 780ms ease, transform 950ms cubic-bezier(0.16, 1, 0.3, 1);
}

.octopus-specialties-section.is-visible .octopus-specialties-logo {
  opacity: 1;
  transform: translate(-50%, -50%) scale(1);
}

.octopus-specialties-list {
  position: absolute;
  z-index: 2;
  inset: 0;
  padding: 0;
  margin: 0;
  list-style: none;
}

.octopus-specialty {
  position: absolute;
  width: max-content;
  max-width: 190px;
  color: #edf1eb;
  font-family: "Inter Variable", "Inter", sans-serif;
  opacity: 0;
  transform: translateY(8px);
  transition: opacity 420ms ease, transform 560ms cubic-bezier(0.16, 1, 0.3, 1);
}

.octopus-specialties-section.is-visible .octopus-specialty {
  opacity: 1;
  transform: translateY(0);
}

.octopus-specialties-section.is-visible .octopus-specialty-api { transition-delay: 70ms; }
.octopus-specialties-section.is-visible .octopus-specialty-infra { transition-delay: 140ms; }
.octopus-specialties-section.is-visible .octopus-specialty-redteam { transition-delay: 210ms; }
.octopus-specialties-section.is-visible .octopus-specialty-cloud { transition-delay: 280ms; }
.octopus-specialties-section.is-visible .octopus-specialty-ddos { transition-delay: 350ms; }

.octopus-specialty::before {
  position: absolute;
  top: 17px;
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: #f0f4ed;
  box-shadow: 0 0 12px rgba(240, 244, 237, 0.3);
  content: "";
}

.octopus-specialty::after {
  position: absolute;
  top: 19px;
  width: clamp(34px, 4.5vw, 58px);
  height: 1px;
  background: linear-gradient(90deg, rgba(239, 244, 237, 0.42), rgba(239, 244, 237, 0.04));
  content: "";
}

.octopus-specialty > span,
.octopus-specialty strong,
.octopus-specialty small {
  display: block;
}

.octopus-specialty > span {
  color: rgba(224, 230, 222, 0.45);
  font-size: 0.52rem;
  font-weight: 650;
  letter-spacing: 0.075em;
}

.octopus-specialty strong {
  margin-top: 4px;
  color: rgba(247, 249, 244, 0.96);
  font-size: clamp(0.9rem, 1.18vw, 1.06rem);
  font-weight: 560;
  letter-spacing: -0.035em;
}

.octopus-specialty small {
  margin-top: 4px;
  color: rgba(222, 229, 220, 0.52);
  font-size: 0.58rem;
  font-weight: 500;
  letter-spacing: 0.01em;
}

.octopus-specialty-web,
.octopus-specialty-api,
.octopus-specialty-infra {
  padding-left: 14px;
  border-left: 1px solid rgba(238, 242, 235, 0.36);
  text-align: left;
}

.octopus-specialty-web::before,
.octopus-specialty-api::before,
.octopus-specialty-infra::before { left: -3px; }
.octopus-specialty-web::after,
.octopus-specialty-api::after,
.octopus-specialty-infra::after { left: 100%; }

.octopus-specialty-redteam,
.octopus-specialty-cloud,
.octopus-specialty-ddos {
  padding-right: 14px;
  border-right: 1px solid rgba(238, 242, 235, 0.36);
  text-align: right;
}

.octopus-specialty-redteam::before,
.octopus-specialty-cloud::before,
.octopus-specialty-ddos::before { right: -3px; }
.octopus-specialty-redteam::after,
.octopus-specialty-cloud::after,
.octopus-specialty-ddos::after {
  right: 100%;
  background: linear-gradient(90deg, rgba(239, 244, 237, 0.04), rgba(239, 244, 237, 0.42));
}

.octopus-specialty-web { top: 20%; left: 5%; }
.octopus-specialty-api { top: 49%; left: 0; }
.octopus-specialty-infra { bottom: 13%; left: 15%; }
.octopus-specialty-redteam { top: 20%; right: 5%; }
.octopus-specialty-cloud { top: 49%; right: 0; }
.octopus-specialty-ddos { right: 15%; bottom: 13%; }

@media (max-width: 760px) {
  .octopus-specialties-section {
    padding-right: 19px;
    padding-left: 19px;
  }

  .octopus-specialties-stage {
    display: flex;
    min-height: 0;
    padding: 21px 0 24px;
    flex-direction: column;
    align-items: center;
  }

  .octopus-specialties-stage::before { display: none; }

  .octopus-specialties-logo {
    position: relative;
    top: auto;
    left: auto;
    width: min(100%, 420px);
    margin-bottom: 23px;
    transform: scale(0.96);
  }

  .octopus-specialties-section.is-visible .octopus-specialties-logo {
    transform: scale(1);
  }

  .octopus-specialties-list {
    position: relative;
    display: grid;
    width: 100%;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0;
    inset: auto;
  }

  .octopus-specialty,
  .octopus-specialty-web,
  .octopus-specialty-api,
  .octopus-specialty-infra,
  .octopus-specialty-redteam,
  .octopus-specialty-cloud,
  .octopus-specialty-ddos {
    position: relative;
    top: auto;
    right: auto;
    bottom: auto;
    left: auto;
    width: auto;
    max-width: none;
    min-height: 86px;
    padding: 13px 10px 13px 12px;
    border-top: 1px solid rgba(239, 244, 237, 0.1);
    border-right: 0;
    border-bottom: 0;
    border-left: 1px solid rgba(239, 244, 237, 0.1);
    text-align: left;
  }

  .octopus-specialty:nth-child(odd) { border-left: 0; }
  .octopus-specialty::before,
  .octopus-specialty::after { display: none; }
  .octopus-specialty > span { font-size: 0.44rem; }
  .octopus-specialty strong { font-size: 0.76rem; }
  .octopus-specialty small { font-size: 0.49rem; line-height: 1.35; }
}

@media (prefers-reduced-motion: reduce) {
  .octopus-specialties-logo,
  .octopus-specialty {
    transition: none;
  }
}

.octopus-specialties-logo {
  aspect-ratio: 1450 / 1115;
}

.octopus-specialties-logo-base,
.octopus-tentacle-motion {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
  filter: none !important;
}

.octopus-specialties-logo-base {
  position: relative;
  z-index: 1;
}

.octopus-pulse-routes {
  position: absolute;
  z-index: 2;
  inset: 0;
  width: 100%;
  height: 100%;
  overflow: visible;
  pointer-events: none;
}

.octopus-pulse-group circle {
  fill: #f2f6ed;
}

.octopus-tentacle-motion {
  position: absolute;
  z-index: 2;
  inset: 0;
  pointer-events: none;
  will-change: transform;
}

.octopus-tentacle-web {
  clip-path: polygon(7% 37%, 28% 38%, 44% 32%, 44% 42%, 34% 58%, 20% 59%, 7% 53%);
  transform-origin: 42% 40%;
  animation: octopus-tentacle-web 4.8s ease-in-out infinite;
}

.octopus-tentacle-api {
  clip-path: polygon(7% 51%, 27% 48%, 44% 32%, 46% 46%, 35% 65%, 17% 77%, 6% 69%);
  transform-origin: 43% 42%;
  animation: octopus-tentacle-api 5.7s ease-in-out -1.3s infinite;
}

.octopus-tentacle-infra {
  clip-path: polygon(29% 48%, 47% 32%, 51% 34%, 49% 72%, 38% 93%, 21% 75%);
  transform-origin: 48% 40%;
  animation: octopus-tentacle-infra 6.3s ease-in-out -2.1s infinite;
}

.octopus-tentacle-redteam {
  clip-path: polygon(56% 32%, 72% 38%, 93% 37%, 93% 53%, 80% 59%, 66% 58%, 56% 42%);
  transform-origin: 58% 40%;
  animation: octopus-tentacle-redteam 5.2s ease-in-out -0.7s infinite;
}

.octopus-tentacle-cloud {
  clip-path: polygon(54% 32%, 73% 48%, 94% 51%, 94% 69%, 83% 77%, 65% 65%, 54% 46%);
  transform-origin: 56% 42%;
  animation: octopus-tentacle-cloud 6.1s ease-in-out -2.8s infinite;
}

.octopus-tentacle-ddos {
  clip-path: polygon(50% 33%, 55% 32%, 71% 48%, 78% 76%, 63% 93%, 52% 72%);
  transform-origin: 53% 40%;
  animation: octopus-tentacle-ddos 5.9s ease-in-out -1.8s infinite;
}

@keyframes octopus-tentacle-web {
  0%, 100% { transform: translate3d(0, 0, 0) rotate(0deg); }
  50% { transform: translate3d(-1.7%, 0.5%, 0) rotate(-0.65deg); }
}

@keyframes octopus-tentacle-api {
  0%, 100% { transform: translate3d(0, 0, 0) rotate(0deg); }
  47% { transform: translate3d(-1.25%, 1.2%, 0) rotate(0.48deg); }
}

@keyframes octopus-tentacle-infra {
  0%, 100% { transform: translate3d(0, 0, 0) rotate(0deg); }
  52% { transform: translate3d(-0.8%, 1.7%, 0) rotate(-0.38deg); }
}

@keyframes octopus-tentacle-redteam {
  0%, 100% { transform: translate3d(0, 0, 0) rotate(0deg); }
  49% { transform: translate3d(1.7%, 0.5%, 0) rotate(0.65deg); }
}

@keyframes octopus-tentacle-cloud {
  0%, 100% { transform: translate3d(0, 0, 0) rotate(0deg); }
  53% { transform: translate3d(1.25%, 1.2%, 0) rotate(-0.48deg); }
}

@keyframes octopus-tentacle-ddos {
  0%, 100% { transform: translate3d(0, 0, 0) rotate(0deg); }
  46% { transform: translate3d(0.8%, 1.7%, 0) rotate(0.38deg); }
}

@media (prefers-reduced-motion: reduce) {
  .octopus-tentacle-motion,
  .octopus-pulse-routes { display: none; }
}

.validation-map-section .validation-map-visual.validation-beam-shell {
  position: relative;
  top: auto;
  right: auto;
  bottom: auto;
  width: min(100%, 560px);
  height: auto;
  min-width: 0;
  margin-left: auto;
}

.validation-beam-stage {
  position: relative;
  padding: 10px 0 13px;
  color: #eff4ed;
}

.validation-beam-kicker,
.validation-beam-status {
  display: inline-flex;
  align-items: center;
  color: rgba(231, 237, 228, 0.45);
  font-family: "Inter Variable", "Inter", sans-serif;
  font-size: 0.55rem;
  font-weight: 650;
  letter-spacing: 0.085em;
}

.validation-beam-network {
  position: relative;
  min-height: clamp(292px, 28vw, 358px);
  margin: 3px 0 5px;
}

.validation-beam-routes {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  overflow: visible;
}

.validation-beam-base-routes path {
  fill: none;
  stroke: rgba(235, 241, 232, 0.17);
  stroke-width: 1.2;
  vector-effect: non-scaling-stroke;
}

.validation-beam-live-routes path {
  fill: none;
  stroke: url(#validationBeamFade);
  stroke-width: 2.1;
  stroke-dasharray: 12 76;
  stroke-linecap: round;
  vector-effect: non-scaling-stroke;
  animation: validation-beam-travel 2.8s linear infinite;
}

.validation-beam-path-b { animation-delay: -0.46s !important; }
.validation-beam-path-c { animation-delay: -1.05s !important; }
.validation-beam-path-d { animation-delay: -1.44s !important; animation-direction: reverse !important; }
.validation-beam-path-e { animation-delay: -0.88s !important; animation-direction: reverse !important; }
.validation-beam-path-f { animation-delay: -1.88s !important; animation-direction: reverse !important; }

.validation-beam-node {
  position: absolute;
  z-index: 2;
  display: inline-flex;
  align-items: center;
  min-height: 25px;
  padding: 0 8px;
  border: 1px solid rgba(237, 243, 234, 0.18);
  border-radius: 999px;
  background: rgba(5, 7, 6, 0.62);
  color: rgba(241, 245, 238, 0.78);
  font-family: "Inter Variable", "Inter", sans-serif;
  font-size: 0.57rem;
  font-weight: 650;
  letter-spacing: 0.06em;
  transform: translate(-50%, -50%);
  white-space: nowrap;
}

.validation-beam-node::before {
  width: 4px;
  height: 4px;
  margin-right: 5px;
  border-radius: 50%;
  background: #f0f4ed;
  box-shadow: 0 0 8px rgba(240, 244, 237, 0.4);
  content: "";
}

.validation-beam-node-sqli { top: 24.5%; left: 15.2%; }
.validation-beam-node-xss { top: 71.1%; left: 12.8%; }
.validation-beam-node-ports { top: 84.6%; left: 35.2%; }
.validation-beam-node-api { top: 24.5%; left: 84.8%; }
.validation-beam-node-auth { top: 71.1%; left: 87.2%; }
.validation-beam-node-dns { top: 84.6%; left: 64.8%; }

.validation-beam-core {
  position: absolute;
  z-index: 3;
  top: 50%;
  left: 50%;
  display: grid;
  width: clamp(92px, 11vw, 126px);
  aspect-ratio: 1;
  transform: translate(-50%, -50%);
  place-items: center;
}

.validation-beam-core-ring {
  position: absolute;
  inset: 1%;
  border: 1px solid rgba(239, 244, 237, 0.23);
  border-radius: 50%;
  box-shadow: 0 0 38px rgba(240, 244, 237, 0.06);
}

.validation-beam-core-ring::before,
.validation-beam-core-ring::after {
  position: absolute;
  border: 1px solid rgba(239, 244, 237, 0.13);
  border-radius: 50%;
  content: "";
}

.validation-beam-core-ring::before { inset: 12%; }
.validation-beam-core-ring::after { inset: -16%; border-style: dashed; }

.validation-beam-core img {
  position: relative;
  z-index: 1;
  width: 48%;
  height: auto;
  filter: none !important;
}

.validation-beam-core > span:last-child {
  position: absolute;
  top: calc(100% + 8px);
  left: 50%;
  width: max-content;
  transform: translateX(-50%);
  color: rgba(229, 236, 227, 0.42);
  font-family: "Inter Variable", "Inter", sans-serif;
  font-size: 0.45rem;
  font-weight: 650;
  letter-spacing: 0.07em;
  white-space: nowrap;
}

.validation-beam-status {
  gap: 6px;
}

.validation-beam-status i {
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: #f0f4ed;
  box-shadow: 0 0 9px rgba(240, 244, 237, 0.26);
}

@keyframes validation-beam-travel {
  to { stroke-dashoffset: -88; }
}

@media (max-width: 900px) {
  .validation-map-section .validation-map-visual.validation-beam-shell {
    width: min(100%, 560px);
    margin-top: 30px;
    margin-left: 0;
  }
}

@media (max-width: 540px) {
  .validation-beam-network {
    min-height: 310px;
  }

  .validation-beam-node {
    min-height: 22px;
    padding: 0 6px;
    font-size: 0.47rem;
  }

  .validation-beam-node::before {
    width: 3px;
    height: 3px;
    margin-right: 4px;
  }

  .validation-beam-node-sqli { left: 13%; }
  .validation-beam-node-xss { left: 11%; }
  .validation-beam-node-ports { left: 33%; }
  .validation-beam-node-api { left: 87%; }
  .validation-beam-node-auth { left: 89%; }
  .validation-beam-node-dns { left: 67%; }
}

@media (prefers-reduced-motion: reduce) {
  .validation-beam-live-routes path { animation: none; }
}

.validation-map-section .validation-map-visual.phosphor-validation-shell {
  position: relative;
  top: auto;
  right: auto;
  bottom: auto;
  width: min(100%, 474px);
  height: auto;
  min-width: 0;
  margin-left: auto;
}

.phosphor-validation-stage {
  position: relative;
  overflow: hidden;
  padding: 18px;
  border: 0;
  border-radius: 12px;
  background:
    radial-gradient(circle at 66% 44%, rgba(255, 255, 255, 0.035), transparent 42%),
    #101011;
  box-shadow: 0 22px 45px rgba(0, 0, 0, 0.21);
}

.phosphor-validation-stage::before {
  display: none;
  position: absolute;
  inset: 0;
  pointer-events: none;
  content: "";
  opacity: 0.32;
  background-image: linear-gradient(rgba(255, 255, 255, 0.028) 1px, transparent 1px);
  background-size: 100% 4px;
  mask-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.58), transparent 85%);
}

.phosphor-validation-title {
  position: relative;
  z-index: 1;
  margin: 0 0 12px;
  color: rgba(245, 245, 246, 0.92);
  font-family: "Space Grotesk", sans-serif;
  font-size: clamp(1rem, 1.5vw, 1.2rem);
  font-weight: 500;
  letter-spacing: -0.045em;
  line-height: 1;
}

.phosphor-validation-kicker,
.phosphor-validation-status {
  position: relative;
  z-index: 1;
  display: inline-flex;
  align-items: center;
  color: rgba(231, 235, 229, 0.48);
  font-family: "Inter Variable", "Inter", sans-serif;
  font-size: 0.57rem;
  font-weight: 650;
  letter-spacing: 0.085em;
}

.phosphor-validation-figure {
  position: relative;
  z-index: 1;
  width: 100%;
  max-width: 100%;
  margin: 0 auto;
  aspect-ratio: 5 / 4;
  --hairline-plate: #101011;
  --hairline-hi: #f1f3ee;
  --hairline-edge: #9ba19a;
  --hairline-mid: #515650;
  --hairline-lo: #1e211e;
  --hairline-stroke: 0.82;
}

.phosphor-validation-figure > svg {
  display: block;
  width: 100%;
  height: 100%;
}

.phosphor-validation-status {
  gap: 6px;
}

.phosphor-validation-status i {
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: rgba(242, 244, 239, 0.82);
  box-shadow: 0 0 9px rgba(242, 244, 239, 0.22);
}

@media (max-width: 900px) {
  .validation-map-section .validation-map-visual.phosphor-validation-shell {
    width: min(100%, 474px);
    margin-top: 30px;
    margin-left: 0;
  }
}

@media (max-width: 560px) {
  .phosphor-validation-stage {
    padding: 12px 12px 11px;
    border-radius: 10px;
  }

  .phosphor-validation-kicker,
  .phosphor-validation-status {
    font-size: 0.51rem;
  }
}

body .site-shell > main > .analyzer-section {
  filter: none !important;
  background: linear-gradient(180deg, #000 0%, #020403 69%, #000 100%);
}

body .site-shell > main > .analyzer-section::after {
  display: none;
}

.analyzer-section > .analyzer-heading,
.analyzer-section .analyzer-toolbar,
.analyzer-section .analyzer-filter-row,
.analyzer-section .analyzer-packet-pane,
.analyzer-section .analyzer-details-pane,
.analyzer-section .analyzer-statusbar,
.analyzer-section .analyzer-topology-pane .analyzer-pane-header,
.analyzer-section .analyzer-topology-pane .analyzer-bytes-grid,
.analyzer-section .analyzer-topology-pane .analyzer-ascii {
  filter: grayscale(1);
}

.validation-monitor-main {
  background: #030504;
}

.database-validation-stage {
  position: relative;
  isolation: isolate;
  min-height: clamp(288px, 30vw, 360px);
  overflow: hidden;
  background:
    radial-gradient(circle at 66% 46%, rgba(238, 244, 238, 0.09), transparent 24%),
    linear-gradient(138deg, #0b0e0c 0%, #050706 54%, #010201 100%);
}

.database-validation-stage::before,
.database-validation-stage::after {
  position: absolute;
  z-index: 0;
  content: "";
  pointer-events: none;
}

.database-validation-stage::before {
  inset: 0;
  background:
    linear-gradient(90deg, rgba(232, 240, 233, 0.035) 1px, transparent 1px) 0 0 / 36px 100%,
    linear-gradient(rgba(232, 240, 233, 0.028) 1px, transparent 1px) 0 0 / 100% 36px;
  mask-image: linear-gradient(90deg, #000, transparent 83%);
  -webkit-mask-image: linear-gradient(90deg, #000, transparent 83%);
}

.database-validation-stage::after {
  right: -8%;
  bottom: -42%;
  left: -8%;
  height: 54%;
  background: radial-gradient(ellipse at center, rgba(227, 235, 228, 0.08), transparent 66%);
}

.database-stage-grid {
  position: absolute;
  z-index: 0;
  top: 12%;
  right: 6%;
  width: 47%;
  height: 76%;
  border: 1px solid rgba(235, 242, 235, 0.08);
  border-radius: 50%;
  opacity: 0.76;
  transform: rotate(-20deg);
}

.database-stage-grid::before,
.database-stage-grid::after {
  position: absolute;
  border: 1px solid rgba(235, 242, 235, 0.07);
  border-radius: 50%;
  content: "";
}

.database-stage-grid::before { inset: 13%; }
.database-stage-grid::after { inset: 29%; }

.database-stage-copy,
.database-stage-metrics,
.database-stage-status {
  position: absolute;
  z-index: 3;
  font-family: "IBM Plex Mono", "SFMono-Regular", Consolas, monospace;
}

.database-stage-copy {
  top: 12%;
  left: 6%;
  color: rgba(232, 238, 232, 0.48);
  font-size: clamp(0.42rem, 0.67vw, 0.56rem);
  font-weight: 700;
  letter-spacing: 0.12em;
}

.database-stage-copy span,
.database-stage-copy strong,
.database-stage-copy small {
  display: block;
}

.database-stage-copy strong {
  margin: 12px 0 10px;
  color: rgba(245, 248, 244, 0.91);
  font-family: "Inter Variable", "Inter", sans-serif;
  font-size: clamp(1rem, 1.75vw, 1.38rem);
  font-weight: 520;
  letter-spacing: -0.07em;
  line-height: 0.94;
  text-transform: none;
}

.database-stage-copy small {
  max-width: 145px;
  color: rgba(224, 232, 224, 0.36);
  font-size: 0.46rem;
  letter-spacing: 0.09em;
  line-height: 1.55;
}

.database-cluster {
  position: absolute;
  z-index: 2;
  top: 50%;
  right: 13%;
  width: min(42%, 190px);
  height: 190px;
  transform: translateY(-47%);
}

.database-orbit {
  position: absolute;
  top: 39px;
  left: -13%;
  width: 126%;
  height: 90px;
  border: 1px solid rgba(237, 243, 237, 0.15);
  border-radius: 50%;
  transform: rotate(-16deg);
}

.database-orbit-two {
  top: 67px;
  border-color: rgba(237, 243, 237, 0.07);
  transform: rotate(17deg) scale(0.86);
}

.database-layer {
  position: absolute;
  left: 50%;
  width: 78%;
  height: 44px;
  border: 1px solid rgba(239, 245, 240, 0.42);
  border-radius: 50% / 13px;
  background: linear-gradient(180deg, rgba(215, 225, 216, 0.19), rgba(61, 69, 62, 0.12) 42%, rgba(5, 8, 6, 0.88) 100%);
  box-shadow: inset 0 10px 16px rgba(241, 247, 241, 0.06), 0 13px 21px rgba(0, 0, 0, 0.25);
  transform: translateX(-50%);
}

.database-layer::before,
.database-layer::after {
  position: absolute;
  left: 9%;
  width: 82%;
  height: 9px;
  border: 1px solid rgba(241, 247, 241, 0.3);
  border-radius: 50%;
  content: "";
}

.database-layer::before {
  top: -5px;
  background: rgba(226, 236, 228, 0.08);
}

.database-layer::after {
  bottom: 6px;
  border-color: rgba(221, 230, 221, 0.13);
}

.database-layer i {
  position: absolute;
  z-index: 1;
  top: 11px;
  right: 16%;
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: #e9efe9;
  box-shadow: -18px 4px 0 rgba(233, 239, 233, 0.56), 18px 4px 0 rgba(233, 239, 233, 0.56);
}

.database-layer-one { top: 35px; }
.database-layer-two { top: 77px; }
.database-layer-three { top: 119px; }

.database-core-label {
  position: absolute;
  z-index: 2;
  top: 0;
  left: 50%;
  padding: 4px 7px;
  border: 1px solid rgba(236, 243, 237, 0.18);
  color: rgba(237, 243, 237, 0.52);
  font-family: "IBM Plex Mono", "SFMono-Regular", Consolas, monospace;
  font-size: 0.42rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  transform: translateX(-50%);
  white-space: nowrap;
}

.database-path {
  position: absolute;
  z-index: 1;
  top: 54%;
  width: 27%;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(239, 245, 239, 0.48), transparent);
  transform-origin: right center;
}

.database-path-left {
  left: 27%;
  transform: rotate(-17deg);
}

.database-path-right {
  right: 7%;
  width: 18%;
  transform: rotate(28deg);
}

.database-path i,
.database-path b {
  position: absolute;
  top: 50%;
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: rgba(243, 247, 243, 0.92);
  box-shadow: 0 0 10px rgba(235, 243, 235, 0.55);
  content: "";
  transform: translateY(-50%);
}

.database-path i { left: 18%; animation: database-path-signal 3.6s linear infinite; }
.database-path b { right: 13%; animation: database-path-signal 3.6s linear 1.8s infinite reverse; }

.database-stage-metrics {
  bottom: 11%;
  left: 6%;
  display: flex;
  gap: clamp(9px, 1.4vw, 17px);
  margin: 0;
}

.database-stage-metrics div {
  min-width: 40px;
}

.database-stage-metrics dt {
  color: rgba(223, 231, 224, 0.34);
  font-size: 0.38rem;
  font-weight: 700;
  letter-spacing: 0.1em;
}

.database-stage-metrics dd {
  margin: 5px 0 0;
  color: rgba(245, 248, 245, 0.82);
  font-size: 0.52rem;
  font-weight: 700;
  letter-spacing: 0.04em;
}

.database-stage-status {
  right: 6%;
  bottom: 10%;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  color: rgba(236, 242, 236, 0.6);
  font-size: 0.42rem;
  font-weight: 700;
  letter-spacing: 0.1em;
}

.database-stage-status i {
  width: 5px;
  height: 5px;
  border: 1px solid rgba(237, 244, 237, 0.75);
  border-radius: 50%;
  animation: database-status-pulse 2.4s ease-in-out infinite;
}

@keyframes database-path-signal {
  from { transform: translate(-11px, -50%); opacity: 0; }
  18%, 74% { opacity: 1; }
  to { transform: translate(37px, -50%); opacity: 0; }
}

@keyframes database-status-pulse {
  0%, 100% { box-shadow: 0 0 0 0 rgba(236, 243, 236, 0); }
  50% { box-shadow: 0 0 0 5px rgba(236, 243, 236, 0.08); }
}

@media (max-width: 560px) {
  .database-validation-stage {
    min-height: 294px;
  }

  .database-stage-copy {
    top: 10%;
    left: 5%;
  }

  .database-stage-copy strong {
    font-size: 1rem;
  }

  .database-cluster {
    right: 4%;
    width: 48%;
    height: 174px;
  }

  .database-stage-metrics {
    bottom: 8%;
    left: 5%;
  }

  .database-stage-status {
    right: 5%;
    bottom: 8%;
    font-size: 0.36rem;
  }
}

@media (prefers-reduced-motion: reduce) {
  .database-path i,
  .database-path b,
  .database-stage-status i {
    animation: none;
  }
}

.validation-image-stage {
  position: relative;
  min-height: clamp(286px, 30vw, 360px);
  margin: 0;
  overflow: hidden;
  background: #030504;
}

.validation-scene-image {
  display: block;
  width: 100%;
  height: 100%;
  min-height: inherit;
  object-fit: cover;
  object-position: center;
}

@media (max-width: 560px) {
  .validation-image-stage {
    min-height: 294px;
  }

  .validation-scene-image {
    object-position: 58% center;
  }
}

.database-code-stage {
  position: relative;
  isolation: isolate;
  min-height: clamp(288px, 30vw, 360px);
  overflow: hidden;
  background:
    radial-gradient(circle at 68% 46%, rgba(245, 248, 244, 0.075), transparent 26%),
    linear-gradient(138deg, #0a0d0b 0%, #040605 56%, #010201 100%);
}

.database-code-stage::before,
.database-code-stage::after,
.database-code-grid {
  position: absolute;
  z-index: 0;
  content: "";
  pointer-events: none;
}

.database-code-stage::before {
  inset: 0;
  background:
    linear-gradient(90deg, rgba(235, 241, 235, 0.035) 1px, transparent 1px) 0 0 / 38px 100%,
    linear-gradient(rgba(235, 241, 235, 0.028) 1px, transparent 1px) 0 0 / 100% 38px;
  opacity: 0.82;
  mask-image: linear-gradient(90deg, #000 0%, rgba(0, 0, 0, 0.65) 67%, transparent 100%);
  -webkit-mask-image: linear-gradient(90deg, #000 0%, rgba(0, 0, 0, 0.65) 67%, transparent 100%);
}

.database-code-stage::after {
  right: -10%;
  bottom: -45%;
  left: -10%;
  height: 62%;
  background: radial-gradient(ellipse at center, rgba(235, 242, 235, 0.07), transparent 66%);
}

.database-code-grid {
  right: 5%;
  bottom: -12%;
  width: 50%;
  height: 92%;
  border: 1px solid rgba(237, 243, 237, 0.09);
  border-radius: 50%;
  transform: rotate(-23deg);
}

.database-code-grid::before,
.database-code-grid::after {
  position: absolute;
  border: 1px solid rgba(237, 243, 237, 0.075);
  border-radius: 50%;
  content: "";
}

.database-code-grid::before { inset: 15%; }
.database-code-grid::after { inset: 31%; }

.database-code-copy,
.database-code-metrics,
.database-code-status {
  position: absolute;
  z-index: 3;
}

.database-code-copy {
  top: 12%;
  left: 6%;
  color: rgba(232, 238, 233, 0.48);
  font-family: "IBM Plex Mono", "SFMono-Regular", Consolas, monospace;
  font-size: clamp(0.42rem, 0.67vw, 0.56rem);
  font-weight: 700;
  letter-spacing: 0.115em;
}

.database-code-copy span,
.database-code-copy strong,
.database-code-copy small {
  display: block;
}

.database-code-copy strong {
  margin: 12px 0 10px;
  color: rgba(246, 248, 245, 0.92);
  font-family: "Inter Variable", "Inter", sans-serif;
  font-size: clamp(1rem, 1.75vw, 1.38rem);
  font-weight: 520;
  letter-spacing: -0.075em;
  line-height: 0.94;
}

.database-code-copy small {
  max-width: 148px;
  color: rgba(226, 233, 227, 0.34);
  font-size: 0.45rem;
  letter-spacing: 0.095em;
  line-height: 1.55;
}

.database-vault {
  position: absolute;
  z-index: 2;
  top: 50%;
  right: 14%;
  width: min(42%, 190px);
  aspect-ratio: 1;
  transform: translateY(-49%);
}

.database-vault-backdrop {
  position: absolute;
  inset: 7%;
  border: 1px solid rgba(240, 246, 241, 0.18);
  background: linear-gradient(145deg, rgba(226, 235, 228, 0.08), rgba(10, 13, 11, 0.14));
  transform: rotate(7deg);
}

.database-vault::before,
.database-vault::after {
  position: absolute;
  z-index: 2;
  width: 20px;
  height: 20px;
  content: "";
  pointer-events: none;
}

.database-vault::before {
  top: 0;
  left: 0;
  border-top: 1px solid rgba(246, 249, 246, 0.7);
  border-left: 1px solid rgba(246, 249, 246, 0.7);
}

.database-vault::after {
  right: 0;
  bottom: 0;
  border-right: 1px solid rgba(246, 249, 246, 0.38);
  border-bottom: 1px solid rgba(246, 249, 246, 0.38);
}

.database-vault-top {
  position: absolute;
  z-index: 3;
  top: 5%;
  right: 6%;
  left: 6%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 20px;
  padding: 0 8px;
  border: 1px solid rgba(237, 244, 238, 0.17);
  background: rgba(9, 12, 10, 0.83);
  color: rgba(237, 243, 237, 0.55);
  font-family: "IBM Plex Mono", "SFMono-Regular", Consolas, monospace;
  font-size: 0.37rem;
  font-weight: 700;
  letter-spacing: 0.11em;
}

.database-vault-top i,
.database-vault-footer i,
.database-code-status i {
  width: 5px;
  height: 5px;
  border: 1px solid rgba(241, 247, 242, 0.72);
  border-radius: 50%;
}

.database-vault-face {
  position: absolute;
  z-index: 1;
  top: 16%;
  right: 6%;
  bottom: 6%;
  left: 6%;
  padding: 13% 12% 10%;
  border: 1px solid rgba(239, 245, 240, 0.38);
  background:
    linear-gradient(180deg, rgba(229, 238, 230, 0.09), transparent 32%),
    linear-gradient(135deg, rgba(43, 49, 44, 0.66), rgba(6, 8, 7, 0.94));
  box-shadow: inset 0 1px rgba(247, 250, 247, 0.09), 0 18px 32px rgba(0, 0, 0, 0.24);
}

.database-vault-heading,
.database-vault-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-family: "IBM Plex Mono", "SFMono-Regular", Consolas, monospace;
  font-size: 0.37rem;
  font-weight: 700;
  letter-spacing: 0.1em;
}

.database-vault-heading {
  margin-bottom: 10px;
  color: rgba(239, 245, 240, 0.58);
}

.database-vault-heading b {
  color: rgba(244, 248, 244, 0.86);
  font-weight: 700;
}

.database-vault-row {
  display: grid;
  grid-template-columns: 5px 1fr 9px;
  gap: 7px;
  align-items: center;
  height: 17%;
  border-top: 1px solid rgba(236, 244, 237, 0.11);
}

.database-vault-row i,
.database-vault-row b {
  display: block;
  height: 4px;
  background: rgba(240, 246, 240, 0.55);
}

.database-vault-row i { width: 4px; border-radius: 50%; }
.database-vault-row b { width: 9px; justify-self: end; opacity: 0.36; }

.database-vault-row span {
  display: block;
  height: 3px;
  background: linear-gradient(90deg, rgba(241, 247, 241, 0.54) 0 66%, transparent 66% 76%, rgba(241, 247, 241, 0.22) 76% 100%);
}

.database-vault-row:nth-of-type(4) span { opacity: 0.72; }
.database-vault-row:nth-of-type(5) span { opacity: 0.5; }

.database-vault-footer {
  position: absolute;
  right: 12%;
  bottom: 7%;
  left: 12%;
  color: rgba(235, 242, 236, 0.44);
}

.database-code-route {
  position: absolute;
  z-index: 1;
  top: 53%;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(239, 245, 240, 0.52), transparent);
  transform-origin: right center;
}

.database-code-route-left {
  left: 27%;
  width: 29%;
  transform: rotate(-18deg);
}

.database-code-route-right {
  right: 6%;
  width: 19%;
  transform: rotate(28deg);
}

.database-code-route i {
  position: absolute;
  top: 50%;
  left: 28%;
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: rgba(246, 249, 246, 0.92);
  box-shadow: 0 0 9px rgba(243, 248, 243, 0.5);
  transform: translateY(-50%);
  animation: database-code-signal 3.8s linear infinite;
}

.database-code-route-right i {
  animation-delay: -1.8s;
  animation-direction: reverse;
}

.database-code-metrics {
  bottom: 11%;
  left: 6%;
  display: flex;
  gap: clamp(10px, 1.45vw, 18px);
  margin: 0;
  font-family: "IBM Plex Mono", "SFMono-Regular", Consolas, monospace;
}

.database-code-metrics div { min-width: 38px; }

.database-code-metrics dt {
  color: rgba(225, 233, 226, 0.34);
  font-size: 0.37rem;
  font-weight: 700;
  letter-spacing: 0.1em;
}

.database-code-metrics dd {
  margin: 5px 0 0;
  color: rgba(245, 248, 245, 0.82);
  font-size: 0.52rem;
  font-weight: 700;
  letter-spacing: 0.04em;
}

.database-code-status {
  right: 6%;
  bottom: 10%;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  color: rgba(237, 243, 237, 0.58);
  font-family: "IBM Plex Mono", "SFMono-Regular", Consolas, monospace;
  font-size: 0.41rem;
  font-weight: 700;
  letter-spacing: 0.1em;
}

.database-code-status i {
  animation: database-code-status 2.4s ease-in-out infinite;
}

@keyframes database-code-signal {
  from { transform: translate(-12px, -50%); opacity: 0; }
  18%, 74% { opacity: 1; }
  to { transform: translate(40px, -50%); opacity: 0; }
}

@keyframes database-code-status {
  0%, 100% { box-shadow: 0 0 0 0 rgba(241, 247, 242, 0); }
  50% { box-shadow: 0 0 0 5px rgba(241, 247, 242, 0.08); }
}

@media (max-width: 560px) {
  .database-code-stage {
    min-height: 294px;
  }

  .database-code-copy {
    top: 10%;
    left: 5%;
  }

  .database-code-copy strong {
    font-size: 1rem;
  }

  .database-vault {
    right: 4%;
    width: 48%;
  }

  .database-code-metrics {
    bottom: 8%;
    left: 5%;
  }

  .database-code-status {
    right: 5%;
    bottom: 8%;
    font-size: 0.36rem;
  }
}

@media (prefers-reduced-motion: reduce) {
  .database-code-route i,
  .database-code-status i {
    animation: none;
  }
}

.database-cube-stage {
  position: relative;
  isolation: isolate;
  min-height: clamp(288px, 30vw, 360px);
  overflow: hidden;
  background:
    radial-gradient(circle at 69% 46%, rgba(244, 248, 244, 0.08), transparent 24%),
    linear-gradient(138deg, #090c0a 0%, #040605 58%, #010201 100%);
}

.database-cube-stage::before,
.database-cube-stage::after {
  position: absolute;
  z-index: 0;
  content: "";
  pointer-events: none;
}

.database-cube-stage::before {
  inset: 0;
  background:
    linear-gradient(90deg, rgba(235, 242, 236, 0.034) 1px, transparent 1px) 0 0 / 42px 100%,
    linear-gradient(rgba(235, 242, 236, 0.025) 1px, transparent 1px) 0 0 / 100% 42px;
  mask-image: linear-gradient(90deg, rgba(0, 0, 0, 0.72), transparent 78%);
  -webkit-mask-image: linear-gradient(90deg, rgba(0, 0, 0, 0.72), transparent 78%);
}

.database-cube-stage::after {
  right: -9%;
  bottom: -46%;
  left: -9%;
  height: 62%;
  background: radial-gradient(ellipse at center, rgba(235, 242, 236, 0.065), transparent 67%);
}

.database-cube-visual {
  position: absolute;
  z-index: 1;
  inset: 0;
  width: 100%;
  height: 100%;
  overflow: visible;
}

.database-cube-floor {
  stroke: rgba(231, 239, 233, 0.1);
  stroke-width: 1;
}

.database-cube-link {
  stroke: rgba(240, 246, 241, 0.26);
  stroke-width: 1;
  stroke-dasharray: 4 8;
  animation: database-cube-flow 5.6s linear infinite;
}

.database-cube-link-b {
  animation-delay: -2.8s;
  animation-direction: reverse;
}

.database-cube-signal {
  fill: #edf2ee;
  filter: drop-shadow(0 0 5px rgba(237, 242, 238, 0.6));
  animation: database-cube-signal 2.8s ease-in-out infinite;
}

.database-cube-signal-b {
  animation-delay: -1.35s;
}

.database-cube-layer,
.database-cube-layer-side {
  stroke: rgba(243, 248, 243, 0.26);
  stroke-width: 1;
}

.database-cube-layer-side {
  stroke: rgba(238, 245, 239, 0.14);
}

.database-cube-core {
  fill: #eff4ef;
  filter: url(#databaseCubeSoft);
  animation: database-cube-core 2.8s ease-in-out infinite;
}

.database-cube-core-halo {
  stroke: rgba(241, 247, 242, 0.32);
  stroke-width: 1;
  animation: database-cube-halo 2.8s ease-in-out infinite;
}

.database-cube-scan {
  stroke: rgba(248, 251, 248, 0.7);
  stroke-width: 1.5;
  stroke-dasharray: 24 210;
  animation: database-cube-scan 3.9s linear infinite;
}

.database-cube-route {
  position: absolute;
  z-index: 1;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(239, 246, 240, 0.22), transparent);
  pointer-events: none;
}

.database-cube-route-in {
  top: 68%;
  left: 7%;
  width: 34%;
  transform: rotate(-8deg);
}

.database-cube-route-out {
  top: 58%;
  right: 6%;
  width: 18%;
  transform: rotate(18deg);
}

.database-cube-label {
  position: absolute;
  z-index: 2;
  color: rgba(237, 244, 238, 0.48);
  font-family: "IBM Plex Mono", "SFMono-Regular", Consolas, monospace;
  font-size: clamp(0.38rem, 0.58vw, 0.5rem);
  font-weight: 700;
  letter-spacing: 0.115em;
}

.database-cube-label::before {
  display: inline-block;
  width: 4px;
  height: 4px;
  margin-right: 6px;
  border: 1px solid rgba(241, 247, 242, 0.62);
  border-radius: 50%;
  content: "";
  vertical-align: 1px;
}

.database-cube-label-main {
  top: 12%;
  right: 30%;
  color: rgba(243, 248, 243, 0.74);
}

.database-cube-label-left {
  top: 59%;
  left: 8%;
}

.database-cube-label-right {
  top: 49%;
  right: 5%;
}

@keyframes database-cube-flow {
  to { stroke-dashoffset: -48; }
}

@keyframes database-cube-signal {
  0%, 100% { opacity: 0.32; transform: scale(0.72); }
  50% { opacity: 1; transform: scale(1); }
}

@keyframes database-cube-core {
  0%, 100% { opacity: 0.7; transform: scale(0.86); transform-origin: 500px 135px; }
  50% { opacity: 1; transform: scale(1); transform-origin: 500px 135px; }
}

@keyframes database-cube-halo {
  0%, 100% { opacity: 0.22; transform: scale(0.74); transform-origin: 500px 135px; }
  50% { opacity: 0.72; transform: scale(1.12); transform-origin: 500px 135px; }
}

@keyframes database-cube-scan {
  to { stroke-dashoffset: -234; }
}

@media (max-width: 560px) {
  .database-cube-stage {
    min-height: 294px;
  }

  .database-cube-label-main {
    top: 11%;
    right: 26%;
  }

  .database-cube-label-left { left: 5%; }
  .database-cube-label-right { right: 3%; }
}

@media (prefers-reduced-motion: reduce) {
  .database-cube-link,
  .database-cube-signal,
  .database-cube-core,
  .database-cube-core-halo,
  .database-cube-scan {
    animation: none;
  }
}

.validation-map-section .validation-map-visual.linear-database-shell {
  position: relative;
  top: auto;
  right: auto;
  bottom: auto;
  width: min(100%, 590px);
  height: auto;
  min-width: 0;
  margin-left: auto;
}

.linear-database-shell .validation-monitor-frame {
  display: none !important;
}

.linear-database-panel {
  overflow: hidden;
  border: 1px solid rgba(242, 242, 238, 0.12);
  border-radius: 8px;
  background: #191918;
  box-shadow: 0 20px 50px rgba(0, 0, 0, 0.28), 0 1px rgba(255, 255, 255, 0.025) inset;
  color: #f1f1ed;
  font-family: "Inter Variable", "Inter", sans-serif;
}

.linear-database-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 54px;
  padding: 0 17px;
  border-bottom: 1px solid rgba(242, 242, 238, 0.08);
  background: #1c1c1b;
}

.linear-database-identity,
.linear-database-state,
.linear-database-footer,
.linear-database-sidebar,
.linear-database-content-header span,
.linear-database-row,
.linear-database-sidebar > span,
.linear-database-sidebar small {
  font-family: "Inter Variable", "Inter", sans-serif;
}

.linear-database-identity {
  display: flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
}

.linear-database-identity > div > span,
.linear-database-identity strong {
  display: block;
}

.linear-database-identity > div > span,
.linear-database-sidebar > span,
.linear-sidebar-caption,
.linear-database-row-head,
.linear-database-state,
.linear-database-footer {
  color: rgba(233, 233, 227, 0.43);
  font-size: 0.59rem;
  font-weight: 590;
  letter-spacing: 0.02em;
}

.linear-database-identity strong {
  margin-top: 2px;
  color: rgba(247, 247, 242, 0.9);
  font-size: 0.78rem;
  font-weight: 560;
  letter-spacing: -0.02em;
}

.linear-database-icon {
  display: grid;
  gap: 2px;
  width: 15px;
}

.linear-database-icon i {
  display: block;
  height: 3px;
  border: 1px solid rgba(242, 242, 237, 0.55);
  border-radius: 2px;
}

.linear-database-state {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  white-space: nowrap;
}

.linear-database-state i,
.linear-database-footer i,
.linear-database-sidebar small i {
  display: inline-block;
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: rgba(239, 241, 235, 0.84);
}

.linear-database-body {
  display: grid;
  grid-template-columns: minmax(132px, 0.33fr) minmax(0, 0.67fr);
  min-height: clamp(262px, 26vw, 310px);
}

.linear-database-sidebar {
  padding: 18px 10px;
  border-right: 1px solid rgba(242, 242, 238, 0.07);
  background: #171716;
}

.linear-database-sidebar > span {
  display: block;
  padding: 0 7px;
}

.linear-database-sidebar ul {
  display: grid;
  gap: 2px;
  padding: 8px 0 16px;
  margin: 0;
  list-style: none;
}

.linear-database-sidebar li {
  display: grid;
  grid-template-columns: 7px minmax(0, 1fr) auto;
  gap: 7px;
  align-items: center;
  min-height: 29px;
  padding: 0 7px;
  border-radius: 5px;
  color: rgba(231, 231, 226, 0.56);
  font-size: 0.67rem;
  font-weight: 490;
}

.linear-database-sidebar li i {
  width: 6px;
  height: 6px;
  border: 1px solid rgba(235, 235, 230, 0.4);
  border-radius: 2px;
}

.linear-database-sidebar li b {
  color: rgba(230, 230, 225, 0.31);
  font-size: 0.6rem;
  font-weight: 520;
}

.linear-database-sidebar li.is-active {
  background: rgba(255, 255, 251, 0.07);
  color: rgba(248, 248, 244, 0.91);
}

.linear-database-sidebar li.is-active i {
  border-color: rgba(248, 248, 244, 0.76);
  background: rgba(248, 248, 244, 0.72);
}

.linear-sidebar-caption {
  margin-top: 4px;
}

.linear-database-sidebar small {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 9px 7px 0;
  color: rgba(229, 229, 224, 0.5);
  font-size: 0.62rem;
}

.linear-database-sidebar small i {
  width: 4px;
  height: 4px;
  opacity: 0.72;
}

.linear-database-content {
  min-width: 0;
  padding: 18px 18px 13px;
  background: #1a1a19;
}

.linear-database-content-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
  margin-bottom: 18px;
}

.linear-database-content-header strong,
.linear-database-content-header span {
  display: block;
}

.linear-database-content-header strong {
  color: rgba(248, 248, 244, 0.93);
  font-size: 0.81rem;
  font-weight: 560;
  letter-spacing: -0.02em;
}

.linear-database-content-header div span {
  margin-top: 4px;
  color: rgba(229, 229, 224, 0.44);
  font-size: 0.62rem;
}

.linear-database-content-header > span {
  padding: 4px 7px;
  border: 1px solid rgba(244, 244, 239, 0.1);
  border-radius: 4px;
  color: rgba(231, 231, 226, 0.54);
  font-size: 0.59rem;
  white-space: nowrap;
}

.linear-database-table {
  border-top: 1px solid rgba(241, 241, 236, 0.08);
}

.linear-database-row {
  display: grid;
  grid-template-columns: minmax(0, 1.45fr) minmax(58px, 0.76fr) minmax(58px, 0.7fr);
  gap: 8px;
  align-items: center;
  min-height: 39px;
  border-bottom: 1px solid rgba(241, 241, 236, 0.07);
  color: rgba(235, 235, 230, 0.68);
  font-size: 0.66rem;
}

.linear-database-row-head {
  min-height: 27px;
  color: rgba(229, 229, 224, 0.35);
  font-size: 0.55rem;
  font-weight: 600;
  letter-spacing: 0.025em;
}

.linear-database-row > span:first-child {
  display: flex;
  align-items: center;
  min-width: 0;
  gap: 7px;
  color: rgba(242, 242, 237, 0.77);
  font-weight: 500;
}

.linear-database-row > span:first-child i {
  flex: 0 0 auto;
  width: 5px;
  height: 5px;
  border: 1px solid rgba(239, 239, 234, 0.54);
  border-radius: 1px;
}

.linear-database-row b {
  color: rgba(235, 235, 230, 0.55);
  font-size: 0.62rem;
  font-weight: 530;
}

.linear-database-footer {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  padding-top: 13px;
}

.linear-database-footer span:first-child {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: rgba(236, 236, 231, 0.55);
}

.linear-database-footer i {
  width: 4px;
  height: 4px;
}

@media (max-width: 900px) {
  .validation-map-section .validation-map-visual.linear-database-shell {
    width: 100%;
    margin-top: 30px;
  }
}

@media (max-width: 560px) {
  .linear-database-toolbar {
    min-height: 49px;
    padding: 0 13px;
  }

  .linear-database-body {
    grid-template-columns: 112px minmax(0, 1fr);
    min-height: 270px;
  }

  .linear-database-sidebar {
    padding: 15px 7px;
  }

  .linear-database-sidebar li {
    gap: 5px;
    padding: 0 5px;
    font-size: 0.6rem;
  }

  .linear-database-content {
    padding: 15px 12px 12px;
  }

  .linear-database-row {
    grid-template-columns: minmax(0, 1.28fr) minmax(42px, 0.72fr) minmax(46px, 0.7fr);
    gap: 5px;
    font-size: 0.59rem;
  }

  .linear-database-footer {
    font-size: 0.52rem;
  }
}

.radar-earth-horizon {
  position: absolute;
  z-index: 0;
  right: -10%;
  bottom: -7%;
  width: 122%;
  height: 72%;
  object-fit: cover;
  object-position: center bottom;
  opacity: 0.48;
  filter: grayscale(1) brightness(0.72) contrast(1.08);
  mask-image: linear-gradient(180deg, transparent 0%, #000 36%, #000 100%);
  -webkit-mask-image: linear-gradient(180deg, transparent 0%, #000 36%, #000 100%);
  pointer-events: none;
}

@media (max-width: 720px) {
  .radar-earth-horizon {
    right: -22%;
    bottom: -5%;
    width: 144%;
    height: 68%;
    opacity: 0.4;
  }
}

body .site-shell > main > .beam-analysis-section {
  background: #020403;
}

.beam-analysis-section::before {
  opacity: 0.18;
}

.radar-analysis-layout .beam-analysis-heading,
.radar-analysis-layout .beam-analysis-heading h2,
.radar-analysis-layout .beam-analysis-heading h2 em,
.radar-analysis-layout .beam-analysis-heading p {
  font-family: "Inter Variable", "Inter", sans-serif;
  font-style: normal;
}

.radar-analysis-layout .beam-analysis-heading h2 {
  color: #eef4ef;
  font-weight: 510;
  letter-spacing: -0.082em;
  line-height: 0.9;
}

.radar-analysis-layout .beam-analysis-heading h2 em {
  color: inherit;
  font-weight: inherit;
}

.radar-analysis-figure {
  position: relative;
  isolation: isolate;
  min-height: clamp(350px, 32vw, 390px);
  width: min(100%, 1080px);
  margin: clamp(28px, 3vw, 38px) auto 0;
  overflow: hidden;
  border: 1px solid rgba(221, 240, 221, 0.15);
  background:
    radial-gradient(circle at 50% 52%, rgba(116, 173, 81, 0.1), transparent 25%),
    linear-gradient(140deg, rgba(19, 27, 20, 0.74), rgba(5, 8, 6, 0.94) 52%),
    #060806;
  box-shadow: 0 18px 48px rgba(0, 0, 0, 0.3), inset 0 1px rgba(246, 252, 244, 0.04);
}

.radar-analysis-figure::before {
  position: absolute;
  z-index: 0;
  inset: 0;
  background:
    linear-gradient(90deg, rgba(226, 245, 218, 0.025) 1px, transparent 1px) 0 0 / 48px 100%,
    linear-gradient(rgba(226, 245, 218, 0.02) 1px, transparent 1px) 0 0 / 100% 48px;
  content: "";
  opacity: 0.58;
}

.radar-analysis-topline,
.radar-analysis-caption {
  position: absolute;
  right: 0;
  left: 0;
  z-index: 4;
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 36px;
  padding: 0 clamp(16px, 2.2vw, 25px);
  color: rgba(229, 239, 224, 0.43);
  font-family: "IBM Plex Mono", "SFMono-Regular", Consolas, monospace;
  font-size: 0.5rem;
  font-weight: 600;
  letter-spacing: 0.13em;
}

.radar-analysis-topline {
  top: 0;
  border-bottom: 1px solid rgba(225, 245, 216, 0.11);
  background: rgba(9, 13, 10, 0.52);
}

.radar-analysis-caption {
  bottom: 0;
  gap: 18px;
  border-top: 1px solid rgba(225, 245, 216, 0.11);
  background: rgba(5, 8, 6, 0.6);
}

.radar-analysis-caption > span:first-child {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: rgba(201, 240, 149, 0.9);
}

.radar-analysis-caption i {
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: #c5f58e;
  box-shadow: 0 0 10px rgba(197, 245, 142, 0.74);
}

.radar-analysis-svg {
  position: absolute;
  z-index: 1;
  top: 36px;
  bottom: 36px;
  left: 50%;
  width: min(62%, 650px);
  height: calc(100% - 72px);
  overflow: visible;
  transform: translateX(-50%);
}

.radar-grid polygon,
.radar-grid path {
  stroke: rgba(223, 241, 214, 0.17);
  stroke-width: 1;
}

.radar-grid polygon:first-child {
  stroke: rgba(202, 242, 149, 0.26);
}

.radar-analysis-area {
  fill: url(#radarAreaGradient);
}

.radar-analysis-outline {
  fill: none;
  stroke: #c8f291;
  stroke-dasharray: 3 5;
  stroke-width: 1.8;
  animation: radar-outline-shift 12s linear infinite;
}

.radar-analysis-points circle {
  fill: #d6f5ad;
  stroke: rgba(65, 102, 46, 0.9);
  stroke-width: 3;
  filter: drop-shadow(0 0 5px rgba(201, 242, 145, 0.52));
}

.radar-analysis-core {
  position: absolute;
  z-index: 3;
  top: 50%;
  left: 50%;
  display: grid;
  width: 78px;
  height: 78px;
  place-items: center;
  transform: translate(-50%, -50%);
}

.radar-analysis-core img {
  width: 72%;
  height: auto;
  object-fit: contain;
  filter: drop-shadow(0 6px 13px rgba(0, 0, 0, 0.5));
}

.radar-analysis-core span {
  position: absolute;
  bottom: -8px;
  color: rgba(231, 243, 224, 0.5);
  font-family: "IBM Plex Mono", "SFMono-Regular", Consolas, monospace;
  font-size: 0.36rem;
  font-weight: 600;
  letter-spacing: 0.1em;
  white-space: nowrap;
}

.radar-analysis-tag {
  position: absolute;
  z-index: 3;
  display: flex;
  align-items: baseline;
  gap: 7px;
  color: rgba(226, 238, 221, 0.55);
  font-family: "IBM Plex Mono", "SFMono-Regular", Consolas, monospace;
  font-size: 0.51rem;
  font-weight: 600;
  letter-spacing: 0.1em;
  transform: translate(-50%, -50%);
}

.radar-analysis-tag::before {
  display: none;
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: #c8f291;
  box-shadow: 0 0 8px rgba(200, 242, 145, 0.72);
  content: "";
}

.radar-analysis-tag strong {
  color: rgba(240, 247, 235, 0.9);
  font-size: 0.68rem;
  font-weight: 500;
  letter-spacing: -0.03em;
}

.radar-analysis-tag-sqli { top: 20%; left: 50%; }
.radar-analysis-tag-ports { top: 38%; left: 68%; }
.radar-analysis-tag-auth { top: 60%; left: 67%; }
.radar-analysis-tag-api { top: 76%; left: 50%; }
.radar-analysis-tag-xss { top: 64%; left: 30%; }
.radar-analysis-tag-dns { top: 39%; left: 42%; }

@keyframes radar-outline-shift {
  to { stroke-dashoffset: -64; }
}

@media (max-width: 720px) {
  .radar-analysis-figure {
    min-height: 330px;
    margin-top: 27px;
  }

  .radar-analysis-topline,
  .radar-analysis-caption {
    min-height: 33px;
    padding-right: 13px;
    padding-left: 13px;
    font-size: 0.43rem;
  }

  .radar-analysis-topline > span:last-child,
  .radar-analysis-caption > span:nth-child(2) {
    display: none;
  }

  .radar-analysis-svg {
    top: 33px;
    bottom: 33px;
    width: 92%;
    height: calc(100% - 66px);
  }

  .radar-analysis-core {
    width: 64px;
    height: 64px;
  }

  .radar-analysis-core span {
    bottom: -8px;
    font-size: 0.32rem;
  }

  .radar-analysis-tag {
    gap: 4px;
    font-size: 0.41rem;
  }

  .radar-analysis-tag::before {
    width: 3px;
    height: 3px;
  }

  .radar-analysis-tag strong {
    font-size: 0.56rem;
  }

  .radar-analysis-tag-ports { left: 70%; }
  .radar-analysis-tag-auth { left: 68%; }
  .radar-analysis-tag-xss { left: 29%; }
  .radar-analysis-tag-dns { left: 38%; }
}

@media (prefers-reduced-motion: reduce) {
  .radar-analysis-outline {
    animation: none;
  }
}

body .site-shell > main > .beam-analysis-section {
  filter: none !important;
  background: #020403;
}

.beam-analysis-heading,
.radar-analysis-topline,
.radar-analysis-caption,
.radar-analysis-svg,
.radar-analysis-tag {
  filter: grayscale(1);
}

.radar-analysis-figure {
  background:
    radial-gradient(circle at 50% 52%, rgba(138, 146, 139, 0.07), transparent 25%),
    linear-gradient(140deg, rgba(19, 22, 20, 0.74), rgba(5, 8, 6, 0.94) 52%),
    #060806;
}

.radar-analysis-core img {
  opacity: 1;
  filter: none !important;
}

.radar-analysis-core span {
  color: rgba(231, 243, 224, 0.5);
}

@media (prefers-reduced-motion: reduce) {
  .beam-node-core-ring {
    animation: none;
  }

  .beam-network-pulse {
    display: none;
  }
}

.beam-analysis-section {
  padding-top: clamp(66px, 6.5vw, 88px);
  padding-bottom: clamp(72px, 7vw, 94px);
  background:
    radial-gradient(ellipse at 50% 82%, rgba(66, 116, 78, 0.09), transparent 36%),
    linear-gradient(180deg, #000 0%, #020403 70%, #060b07 100%);
}

.beam-analysis-section::before {
  opacity: 0.28;
}

.beam-analysis-heading {
  grid-template-columns: minmax(150px, 0.43fr) minmax(0, 1.57fr);
  gap: clamp(24px, 4vw, 58px);
}

.beam-analysis-heading h2 {
  font-size: clamp(2.15rem, 3.6vw, 3.2rem);
  letter-spacing: -0.07em;
}

.beam-analysis-heading p {
  max-width: 470px;
  margin-top: 14px;
  font-size: 0.9rem;
}

.beam-network {
  min-height: clamp(350px, 33vw, 390px);
  margin-top: clamp(28px, 3vw, 38px);
  border-color: rgba(221, 240, 221, 0.15);
  background:
    radial-gradient(circle at 50% 50%, rgba(116, 173, 81, 0.08), transparent 20%),
    linear-gradient(140deg, rgba(19, 27, 20, 0.74), rgba(5, 8, 6, 0.94) 52%),
    #060806;
  box-shadow: 0 18px 48px rgba(0, 0, 0, 0.3), inset 0 1px rgba(246, 252, 244, 0.04);
}

.beam-network-topline,
.beam-network-caption {
  min-height: 36px;
  font-size: 0.5rem;
}

.beam-network-svg {
  top: 36px;
  bottom: 36px;
  height: calc(100% - 72px);
}

.beam-network-path {
  stroke-width: 0.86;
  stroke-dasharray: 1.5 10;
  opacity: 0.7;
}

.beam-network-pulse {
  opacity: 0.82;
}

.beam-node {
  display: block;
  width: auto;
  min-height: 0;
  padding: 0;
  border: 0;
  background: transparent;
  box-shadow: none;
}

.beam-node::before {
  top: 50%;
  left: -12px;
  width: 4px;
  height: 4px;
  border-radius: 50%;
  box-shadow: 0 0 8px rgba(197, 245, 142, 0.7);
  transform: translateY(-50%);
}

.beam-node > span {
  display: block;
  color: rgba(201, 240, 149, 0.52);
  font-size: 0.48rem;
}

.beam-node strong {
  display: block;
  margin-top: 3px;
  color: rgba(238, 245, 235, 0.88);
  font-size: 0.68rem;
  font-weight: 600;
}

.beam-node small {
  display: block;
  margin-top: 3px;
  color: rgba(228, 238, 223, 0.38);
  font-size: 0.46rem;
}

.beam-node-ports,
.beam-node-auth,
.beam-node-api {
  text-align: right;
}

.beam-node-ports::before,
.beam-node-auth::before,
.beam-node-api::before {
  right: -12px;
  left: auto;
}

.beam-node-core {
  width: 92px;
  height: 92px;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

.beam-node-core-ring {
  display: none;
}

.beam-node-core img {
  width: 72%;
  filter: drop-shadow(0 6px 13px rgba(0, 0, 0, 0.45));
}

.beam-node-core-label {
  bottom: -11px;
  color: rgba(231, 243, 224, 0.47);
  font-size: 0.42rem;
  white-space: nowrap;
}

.beam-node-core > strong {
  display: none;
}

.beam-node-sqli { top: 25%; }
.beam-node-xss { top: 75%; }
.beam-node-ports { top: 25%; }
.beam-node-api { top: 75%; }

@media (max-width: 720px) {
  .beam-analysis-section {
    padding-top: 58px;
    padding-bottom: 68px;
  }

  .beam-analysis-heading {
    grid-template-columns: 1fr;
    gap: 18px;
  }

  .beam-analysis-heading h2 {
    font-size: clamp(2.05rem, 9vw, 2.8rem);
  }

  .beam-network {
    min-height: 348px;
    margin-top: 27px;
  }

  .beam-network-topline,
  .beam-network-caption {
    min-height: 33px;
    font-size: 0.43rem;
  }

  .beam-network-svg {
    top: 33px;
    bottom: 33px;
    height: calc(100% - 66px);
  }

  .beam-node {
    width: auto;
    min-height: 0;
    padding: 0;
  }

  .beam-node strong { font-size: 0.58rem; }
  .beam-node > span { font-size: 0.42rem; }
  .beam-node small { display: none; }
  .beam-node::before { left: -8px; }

  .beam-node-ports::before,
  .beam-node-auth::before,
  .beam-node-api::before { right: -8px; left: auto; }

  .beam-node-core {
    width: 76px;
    height: 76px;
  }

  .beam-node-core-label {
    bottom: -12px;
    font-size: 0.35rem;
  }

  .beam-node-sqli { left: 20%; }
  .beam-node-dns { left: 13%; }
  .beam-node-xss { left: 20%; }
  .beam-node-ports { left: 80%; }
  .beam-node-auth { left: 87%; }
  .beam-node-api { left: 80%; }
}

body .site-shell > main > .beam-analysis-section {
  filter: none !important;
  background: linear-gradient(180deg, #020403 0%, #020403 58%, #000 100%);
}

.radar-analysis-layout {
  display: grid;
  grid-template-columns: minmax(250px, 0.66fr) minmax(0, 1.34fr);
  gap: clamp(28px, 4.5vw, 70px);
  align-items: center;
  width: min(100%, 1080px);
  margin: 0 auto;
}

.radar-analysis-layout > .beam-analysis-heading {
  display: block;
  width: auto;
  margin: 0;
  filter: grayscale(1);
  font-family: "Inter Variable", "Inter", sans-serif;
  font-style: normal;
}

.radar-analysis-layout .section-marker {
  margin-bottom: 30px;
}

.radar-analysis-layout .beam-analysis-heading h2 {
  color: #eef4ef;
  font-size: clamp(2.2rem, 3.35vw, 3.15rem);
  font-family: "Inter Variable", "Inter", sans-serif;
  font-style: normal;
  font-weight: 510;
  letter-spacing: -0.065em;
  line-height: 0.92;
}

.radar-analysis-layout .beam-analysis-heading h2 em {
  color: inherit;
  font-family: inherit;
  font-style: normal;
  font-weight: inherit;
}

.radar-analysis-layout .beam-analysis-heading p {
  max-width: 355px;
  font-family: "Inter Variable", "Inter", sans-serif;
  font-style: normal;
}

.radar-analysis-figure {
  min-height: clamp(345px, 34vw, 410px);
  width: min(100%, 640px);
  margin: 0 0 0 auto;
  overflow: visible;
  border: 0 !important;
  background: none !important;
  box-shadow: none !important;
}

.radar-analysis-figure::before {
  display: none !important;
}

.radar-analysis-svg {
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 100%;
  filter: grayscale(1);
  transform: none;
}

.radar-analysis-tag {
  filter: grayscale(1);
}

.radar-analysis-core {
  width: 98px;
  height: 98px;
}

.radar-analysis-core img {
  width: 78%;
  opacity: 1;
  filter: none !important;
}

.radar-analysis-core span {
  display: none;
}

@media (max-width: 720px) {
  .radar-analysis-layout {
    grid-template-columns: 1fr;
    gap: 30px;
  }

  .radar-analysis-layout .section-marker {
    margin-bottom: 19px;
  }

  .radar-analysis-layout .beam-analysis-heading h2 {
    font-size: clamp(2.05rem, 9vw, 2.8rem);
  }

  .radar-analysis-figure {
    min-height: 330px;
    width: min(100%, 490px);
    margin-right: auto;
    margin-left: auto;
  }

  .radar-analysis-core {
    width: 74px;
    height: 74px;
  }
}
.result-guarantee-section {
  position: relative;
  overflow: hidden;
  padding: clamp(86px, 10vw, 138px) max(24px, calc((100vw - 1080px) / 2));
  color: #edf1eb;
  background: linear-gradient(180deg, #000 0%, #050706 100%);
}

.result-guarantee-section::before {
  position: absolute;
  inset: 0;
  border-top: 1px solid rgba(235, 244, 232, 0.11);
  border-bottom: 1px solid rgba(235, 244, 232, 0.08);
  content: "";
  pointer-events: none;
}

.result-guarantee-layout {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: minmax(0, 1.16fr) minmax(245px, 0.84fr);
  gap: clamp(40px, 8vw, 124px);
  align-items: end;
  max-width: 1080px;
  margin: 0 auto;
}

.result-guarantee-copy .section-marker {
  margin-bottom: 28px;
}

.result-guarantee-copy h2 {
  max-width: 720px;
  margin: 0;
  color: #f0f3ef;
  font-family: "Inter Variable", "Inter", sans-serif;
  font-size: clamp(2.75rem, 5.1vw, 5.4rem);
  font-weight: 510;
  letter-spacing: -0.09em;
  line-height: 0.88;
}

.result-guarantee-copy h2 em {
  color: rgba(240, 243, 239, 0.62);
  font: inherit;
  font-style: normal;
}

.result-guarantee-copy > p {
  max-width: 540px;
  margin: 28px 0 0;
  color: rgba(232, 239, 230, 0.62);
  font-size: clamp(0.89rem, 1.15vw, 1rem);
  line-height: 1.7;
}

.result-guarantee-rule {
  position: relative;
  min-height: 316px;
  padding: 22px 0 0 32px;
  border-left: 1px solid rgba(232, 241, 230, 0.18);
}

.result-guarantee-rule::before {
  position: absolute;
  top: 0;
  left: -3px;
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: #eef3ed;
  box-shadow: 0 0 14px rgba(238, 243, 237, 0.38);
  content: "";
}

.result-guarantee-kicker {
  display: block;
  color: rgba(231, 240, 228, 0.42);
  font-family: "IBM Plex Mono", "SFMono-Regular", Consolas, monospace;
  font-size: 0.55rem;
  font-weight: 700;
  letter-spacing: 0.14em;
}

.result-guarantee-zero {
  margin: -4px 0 -17px -7px;
  color: rgba(240, 244, 239, 0.88);
  font-family: "Inter Variable", "Inter", sans-serif;
  font-size: clamp(7.5rem, 12vw, 10rem);
  font-weight: 460;
  letter-spacing: -0.15em;
  line-height: 0.84;
}

.result-guarantee-rule > p {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 0;
  font-family: "IBM Plex Mono", "SFMono-Regular", Consolas, monospace;
  font-size: 0.6rem;
  letter-spacing: 0.1em;
}

.result-guarantee-rule > p strong {
  color: #f0f4ef;
  font-weight: 700;
}

.result-guarantee-rule > p span {
  color: rgba(230, 239, 228, 0.5);
}

.result-guarantee-rule ul {
  margin: 30px 0 0;
  padding: 0;
  border-top: 1px solid rgba(232, 241, 230, 0.12);
  list-style: none;
}

.result-guarantee-rule li {
  padding: 11px 0;
  border-bottom: 1px solid rgba(232, 241, 230, 0.1);
  color: rgba(233, 240, 231, 0.62);
  font-size: 0.73rem;
  line-height: 1.4;
}

.result-guarantee-rule li::before {
  margin-right: 10px;
  color: rgba(240, 244, 239, 0.86);
  content: "+";
}

@media (max-width: 720px) {
  .result-guarantee-section {
    padding: 82px 24px;
  }

  .result-guarantee-layout {
    grid-template-columns: 1fr;
    gap: 52px;
  }

  .result-guarantee-copy h2 {
    font-size: clamp(2.7rem, 13vw, 4.3rem);
  }

  .result-guarantee-rule {
    min-height: 0;
    padding-left: 23px;
  }

  .result-guarantee-zero {
    font-size: clamp(7rem, 33vw, 9rem);
  }
}

.result-guarantee-section {
  padding: clamp(74px, 9vw, 126px) 32px;
  background: #050817;
}

.result-guarantee-section::before {
  border-color: rgba(208, 222, 255, 0.1);
}

.result-guarantee-frame {
  position: relative;
  z-index: 1;
  width: min(100%, 1220px);
  margin: 0 auto;
}

.result-guarantee-topline {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 14px;
  color: rgba(206, 216, 236, 0.54);
  font-family: "IBM Plex Mono", "SFMono-Regular", Consolas, monospace;
  font-size: 0.56rem;
  font-weight: 700;
  letter-spacing: 0.13em;
}

.result-guarantee-board {
  display: grid;
  grid-template-columns: minmax(0, 0.96fr) minmax(0, 0.6fr) minmax(0, 0.94fr);
  grid-template-rows: minmax(286px, 1.14fr) minmax(205px, 0.86fr);
  overflow: hidden;
  border: 1px solid rgba(214, 226, 251, 0.12);
  background: #090c12;
}

.result-guarantee-statement,
.result-guarantee-visual,
.result-guarantee-ledger {
  min-width: 0;
}

.result-guarantee-statement {
  display: flex;
  grid-row: 1 / span 2;
  grid-column: 1;
  flex-direction: column;
  align-items: flex-start;
  padding: clamp(28px, 4vw, 54px);
  border-right: 1px solid rgba(214, 226, 251, 0.1);
  background: #090b10;
}

.result-guarantee-statement .section-marker {
  margin: 0 0 clamp(38px, 5vw, 72px);
}

.result-guarantee-statement h2 {
  max-width: 505px;
  margin: 0;
  color: #f1f4f8;
  font-family: "Inter Variable", "Inter", sans-serif;
  font-size: clamp(2.4rem, 4.1vw, 4.55rem);
  font-weight: 700;
  letter-spacing: -0.085em;
  line-height: 0.86;
  text-transform: uppercase;
}

.result-guarantee-statement h2 em {
  color: rgba(229, 235, 246, 0.64);
  font: inherit;
  font-style: normal;
}

.result-guarantee-statement > p {
  max-width: 360px;
  margin: 28px 0 0;
  color: rgba(222, 231, 245, 0.58);
  font-size: 0.82rem;
  line-height: 1.68;
}

.result-guarantee-note {
  margin-top: auto;
  padding-top: 36px;
  color: rgba(231, 239, 250, 0.45);
  font-family: "IBM Plex Mono", "SFMono-Regular", Consolas, monospace;
  font-size: 0.55rem;
  font-weight: 700;
  letter-spacing: 0.12em;
}

.result-guarantee-visual {
  position: relative;
  grid-row: 1;
  grid-column: 2 / span 2;
  overflow: hidden;
  margin: 0;
  border-bottom: 1px solid rgba(214, 226, 251, 0.1);
  background: radial-gradient(circle at 82% 14%, rgba(207, 57, 255, 0.7), transparent 35%), radial-gradient(circle at 68% 91%, rgba(255, 142, 38, 0.43), transparent 42%), linear-gradient(125deg, #06165c 0%, #182475 48%, #46136e 100%);
}

.result-guarantee-visual > img:first-child {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 66% 54%;
  opacity: 0.8;
  transform: scale(1.04);
}

.result-guarantee-visual::after {
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, rgba(5, 8, 23, 0.78) 0%, rgba(5, 8, 23, 0.1) 67%), linear-gradient(0deg, rgba(5, 8, 23, 0.58) 0%, transparent 58%);
  content: "";
}

.result-guarantee-visual-copy {
  position: absolute;
  z-index: 1;
  top: 34px;
  left: 34px;
  display: grid;
  gap: 4px;
  color: #f0f4fb;
  font-family: "Inter Variable", "Inter", sans-serif;
}

.result-guarantee-visual-copy span {
  color: rgba(232, 239, 251, 0.61);
  font-family: "IBM Plex Mono", "SFMono-Regular", Consolas, monospace;
  font-size: 0.53rem;
  font-weight: 700;
  letter-spacing: 0.13em;
}

.result-guarantee-visual-copy strong {
  font-size: clamp(1.15rem, 2vw, 1.75rem);
  letter-spacing: -0.06em;
}

.result-guarantee-logo {
  position: absolute;
  z-index: 1;
  right: 24px;
  bottom: 19px;
  width: 44px;
  height: 44px;
  object-fit: contain;
}

.result-guarantee-ledger {
  position: relative;
  display: grid;
  grid-row: 2;
  grid-column: 2 / span 2;
  grid-template-columns: 0.76fr 1.24fr;
  column-gap: 28px;
  padding: 24px 28px 22px;
  background: #0a0d13;
}

.result-guarantee-kicker {
  grid-column: 1;
  align-self: start;
  color: rgba(226, 236, 251, 0.46);
}

.result-guarantee-ledger .result-guarantee-zero {
  grid-row: 1 / span 2;
  grid-column: 1;
  align-self: end;
  margin: 0 0 -12px -6px;
  color: #edf2fa;
  font-size: clamp(6.6rem, 10vw, 9.2rem);
  font-weight: 580;
}

.result-guarantee-ledger > p {
  grid-column: 2;
  align-self: end;
  display: grid;
  gap: 5px;
  margin: 0;
  color: #edf2fa;
  font-family: "IBM Plex Mono", "SFMono-Regular", Consolas, monospace;
  font-size: 0.56rem;
  letter-spacing: 0.09em;
}

.result-guarantee-ledger > p strong {
  color: #f1f5fb;
}

.result-guarantee-ledger > p span {
  color: rgba(225, 235, 249, 0.5);
}

.result-guarantee-ledger ul {
  grid-column: 2;
  align-self: end;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  margin: 17px 0 0;
  padding: 11px 0 0;
  border-top: 1px solid rgba(214, 226, 251, 0.11);
}

.result-guarantee-ledger li {
  display: grid;
  gap: 3px;
  padding: 0;
  border: 0;
  color: rgba(229, 237, 249, 0.64);
  font-size: 0.61rem;
  line-height: 1.35;
}

.result-guarantee-ledger li::before {
  display: none;
}

.result-guarantee-ledger li span {
  color: rgba(232, 240, 251, 0.37);
  font-family: "IBM Plex Mono", "SFMono-Regular", Consolas, monospace;
  font-size: 0.5rem;
  letter-spacing: 0.08em;
}

@media (max-width: 760px) {
  .result-guarantee-section {
    padding: 64px 18px;
  }

  .result-guarantee-topline {
    margin: 0 5px 12px;
    font-size: 0.49rem;
  }

  .result-guarantee-board {
    grid-template-columns: 1fr;
    grid-template-rows: auto 245px auto;
  }

  .result-guarantee-statement {
    grid-row: 1;
    grid-column: 1;
    min-height: 390px;
    padding: 30px 26px;
    border-right: 0;
    border-bottom: 1px solid rgba(214, 226, 251, 0.1);
  }

  .result-guarantee-statement .section-marker {
    margin-bottom: 56px;
  }

  .result-guarantee-statement h2 {
    font-size: clamp(2.55rem, 12vw, 4rem);
  }

  .result-guarantee-visual {
    grid-row: 2;
    grid-column: 1;
  }

  .result-guarantee-visual-copy {
    top: 25px;
    left: 25px;
  }

  .result-guarantee-ledger {
    grid-row: 3;
    grid-column: 1;
    grid-template-columns: 0.72fr 1.28fr;
    min-height: 205px;
    padding: 23px 22px 20px;
    column-gap: 18px;
  }

  .result-guarantee-ledger ul {
    grid-template-columns: 1fr;
    gap: 6px;
    margin-top: 12px;
    padding-top: 9px;
  }

  .result-guarantee-ledger li {
    grid-template-columns: 24px 1fr;
    align-items: baseline;
  }
}

.result-guarantee-visual > img:first-child {
  opacity: 1 !important;
  object-position: 68% 52%;
  filter: saturate(1.5) brightness(1.09) contrast(1.08) !important;
  mix-blend-mode: normal;
  transform: scale(1.015);
}

.result-guarantee-visual::after {
  display: none;
}

.result-guarantee-photo {
  position: absolute;
  inset: 0;
  z-index: 0;
  background-image: url("assets/guarantee-chladni-texture-v1.webp?v=20261009");
  background-position: 78% 50%;
  background-size: cover;
  background-repeat: no-repeat;
  filter: saturate(1.45) brightness(1.08) contrast(1.08) !important;
}

body .site-shell > main > .result-guarantee-section {
  filter: none !important;
  background: #000 !important;
}

.result-guarantee-board,
.result-guarantee-statement,
.result-guarantee-ledger {
  background: #050505;
}

.result-guarantee-section {
  padding: clamp(72px, 8vw, 112px) 28px;
}

.result-guarantee-frame {
  width: min(100%, 1080px);
}

.result-guarantee-topline {
  margin-bottom: 12px;
}

.result-guarantee-board {
  grid-template-columns: minmax(0, 0.98fr) minmax(0, 1.02fr);
  grid-template-rows: minmax(378px, 1fr) auto;
  background: #050505;
}

.result-guarantee-statement {
  grid-row: 1;
  grid-column: 1;
  min-height: 378px;
  padding: clamp(32px, 4.2vw, 52px);
  border-right: 1px solid rgba(255, 255, 255, 0.12);
  border-bottom: 0;
}

.result-guarantee-statement .section-marker {
  margin-bottom: clamp(40px, 6vw, 76px);
}

.result-guarantee-statement h2 {
  max-width: 440px;
  font-size: clamp(2.5rem, 4.2vw, 4.25rem);
  line-height: 0.9;
}

.result-guarantee-statement > p {
  max-width: 330px;
  margin-top: 25px;
  color: rgba(238, 241, 245, 0.58);
}

.result-guarantee-note,
.result-guarantee-visual-copy,
.result-guarantee-logo {
  display: none;
}

.result-guarantee-visual {
  grid-row: 1;
  grid-column: 2;
  min-height: 378px;
  border-bottom: 0;
  background: #000 !important;
}

.result-guarantee-photo {
  background-position: 75% 52%;
  filter: saturate(1.18) contrast(1.04) !important;
}

.result-guarantee-ledger {
  grid-row: 2;
  grid-column: 1 / span 2;
  display: flex;
  align-items: center;
  gap: clamp(20px, 3vw, 38px);
  min-height: 98px;
  padding: 22px clamp(28px, 4vw, 50px);
  border-top: 1px solid rgba(255, 255, 255, 0.1);
  background: #050505;
}

.result-guarantee-ledger .result-guarantee-kicker,
.result-guarantee-ledger > p,
.result-guarantee-ledger ul {
  grid-column: auto;
  grid-row: auto;
  align-self: auto;
}

.result-guarantee-ledger .result-guarantee-kicker {
  flex: 0 0 142px;
  color: rgba(237, 242, 249, 0.44);
}

.result-guarantee-ledger > p {
  display: grid;
  flex: 0 1 200px;
  gap: 3px;
  margin: 0;
  font-family: "Inter Variable", "Inter", sans-serif;
  font-size: 0.82rem;
  letter-spacing: -0.02em;
}

.result-guarantee-ledger > p strong {
  color: #f3f5f6;
  font-weight: 600;
}

.result-guarantee-ledger > p span {
  color: rgba(238, 242, 248, 0.5);
}

.result-guarantee-ledger ul {
  display: grid;
  flex: 1;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
  margin: 0;
  padding: 0 0 0 clamp(20px, 3vw, 36px);
  border-top: 0;
  border-left: 1px solid rgba(255, 255, 255, 0.1);
}

.result-guarantee-ledger li {
  grid-template-columns: none;
  color: rgba(238, 242, 248, 0.58);
}

@media (max-width: 760px) {
  .result-guarantee-section {
    padding: 58px 18px;
  }

  .result-guarantee-board {
    grid-template-columns: 1fr;
    grid-template-rows: auto 250px auto;
  }

  .result-guarantee-statement {
    grid-row: 1;
    grid-column: 1;
    min-height: 350px;
    border-right: 0;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
  }

  .result-guarantee-visual {
    grid-row: 2;
    grid-column: 1;
    min-height: 250px;
  }

  .result-guarantee-ledger {
    grid-row: 3;
    grid-column: 1;
    align-items: flex-start;
    flex-direction: column;
    gap: 18px;
    padding: 24px;
  }

  .result-guarantee-ledger .result-guarantee-kicker,
  .result-guarantee-ledger > p {
    flex-basis: auto;
  }

  .result-guarantee-ledger ul {
    width: 100%;
    padding: 15px 0 0;
    border-top: 1px solid rgba(255, 255, 255, 0.1);
    border-left: 0;
  }
}

.result-guarantee-section {
  padding: clamp(42px, 5vw, 72px) 24px;
}

.result-guarantee-frame {
  width: min(100%, 980px);
}

.result-guarantee-topline {
  display: none;
}

.result-guarantee-board {
  grid-template-columns: minmax(0, 1fr) minmax(240px, 0.56fr);
  grid-template-rows: minmax(245px, auto) auto;
  border-color: rgba(255, 255, 255, 0.1);
}

.result-guarantee-statement {
  min-height: 245px;
  padding: 31px 36px 28px;
}

.result-guarantee-statement .section-marker {
  margin-bottom: 30px;
}

.result-guarantee-statement h2 {
  max-width: 500px;
  font-size: clamp(2.15rem, 3.7vw, 3.5rem);
  letter-spacing: -0.075em;
  line-height: 0.91;
}

.result-guarantee-statement > p {
  max-width: 410px;
  margin-top: 16px;
  font-size: 0.78rem;
  line-height: 1.55;
}

.result-guarantee-visual {
  min-height: 245px;
}

.result-guarantee-photo {
  background-position: 77% 50%;
  filter: saturate(1.08) contrast(1.02) !important;
}

.result-guarantee-ledger {
  min-height: 76px;
  gap: 18px;
  padding: 16px 36px;
}

.result-guarantee-ledger .result-guarantee-kicker {
  flex-basis: 126px;
  font-size: 0.5rem;
}

.result-guarantee-ledger > p {
  flex-basis: 165px;
  font-size: 0.7rem;
}

.result-guarantee-ledger ul {
  gap: 10px;
  padding-left: 20px;
}

.result-guarantee-ledger li {
  font-size: 0.57rem;
}

.result-guarantee-ledger li span {
  font-size: 0.46rem;
}

@media (max-width: 760px) {
  .result-guarantee-section {
    padding: 38px 18px;
  }

  .result-guarantee-board {
    grid-template-columns: 1fr;
    grid-template-rows: auto 190px auto;
  }

  .result-guarantee-statement {
    min-height: 275px;
    padding: 29px 26px;
  }

  .result-guarantee-statement .section-marker {
    margin-bottom: 25px;
  }

  .result-guarantee-visual {
    min-height: 190px;
  }

  .result-guarantee-ledger {
    gap: 14px;
    padding: 20px 24px;
  }
}

.result-guarantee-section {
  padding: clamp(56px, 7vw, 96px) 24px;
  border: 0;
}

.result-guarantee-section::before {
  display: none;
}

.result-guarantee-minimal {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(300px, 0.82fr);
  gap: clamp(42px, 8vw, 112px);
  align-items: center;
  width: min(100%, 980px);
  margin: 0 auto;
}

.result-guarantee-copy-minimal .section-marker {
  margin-bottom: 28px;
}

.result-guarantee-copy-minimal h2 {
  max-width: 530px;
  margin: 0;
  color: #f3f4f4;
  font-family: "Inter Variable", "Inter", sans-serif;
  font-size: clamp(2.25rem, 4.1vw, 4.15rem);
  font-weight: 650;
  letter-spacing: -0.085em;
  line-height: 0.89;
}

.result-guarantee-copy-minimal h2 em {
  color: rgba(242, 244, 246, 0.56);
  font: inherit;
  font-style: normal;
}

.result-guarantee-copy-minimal p {
  max-width: 410px;
  margin: 24px 0 0;
  color: rgba(233, 237, 240, 0.58);
  font-size: 0.86rem;
  line-height: 1.7;
}

.result-guarantee-copy-minimal p strong {
  color: rgba(244, 247, 250, 0.92);
  font-weight: 650;
}

.result-guarantee-code-stack {
  position: relative;
  width: min(100%, 350px);
  height: 228px;
  justify-self: end;
}

.result-code-card {
  position: absolute;
  display: grid;
  gap: 18px;
  width: min(100%, 270px);
  min-height: 138px;
  padding: 17px 18px;
  overflow: hidden;
  border: 1px solid rgba(229, 237, 250, 0.18);
  border-radius: 12px;
  background: rgba(11, 13, 17, 0.94);
  box-shadow: 0 18px 34px rgba(0, 0, 0, 0.28);
  color: rgba(222, 231, 247, 0.77);
  font-family: "IBM Plex Mono", "SFMono-Regular", Consolas, monospace;
  transition: transform 420ms cubic-bezier(0.2, 0.8, 0.2, 1), border-color 420ms ease;
}

.result-code-card::before {
  position: absolute;
  top: 0;
  right: 0;
  width: 84px;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(122, 166, 255, 0.8));
  content: "";
}

.result-code-card header {
  display: flex;
  justify-content: space-between;
  color: rgba(203, 216, 242, 0.56);
  font-size: 0.56rem;
  font-weight: 700;
  letter-spacing: 0.08em;
}

.result-code-card pre {
  margin: 0;
  white-space: pre-wrap;
  color: rgba(233, 239, 250, 0.8);
  font: inherit;
  font-size: 0.68rem;
  line-height: 1.75;
}

.result-code-card-scope {
  top: 1px;
  left: 0;
  z-index: 1;
  opacity: 0.32;
  transform: rotate(-7deg);
}

.result-code-card-proof {
  top: 31px;
  left: 30px;
  z-index: 2;
  opacity: 0.6;
  transform: rotate(-3deg);
}

.result-code-card-outcome {
  top: 62px;
  left: 61px;
  z-index: 3;
  border-color: rgba(173, 200, 255, 0.34);
  transform: rotate(2deg);
}

.result-guarantee-code-stack:hover .result-code-card-scope {
  transform: translate(-13px, -14px) rotate(-9deg);
}

.result-guarantee-code-stack:hover .result-code-card-proof {
  transform: translate(5px, -8px) rotate(-3deg);
}

.result-guarantee-code-stack:hover .result-code-card-outcome {
  transform: translate(13px, -3px) rotate(3deg);
}

@media (max-width: 760px) {
  .result-guarantee-section {
    padding: 52px 24px 62px;
  }

  .result-guarantee-minimal {
    grid-template-columns: 1fr;
    gap: 42px;
  }

  .result-guarantee-copy-minimal h2 {
    font-size: clamp(2.45rem, 12vw, 3.75rem);
  }

  .result-guarantee-code-stack {
    justify-self: start;
    width: min(100%, 325px);
    height: 214px;
  }

  .result-code-card-outcome {
    left: 51px;
  }
}

.result-guarantee-section {
  padding: clamp(76px, 9vw, 132px) 24px;
  background: #000 !important;
}

.result-guarantee-centered {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  width: min(100%, 760px);
  margin: 0 auto;
  text-align: center;
}

.result-guarantee-centered h2 {
  max-width: 960px;
  margin: 0;
  color: #f3f4f4;
  font-family: "Inter Variable", "Inter", sans-serif;
  font-size: clamp(2.35rem, 4.3vw, 4.55rem);
  font-weight: 620;
  letter-spacing: -0.075em;
  line-height: 0.91;
}

.result-guarantee-centered h2 em {
  color: rgba(243, 244, 244, 0.56);
  font: inherit;
  font-style: normal;
}

.result-guarantee-centered p {
  max-width: 480px;
  margin: 26px 0 0;
  color: rgba(232, 237, 233, 0.58);
  font-size: clamp(0.82rem, 1.25vw, 0.96rem);
  line-height: 1.65;
}

.result-guarantee-meteor {
  position: absolute;
  z-index: 0;
  display: block;
  width: clamp(108px, 14vw, 218px);
  height: auto;
  pointer-events: none;
  filter: none !important;
  opacity: 0.86;
  --parallax-x: 0px;
  --parallax-y: 0px;
  --parallax-scale: 1;
  --base-rotation: 0deg;
  transform: translate3d(var(--parallax-x), var(--parallax-y), 0) rotate(var(--base-rotation)) scale(var(--parallax-scale));
  transform-origin: center;
  transition: transform 180ms cubic-bezier(0.22, 1, 0.36, 1);
  will-change: transform;
}

.result-guarantee-debris {
  position: absolute;
  z-index: 0;
  display: block;
  width: clamp(118px, 13vw, 224px);
  height: clamp(126px, 14vw, 238px);
  object-fit: cover;
  pointer-events: none;
  --parallax-x: 0px;
  --parallax-y: 0px;
  --parallax-scale: 1;
  --base-rotation: 0deg;
  transform: translate3d(var(--parallax-x), var(--parallax-y), 0) rotate(var(--base-rotation)) scale(var(--parallax-scale));
  transform-origin: center;
  transition: transform 180ms cubic-bezier(0.22, 1, 0.36, 1);
  will-change: transform;
}

.result-guarantee-debris-top {
  top: clamp(-44px, -2vw, -18px);
  right: clamp(-22px, 1vw, 38px);
  object-position: 10% 44%;
  opacity: 0.9;
  --base-rotation: 13deg;
}

.result-guarantee-debris-left {
  bottom: clamp(-72px, -4vw, -30px);
  left: clamp(-42px, 1vw, 38px);
  width: clamp(132px, 15vw, 246px);
  height: clamp(144px, 16vw, 262px);
  object-position: 54% 56%;
  opacity: 0.76;
  --base-rotation: -18deg;
}

.result-guarantee-debris-right {
  right: clamp(-38px, 2vw, 46px);
  bottom: clamp(20px, 4vw, 70px);
  width: clamp(76px, 8vw, 134px);
  height: clamp(124px, 12vw, 198px);
  object-position: 100% 60%;
  opacity: 0.72;
  --base-rotation: 23deg;
}

.result-guarantee-meteor-left {
  top: 5%;
  left: clamp(-106px, -4vw, -34px);
  --base-rotation: -22deg;
}

.result-guarantee-meteor-right {
  right: clamp(-112px, -4vw, -32px);
  bottom: -17%;
  width: clamp(92px, 11vw, 178px);
  opacity: 0.66;
  --base-rotation: 132deg;
}

@media (max-width: 760px) {
  .result-guarantee-section {
    padding: 76px 24px;
  }

  .result-guarantee-centered h2 {
    font-size: clamp(2.55rem, 12.4vw, 4.15rem);
  }

  .result-guarantee-meteor-left {
    top: -2%;
    left: -70px;
    width: 128px;
    opacity: 0.5;
  }

  .result-guarantee-meteor-right {
    right: -72px;
    bottom: -7%;
    width: 116px;
    opacity: 0.4;
  }

  .result-guarantee-debris-top {
    top: -30px;
    right: -30px;
    width: 124px;
    height: 140px;
    opacity: 0.58;
  }

  .result-guarantee-debris-left {
    bottom: -50px;
    left: -44px;
    width: 136px;
    height: 152px;
    opacity: 0.5;
  }

  .result-guarantee-debris-right {
    right: -22px;
    bottom: 18px;
    width: 68px;
    height: 116px;
    opacity: 0.48;
  }
}

.site-header,
.site-header.is-scrolled {
  padding: 12px clamp(18px, 4vw, 64px);
  border-bottom: 0;
  background: linear-gradient(180deg, rgba(3, 5, 4, 0.96) 0%, rgba(3, 5, 4, 0.9) 56%, rgba(3, 5, 4, 0.65) 78%, rgba(3, 5, 4, 0.48) 100%);
  box-shadow: none;
  backdrop-filter: none;
  transition: background 240ms ease, border-color 240ms ease, box-shadow 240ms ease;
}

.site-header::after {
  position: absolute;
  z-index: 0;
  top: 100%;
  right: 0;
  left: 0;
  height: clamp(90px, 9vw, 160px);
  background: linear-gradient(180deg, rgba(3, 5, 4, 0.48) 0%, rgba(3, 5, 4, 0.25) 54%, rgba(3, 5, 4, 0) 100%);
  content: "";
  pointer-events: none;
}

.site-header .header-inner {
  position: relative;
  z-index: 1;
  width: min(100%, 1380px);
  min-height: 44px;
}

.site-header .brand {
  gap: 11px;
  min-height: 34px;
}

.site-header .brand-icon {
  width: 34px;
  height: 34px;
  border: 0;
  background: transparent;
  box-shadow: none;
}

.site-header .brand-icon img,
.site-header.is-scrolled .brand-icon img {
  width: 39px;
  transform: none;
  filter: none !important;
}

.site-header .brand-name {
  color: rgba(246, 250, 247, 0.94);
  font-size: 0.68rem;
  font-weight: 760;
  letter-spacing: 0.16em;
}

.site-header .primary-nav {
  align-items: center;
  gap: clamp(18px, 2.6vw, 38px);
  margin-right: 0;
}

.site-header .primary-nav a {
  padding: 8px 0;
  color: rgba(235, 241, 235, 0.62);
  font-size: 0.61rem;
  font-weight: 720;
  letter-spacing: 0.12em;
  line-height: 1;
  transition: color 180ms ease;
}

.site-header .primary-nav a:hover,
.site-header .primary-nav a:focus-visible {
  color: rgba(246, 250, 247, 0.98);
}

.site-header .primary-nav a::after {
  right: 0;
  bottom: 0;
  background: var(--acid);
}

.site-header .header-cta {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  margin-left: clamp(18px, 2.3vw, 34px);
  padding: 10px 12px 10px 15px;
  border: 1px solid rgba(235, 240, 235, 0.22);
  border-radius: 999px;
  background: rgba(235, 240, 235, 0.06);
  color: rgba(246, 250, 247, 0.9);
  font-size: 0.6rem;
  font-weight: 760;
  letter-spacing: 0.12em;
  line-height: 1;
  text-transform: uppercase;
  transition: border-color 180ms ease, background 180ms ease, color 180ms ease, transform 180ms ease;
}

.site-header .header-cta b {
  color: var(--acid);
  font-size: 0.98rem;
  font-weight: 500;
  line-height: 0.6;
}

.site-header .header-cta:hover,
.site-header .header-cta:focus-visible {
  border-color: var(--acid);
  background: var(--acid);
  color: #091008;
  transform: translateY(-1px);
}

.site-header .header-cta:hover b,
.site-header .header-cta:focus-visible b {
  color: #091008;
}

.site-header .menu-toggle {
  width: 40px;
  height: 40px;
  border-color: rgba(235, 240, 235, 0.2);
  border-radius: 11px;
  background: rgba(235, 240, 235, 0.05);
}

.site-header .menu-toggle span:not(.sr-only) {
  background: rgba(246, 250, 247, 0.9);
}

@media (max-width: 860px) {
  .site-header,
  .site-header.is-scrolled {
    padding: 10px 18px;
  }

  .site-header .header-inner {
    min-height: 42px;
  }

  .site-header .primary-nav {
    top: calc(100% + 10px);
    right: 0;
    left: 0;
    gap: 0;
    padding: 7px;
    border-color: rgba(235, 240, 235, 0.14);
    border-radius: 13px;
    background: rgba(3, 5, 4, 0.97);
    box-shadow: 0 24px 56px rgba(0, 0, 0, 0.42);
  }

  .site-header .primary-nav a {
    padding: 14px 12px;
    color: rgba(235, 241, 235, 0.72);
    font-size: 0.62rem;
  }

  .site-header .header-cta {
    display: none;
  }
}

.analyzer-heading {
  display: block;
}

.analyzer-heading > div {
  width: min(100%, 820px);
}

.analyzer-heading h2 {
  max-width: 820px;
  display: grid;
  gap: 0.28em;
  letter-spacing: -0.055em;
  word-spacing: 0.035em;
  text-wrap: balance;
  line-height: 0.98;
}

.analyzer-heading h2 > span,
.analyzer-heading h2 > em {
  display: block;
}

.analyzer-heading h2 em {
  color: #ffffff;
}

.forensic-section {
  position: relative;
  isolation: isolate;
  display: flex;
  align-items: center;
  min-height: clamp(620px, 62vw, 790px);
  overflow: hidden;
  padding: clamp(92px, 10vw, 144px) clamp(24px, 7.2vw, 116px) clamp(120px, 12vw, 164px);
  border-top: 1px solid rgba(230, 238, 255, 0.14);
  border-bottom: 1px solid rgba(230, 238, 255, 0.1);
  background: #000000;
}

body .site-shell > main > .forensic-section {
  filter: none !important;
}

.forensic-halftone-canvas {
  position: absolute;
  z-index: -1;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  opacity: 0.94;
  pointer-events: none;
}

.forensic-content {
  position: relative;
  z-index: 1;
  width: min(48%, 580px);
}

.forensic-kicker {
  display: block;
  color: rgba(227, 236, 229, 0.66);
  font-size: 0.63rem;
  font-weight: 760;
  letter-spacing: 0.16em;
  line-height: 1.3;
}

.forensic-content h2 {
  margin: 0;
  color: #f5f7ff;
  display: grid;
  gap: 0.28em;
  font-size: clamp(2.2rem, 3.8vw, 4.2rem);
  font-weight: 560;
  letter-spacing: -0.055em;
  word-spacing: 0.035em;
  line-height: 0.98;
  text-wrap: balance;
}

.forensic-content h2 > span,
.forensic-content h2 > em {
  display: block;
}

.forensic-content h2 > span {
  white-space: nowrap;
}

.forensic-content h2 em {
  color: rgba(211, 223, 214, 0.6);
  font-style: normal;
}

.forensic-content p {
  max-width: 500px;
  margin: 30px 0 0;
  color: rgba(239, 243, 255, 0.8);
  font-size: clamp(0.91rem, 1.2vw, 1.04rem);
  line-height: 1.62;
}

.forensic-content p + p {
  margin-top: 14px;
  color: rgba(232, 237, 255, 0.58);
}

.forensic-globe-shell {
  position: absolute;
  z-index: 0;
  top: 50%;
  right: clamp(24px, 3.4vw, 66px);
  width: clamp(360px, 41vw, 660px);
  aspect-ratio: 1;
  transform: translateY(-51%);
}

.forensic-globe-shell::before {
  position: absolute;
  z-index: -1;
  inset: 13%;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(244, 248, 244, 0.1), rgba(205, 217, 208, 0.03) 50%, transparent 72%);
  filter: none;
  content: "";
  pointer-events: none;
  animation: forensic-aura 4.8s ease-in-out infinite;
}

.forensic-globe {
  display: block;
  width: 100%;
  height: 100%;
  border-radius: 50%;
  cursor: default;
  opacity: 0;
  touch-action: auto;
  filter: none;
  transition: opacity 1.1s ease;
}

.forensic-signal-sphere {
  position: absolute;
  z-index: 0;
  top: 50%;
  right: clamp(-2px, 1.4vw, 28px);
  width: clamp(440px, 45vw, 730px);
  aspect-ratio: 1;
  overflow: hidden;
  background: #000000;
  pointer-events: none;
  transform: translateY(-50%);
}

.forensic-signal-sphere-canvas {
  display: block;
  width: 100%;
  height: 100%;
  background: #000000;
}

.forensic-matrix-stage {
  --matrix-side: clamp(142px, 13.2vw, 218px);
  --matrix-half: calc(var(--matrix-side) / 2);
  position: absolute;
  z-index: 0;
  top: 50%;
  right: clamp(28px, 6vw, 124px);
  width: clamp(330px, 36vw, 570px);
  aspect-ratio: 1;
  overflow: hidden;
  perspective: 980px;
  pointer-events: none;
  transform: translateY(-50%);
}

.forensic-matrix-stage::before {
  position: absolute;
  z-index: 0;
  inset: 12% 10%;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(242, 245, 244, 0.07), transparent 66%);
  content: "";
  pointer-events: none;
}

.forensic-matrix-grid {
  position: absolute;
  z-index: 0;
  right: -3%;
  left: -3%;
  height: 31%;
  opacity: 0.55;
  background-image:
    linear-gradient(rgba(239, 244, 241, 0.12) 1px, transparent 1px),
    linear-gradient(90deg, rgba(239, 244, 241, 0.12) 1px, transparent 1px);
  background-size: clamp(24px, 2.3vw, 35px) clamp(24px, 2.3vw, 35px);
  mask-image: radial-gradient(ellipse 68% 82% at 50% 50%, #000 10%, transparent 73%);
  -webkit-mask-image: radial-gradient(ellipse 68% 82% at 50% 50%, #000 10%, transparent 73%);
}

.forensic-matrix-grid-top {
  top: 5%;
  transform: perspective(860px) rotateX(64deg) scaleX(0.94);
  transform-origin: center bottom;
}

.forensic-matrix-grid-bottom {
  right: 4%;
  bottom: 5%;
  left: 4%;
  opacity: 0.33;
  transform: perspective(860px) rotateX(64deg) scaleX(0.94);
  transform-origin: center top;
}

.forensic-evidence-cube {
  position: absolute;
  z-index: 1;
  top: 50%;
  left: 50%;
  width: var(--matrix-side);
  height: var(--matrix-side);
  transform-style: preserve-3d;
  animation: forensic-evidence-turn 18s cubic-bezier(0.45, 0, 0.2, 1) infinite alternate;
  will-change: transform;
}

.forensic-cube-face {
  position: absolute;
  box-sizing: border-box;
  width: 100%;
  height: 100%;
  overflow: hidden;
  border: 1px solid rgba(244, 248, 245, 0.42);
  background-color: rgba(240, 244, 241, 0.015);
  background-image:
    linear-gradient(90deg, transparent 32.8%, rgba(244, 248, 245, 0.22) 33%, rgba(244, 248, 245, 0.22) 33.5%, transparent 33.7%, transparent 66.2%, rgba(244, 248, 245, 0.22) 66.4%, rgba(244, 248, 245, 0.22) 66.9%, transparent 67.1%),
    linear-gradient(0deg, transparent 32.8%, rgba(244, 248, 245, 0.22) 33%, rgba(244, 248, 245, 0.22) 33.5%, transparent 33.7%, transparent 66.2%, rgba(244, 248, 245, 0.22) 66.4%, rgba(244, 248, 245, 0.22) 66.9%, transparent 67.1%);
  backface-visibility: hidden;
}

.forensic-cube-face::after {
  position: absolute;
  width: 33.333%;
  height: 33.333%;
  background: radial-gradient(circle at 52% 48%, rgba(248, 251, 249, 0.16), rgba(248, 251, 249, 0.028) 66%, transparent 70%);
  content: "";
}

.forensic-cube-front { transform: translateZ(var(--matrix-half)); }
.forensic-cube-back { transform: rotateY(180deg) translateZ(var(--matrix-half)); }
.forensic-cube-right { transform: rotateY(90deg) translateZ(var(--matrix-half)); }
.forensic-cube-left { transform: rotateY(-90deg) translateZ(var(--matrix-half)); }
.forensic-cube-top { transform: rotateX(90deg) translateZ(var(--matrix-half)); }
.forensic-cube-bottom { transform: rotateX(-90deg) translateZ(var(--matrix-half)); }

.forensic-cube-front::after { top: 33.333%; left: 33.333%; }
.forensic-cube-right::after { top: 0; left: 33.333%; }
.forensic-cube-top::after { top: 33.333%; left: 0; }
.forensic-cube-back::after,
.forensic-cube-left::after,
.forensic-cube-bottom::after { opacity: 0.38; }

@keyframes forensic-evidence-turn {
  0% { transform: translate3d(-50%, -50%, 0) rotateX(-15deg) rotateY(24deg); }
  46% { transform: translate3d(-50%, -50%, 0) rotateX(13deg) rotateY(-22deg); }
  100% { transform: translate3d(-50%, -50%, 0) rotateX(-7deg) rotateY(34deg); }
}

.forensic-globe-caption {
  position: absolute;
  right: 7%;
  bottom: 12%;
  display: inline-flex;
  gap: 8px;
  align-items: center;
  padding: 8px 10px;
  border: 1px solid rgba(231, 239, 233, 0.21);
  background: rgba(4, 6, 4, 0.62);
  color: rgba(232, 240, 234, 0.74);
  font-size: 0.56rem;
  font-weight: 760;
  letter-spacing: 0.13em;
  line-height: 1;
}

.forensic-globe-caption i {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #dfe8e1;
  box-shadow: none;
  animation: forensic-signal 1.35s ease-in-out infinite;
}

@keyframes forensic-aura {
  0%, 100% { opacity: 0.32; }
  50% { opacity: 0.48; }
}

@keyframes forensic-signal {
  0%, 100% { transform: scale(0.75); opacity: 0.58; }
  50% { transform: scale(1.35); opacity: 1; }
}

@media (prefers-reduced-motion: reduce) {
  .forensic-globe-shell::before,
  .forensic-globe-caption i {
    animation: none;
  }

  .forensic-evidence-cube {
    animation: none;
    transform: translate3d(-50%, -50%, 0) rotateX(-11deg) rotateY(28deg);
  }

}

@media (max-width: 760px) {
  .forensic-section {
    align-items: flex-start;
    min-height: 690px;
    padding: 96px 24px 96px;
  }

  .forensic-content h2 {
    font-size: clamp(2.05rem, 7.5vw, 3.2rem);
  }

  .forensic-content {
    width: 100%;
  }

  .forensic-content p {
    max-width: 430px;
    font-size: 0.91rem;
  }

  .forensic-globe-shell {
    position: relative;
    top: auto;
    right: auto;
    width: min(100%, 460px);
    margin: 30px auto -56px;
    transform: none;
  }

  .forensic-matrix-stage {
    position: relative;
    top: auto;
    right: auto;
    width: min(100%, 390px);
    margin: 26px auto -52px;
    transform: none;
  }

  .forensic-signal-sphere {
    position: relative;
    top: auto;
    right: auto;
    width: min(100%, 460px);
    margin: 34px auto -54px;
    transform: none;
  }

  .forensic-globe-caption {
    right: 5%;
    bottom: 12%;
  }

}

.result-guarantee-section {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  padding: clamp(78px, 9vw, 138px) clamp(24px, 7.2vw, 116px);
  border-top: 1px solid rgba(239, 245, 240, 0.14);
  border-bottom: 1px solid rgba(239, 245, 240, 0.1);
  background:
    radial-gradient(ellipse 42% 70% at 84% 46%, rgba(242, 247, 243, 0.055), transparent 72%),
    linear-gradient(90deg, rgba(242, 247, 243, 0.025) 1px, transparent 1px) 0 0 / 92px 100%,
    #020302 !important;
}

body .site-shell > main > .result-guarantee-section {
  filter: none !important;
  background:
    radial-gradient(ellipse 42% 70% at 84% 46%, rgba(242, 247, 243, 0.055), transparent 72%),
    linear-gradient(90deg, rgba(242, 247, 243, 0.025) 1px, transparent 1px) 0 0 / 92px 100%,
    #020302 !important;
}

.result-guarantee-section::before,
.result-guarantee-section::after {
  position: absolute;
  z-index: -1;
  display: block;
  content: "";
  pointer-events: none;
}

.result-guarantee-section::before {
  inset: 0;
  border: 0;
  background: linear-gradient(180deg, transparent 0 49.8%, rgba(241, 246, 242, 0.065) 50%, transparent 50.2%);
}

.result-guarantee-section::after {
  top: 50%;
  right: -12%;
  width: min(47vw, 660px);
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(241, 246, 242, 0.28), transparent);
}

.result-guarantee-layout {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(340px, 0.72fr);
  gap: clamp(42px, 9vw, 154px);
  align-items: end;
  width: min(100%, 1240px);
  margin: 0 auto;
}

.result-guarantee-copy {
  max-width: 690px;
}

.result-guarantee-kicker,
.result-guarantee-evidence-head,
.result-guarantee-zero b,
.result-guarantee-zero span,
.result-guarantee-criteria {
  font-size: 0.62rem;
  font-weight: 760;
  letter-spacing: 0.13em;
  line-height: 1.35;
  text-transform: uppercase;
}

.result-guarantee-kicker {
  display: inline-flex;
  gap: 10px;
  align-items: center;
  color: rgba(235, 242, 237, 0.61);
}

.result-guarantee-kicker i {
  width: 7px;
  height: 7px;
  border: 1px solid rgba(244, 248, 244, 0.82);
  border-radius: 50%;
}

.result-guarantee-copy h2 {
  max-width: 700px;
  margin: 22px 0 0;
  color: #f4f7f3;
  font-size: clamp(3rem, 6vw, 6.9rem);
  font-weight: 560;
  letter-spacing: -0.098em;
  line-height: 0.84;
}

.result-guarantee-copy h2 em {
  color: rgba(229, 236, 230, 0.53);
  font: inherit;
}

.result-guarantee-copy p {
  max-width: 535px;
  margin: 29px 0 0;
  color: rgba(234, 241, 236, 0.71);
  font-size: clamp(0.91rem, 1.2vw, 1.03rem);
  line-height: 1.62;
}

.result-guarantee-evidence {
  position: relative;
  min-width: 0;
  padding: 0 0 0 clamp(22px, 3vw, 42px);
  border-left: 1px solid rgba(239, 245, 240, 0.24);
}

.result-guarantee-evidence-head {
  display: flex;
  justify-content: space-between;
  gap: 18px;
  color: rgba(236, 243, 237, 0.47);
}

.result-guarantee-evidence-head span:last-child {
  color: rgba(244, 248, 244, 0.77);
  text-align: right;
}

.result-guarantee-trace {
  position: relative;
  height: 1px;
  margin: 24px 0 22px;
  overflow: visible;
  background: linear-gradient(90deg, rgba(241, 247, 242, 0.07), rgba(241, 247, 242, 0.42), rgba(241, 247, 242, 0.07));
}

.result-guarantee-trace::before,
.result-guarantee-trace::after {
  position: absolute;
  top: 50%;
  width: 5px;
  height: 5px;
  border: 1px solid rgba(244, 248, 244, 0.6);
  border-radius: 50%;
  background: #020302;
  content: "";
  transform: translateY(-50%);
}

.result-guarantee-trace::before { left: 0; }
.result-guarantee-trace::after { right: 0; }

.result-guarantee-trace i {
  position: absolute;
  top: 50%;
  left: 0;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #f1f6f2;
  box-shadow: 0 0 12px rgba(241, 246, 242, 0.42);
  transform: translate(-50%, -50%);
  animation: guarantee-evidence-trace 4.8s cubic-bezier(0.56, 0, 0.32, 1) infinite;
}

.result-guarantee-zero {
  display: flex;
  gap: 19px;
  align-items: center;
  min-height: 112px;
}

.result-guarantee-zero > strong {
  color: #f4f7f3;
  font-size: clamp(5rem, 8.6vw, 8.8rem);
  font-weight: 480;
  letter-spacing: -0.12em;
  line-height: 0.7;
}

.result-guarantee-zero div {
  display: grid;
  gap: 7px;
}

.result-guarantee-zero b { color: rgba(244, 248, 244, 0.9); }
.result-guarantee-zero span { color: rgba(232, 240, 234, 0.46); }

.result-guarantee-criteria {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
  margin: 25px 0 0;
  padding: 17px 0 0;
  border-top: 1px solid rgba(239, 245, 240, 0.17);
  list-style: none;
  color: rgba(231, 239, 233, 0.6);
}

.result-guarantee-criteria li {
  display: grid;
  gap: 6px;
}

.result-guarantee-criteria b {
  color: rgba(244, 248, 244, 0.85);
  font-size: 0.56rem;
}

@keyframes guarantee-evidence-trace {
  0%, 12% { left: 0; opacity: 0; }
  22% { opacity: 1; }
  76% { left: 100%; opacity: 1; }
  88%, 100% { left: 100%; opacity: 0; }
}

@media (max-width: 800px) {
  .result-guarantee-section {
    padding: 76px 24px;
  }

  .result-guarantee-layout {
    grid-template-columns: 1fr;
    gap: 52px;
  }

  .result-guarantee-evidence {
    padding: 25px 0 0;
    border-top: 1px solid rgba(239, 245, 240, 0.24);
    border-left: 0;
  }
}

@media (max-width: 520px) {
  .result-guarantee-section {
    padding: 62px 20px;
  }

  .result-guarantee-copy h2 {
    font-size: clamp(2.85rem, 13vw, 4.7rem);
  }

  .result-guarantee-evidence-head {
    align-items: flex-start;
    flex-direction: column;
    gap: 7px;
  }

  .result-guarantee-evidence-head span:last-child {
    text-align: left;
  }

  .result-guarantee-criteria {
    grid-template-columns: 1fr;
    gap: 13px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .result-guarantee-trace i {
    left: 50%;
    animation: none;
  }
}

body .site-shell > main > .result-guarantee-section {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  min-height: 0;
  padding: clamp(76px, 9vw, 132px) 24px;
  border: 0;
  background: #000 !important;
}

.result-guarantee-section::before {
  display: none;
}

.result-guarantee-section::after {
  display: none;
}

.result-guarantee-shield {
  position: absolute;
  z-index: 1;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  opacity: 1;
  pointer-events: none;
}

body .site-shell > main > .result-guarantee-section {
  padding: clamp(78px, 9vw, 132px) clamp(24px, 7.2vw, 116px);
}

.result-guarantee-layout-shield {
  position: relative;
  z-index: 2;
  display: grid;
  grid-template-columns: minmax(0, 0.82fr) minmax(390px, 1.18fr);
  gap: clamp(42px, 7vw, 112px);
  align-items: center;
  width: min(100%, 1240px);
  margin: 0 auto;
}

.result-guarantee-copy-shield {
  z-index: 1;
  align-items: flex-start;
  width: auto;
  margin: 0;
  text-align: left;
}

.result-guarantee-copy-shield h2 {
  font-size: clamp(2.7rem, 4.5vw, 4.8rem);
}

.result-guarantee-copy-shield p {
  margin-right: 0;
  margin-left: 0;
}

.result-guarantee-art-panel {
  position: relative;
  min-height: 0;
  aspect-ratio: 1.63;
  overflow: hidden;
  border: 0;
  background: transparent;
  box-shadow: none;
}

.result-guarantee-tentacle-canvas {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  pointer-events: none;
}

.result-guarantee-art-panel::before,
.result-guarantee-art-panel::after {
  display: none;
}

@media (max-width: 900px) {
  body .site-shell > main > .result-guarantee-section {
    padding: 76px 24px;
  }

  .result-guarantee-shield {
    opacity: 0.96;
  }

  .result-guarantee-layout-shield {
    grid-template-columns: 1fr;
    gap: 42px;
  }

  .result-guarantee-copy-shield {
    align-items: center;
    text-align: center;
  }

  .result-guarantee-copy-shield p {
    margin-right: auto;
    margin-left: auto;
  }

  .result-guarantee-art-panel {
    min-height: 0;
  }

}

@media (prefers-reduced-motion: no-preference) {
  .reveal {
    opacity: 0;
    transform: translate3d(0, 12px, 0);
    filter: blur(2px);
    will-change: opacity, transform, filter;
    transition:
      opacity 480ms cubic-bezier(0.16, 1, 0.3, 1),
      transform 720ms cubic-bezier(0.16, 1, 0.3, 1),
      filter 540ms cubic-bezier(0.16, 1, 0.3, 1);
  }

  .reveal.is-visible {
    opacity: 1;
    transform: translate3d(0, 0, 0);
    filter: blur(0);
    will-change: auto;
  }

  .reveal > .linear-stage {
    opacity: 0;
    transform: translate3d(0, 8px, 0);
    filter: blur(1px);
    transition:
      opacity 420ms cubic-bezier(0.16, 1, 0.3, 1),
      transform 620ms cubic-bezier(0.16, 1, 0.3, 1),
      filter 460ms cubic-bezier(0.16, 1, 0.3, 1);
    transition-delay: var(--linear-delay, 110ms);
  }

  .reveal.is-visible > .linear-stage {
    opacity: 1;
    transform: translate3d(0, 0, 0);
    filter: blur(0);
  }
}

body .site-shell > main > .contact-section.impact-cta {
  display: grid;
  place-items: center;
  min-height: 0;
  padding: clamp(30px, 3.4vw, 46px) clamp(22px, 7.2vw, 116px);
  border: 0;
  background: #030303 !important;
  box-shadow: none;
  isolation: isolate;
  overflow: hidden;
}

body .site-shell > main > .contact-section.impact-cta::before {
  content: "";
  position: absolute;
  z-index: -1;
  top: 50%;
  left: 50%;
  width: min(56vw, 720px);
  height: 150px;
  border-radius: 50%;
  background: radial-gradient(ellipse, rgba(236, 241, 235, 0.075) 0%, rgba(236, 241, 235, 0.026) 38%, transparent 72%);
  filter: blur(22px);
  transform: translate(-50%, -50%);
  pointer-events: none;
}

body .site-shell > main > .contact-section.impact-cta .impact-center-metrics {
  position: relative;
  z-index: 1;
  width: min(100%, 760px);
}

body .site-shell > main > .contact-section.impact-cta .impact-center-metric + .impact-center-metric {
  border-left-color: rgba(244, 247, 243, 0.18);
}

body .site-shell > main > .contact-section.impact-cta .impact-center-metric strong {
  color: #f4f7f3;
  font-size: clamp(3.1rem, 5vw, 5.35rem);
  font-variant-numeric: tabular-nums;
  font-feature-settings: "tnum" 1;
}

body .site-shell > main > .contact-section.impact-cta .impact-center-metric span {
  color: rgba(244, 247, 243, 0.52);
}

body .site-shell > main > .contact-section.impact-cta .impact-center-metrics--capabilities {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  column-gap: clamp(32px, 7vw, 108px);
  width: min(100%, 960px);
  padding-right: clamp(12px, 2vw, 24px);
  padding-left: clamp(12px, 2vw, 24px);
}

body .site-shell > main > .contact-section.impact-cta .impact-center-metrics--capabilities .impact-center-metric {
  justify-items: center;
  text-align: center;
}

@media (max-width: 600px) {
  body .site-shell > main > .contact-section.impact-cta .impact-center-metrics--capabilities {
    grid-template-columns: 1fr;
  }
}

.site-header .primary-nav {
  gap: 3px;
}

.site-header .primary-nav a {
  padding: 9px 10px;
  border: 1px solid transparent;
  border-radius: 7px;
  color: rgba(246, 250, 247, 0.58);
  transition:
    color 180ms cubic-bezier(0.16, 1, 0.3, 1),
    background-color 180ms cubic-bezier(0.16, 1, 0.3, 1),
    border-color 180ms cubic-bezier(0.16, 1, 0.3, 1),
    transform 180ms cubic-bezier(0.16, 1, 0.3, 1);
}

.site-header .primary-nav a::after {
  display: none;
}

.site-header .primary-nav a:hover,
.site-header .primary-nav a:focus-visible {
  border-color: rgba(255, 255, 255, 0.1);
  background: rgba(255, 255, 255, 0.075);
  color: #ffffff;
  transform: translateY(-1px);
}

.site-header .primary-nav a:focus-visible {
  outline: 1px solid rgba(255, 255, 255, 0.72);
  outline-offset: 2px;
}

.site-header .header-cta,
.site-header:not(.is-scrolled) .header-cta,
.site-header.is-scrolled .header-cta {
  border-color: rgba(255, 255, 255, 0.2);
  background: rgba(255, 255, 255, 0.045);
  color: rgba(255, 255, 255, 0.9);
}

.site-header .header-cta b {
  color: rgba(255, 255, 255, 0.72);
  transition: transform 180ms cubic-bezier(0.16, 1, 0.3, 1);
}

.site-header .header-cta:hover,
.site-header .header-cta:focus-visible,
.site-header:not(.is-scrolled) .header-cta:hover,
.site-header:not(.is-scrolled) .header-cta:focus-visible {
  border-color: rgba(255, 255, 255, 0.42);
  background: rgba(255, 255, 255, 0.12);
  color: #ffffff;
  transform: translateY(-1px);
}

.site-header .header-cta:hover b,
.site-header .header-cta:focus-visible b {
  color: #ffffff;
  transform: translate3d(2px, -2px, 0);
}

@media (max-width: 860px) {
  .site-header .primary-nav {
    gap: 2px;
  }

  .site-header .primary-nav a {
    border-radius: 6px;
  }
}

.focus-intro p {
  max-width: 560px;
  margin: 22px 0 0;
  color: rgba(232, 240, 234, 0.62);
  font-size: clamp(0.91rem, 1.05vw, 1rem);
  line-height: 1.62;
}

.validation-map-copy h2 {
  max-width: 640px;
  overflow-wrap: break-word;
  text-wrap: balance;
  line-height: 0.92;
}

.validation-map-copy .leensfish-mark,
.validation-map-copy .leensfish-mark *,
.result-guarantee-centered .leensfish-mark,
.result-guarantee-centered .leensfish-mark * {
  color: #91b467 !important;
  font-weight: 700 !important;
  letter-spacing: -0.025em;
  background: linear-gradient(100deg, #3f7040 0%, #719d58 45%, #b6cf82 100%) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
}

.validation-map-copy a.leensfish-mark {
  text-decoration: none;
}

.validation-map-copy a.leensfish-mark:hover,
.validation-map-copy a.leensfish-mark:focus-visible {
  filter: brightness(1.16);
}

.analyzer-workbench {
  border-color: #3b3c41;
  background: linear-gradient(142deg, #1f2023 0%, #17181b 48%, #0d0e10 100%);
  box-shadow: 0 24px 62px rgba(0, 0, 0, 0.42), inset 0 1px rgba(255, 255, 255, 0.045);
  color: rgba(239, 240, 242, 0.84);
}

.analyzer-toolbar {
  border-bottom-color: rgba(255, 255, 255, 0.1);
  background: #1f2023;
  color: rgba(239, 240, 242, 0.7);
}

.analyzer-brandmark i {
  border-color: rgba(244, 245, 246, 0.78);
  background: rgba(255, 255, 255, 0.09);
  box-shadow: none;
}

.analyzer-session,
.analyzer-filter-label,
.analyzer-filter-hint,
.analyzer-statusbar {
  color: rgba(225, 226, 229, 0.5);
}

.analyzer-session b,
.analyzer-session em,
.analyzer-filter-valid,
.analyzer-filter-hint,
.analyzer-statusbar > strong {
  color: rgba(247, 248, 249, 0.88);
}

.analyzer-session em i,
.analyzer-statusbar > strong i {
  background: #e8e9eb;
  box-shadow: 0 0 0 3px rgba(255, 255, 255, 0.055), 0 0 10px rgba(255, 255, 255, 0.15);
}

.analyzer-filter-row,
.analyzer-statusbar {
  border-color: rgba(255, 255, 255, 0.09);
  background: #17181b;
}

.analyzer-filter-input {
  border-color: #44454b;
  background: #101114;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.025);
}

.analyzer-filter-input code,
.analyzer-filter-button {
  color: rgba(239, 240, 242, 0.8);
}

.analyzer-filter-cursor {
  background: #e7e8ea;
}

.analyzer-filter-button,
.analyzer-pane-header {
  border-color: rgba(255, 255, 255, 0.13);
}

.analyzer-pane-header {
  background: #1a1b1e;
}

.analyzer-table-wrap {
  background: #101114;
}

.offensive-service-network,
.offensive-service-redteam {
  background-color: #092ba5;
  background-repeat: no-repeat;
  background-size: cover;
  border-color: rgba(178, 214, 255, 0.34);
  box-shadow: 0 16px 42px rgba(0, 24, 112, 0.3);
}

.offensive-service-network {
  background-image: url("assets/network-pentest-cobalt-v1.webp");
  background-position: 50% center;
}

.offensive-service-redteam {
  background-image: url("assets/redteam-cobalt-v1.webp");
  background-position: 64% center;
}

.offensive-service-network::before {
  background:
    linear-gradient(180deg, rgba(3, 22, 98, 0.42) 0%, rgba(8, 65, 190, 0.08) 42%, rgba(2, 17, 78, 0.64) 100%),
    linear-gradient(90deg, rgba(2, 14, 73, 0.48), transparent 66%);
}

.offensive-service-redteam::before {
  background:
    linear-gradient(180deg, rgba(3, 22, 98, 0.18) 0%, rgba(8, 65, 190, 0.08) 44%, rgba(2, 17, 78, 0.72) 100%),
    linear-gradient(90deg, rgba(2, 14, 73, 0.46), transparent 66%);
}

.offensive-service-network::after,
.offensive-service-redteam::after {
  background-image:
    radial-gradient(circle at 54% 48%, rgba(210, 235, 255, 0.12), transparent 56%),
    linear-gradient(rgba(206, 230, 255, 0.032) 1px, transparent 1px),
    linear-gradient(90deg, rgba(206, 230, 255, 0.026) 1px, transparent 1px);
  background-size: auto, 18px 18px, 18px 18px;
  opacity: 0.3;
}

.offensive-service-network .offensive-service-index,
.offensive-service-network .offensive-service-copy,
.offensive-service-network .offensive-service-brand,
.offensive-service-redteam .offensive-service-index,
.offensive-service-redteam .offensive-service-copy,
.offensive-service-redteam .offensive-service-brand {
  text-shadow: 0 2px 16px rgba(1, 21, 92, 0.72), 0 1px 3px rgba(0, 0, 0, 0.4);
}

@media (hover: hover) and (pointer: fine) {
  .offensive-service-network:hover,
  .offensive-service-redteam:hover {
    box-shadow: 0 28px 54px rgba(0, 0, 0, 0.48), 0 0 34px rgba(44, 132, 255, 0.2);
  }
}

.offensive-service-network,
.offensive-service-redteam {
  background-size: cover;
}

.offensive-services-grid {
  width: min(100%, 1000px);
}

.offensive-service-card {
  height: clamp(340px, 29vw, 390px);
}

@media (max-width: 760px) {
  .offensive-services-grid {
    width: min(100%, 380px);
  }

  .offensive-service-card {
    height: 380px;
  }
}

.offensive-service-card {
  will-change: transform, background-position;
  transition:
    transform 520ms cubic-bezier(0.16, 1, 0.3, 1),
    background-position 760ms cubic-bezier(0.16, 1, 0.3, 1),
    border-color 420ms ease,
    box-shadow 520ms ease;
}

.offensive-service-card > * {
  transition: transform 520ms cubic-bezier(0.16, 1, 0.3, 1);
}

@media (hover: hover) and (pointer: fine) {
  .offensive-service-card:hover {
    transform: translate3d(0, -8px, 0) scale(1.012);
    border-color: rgba(183, 220, 255, 0.66);
    box-shadow: 0 24px 44px rgba(2, 14, 73, 0.34), 0 0 28px rgba(44, 132, 255, 0.16);
  }

  .offensive-service-card:hover::after {
    opacity: 0.52;
    transform: scale(1.07) translate3d(0, -0.7%, 0);
  }

  .offensive-service-network:hover {
    background-position: 54% 48%;
  }

  .offensive-service-ddos:hover {
    background-position: 67% 48%;
  }

  .offensive-service-redteam:hover {
    background-position: 68% 48%;
  }

  .offensive-service-card:hover .offensive-service-index {
    transform: translate3d(3px, -2px, 0);
  }

  .offensive-service-card:hover .offensive-service-copy,
  .offensive-service-card:hover .offensive-service-brand,
  .offensive-service-card:hover .offensive-service-caption {
    transform: translate3d(3px, -3px, 0);
  }

  .offensive-service-card:hover .offensive-service-mark {
    transform: translate3d(0, -5px, 0) scale(1.025);
  }
}

@media (prefers-reduced-motion: reduce) {
  .offensive-service-card,
  .offensive-service-card > *,
  .offensive-service-card::after {
    transition: none !important;
  }

  .offensive-service-card:hover,
  .offensive-service-card:hover > * {
    transform: none !important;
  }
}

.offensive-service-redteam {
  background-color: #141716;
  background-image: url("assets/redteam-graphite-arcs-v1.webp");
  background-position: 55% center;
  border-color: rgba(222, 228, 223, 0.36);
  box-shadow: 0 16px 42px rgba(0, 0, 0, 0.42);
}

.offensive-service-redteam::before {
  background:
    linear-gradient(180deg, rgba(7, 10, 9, 0.16) 0%, rgba(19, 24, 22, 0.06) 42%, rgba(0, 0, 0, 0.68) 100%),
    linear-gradient(90deg, rgba(0, 0, 0, 0.32), transparent 68%);
}

.offensive-service-redteam::after {
  background-image:
    radial-gradient(circle at 54% 48%, rgba(245, 247, 245, 0.1), transparent 56%),
    linear-gradient(rgba(231, 235, 232, 0.026) 1px, transparent 1px),
    linear-gradient(90deg, rgba(231, 235, 232, 0.02) 1px, transparent 1px);
}

@media (hover: hover) and (pointer: fine) {
  .offensive-service-redteam:hover {
    background-position: 59% 48%;
    border-color: rgba(220, 255, 227, 0.72);
    box-shadow: 0 24px 44px rgba(1, 48, 17, 0.38), 0 0 28px rgba(57, 213, 93, 0.2);
  }
}

@media (hover: hover) and (pointer: fine) {
  .offensive-service-redteam:hover {
    transform: translate3d(0, -5px, 0) scale(1.006);
    background-position: 55% center;
    border-color: rgba(220, 255, 227, 0.58);
    box-shadow: 0 18px 34px rgba(1, 48, 17, 0.28), 0 0 18px rgba(57, 213, 93, 0.1);
  }

  .offensive-service-redteam:hover::after {
    opacity: 0.26;
    transform: scale(1.025);
  }

  .offensive-service-redteam:hover .offensive-service-index,
  .offensive-service-redteam:hover .offensive-service-copy,
  .offensive-service-redteam:hover .offensive-service-brand {
    transform: none;
  }
}

.offensive-service-network {
  background-color: #15933c;
  background-image: url("assets/network-green-towers-v1.webp");
  background-position: 50% center;
  border-color: rgba(206, 255, 218, 0.46);
  box-shadow: 0 16px 42px rgba(4, 79, 26, 0.3);
}

.offensive-service-network::before {
  background:
    linear-gradient(180deg, rgba(3, 70, 25, 0.3) 0%, rgba(7, 111, 41, 0.05) 42%, rgba(1, 39, 16, 0.62) 100%),
    linear-gradient(90deg, rgba(1, 48, 18, 0.4), transparent 68%);
}

.offensive-service-network::after {
  background-image:
    radial-gradient(circle at 54% 48%, rgba(239, 255, 241, 0.12), transparent 56%),
    linear-gradient(rgba(224, 255, 230, 0.03) 1px, transparent 1px),
    linear-gradient(90deg, rgba(224, 255, 230, 0.024) 1px, transparent 1px);
}

@media (hover: hover) and (pointer: fine) {
  .offensive-service-network:hover {
    transform: translate3d(0, -5px, 0) scale(1.006);
    background-position: 54% 48%;
    border-color: rgba(220, 255, 227, 0.58);
    box-shadow: 0 18px 34px rgba(1, 48, 17, 0.28), 0 0 18px rgba(57, 213, 93, 0.1);
  }

  .offensive-service-network:hover::after {
    opacity: 0.26;
    transform: scale(1.025);
  }
}

.offensive-service-network {
  background-color: #141716;
  background-image: url("assets/network-graphite-towers-v1.webp");
  background-position: 50% center;
  border-color: rgba(222, 228, 223, 0.36);
  box-shadow: 0 16px 42px rgba(0, 0, 0, 0.42);
}

.offensive-service-network::before {
  background:
    linear-gradient(180deg, rgba(7, 10, 9, 0.3) 0%, rgba(19, 24, 22, 0.05) 42%, rgba(0, 0, 0, 0.62) 100%),
    linear-gradient(90deg, rgba(0, 0, 0, 0.32), transparent 68%);
}

.offensive-service-network::after {
  background-image:
    radial-gradient(circle at 54% 48%, rgba(245, 247, 245, 0.1), transparent 56%),
    linear-gradient(rgba(231, 235, 232, 0.026) 1px, transparent 1px),
    linear-gradient(90deg, rgba(231, 235, 232, 0.02) 1px, transparent 1px);
}

.offensive-service-card {
  transition:
    transform 360ms ease-out,
    border-color 320ms ease,
    box-shadow 360ms ease;
}

@media (hover: hover) and (pointer: fine) {
  .offensive-service-card:hover {
    transform: translate3d(0, -6px, 0);
    border-color: rgba(191, 220, 255, 0.58);
    box-shadow: 0 18px 38px rgba(0, 0, 0, 0.28), 0 0 18px rgba(57, 130, 255, 0.1);
  }

  .offensive-service-card:hover::after {
    opacity: 0.36;
    transform: scale(1.025);
  }

  .offensive-service-network:hover {
    background-position: 50% center;
  }

  .offensive-service-ddos:hover {
    background-position: 64% center;
  }

  .offensive-service-redteam:hover {
    background-position: 55% center;
    border-color: rgba(220, 255, 227, 0.58);
    box-shadow: 0 18px 38px rgba(1, 48, 17, 0.28), 0 0 18px rgba(57, 213, 93, 0.1);
  }

  .offensive-service-card:hover .offensive-service-index,
  .offensive-service-card:hover .offensive-service-copy,
  .offensive-service-card:hover .offensive-service-brand,
  .offensive-service-card:hover .offensive-service-caption,
  .offensive-service-card:hover .offensive-service-mark {
    transform: none;
  }
}

.offensive-service-card.hover-lift-card {
  transition:
    transform 170ms cubic-bezier(0.22, 1, 0.36, 1),
    border-color 150ms ease-out,
    box-shadow 180ms ease-out;
}

@media (hover: hover) and (pointer: fine) {
  .offensive-service-card.hover-lift-card:hover {
    z-index: 2;
    transform: translate3d(0, -9px, 0) scale(1.012);
    border-color: rgba(213, 234, 255, 0.68);
    box-shadow: 0 23px 46px rgba(0, 0, 0, 0.31), 0 0 24px rgba(57, 130, 255, 0.16);
  }

  .offensive-service-card.hover-lift-card:hover::after {
    opacity: 0.52;
    transform: scale(1.055);
  }

  .offensive-service-card.hover-lift-card:hover .offensive-service-index,
  .offensive-service-card.hover-lift-card:hover .offensive-service-copy,
  .offensive-service-card.hover-lift-card:hover .offensive-service-brand,
  .offensive-service-card.hover-lift-card:hover .offensive-service-caption,
  .offensive-service-card.hover-lift-card:hover .offensive-service-mark {
    transform: translate3d(0, -2px, 0);
  }

  .offensive-service-redteam.hover-lift-card:hover {
    border-color: rgba(237, 241, 238, 0.62);
    box-shadow: 0 23px 46px rgba(0, 0, 0, 0.48), 0 0 24px rgba(232, 238, 233, 0.1);
  }

  .offensive-service-network.hover-lift-card:hover {
    border-color: rgba(237, 241, 238, 0.62);
    box-shadow: 0 23px 46px rgba(0, 0, 0, 0.48), 0 0 24px rgba(232, 238, 233, 0.1);
  }
}

.offensive-service-ddos {
  background-color: #15933c;
  background-image: url("assets/ddos-green-containment-v1.webp");
  background-position: 52% center;
  border-color: rgba(206, 255, 218, 0.46);
  box-shadow: 0 16px 42px rgba(4, 79, 26, 0.3);
}

.offensive-service-ddos::before {
  background:
    linear-gradient(180deg, rgba(3, 70, 25, 0.28) 0%, rgba(7, 111, 41, 0.06) 45%, rgba(1, 39, 16, 0.66) 100%),
    linear-gradient(90deg, rgba(1, 48, 18, 0.26), transparent 64%);
}

.offensive-service-ddos::after {
  background-image:
    radial-gradient(circle at 52% 50%, rgba(239, 255, 241, 0.14), transparent 56%),
    linear-gradient(rgba(224, 255, 230, 0.03) 1px, transparent 1px),
    linear-gradient(90deg, rgba(224, 255, 230, 0.024) 1px, transparent 1px);
}

.offensive-service-ddos .offensive-service-index,
.offensive-service-ddos .offensive-service-caption,
.offensive-service-ddos .offensive-service-mark {
  text-shadow: 0 2px 16px rgba(1, 48, 18, 0.72), 0 1px 3px rgba(0, 0, 0, 0.4);
}

@media (hover: hover) and (pointer: fine) {
  .offensive-service-ddos:hover {
    background-position: 52% center;
  }

  .offensive-service-ddos.hover-lift-card:hover {
    border-color: rgba(220, 255, 227, 0.72);
    box-shadow: 0 23px 46px rgba(1, 48, 17, 0.31), 0 0 24px rgba(57, 213, 93, 0.16);
  }
}

.offensive-services-section .offensive-service-card {
  display: flex;
  align-items: stretch;
  justify-content: flex-start;
  height: clamp(335px, 28vw, 385px);
  overflow: hidden;
  border: 1px solid rgba(244, 247, 243, 0.11);
  border-radius: 8px;
  background: #101011 !important;
  box-shadow: none;
  isolation: isolate;
  transition:
    transform 180ms cubic-bezier(0.22, 1, 0.36, 1),
    border-color 180ms ease-out,
    background-color 180ms ease-out,
    box-shadow 180ms ease-out;
}

.offensive-services-section .offensive-service-card::before {
  display: none;
}

.offensive-services-section .offensive-service-card::after {
  z-index: 0;
  background: none;
  opacity: 0;
  transform: none;
}

.offensive-services-section .offensive-service-card > * {
  z-index: 1;
}

.offensive-services-section .offensive-service-index {
  top: 22px;
  left: 24px;
  color: rgba(241, 243, 239, 0.58);
  font-size: 0.56rem;
  font-weight: 700;
  letter-spacing: 0.13em;
}

.offensive-services-section .offensive-service-icon {
  position: absolute;
  top: 58px;
  left: 24px;
  display: grid;
  width: 32px;
  height: 32px;
  place-items: center;
  color: rgba(232, 237, 229, 0.88);
}

.offensive-services-section .offensive-service-icon::after {
  position: absolute;
  top: 50%;
  left: 45px;
  width: 38px;
  height: 1px;
  background: rgba(232, 237, 229, 0.27);
  content: "";
}

.offensive-services-section .offensive-service-icon svg {
  display: block;
  width: 100%;
  height: 100%;
}

.offensive-services-section .offensive-service-copy,
.offensive-services-section .offensive-service-redteam .offensive-service-copy {
  top: 116px;
  right: 24px;
  bottom: auto;
  left: 24px;
}

.offensive-services-section .offensive-service-copy h3 {
  color: #f3f4f0;
  font-size: clamp(2.05rem, 3.1vw, 3.25rem);
  font-weight: 500;
  letter-spacing: -0.075em;
  line-height: 0.92;
}

.offensive-services-section .offensive-service-copy p {
  max-width: 248px;
  margin-top: 17px;
  color: rgba(232, 235, 229, 0.56);
  font-size: 0.76rem;
  letter-spacing: -0.015em;
  line-height: 1.42;
}

.offensive-services-section .offensive-service-brand {
  bottom: 22px;
  left: 24px;
  color: rgba(241, 243, 239, 0.46);
  font-size: 0.58rem;
  font-weight: 700;
  letter-spacing: 0.14em;
}

.offensive-services-section .offensive-service-ddos {
  background: #101011 !important;
}

.offensive-services-section .offensive-service-ddos .offensive-service-icon {
  color: rgba(207, 223, 188, 0.9);
}

.offensive-services-section .offensive-service-ddos .offensive-service-icon::after {
  background-color: rgba(207, 223, 188, 0.28);
}

@media (hover: hover) and (pointer: fine) {
  .offensive-services-section .offensive-service-card.hover-lift-card:hover {
    z-index: 2;
    transform: translate3d(0, -2px, 0) !important;
    border-color: rgba(244, 247, 243, 0.11);
    background: #0d0e11 !important;
    box-shadow: none;
  }

  .offensive-services-section .offensive-service-ddos.hover-lift-card:hover {
    border-color: rgba(244, 247, 243, 0.11);
    background: #0d0e11 !important;
    box-shadow: none;
  }

  .offensive-services-section .offensive-service-card:hover::after,
  .offensive-services-section .offensive-service-card:hover .offensive-service-index,
  .offensive-services-section .offensive-service-card:hover .offensive-service-copy,
  .offensive-services-section .offensive-service-card:hover .offensive-service-brand,
  .offensive-services-section .offensive-service-card:hover .offensive-service-caption,
  .offensive-services-section .offensive-service-card:hover .offensive-service-mark {
    opacity: initial;
    transform: none !important;
  }
}

@media (max-width: 760px) {
  .offensive-services-section .offensive-service-card {
    height: 365px;
  }
}

.offensive-services-section .offensive-service-card {
  height: clamp(360px, 30vw, 400px);
  border-color: rgba(245, 245, 243, 0.12);
  border-radius: 24px;
  background: linear-gradient(180deg, #202023 0%, #151518 34%, #09090b 67%, #030303 100%) !important;
  box-shadow: 0 12px 24px rgba(0, 0, 0, 0.18);
}

.offensive-services-section .offensive-service-card::after {
  display: none;
}

.offensive-services-section .offensive-service-card::before {
  display: block;
  z-index: 2;
  top: auto;
  right: 26px;
  bottom: 74px;
  left: 26px;
  width: auto;
  height: 1px;
  background: rgba(245, 245, 243, 0.2);
  content: "";
}

.offensive-services-section .offensive-service-copy,
.offensive-services-section .offensive-service-redteam .offensive-service-copy {
  z-index: 2;
  top: clamp(66px, 7vw, 82px);
  right: 26px;
  left: 26px;
}

.offensive-services-section .offensive-service-copy h3 {
  font-size: clamp(2.1rem, 2.55vw, 2.7rem);
  font-weight: 540;
  letter-spacing: -0.07em;
  line-height: 0.94;
}

.offensive-services-section .offensive-service-copy p {
  max-width: 240px;
  margin-top: 16px;
  color: rgba(232, 235, 229, 0.58);
  font-size: 0.75rem;
  line-height: 1.48;
}

.offensive-services-section .offensive-service-action {
  position: absolute;
  z-index: 2;
  right: 26px;
  bottom: 24px;
  display: inline-flex;
  gap: 9px;
  align-items: center;
  min-height: 34px;
  padding: 0 13px 0 15px;
  border-radius: 5px;
  background: #f4f4f1;
  color: #101011;
  font-family: "Inter", sans-serif;
  font-size: 0.64rem;
  font-weight: 700;
  letter-spacing: -0.015em;
  line-height: 1;
  transition: background 160ms ease, transform 160ms ease;
}

.offensive-services-section .offensive-service-action b {
  color: rgba(16, 16, 17, 0.58);
  font-size: 0.9rem;
  font-weight: 500;
}

.offensive-services-section .offensive-service-action:hover,
.offensive-services-section .offensive-service-action:focus-visible {
  background: #fff;
  transform: translateY(-1px);
}

@media (hover: hover) and (pointer: fine) {
  .offensive-services-section .offensive-service-card.hover-lift-card:hover {
    border-color: rgba(245, 245, 243, 0.18);
    background: linear-gradient(180deg, #242427 0%, #17171a 34%, #0a0a0c 67%, #030303 100%) !important;
    box-shadow: 0 16px 28px rgba(0, 0, 0, 0.22);
  }

}

.analyzer-workbench {
  border-color: #35363d;
  background: linear-gradient(145deg, #202125 0%, #18191d 52%, #101115 100%);
}

.analyzer-toolbar { background: #202125; }

.analyzer-filter-row,
.analyzer-statusbar { background: #17181c; }

.analyzer-filter-input,
.analyzer-table-wrap { background: #101115; }

.analyzer-packet-row,
.analyzer-packet-row:nth-child(2n),
.analyzer-packet-row-dns,
.analyzer-packet-row-tcp,
.analyzer-packet-row-tls,
.analyzer-packet-row-alert {
  background: rgba(255, 255, 255, 0.018);
}

.analyzer-packet-row:nth-child(2n) { background: rgba(255, 255, 255, 0.034); }

.analyzer-packet-row-selected {
  background: #292a31 !important;
  box-shadow: inset 3px 0 #7a80dc;
}

body .site-shell > main > .result-guarantee-section {
  display: block;
  min-height: 164svh;
  padding: 0 !important;
  overflow: clip;
  background: #030303 !important;
}

body .site-shell > main > .result-guarantee-section.reveal,
body .site-shell > main > .result-guarantee-section.reveal.is-visible {
  transform: none !important;
  filter: none !important;
}

.result-guarantee-ocean-stage {
  position: sticky;
  top: 0;
  display: flex;
  align-items: center;
  min-height: 100svh;
  overflow: hidden;
  isolation: isolate;
  background: #000;
}

.result-guarantee-ocean-canvas,
.result-guarantee-ocean-vignette {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
}

.result-guarantee-ocean-canvas {
  z-index: 1;
  display: block;
  visibility: hidden;
  mix-blend-mode: screen;
}

.result-guarantee-ocean-logo {
  position: absolute;
  z-index: 0;
  left: 50%;
  top: 50%;
  display: block;
  width: min(34vw, 420px);
  max-height: 50svh;
  object-fit: contain;
  opacity: 0;
  filter: grayscale(1) brightness(1.35) contrast(1.08);
  transform: translate3d(-50%, -50%, 0) scale(0.95);
  transform-origin: center;
  pointer-events: none;
  user-select: none;
  will-change: opacity, transform;
}

.result-guarantee-ocean-vignette {
  z-index: 1;
  background:
    radial-gradient(ellipse 38% 30% at 50% 50%, rgba(0, 0, 0, 0.37), transparent 100%),
    linear-gradient(180deg, rgba(0, 0, 0, 0.02), transparent 30%, transparent 76%, rgba(0, 0, 0, 0.16));
}

.result-guarantee-ocean-stage .result-guarantee-layout-shield {
  position: relative;
  z-index: 2;
  display: block;
  width: min(100% - 48px, 1120px);
  margin: 0 auto;
}

.result-guarantee-ocean-stage .result-guarantee-copy-shield {
  width: 100%;
  text-align: center;
  align-items: center;
}

.result-guarantee-ocean-stage .result-guarantee-copy-shield h2 {
  max-width: 1100px;
  color: #f2f2f2;
  font-size: clamp(3rem, 5.2vw, 5.4rem);
  line-height: 0.98;
  text-wrap: balance;
}

.result-guarantee-ocean-stage .result-guarantee-copy-shield h2 em {
  color: rgba(214, 214, 214, 0.58);
}

.result-guarantee-ocean-stage .result-guarantee-copy-shield p {
  margin: 32px auto 0;
  color: rgba(232, 232, 232, 0.7);
}

.leensfish-apply-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  min-height: 47px;
  margin-top: 28px;
  padding: 0 18px 0 20px;
  border: 1px solid rgba(238, 238, 238, 0.56);
  border-radius: 999px;
  background: rgba(232, 232, 232, 0.1);
  color: #f1f1f1;
  font-family: "Plus Jakarta Sans", sans-serif;
  font-size: 0.68rem;
  font-weight: 800;
  letter-spacing: 0.12em;
  line-height: 1;
  text-decoration: none;
  text-transform: uppercase;
  transition: background 180ms ease, border-color 180ms ease, color 180ms ease, transform 180ms ease;
}

.leensfish-apply-button b {
  font-size: 1rem;
  font-weight: 500;
  line-height: 1;
  transition: transform 180ms ease;
}

.leensfish-apply-button:hover,
.leensfish-apply-button:focus-visible {
  border-color: #f2f2f2;
  background: #f2f2f2;
  color: #090909;
  transform: translateY(-2px);
}

.leensfish-apply-button:hover b,
.leensfish-apply-button:focus-visible b {
  transform: translate(2px, -2px);
}

.leensfish-apply-button:focus-visible {
  outline: 2px solid #fff;
  outline-offset: 4px;
}

body .site-shell > main > .result-guarantee-section .leensfish-mark,
body .site-shell > main > .result-guarantee-section .leensfish-mark * {
  color: #91b467 !important;
  font-weight: 700 !important;
  letter-spacing: -0.025em;
  background: linear-gradient(100deg, #3f7040 0%, #719d58 45%, #b6cf82 100%) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
}

@media (max-width: 900px) {
  body .site-shell > main > .result-guarantee-section {
    min-height: 145svh;
  }

  .result-guarantee-ocean-stage .result-guarantee-layout-shield {
    width: min(100% - 48px, 700px);
  }

  .result-guarantee-ocean-stage .result-guarantee-copy-shield h2 {
    font-size: clamp(2.65rem, 7vw, 4.2rem);
  }

  .leensfish-apply-button {
    margin-top: 24px;
  }

  .result-guarantee-ocean-vignette {
    background:
      radial-gradient(ellipse 58% 38% at 50% 50%, rgba(0, 0, 0, 0.52), transparent 100%),
      linear-gradient(180deg, rgba(0, 0, 0, 0.06), transparent 65%, rgba(0, 0, 0, 0.2));
  }

  .result-guarantee-ocean-logo {
    width: min(46vw, 400px);
    max-height: 43svh;
  }
}

@media (max-width: 540px) {
  .result-guarantee-ocean-logo {
    width: min(68vw, 300px);
    max-height: 36svh;
  }

  .result-guarantee-ocean-stage .result-guarantee-copy-shield h2 {
    font-size: clamp(2.35rem, 10vw, 3.3rem);
    letter-spacing: -0.065em;
  }
}

.analyzer-protocol,
.analyzer-protocol-tcp,
.analyzer-protocol-tls,
.analyzer-protocol-dns,
.analyzer-protocol-http,
.analyzer-protocol-ssh { color: rgba(230, 231, 236, 0.76); }

.analyzer-table-scan {
  background: linear-gradient(180deg, transparent, rgba(128, 134, 220, 0.46) 46%, transparent);
  box-shadow: 0 0 16px rgba(112, 118, 207, 0.2);
}

.site-header .brand-icon {
  border: 0;
  border-radius: 0;
  background: transparent;
}

.site-header .brand-icon img,
.site-header.is-scrolled .brand-icon img {
  filter: none !important;
}

.site-header .brand-name {
  color: rgba(246, 246, 246, 0.94);
  font-family: "Plus Jakarta Sans", sans-serif;
  font-size: 0.66rem;
  font-weight: 760;
  letter-spacing: 0.14em;
}

.site-header .primary-nav {
  gap: clamp(18px, 2.3vw, 34px);
}

.site-header .primary-nav a {
  padding: 9px 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: rgba(238, 238, 238, 0.64);
  font-family: "Plus Jakarta Sans", sans-serif;
  font-size: 0.61rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  transform: none;
}

.site-header .primary-nav a:hover,
.site-header .primary-nav a:focus-visible {
  border: 0;
  background: transparent;
  color: #ffffff;
  box-shadow: none;
  transform: none;
}

.site-header .header-cta,
.site-header:not(.is-scrolled) .header-cta,
.site-header.is-scrolled .header-cta {
  border-color: rgba(255, 255, 255, 0.24);
  background: rgba(255, 255, 255, 0.06);
  color: rgba(255, 255, 255, 0.92);
  box-shadow: none;
  font-family: "Plus Jakarta Sans", sans-serif;
  font-size: 0.6rem;
  font-weight: 800;
  letter-spacing: 0.09em;
}

.site-header .header-cta b {
  color: rgba(255, 255, 255, 0.72);
}

.site-header .header-cta:hover,
.site-header .header-cta:focus-visible,
.site-header:not(.is-scrolled) .header-cta:hover,
.site-header:not(.is-scrolled) .header-cta:focus-visible {
  border-color: #f1f1f1;
  background: #f1f1f1;
  color: #090909;
  box-shadow: none;
}

.site-header .header-cta:hover b,
.site-header .header-cta:focus-visible b {
  color: #090909;
}

.site-header .menu-toggle {
  border-color: rgba(255, 255, 255, 0.2);
  background: rgba(255, 255, 255, 0.05);
}

.site-header .menu-toggle span:not(.sr-only) {
  background: #f1f1f1;
}

@media (max-width: 860px) {
  .site-header .primary-nav {
    gap: 2px;
    border-color: rgba(255, 255, 255, 0.14);
    background: rgba(5, 5, 5, 0.97);
  }

  .site-header .primary-nav a {
    padding: 14px 12px;
    border-radius: 6px;
  }
}

.focus-intro h2 {
  max-width: 570px;
  margin-top: clamp(28px, 3.5vw, 48px);
  font-size: clamp(2.25rem, 3.65vw, 3.9rem);
  line-height: 1.02;
  text-wrap: balance;
}

@media (max-width: 900px) {
  .focus-intro h2 {
    max-width: 620px;
    margin-top: 28px;
    font-size: clamp(2.15rem, 6.8vw, 3.25rem);
  }
}

.analyzer-toolbar {
  border-bottom-color: rgba(255, 255, 255, 0.1);
  background: #090a0c;
  color: rgba(237, 237, 239, 0.66);
}

.analyzer-brandmark {
  color: rgba(235, 235, 237, 0.7);
}

.analyzer-brandmark strong {
  color: #f4f4f5;
  font-weight: 750;
}

.analyzer-brandmark i {
  border-color: rgba(255, 255, 255, 0.54);
  background: #dcdcdf;
  box-shadow: 0 0 0 3px rgba(255, 255, 255, 0.035);
}

.analyzer-workbench {
  isolation: isolate;
  overflow: hidden;
  border-color: rgba(255, 255, 255, 0.16);
  border-radius: 18px;
  -webkit-mask-image: linear-gradient(to bottom, #000 0%, #000 88%, rgba(0, 0, 0, 0.68) 95%, transparent 100%);
  mask-image: linear-gradient(to bottom, #000 0%, #000 88%, rgba(0, 0, 0, 0.68) 95%, transparent 100%);
}

.analyzer-filter-input,
.analyzer-filter-button {
  border-radius: 7px;
}

.analyzer-table-wrap {
  border-radius: 10px;
}

.analyzer-statusbar {
  background: linear-gradient(180deg, rgba(9, 10, 12, 0.7), rgba(5, 5, 6, 0.32));
}

@media (max-width: 680px) {
  .analyzer-workbench {
    border-radius: 14px;
    -webkit-mask-image: linear-gradient(to bottom, #000 0%, #000 85%, rgba(0, 0, 0, 0.62) 94%, transparent 100%);
    mask-image: linear-gradient(to bottom, #000 0%, #000 85%, rgba(0, 0, 0, 0.62) 94%, transparent 100%);
  }
}

.threat-news-feed {
  margin-top: clamp(56px, 6vw, 82px);
}

.threat-news-status {
  flex-wrap: wrap;
  padding-bottom: 18px;
}

.threat-news-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: clamp(16px, 2vw, 28px);
  margin-top: 0;
  overflow: visible;
  background: transparent;
}

.threat-news-card {
  min-height: 426px;
  padding: 18px;
  overflow: hidden;
  border: 1px solid rgba(244, 248, 244, 0.11);
  border-radius: 10px;
  background: #0b0b0c;
}

.threat-news-card:hover,
.threat-news-card:focus-visible {
  border-color: rgba(244, 248, 244, 0.26);
  background: #101011;
  transform: translateY(-2px);
}

.threat-news-card-media {
  height: auto;
  aspect-ratio: 16 / 9;
  margin: -18px -18px 20px;
  background: #050505;
}

.threat-news-card-media::after {
  background: linear-gradient(180deg, rgba(4, 4, 4, 0) 36%, rgba(4, 4, 4, 0.42) 100%);
}

.threat-news-card-media img {
  transform: none;
}

.threat-news-card h3 {
  margin-top: 16px;
  -webkit-line-clamp: 3;
}

.threat-news-card p {
  margin-top: 12px;
  -webkit-line-clamp: 3;
}

.threat-news-card-footer {
  padding-top: 16px;
}

@media (max-width: 960px) {
  .threat-news-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .threat-news-card {
    min-height: 404px;
  }
}

@media (max-width: 760px) {
  .threat-news-grid {
    grid-template-columns: 1fr;
    gap: 14px;
  }

  .threat-news-card {
    min-height: 0;
  }

  .threat-news-card-media {
    aspect-ratio: 16 / 9;
  }
}

.offensive-services-section,
.offensive-services-section .offensive-services-grid {
  overflow: visible;
}

.offensive-services-section .offensive-services-grid {
  position: relative;
  isolation: isolate;
  margin-block: -8px;
  padding-block: 8px;
}

.offensive-services-section .offensive-service-card {
  box-sizing: border-box;
  will-change: auto;
  transition: background-color 180ms ease, transform 160ms ease;
}

@media (hover: hover) and (pointer: fine) {
  .offensive-services-section .offensive-service-card.hover-lift-card:hover {
    border-color: transparent;
    background: #0d0e11 !important;
    box-shadow: none !important;
    transform: translateY(-2px) !important;
  }
}

.offensive-services-section .offensive-service-card:focus-within {
  transform: translate3d(0, -6px, 0) !important;
  transition-delay: 0ms !important;
  border-color: rgba(245, 245, 243, 0.24);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.04),
    0 18px 30px rgba(0, 0, 0, 0.24);
}

@media (prefers-reduced-motion: reduce) {
  .offensive-services-section .offensive-service-card {
    transition: none;
  }

  .offensive-services-section .offensive-service-card.hover-lift-card:hover {
    transform: none !important;
  }
}

.client-modal-card {
  position: relative;
  display: grid;
  grid-template-columns: minmax(220px, 0.82fr) minmax(0, 1.18fr);
  align-items: center;
  column-gap: clamp(64px, 8vw, 104px);
  width: min(calc(100vw - 48px), 980px);
  min-height: 500px;
  padding: clamp(42px, 5vw, 64px);
  overflow: hidden;
  border: 1px solid rgba(244, 248, 244, 0.15);
  border-radius: 10px;
  background:
    linear-gradient(145deg, rgba(255, 255, 255, 0.045), transparent 42%),
    linear-gradient(180deg, #181a1b 0%, #101112 56%, #090a0a 100%);
  box-shadow: 0 30px 88px rgba(0, 0, 0, 0.48);
}

.privacy-lock-stage {
  position: absolute;
  z-index: 2;
  top: 50%;
  left: 50%;
  display: block;
  width: min(100%, 238px);
  aspect-ratio: 3 / 4;
  margin: 0;
  overflow: visible;
  border: 0;
  background: transparent;
  box-shadow: none;
  transform: translate(-50%, -50%);
  transition:
    left 520ms cubic-bezier(0.16, 1, 0.3, 1),
    transform 520ms cubic-bezier(0.16, 1, 0.3, 1);
}

.lock-sprite-body,
.lock-sprite-shackle {
  position: absolute;
  inset: 0;
  display: block;
  background-image: url("assets/privacy-lock-canonical-v2.webp");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 100% 100%;
}

.lock-sprite-body {
  clip-path: inset(43% 0 0 0);
  filter: drop-shadow(0 18px 18px rgba(0, 0, 0, 0.34));
}

.lock-sprite-shackle {
  clip-path: inset(0 12% 55% 12%);
  opacity: 0;
  transform: translateY(-30%);
  transform-origin: center bottom;
}

.privacy-modal-copy {
  position: relative;
  z-index: 1;
  grid-column: 2;
  align-self: center;
  display: flex;
  flex-direction: column;
  justify-content: center;
  max-width: 500px;
  padding: 20px 0;
  opacity: 0;
  visibility: hidden;
  transform: translateY(18px);
  transition:
    opacity 380ms ease-out,
    transform 480ms cubic-bezier(0.16, 1, 0.3, 1),
    visibility 0s linear 480ms;
}

.privacy-modal-copy .proof-label {
  margin: 0;
}

.privacy-modal-copy h2 {
  max-width: 500px;
  margin: 0 0 20px;
  font-size: clamp(2.25rem, 3.7vw, 3.8rem);
  letter-spacing: -0.07em;
  line-height: 0.96;
}

.privacy-modal-copy p {
  max-width: 475px;
  margin: 0;
  color: rgba(244, 248, 244, 0.65);
  font-size: 0.94rem;
  line-height: 1.75;
}

.privacy-modal-principles {
  display: grid;
  gap: 10px;
  max-width: 475px;
  margin: 32px 0 0;
  padding: 0;
  list-style: none;
}

.privacy-modal-principles li {
  display: flex;
  align-items: center;
  gap: 10px;
  padding-top: 10px;
  border-top: 1px solid rgba(244, 248, 244, 0.11);
  color: rgba(244, 248, 244, 0.66);
  font-size: 0.66rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.privacy-modal-principles li::before {
  width: 5px;
  height: 5px;
  flex: 0 0 auto;
  border-radius: 50%;
  background: #8b91e8;
  box-shadow: 0 0 0 3px rgba(139, 145, 232, 0.1);
}

.client-modal.is-open .lock-sprite-body {
  animation: client-lock-body-enter 360ms cubic-bezier(0.16, 1, 0.3, 1) both;
}

.client-modal.is-open .lock-sprite-shackle {
  animation: client-lock-shackle-close 720ms cubic-bezier(0.16, 1, 0.3, 1) both;
}

.client-modal.is-copy-visible .privacy-lock-stage {
  left: 19%;
  transform: translate(-50%, -50%) scale(0.88);
}

.client-modal.is-copy-visible .privacy-modal-copy {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
  transition-delay: 0s, 0s, 0s;
}

.client-modal-close {
  z-index: 3;
}

@keyframes client-lock-body-enter {
  from { opacity: 0; transform: translateY(12px) scale(0.97); }
  to { opacity: 1; transform: translateY(0) scale(1); }
}

@keyframes client-lock-shackle-close {
  0% { opacity: 0; transform: translateY(-30%) scale(0.98); }
  16% { opacity: 1; }
  74% { opacity: 1; transform: translateY(1.8%) scale(1.008); }
  88% { transform: translateY(-0.7%) scale(0.998); }
  100% { opacity: 1; transform: translateY(0) scale(1); }
}

@media (max-width: 620px) {
  .client-modal-card {
    display: block;
    width: min(calc(100vw - 28px), 600px);
    min-height: 620px;
    padding: 34px 28px 30px;
  }

  .privacy-lock-stage {
    top: 50%;
    width: min(100%, 198px);
  }

  .privacy-modal-copy {
    display: flex;
    max-width: none;
    padding: 318px 0 0;
  }

  .client-modal.is-copy-visible .privacy-lock-stage {
    top: 150px;
    left: 50%;
    transform: translate(-50%, -50%) scale(0.82);
  }
}

@media (prefers-reduced-motion: reduce) {
  .privacy-lock-stage,
  .privacy-modal-copy {
    transition: none;
  }

  .client-modal.is-open .lock-sprite-body,
  .client-modal.is-open .lock-sprite-shackle {
    animation: none;
    opacity: 1;
    transform: none;
  }
}

.privacy-lock-stage {
  display: grid;
  place-items: center;
  width: min(100%, 264px);
  aspect-ratio: 1;
}

.privacy-lock-sprite {
  position: relative;
  display: block;
  width: min(80%, 192px);
  aspect-ratio: 3 / 4;
  filter: drop-shadow(0 17px 18px rgba(0, 0, 0, 0.42));
}

.privacy-lock-frame {
  position: absolute;
  inset: 0;
  display: block;
  background-image: url("assets/privacy-lock-sprite-v1.webp");
  background-repeat: no-repeat;
  background-size: 400% 100%;
}

@media (max-width: 620px) {
  .privacy-lock-stage {
    width: min(100%, 218px);
  }
}

.privacy-lock-stage {
  width: min(100%, 232px);
  aspect-ratio: 184 / 220;
  background: transparent;
}

.privacy-reference-lock {
  display: block;
  width: 100%;
  height: auto;
  overflow: visible;
  filter: drop-shadow(0 18px 19px rgba(0, 0, 0, 0.38));
}

.privacy-lock-top,
.privacy-lock-bottom {
  fill: none;
  stroke: #f4f6ff;
  stroke-miterlimit: 10;
}

.privacy-lock-top {
  stroke-width: 15.39px;
  stroke-linecap: round;
  transition: d 300ms ease-out 150ms;
}

.privacy-lock-bottom {
  stroke-width: 15px;
}

.privacy-lock-fill {
  fill: #f4f6ff;
  transition: r 300ms ease-out 270ms;
}

.client-modal.is-open .privacy-lock-top {
  d: path("M41.5,93.69V56.93A49.24,49.24,0,0,1,90.73,7.69h2.54A49.24,49.24,0,0,1,142.5,56.93v33");
}

.client-modal.is-open .privacy-lock-fill {
  r: 180;
}

@media (max-width: 620px) {
  .privacy-lock-stage {
    width: min(100%, 188px);
  }
}

@media (prefers-reduced-motion: reduce) {
  .privacy-lock-top,
  .privacy-lock-fill {
    transition: none;
  }
}

.client-modal-card {
  isolation: isolate;
  opacity: 0;
  transform: translateY(22px) scale(0.82);
  clip-path: inset(36% 42% round 10px);
  transition:
    opacity 180ms ease,
    transform 240ms cubic-bezier(0.16, 1, 0.3, 1),
    clip-path 240ms cubic-bezier(0.16, 1, 0.3, 1);
}

.client-modal.is-open .client-modal-card {
  animation: client-privacy-window-open 720ms cubic-bezier(0.16, 1, 0.3, 1) both;
}

.privacy-reference-lock {
  opacity: 0;
  transform: translateY(12px) scale(0.84);
  transform-origin: center;
}

.client-modal.is-open .privacy-reference-lock {
  animation: client-privacy-lock-arrive 460ms cubic-bezier(0.16, 1, 0.3, 1) 80ms both;
}

.privacy-lock-top {
  transition: d 320ms cubic-bezier(0.16, 1, 0.3, 1) 330ms;
}

.privacy-lock-fill {
  transition: r 360ms cubic-bezier(0.16, 1, 0.3, 1) 460ms;
}

@keyframes client-privacy-window-open {
  0% {
    opacity: 0;
    transform: translateY(26px) scale(0.68);
    clip-path: inset(43% 44% round 10px);
  }
  56% {
    opacity: 1;
    transform: translateY(0) scale(1.018);
    clip-path: inset(0 0 round 10px);
  }
  100% {
    opacity: 1;
    transform: translateY(0) scale(1);
    clip-path: inset(0 0 round 10px);
  }
}

@keyframes client-privacy-lock-arrive {
  from { opacity: 0; transform: translateY(12px) scale(0.84); }
  to { opacity: 1; transform: translateY(0) scale(1); }
}

@media (prefers-reduced-motion: reduce) {
  .client-modal.is-open .client-modal-card,
  .client-modal.is-open .privacy-reference-lock {
    animation: none;
    opacity: 1;
    transform: none;
    clip-path: none;
  }
}

.client-modal-backdrop {
  opacity: 0;
  background: rgba(24, 24, 25, 0.78);
  -webkit-backdrop-filter: grayscale(1) saturate(0) blur(0);
  backdrop-filter: grayscale(1) saturate(0) blur(0);
  transition:
    opacity 360ms ease,
    backdrop-filter 520ms ease;
}

.client-modal.is-open .client-modal-backdrop {
  opacity: 1;
  -webkit-backdrop-filter: grayscale(1) saturate(0) blur(12px);
  backdrop-filter: grayscale(1) saturate(0) blur(12px);
}

.privacy-reference-lock {
  position: relative;
  z-index: 1;
}

.privacy-modal-copy > .proof-label,
.privacy-modal-copy > h2,
.privacy-modal-copy > p,
.privacy-modal-principles li {
  opacity: 0;
  transform: translateY(12px);
  transition:
    opacity 360ms ease,
    transform 480ms cubic-bezier(0.16, 1, 0.3, 1);
}

.client-modal.is-copy-visible .privacy-modal-copy > .proof-label,
.client-modal.is-copy-visible .privacy-modal-copy > h2,
.client-modal.is-copy-visible .privacy-modal-copy > p,
.client-modal.is-copy-visible .privacy-modal-principles li {
  opacity: 1;
  transform: translateY(0);
}

.client-modal.is-copy-visible .privacy-modal-copy > .proof-label { transition-delay: 80ms; }
.client-modal.is-copy-visible .privacy-modal-copy > h2 { transition-delay: 150ms; }
.client-modal.is-copy-visible .privacy-modal-copy > p { transition-delay: 230ms; }
.client-modal.is-copy-visible .privacy-modal-principles li:nth-child(1) { transition-delay: 310ms; }
.client-modal.is-copy-visible .privacy-modal-principles li:nth-child(2) { transition-delay: 370ms; }
.client-modal.is-copy-visible .privacy-modal-principles li:nth-child(3) { transition-delay: 430ms; }

.client-modal-close {
  opacity: 0;
  transform: translateY(-5px);
  transition:
    color 180ms ease,
    opacity 260ms ease 420ms,
    transform 360ms cubic-bezier(0.16, 1, 0.3, 1) 420ms;
}

.client-modal.is-open .client-modal-close {
  opacity: 1;
  transform: translateY(0);
}

@media (prefers-reduced-motion: reduce) {
  .client-modal-backdrop,
  .privacy-modal-copy > .proof-label,
  .privacy-modal-copy > h2,
  .privacy-modal-copy > p,
  .privacy-modal-principles li,
  .client-modal-close {
    transition: none;
  }
}

.site-footer {
  border-top: 0;
  background: linear-gradient(180deg, #070808 0%, #0b0b0c 48%, #101011 100%);
}

.footer-cloud-bottom {
  border-top: 0;
}

.footer-cloud-bottom {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  gap: 24px;
  min-height: 76px;
}

.footer-original-logo {
  display: inline-flex;
  align-items: center;
  width: clamp(164px, 12vw, 190px);
  min-height: clamp(164px, 12vw, 190px);
  margin-top: clamp(26px, 3.2vw, 54px);
}

.footer-original-logo img {
  display: block;
  width: 100%;
  height: auto;
  filter: none;
}

.footer-copyright {
  color: rgba(244, 248, 244, 0.44);
  font-family: "Inter Variable", "Inter", sans-serif;
  font-size: 0.65rem;
  font-weight: 600;
  letter-spacing: 0.055em;
  transition: color 160ms ease;
}

.footer-copyright {
  grid-column: 1;
  justify-self: start;
  margin: 0;
}

@media (max-width: 680px) {
  .footer-original-logo {
    width: 144px;
    min-height: 144px;
    margin-top: 18px;
  }

  .footer-cloud-bottom {
    grid-template-columns: 1fr;
    justify-items: start;
    gap: 16px;
    padding: 22px 0;
  }

  .footer-copyright {
    grid-column: auto;
  }

}

.focus-section .focus-panels {
  border: 0;
  margin-block: -3px;
  padding-block: 3px;
}

.focus-section .focus-panel,
.focus-section .focus-panel:last-child {
  min-height: clamp(345px, 29vw, 390px);
  padding-top: 96px;
  padding-bottom: 18px;
  border: 0 !important;
  border-radius: 15px;
  background: #101011 !important;
  background-image: none !important;
  background-blend-mode: normal;
  box-shadow: none !important;
  transition: background-color 180ms ease, transform 160ms ease;
}

.focus-section .focus-panel::before,
.focus-section .focus-panel::after {
  display: none;
}

.focus-section .focus-panel:hover {
  border-color: transparent;
  background: #0d0e11 !important;
  box-shadow: none !important;
  transform: translateY(-2px) !important;
}

.focus-section .focus-index {
  position: absolute;
  top: 18px;
  left: 21px;
  z-index: 0;
  background: radial-gradient(145% 180% at -18% 44%, rgba(255, 255, 255, 0.36) 0%, rgba(255, 255, 255, 0.22) 37%, rgba(255, 255, 255, 0.09) 72%, rgba(255, 255, 255, 0.018) 100%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  -webkit-text-fill-color: transparent;
  font-family: "Space Grotesk", sans-serif;
  font-size: clamp(3.45rem, 4.65vw, 5.25rem);
  font-weight: 500;
  letter-spacing: -0.09em;
  line-height: 0.9;
  filter: drop-shadow(0 9px 20px rgba(255, 255, 255, 0.025));
  pointer-events: none;
}

.focus-section .focus-panel h3 {
  position: relative;
  z-index: 1;
  margin: auto 0 12px;
  color: #f5f5f5;
  font-family: "Space Grotesk", sans-serif;
  font-size: clamp(1.35rem, 1.85vw, 1.72rem);
  font-weight: 590;
  letter-spacing: -0.055em;
  line-height: 1.06;
}

.focus-section .focus-panel p {
  position: relative;
  z-index: 1;
  max-width: 310px;
  color: rgba(255, 255, 255, 0.62);
  font-family: "Inter", sans-serif;
  font-size: 0.79rem;
  line-height: 1.52;
}

@media (max-width: 620px) {
  .focus-section .focus-panel,
  .focus-section .focus-panel:last-child {
    min-height: 330px;
    padding-top: 86px;
  }
}

body .site-shell > main > section {
  border-top: 0 !important;
  border-bottom: 0 !important;
}

body .site-shell > main > .beam-analysis-section {
  background: linear-gradient(180deg, #020403 0%, #020403 58%, #000000 100%);
}

body .site-shell > main > .validation-map-section {
  background: #000000;
}

body .site-shell > main > .proof-section {
  background: linear-gradient(180deg, #000000 0%, #020302 34%, #020302 100%);
}

.proof-section::before {
  display: none;
}

.proof-section h2 {
  margin-top: 0;
}

body .site-shell > main > .threat-news-section {
  display: block;
  padding-top: clamp(92px, 10vw, 142px);
  padding-bottom: clamp(92px, 10vw, 142px);
  background: linear-gradient(180deg, #020302 0%, #050606 36%, #070808 100%);
}

.threat-news-section::before {
  display: none;
}

.threat-news-heading h2 {
  margin-top: 0;
}

.threat-news-heading {
  position: relative;
  top: auto;
  width: min(100%, 780px);
  margin: 0 auto;
  text-align: center;
}

.threat-news-heading h2,
.threat-news-heading > p {
  margin-right: auto;
  margin-left: auto;
}

.threat-news-heading > p {
  max-width: 510px;
}

.threat-news-feed {
  width: min(100%, 1180px);
  margin: clamp(50px, 7vw, 94px) auto 0;
}


.analyzer-workbench {
  border-color: rgba(255, 255, 255, 0.17);
  background: linear-gradient(145deg, #121214 0%, #09090a 52%, #030304 100%);
  color: rgba(240, 240, 242, 0.78);
  -webkit-mask-image: linear-gradient(to bottom, #000 0%, #000 68%, rgba(0, 0, 0, 0.88) 79%, rgba(0, 0, 0, 0.38) 92%, transparent 100%);
  mask-image: linear-gradient(to bottom, #000 0%, #000 68%, rgba(0, 0, 0, 0.88) 79%, rgba(0, 0, 0, 0.38) 92%, transparent 100%);
}

.analyzer-toolbar,
.analyzer-filter-row,
.analyzer-statusbar,
.analyzer-pane-header {
  border-color: rgba(255, 255, 255, 0.09);
  background: #0a0a0b;
}

.analyzer-filter-input,
.analyzer-table-wrap {
  border-color: rgba(255, 255, 255, 0.13);
  background: #050506;
  box-shadow: inset 0 1px rgba(255, 255, 255, 0.025);
}

.analyzer-filter-input code,
.analyzer-filter-button,
.analyzer-pane-header,
.analyzer-pane-header b,
.analyzer-session b,
.analyzer-session em,
.analyzer-filter-valid,
.analyzer-filter-hint,
.analyzer-statusbar > strong {
  color: rgba(244, 244, 246, 0.88);
}

.analyzer-session,
.analyzer-filter-label,
.analyzer-statusbar,
.analyzer-pane-header > span:last-child,
.analyzer-packet-table,
.analyzer-tree,
.analyzer-tree small,
.analyzer-ascii {
  color: rgba(220, 220, 223, 0.54);
}

.analyzer-session em i,
.analyzer-statusbar > strong i,
.analyzer-filter-cursor {
  background: #ededee;
  box-shadow: 0 0 0 3px rgba(255, 255, 255, 0.045), 0 0 10px rgba(255, 255, 255, 0.12);
}

.analyzer-packet-row,
.analyzer-packet-row:nth-child(2n),
.analyzer-packet-row-dns,
.analyzer-packet-row-tcp,
.analyzer-packet-row-tls,
.analyzer-packet-row-alert {
  background: rgba(255, 255, 255, 0.016);
}

.analyzer-packet-row:nth-child(2n) {
  background: rgba(255, 255, 255, 0.032);
}

.analyzer-packet-row-selected {
  background: rgba(255, 255, 255, 0.075) !important;
  box-shadow: inset 3px 0 #e8e8ea;
}

.analyzer-protocol,
.analyzer-protocol-tcp,
.analyzer-protocol-tls,
.analyzer-protocol-dns,
.analyzer-protocol-http,
.analyzer-protocol-ssh,
.analyzer-tree li > span,
.analyzer-tree-alert strong,
.analyzer-tree-alert small,
.analyzer-bytes-grid {
  color: rgba(236, 236, 238, 0.76);
}

.analyzer-table-scan {
  background: linear-gradient(180deg, transparent, rgba(244, 244, 246, 0.5) 46%, transparent);
  box-shadow: 0 0 16px rgba(255, 255, 255, 0.17);
}

.analyzer-topology-pane {
  background: #070708;
}

.analyzer-topology-image {
  filter: none;
  opacity: 1;
}

.analyzer-topology-pane::before {
  background:
    linear-gradient(90deg, rgba(4, 7, 5, 0.54) 0%, rgba(4, 7, 5, 0.16) 66%, rgba(4, 7, 5, 0.03) 100%),
    linear-gradient(0deg, rgba(4, 7, 5, 0.44), transparent 58%);
}

.analyzer-topology-pane .analyzer-pane-header {
  background: rgba(7, 7, 8, 0.64);
}

.analyzer-topology-pane .analyzer-bytes-grid,
.analyzer-topology-pane .analyzer-ascii {
  color: rgba(243, 243, 245, 0.8);
}

.analyzer-brandmark i,
.analyzer-session em i,
.analyzer-statusbar > span:first-child i,
.analyzer-statusbar > strong i {
  display: none;
}

.analyzer-filter-button:hover {
  border-color: rgba(255, 255, 255, 0.34);
  color: #f3f3f4;
}

body .site-shell > main > .analyzer-section {
  border-top-color: rgba(255, 255, 255, 0.06);
  background: linear-gradient(180deg, #000000 0%, #020203 14%, #09090a 44%, #050506 68%, #000000 100%);
}

.analyzer-section::before {
  opacity: 0.18;
  background:
    linear-gradient(90deg, rgba(255, 255, 255, 0.022) 1px, transparent 1px) 0 0 / 128px 100%,
    linear-gradient(rgba(255, 255, 255, 0.018) 1px, transparent 1px) 0 0 / 100% 128px;
}

@keyframes analyzer-selected-signal {
  0%, 100% { color: rgba(238, 238, 240, 0.76); }
  50% { color: #ffffff; }
}

@media (max-width: 680px) {
  .analyzer-workbench {
    -webkit-mask-image: linear-gradient(to bottom, #000 0%, #000 64%, rgba(0, 0, 0, 0.86) 77%, rgba(0, 0, 0, 0.36) 92%, transparent 100%);
    mask-image: linear-gradient(to bottom, #000 0%, #000 64%, rgba(0, 0, 0, 0.86) 77%, rgba(0, 0, 0, 0.36) 92%, transparent 100%);
  }
}

body .site-shell > main > .threat-news-section {
  padding-top: clamp(64px, 7vw, 92px);
  padding-bottom: clamp(66px, 7vw, 92px);
  border-top: 0;
}

.threat-news-heading h2 {
  font-size: clamp(2.3rem, 3.7vw, 4.2rem);
}

.threat-news-heading > p {
  max-width: 470px;
  font-size: 0.84rem;
}

.threat-news-feed {
  margin: clamp(34px, 4vw, 52px) auto 0;
}

.threat-news-status {
  padding-bottom: 10px;
  border-bottom: 0;
}

.threat-news-grid {
  gap: clamp(14px, 1.6vw, 22px);
}

.threat-news-card {
  min-height: 358px;
  padding: 16px;
  border-radius: 8px;
}

.threat-news-card-media {
  height: clamp(160px, 14vw, 184px);
  aspect-ratio: auto;
  margin: -16px -16px 16px;
}

.threat-news-card h3 {
  margin-top: 14px;
}

.threat-news-card p {
  margin-top: 10px;
  -webkit-line-clamp: 2;
}

.threat-news-card-footer {
  padding-top: 13px;
}

@media (max-width: 760px) {
  .threat-news-card-media {
    height: auto;
    aspect-ratio: 16 / 9;
  }
}

.threat-news-heading {
  width: min(100%, 1180px);
}

.threat-news-heading h2 {
  max-width: none;
  font-size: clamp(2.3rem, 3.45vw, 3.65rem);
  line-height: 0.95;
  white-space: nowrap;
}

@media (max-width: 900px) {
  .threat-news-heading h2 {
    font-size: clamp(2.3rem, 7vw, 3.8rem);
    white-space: normal;
  }
}

.offensive-services-section .offensive-service-card {
  border-top-color: transparent !important;
  transition:
    border-color 220ms ease,
    box-shadow 260ms cubic-bezier(0.22, 1, 0.36, 1);
}

.offensive-services-section .offensive-service-card::before {
  display: none !important;
}

.offensive-services-section .offensive-service-card::after {
  position: absolute;
  z-index: 1;
  inset: 0;
  display: block !important;
  border-radius: inherit;
  background:
    radial-gradient(90% 66% at 50% 108%, rgba(255, 255, 255, 0.1) 0%, rgba(255, 255, 255, 0.028) 48%, transparent 76%),
    linear-gradient(180deg, transparent 35%, rgba(255, 255, 255, 0.018) 100%);
  mix-blend-mode: normal;
  opacity: 0;
  pointer-events: none;
  transform: none !important;
  transition: opacity 260ms cubic-bezier(0.22, 1, 0.36, 1);
  content: "";
}

.offensive-services-section .offensive-service-card > * {
  z-index: 2;
}

.offensive-services-section .offensive-service-copy h3,
.offensive-services-section .offensive-service-copy p,
.offensive-services-section .offensive-service-action,
.offensive-services-section .offensive-service-action b {
  transition:
    color 220ms ease,
    background-color 220ms ease,
    box-shadow 220ms ease,
    transform 220ms cubic-bezier(0.22, 1, 0.36, 1);
}

@media (hover: hover) and (pointer: fine) {
  .offensive-services-section .offensive-service-card.hover-lift-card:hover {
    z-index: auto !important;
    border-top-color: transparent !important;
    border-right-color: rgba(245, 245, 243, 0.16);
    border-bottom-color: rgba(245, 245, 243, 0.18);
    border-left-color: rgba(245, 245, 243, 0.16);
    background: linear-gradient(180deg, #202023 0%, #151518 34%, #09090b 67%, #030303 100%) !important;
    box-shadow: 0 22px 42px rgba(0, 0, 0, 0.32) !important;
    transform: none !important;
  }

  .offensive-services-section .offensive-service-card.hover-lift-card:hover::after {
    opacity: 1;
  }

  .offensive-services-section .offensive-service-card.hover-lift-card:hover .offensive-service-copy h3 {
    color: #ffffff;
  }

  .offensive-services-section .offensive-service-card.hover-lift-card:hover .offensive-service-copy p {
    color: rgba(240, 242, 238, 0.76);
  }

  .offensive-services-section .offensive-service-card.hover-lift-card:hover .offensive-service-action {
    background: #ffffff;
    box-shadow: 0 8px 18px rgba(0, 0, 0, 0.26), 0 0 0 1px rgba(255, 255, 255, 0.08);
  }

  .offensive-services-section .offensive-service-card.hover-lift-card:hover .offensive-service-action b {
    transform: translate3d(3px, -2px, 0);
  }

  .offensive-services-section .offensive-service-action:hover,
  .offensive-services-section .offensive-service-action:focus-visible {
    transform: none;
  }
}

.offensive-services-section .offensive-service-card:focus-within {
  border-top-color: transparent !important;
  border-right-color: rgba(245, 245, 243, 0.16);
  border-bottom-color: rgba(245, 245, 243, 0.18);
  border-left-color: rgba(245, 245, 243, 0.16);
  box-shadow: 0 22px 42px rgba(0, 0, 0, 0.32);
  transform: none !important;
}

body .site-shell > main > .result-guarantee-section.result-guarantee-editorial {
  display: block;
  min-height: auto;
  padding: clamp(76px, 10vw, 142px) 24px !important;
  overflow: visible;
  background: #000 !important;
}

.result-guarantee-editorial .result-guarantee-ocean-stage {
  position: relative;
  top: auto;
  display: block;
  min-height: 0;
  overflow: visible;
  background: transparent;
}

.result-guarantee-editorial .leensfish-showcase-card {
  width: min(100%, 1120px);
  margin: 0 auto;
  overflow: hidden;
  border: 1px solid rgba(255, 255, 255, 0.18);
  border-radius: 20px;
  background: #ecebe7;
  box-shadow: 0 28px 82px rgba(0, 0, 0, 0.42);
}

.result-guarantee-editorial .leensfish-showcase-visual {
  position: relative;
  min-height: clamp(275px, 29vw, 350px);
  overflow: hidden;
  isolation: isolate;
  background:
    radial-gradient(75% 140% at 14% 118%, rgba(100, 151, 86, 0.42), transparent 58%),
    radial-gradient(58% 104% at 82% 12%, rgba(196, 198, 206, 0.22), transparent 63%),
    linear-gradient(112deg, #070807 0%, #1a1b1c 45%, #101112 74%, #26272a 100%);
}

.result-guarantee-editorial .leensfish-showcase-visual::before {
  position: absolute;
  z-index: 0;
  inset: 0;
  content: "";
  background:
    linear-gradient(90deg, rgba(255, 255, 255, 0.05) 1px, transparent 1px) 0 0 / 68px 100%,
    linear-gradient(180deg, rgba(255, 255, 255, 0.04) 1px, transparent 1px) 0 0 / 100% 52px;
  opacity: 0.22;
  mask-image: linear-gradient(90deg, transparent, #000 16%, #000 84%, transparent);
}

.result-guarantee-editorial .result-guarantee-ocean-canvas,
.result-guarantee-editorial .result-guarantee-ocean-vignette {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}

.result-guarantee-editorial .result-guarantee-ocean-canvas {
  z-index: 1;
  opacity: 0.86;
  mix-blend-mode: screen;
}

.result-guarantee-editorial .result-guarantee-ocean-logo {
  z-index: 1;
  width: min(26vw, 300px);
  max-height: 70%;
  filter: grayscale(1) brightness(1.55) contrast(1.1);
}

.result-guarantee-editorial .result-guarantee-ocean-vignette {
  z-index: 2;
  background:
    radial-gradient(ellipse 42% 62% at 50% 54%, transparent 0%, rgba(0, 0, 0, 0.1) 62%, rgba(0, 0, 0, 0.48) 100%),
    linear-gradient(180deg, rgba(0, 0, 0, 0.22), transparent 40%, rgba(0, 0, 0, 0.35));
}

.result-guarantee-editorial .leensfish-showcase-nav {
  position: absolute;
  z-index: 3;
  top: 24px;
  left: 50%;
  display: flex;
  align-items: center;
  gap: clamp(14px, 2vw, 28px);
  min-height: 42px;
  padding: 0 17px;
  border: 1px solid rgba(255, 255, 255, 0.14);
  border-radius: 8px;
  background: rgba(8, 9, 9, 0.64);
  box-shadow: inset 0 1px rgba(255, 255, 255, 0.05);
  color: rgba(245, 245, 245, 0.66);
  font-family: "Plus Jakarta Sans", sans-serif;
  font-size: 0.59rem;
  font-weight: 750;
  letter-spacing: 0.07em;
  text-transform: uppercase;
  transform: translateX(-50%);
  backdrop-filter: blur(10px);
  white-space: nowrap;
}

.result-guarantee-editorial .leensfish-showcase-wordmark {
  color: #b5d68b;
  font-size: 0.78rem;
  font-weight: 800;
  letter-spacing: -0.025em;
  text-transform: none;
}

.result-guarantee-editorial .leensfish-showcase-nav i {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #9abe71;
  box-shadow: 0 0 0 4px rgba(154, 190, 113, 0.1), 0 0 14px rgba(154, 190, 113, 0.52);
}

.result-guarantee-editorial .leensfish-showcase-signal {
  position: absolute;
  z-index: 3;
  right: clamp(22px, 4vw, 48px);
  bottom: 22px;
  margin: 0;
  color: rgba(243, 244, 241, 0.64);
  font-family: "Plus Jakarta Sans", sans-serif;
  font-size: 0.56rem;
  font-weight: 800;
  letter-spacing: 0.14em;
}

.result-guarantee-editorial .leensfish-showcase-body {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(250px, 0.65fr);
  gap: clamp(34px, 7vw, 112px);
  align-items: end;
  padding: clamp(38px, 5.5vw, 66px) clamp(28px, 5.4vw, 66px) clamp(38px, 5vw, 60px);
  color: #111111;
}

.result-guarantee-editorial .leensfish-showcase-heading > p {
  margin: 0 0 16px;
  color: rgba(22, 22, 22, 0.52);
  font-family: "Plus Jakarta Sans", sans-serif;
  font-size: 0.58rem;
  font-weight: 800;
  letter-spacing: 0.13em;
}

.result-guarantee-editorial .leensfish-showcase-heading h2 {
  max-width: 660px;
  margin: 0;
  color: #111111;
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(3.45rem, 6.5vw, 6.6rem);
  font-weight: 500;
  letter-spacing: -0.065em;
  line-height: 0.77;
}

.result-guarantee-editorial .leensfish-showcase-heading h2 em {
  color: #111111;
  font-weight: 400;
}

.result-guarantee-editorial .leensfish-showcase-detail {
  max-width: 340px;
  padding-bottom: 3px;
}

.result-guarantee-editorial .leensfish-showcase-detail > p {
  margin: 0;
  color: rgba(17, 17, 17, 0.76);
  font-family: "Plus Jakarta Sans", sans-serif;
  font-size: clamp(0.76rem, 0.9vw, 0.88rem);
  font-weight: 620;
  line-height: 1.52;
}

.result-guarantee-editorial .leensfish-showcase-detail > p + p {
  margin-top: 14px;
  color: rgba(17, 17, 17, 0.54);
}

.result-guarantee-editorial .leensfish-showcase-detail .leensfish-mark,
.result-guarantee-editorial .leensfish-showcase-detail .leensfish-mark * {
  color: #3f7040 !important;
  background: none !important;
  -webkit-text-fill-color: currentColor !important;
}

.result-guarantee-editorial .leensfish-apply-button {
  min-height: 41px;
  margin-top: 25px;
  padding: 0 15px 0 17px;
  border: 1px solid #181818;
  border-radius: 5px;
  background: #181818;
  color: #f7f6f1;
  font-size: 0.59rem;
  letter-spacing: 0.09em;
  text-transform: none;
}

.result-guarantee-editorial .leensfish-apply-button:hover,
.result-guarantee-editorial .leensfish-apply-button:focus-visible {
  border-color: #3f7040;
  background: #3f7040;
  color: #ffffff;
  transform: none;
}

.result-guarantee-editorial .leensfish-apply-button:hover b,
.result-guarantee-editorial .leensfish-apply-button:focus-visible b {
  transform: translate(2px, -1px);
}

@media (max-width: 760px) {
  body .site-shell > main > .result-guarantee-section.result-guarantee-editorial {
    padding: 70px 18px !important;
  }

  .result-guarantee-editorial .leensfish-showcase-card {
    border-radius: 14px;
  }

  .result-guarantee-editorial .leensfish-showcase-visual {
    min-height: 250px;
  }

  .result-guarantee-editorial .result-guarantee-ocean-logo {
    width: min(46vw, 220px);
  }

  .result-guarantee-editorial .leensfish-showcase-nav {
    top: 16px;
    gap: 10px;
    min-height: 36px;
    padding: 0 12px;
    font-size: 0.47rem;
  }

  .result-guarantee-editorial .leensfish-showcase-nav span:nth-of-type(2) {
    display: none;
  }

  .result-guarantee-editorial .leensfish-showcase-signal {
    right: 18px;
    bottom: 16px;
    font-size: 0.46rem;
  }

  .result-guarantee-editorial .leensfish-showcase-body {
    grid-template-columns: 1fr;
    gap: 31px;
    padding: 34px 24px 38px;
  }

  .result-guarantee-editorial .leensfish-showcase-heading h2 {
    font-size: clamp(3.3rem, 15vw, 4.8rem);
  }

  .result-guarantee-editorial .leensfish-showcase-detail {
    max-width: none;
  }
}

.offensive-services-section .offensive-services-grid {
  width: min(100%, 920px);
  gap: 12px;
  padding-right: 1px;
  padding-left: 1px;
}

.offensive-services-section .offensive-service-card {
  width: 100%;
  min-width: 0;
  height: clamp(330px, 25vw, 355px);
  border-radius: 10px;
}

.offensive-services-section .offensive-service-copy,
.offensive-services-section .offensive-service-redteam .offensive-service-copy {
  top: clamp(54px, 5vw, 64px);
  right: 22px;
  left: 22px;
  max-width: calc(100% - 44px);
}

.offensive-services-section .offensive-service-copy h3 {
  max-width: 100%;
  font-size: clamp(1.85rem, 2.2vw, 2.35rem);
  line-height: 0.97;
  overflow-wrap: break-word;
}

.offensive-services-section .offensive-service-copy p {
  max-width: 100%;
  margin-top: 14px;
  overflow-wrap: break-word;
}

.offensive-services-section .offensive-service-action {
  right: 22px;
  bottom: 20px;
  max-width: calc(100% - 44px);
  min-height: 32px;
  border-radius: 3px;
}

@media (max-width: 760px) {
  .offensive-services-section .offensive-services-grid {
    width: min(100%, 340px);
  }

  .offensive-services-section .offensive-service-card {
    height: 330px;
  }

  .offensive-services-section .offensive-service-copy h3 {
    font-size: clamp(1.8rem, 8vw, 2.2rem);
  }
}

.offensive-services-section .offensive-service-card:focus-within::after {
  opacity: 1;
}

@media (prefers-reduced-motion: reduce) {
  .offensive-services-section .offensive-service-card,
  .offensive-services-section .offensive-service-card::after,
  .offensive-services-section .offensive-service-copy h3,
  .offensive-services-section .offensive-service-copy p,
  .offensive-services-section .offensive-service-action,
  .offensive-services-section .offensive-service-action b {
    transition: none;
  }
}

.client-modal-backdrop {
  background: rgba(0, 0, 0, 0.88) !important;
  -webkit-backdrop-filter: blur(0) brightness(0.34);
  backdrop-filter: blur(0) brightness(0.34);
}

.client-modal.is-open .client-modal-backdrop {
  background: rgba(0, 0, 0, 0.88) !important;
  -webkit-backdrop-filter: blur(16px) brightness(0.34);
  backdrop-filter: blur(16px) brightness(0.34);
}

.client-modal-card {
  background-color: #020202 !important;
  background-image:
    linear-gradient(145deg, rgba(8, 8, 8, 0.98), rgba(0, 0, 0, 0.995)),
    url("assets/focus-film-grain.webp") !important;
  background-position: center, center;
  background-repeat: no-repeat, repeat;
  background-size: cover, 680px auto;
  background-blend-mode: normal, soft-light;
}

.certification-emblems-section {
  position: relative;
  display: block;
  padding: clamp(54px, 6vw, 86px) clamp(22px, 5.1vw, 88px);
  overflow: hidden;
  background: linear-gradient(180deg, #000 0%, #060607 44%, #0b0b0d 100%);
}

.certification-emblems-section::before {
  display: none;
  content: none;
}

.certification-emblems-heading,
.certification-emblems-grid {
  position: relative;
  z-index: 1;
}

.certification-emblems-heading {
  max-width: 1000px;
  margin: 0 auto clamp(26px, 3.4vw, 44px);
  text-align: center;
}

.certification-emblems-kicker,
.certification-emblem > span:last-child > small {
  display: block;
  margin: 0;
  color: rgba(244, 245, 242, 0.42);
  font-family: "Plus Jakarta Sans", sans-serif;
  font-size: 0.58rem;
  font-weight: 800;
  letter-spacing: 0.13em;
  line-height: 1.35;
  text-transform: uppercase;
}

.certification-emblems-heading h2 {
  margin: 12px 0 0;
  color: #f4f5f2;
  font-family: "Space Grotesk", sans-serif;
  font-size: clamp(2.6rem, 4.1vw, 4.8rem);
  font-weight: 540;
  letter-spacing: -0.1em;
  line-height: 0.84;
  white-space: nowrap;
}

.certification-emblems-heading h2 em {
  color: rgba(244, 245, 242, 0.54);
  font-style: normal;
}

.certification-emblems-intro-copy {
  max-width: 470px;
  margin: 16px auto 0;
  color: rgba(240, 242, 238, 0.6);
  font-family: "Inter", sans-serif;
  font-size: 0.72rem;
  line-height: 1.45;
}

.certification-emblems-grid {
  display: grid;
  width: min(100%, 1060px);
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: clamp(6px, 0.8vw, 10px);
  row-gap: clamp(16px, 2vw, 26px);
  margin: 0;
  margin-inline: auto;
  padding: 0;
  list-style: none;
  background: transparent;
}

.certification-emblem {
  position: relative;
  display: grid;
  grid-template-columns: 62px minmax(0, 1fr);
  gap: 12px;
  align-items: center;
  min-height: 148px;
  padding: 20px 16px;
  border: 1px solid rgba(255, 255, 255, 0.12);
  border-radius: 14px;
  background: linear-gradient(145deg, #101012, #09090b 70%, #050506);
  box-shadow: inset 0 1px rgba(255, 255, 255, 0.025);
  transition: background-color 180ms ease, border-color 180ms ease;
}

.certification-emblem-seal {
  position: relative;
  display: grid;
  width: 58px;
  height: 66px;
  place-content: center;
  clip-path: polygon(50% 0, 92% 15%, 100% 51%, 76% 93%, 50% 100%, 24% 93%, 0 51%, 8% 15%);
  background: linear-gradient(145deg, #e4e5df, #828588 48%, #f0f0e9 100%);
  color: #090a0b;
  font-family: "Space Grotesk", sans-serif;
  letter-spacing: -0.09em;
  line-height: 0.82;
  text-align: center;
  text-shadow: 0 1px rgba(255, 255, 255, 0.42);
}

.certification-emblem-seal::before {
  position: absolute;
  inset: 5px;
  border: 1px solid rgba(5, 5, 5, 0.52);
  clip-path: polygon(50% 0, 92% 15%, 100% 51%, 76% 93%, 50% 100%, 24% 93%, 0 51%, 8% 15%);
  content: "";
}

.certification-emblem-seal strong,
.certification-emblem-seal small {
  position: relative;
  z-index: 1;
}

.certification-emblem-seal strong {
  font-size: 0.68rem;
  font-weight: 780;
}

.certification-emblem-seal small {
  position: absolute;
  right: 11px;
  bottom: 11px;
  font-size: 0.58rem;
  font-weight: 850;
}

.certification-emblem > span:last-child {
  min-width: 0;
}

.certification-emblem > span:last-child > strong {
  display: block;
  margin-top: 7px;
  color: rgba(248, 248, 246, 0.94);
  font-family: "Space Grotesk", sans-serif;
  font-size: 0.9rem;
  font-weight: 620;
  letter-spacing: -0.055em;
  line-height: 0.96;
}

.certification-emblem--blue-belts,
.certification-emblem--microsoft,
.certification-emblem--specialist,
.certification-emblem--attackiq {
  grid-template-columns: 1fr;
  grid-template-rows: auto auto;
  justify-items: center;
  gap: 5px;
  min-height: 122px;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

.certification-emblem--blue-belts {
  grid-column: 1 / -1;
  grid-template-columns: 1fr;
  grid-template-rows: auto auto;
  justify-self: center;
  width: min(100%, 820px);
  min-height: 0;
  row-gap: 10px;
  padding: 12px 0 10px;
}

.certification-emblem-image {
  display: block;
  width: 94px;
  height: 94px;
  object-fit: contain;
  background: transparent;
}

.certification-emblem--blue-belts > span:last-child,
.certification-emblem--microsoft > span:last-child,
.certification-emblem--specialist > span:last-child,
.certification-emblem--attackiq > span:last-child {
  display: flex;
  align-items: baseline;
  justify-content: center;
  gap: 8px;
  width: 100%;
  min-width: 0;
  white-space: nowrap;
}

.certification-emblem--blue-belts > span:last-child > small,
.certification-emblem--microsoft > span:last-child > small,
.certification-emblem--specialist > span:last-child > small,
.certification-emblem--attackiq > span:last-child > small {
  display: inline;
  flex: 0 1 auto;
  font-size: 0.5rem;
}

.certification-emblem--blue-belts > span:last-child > strong,
.certification-emblem--microsoft > span:last-child > strong,
.certification-emblem--specialist > span:last-child > strong,
.certification-emblem--attackiq > span:last-child > strong {
  display: inline;
  flex: 0 1 auto;
  margin: 0;
  font-size: 0.78rem;
  line-height: 1;
}

.certification-emblem--blue-belts .certification-emblem-visual {
  display: grid;
  justify-items: center;
  gap: 3px;
  min-width: 0;
  text-align: center;
}

.certification-emblem--blue-belts .certification-emblem-record {
  display: block;
  width: 100%;
}

.certification-emblem--blue-belts .certification-emblem-record > small {
  color: rgba(244, 245, 242, 0.62);
  font-size: 1.08rem;
  font-weight: 800;
  letter-spacing: 0.2em;
}

.certification-emblem--blue-belts .certification-emblem-title {
  display: block;
  width: 100%;
  text-align: center;
}

.certification-emblem--blue-belts .certification-emblem-title > strong {
  color: var(--paper);
  display: block;
  font-size: 1.08rem;
  font-weight: 780;
  margin-top: 0;
  text-align: center;
}

.certification-emblem--blue-belts .certification-emblem-image {
  width: 232px;
  height: 132px;
}

.certification-emblem--blue-belts .certification-emblem-details {
  display: grid;
  gap: 8px;
  width: min(100%, 720px);
  margin: 0 auto;
  color: var(--muted);
  font-family: "Inter", sans-serif;
  font-size: 0.68rem;
  line-height: 1.35;
  text-align: center;
}

.certification-emblem--blue-belts .certification-emblem-details p {
  margin: 0;
}

.certification-emblem--blue-belts .certification-emblem-details strong {
  color: var(--paper);
  font-weight: 650;
}

.certification-emblem--blue-belts .certification-emblem-stat {
  display: flex;
  align-items: baseline;
  justify-content: center;
  gap: 16px;
  padding: 2px 0;
}

.certification-emblem--blue-belts .certification-emblem-stat > strong {
  color: var(--paper);
  font-family: "Space Grotesk", sans-serif;
  font-size: 1.85rem;
  font-weight: 720;
  letter-spacing: -0.06em;
  white-space: nowrap;
}

.certification-emblem--blue-belts .certification-emblem-stat > span {
  color: var(--muted);
  font-size: 0.66rem;
  text-align: center;
}

.certification-emblems-section + .site-footer {
  border-top: 0;
  background: linear-gradient(180deg, #0b0b0d 0%, #080809 18%, #070707 100%);
}

.certification-emblems-section + .site-footer::before {
  display: none;
}

@media (hover: hover) and (pointer: fine) {
  .certification-emblem:hover {
    border-color: rgba(255, 255, 255, 0.22);
    background: linear-gradient(145deg, #1d1d20, #101013 70%, #070708);
  }

  .certification-emblem--microsoft:hover,
  .certification-emblem--blue-belts:hover,
  .certification-emblem--specialist:hover,
  .certification-emblem--attackiq:hover {
    border-color: transparent;
    background: transparent;
  }
}

@media (max-width: 820px) {
  .certification-emblems-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .certification-emblem--blue-belts,
  .certification-emblem--microsoft,
  .certification-emblem--specialist,
  .certification-emblem--attackiq {
    grid-column: auto;
    width: 100%;
    justify-self: stretch;
  }

  .certification-emblem--blue-belts {
    grid-column: 1 / -1;
    grid-template-columns: 1fr;
    row-gap: 20px;
  }

  .certification-emblem--blue-belts .certification-emblem-details {
    text-align: center;
  }

  .certification-emblem--blue-belts .certification-emblem-stat {
    justify-content: center;
  }
}

@media (max-width: 680px) {
  .certification-emblems-section {
    padding-top: 54px;
    padding-bottom: 58px;
  }

  .certification-emblems-heading h2 {
    font-size: clamp(2.45rem, 12vw, 4rem);
    white-space: normal;
  }

  .certification-emblems-grid {
    grid-template-columns: 1fr;
  }

  .certification-emblem {
    min-height: 132px;
  }

  .certification-emblem--blue-belts,
  .certification-emblem--microsoft,
  .certification-emblem--specialist,
  .certification-emblem--attackiq {
    grid-column: auto;
    grid-template-columns: 1fr;
    grid-template-rows: auto auto;
    width: 100%;
    min-height: 106px;
  }

  .certification-emblem--blue-belts {
    width: 100%;
  }

  .certification-emblem-image {
    width: 78px;
    height: 78px;
  }

  .certification-emblem--blue-belts .certification-emblem-image {
    width: 200px;
    height: 114px;
  }

  .certification-emblem--blue-belts {
    min-height: 238px;
  }
}

@media (max-width: 390px) {
  .forensic-content h2 {
    font-size: clamp(1.8rem, 7vw, 2.3rem);
  }

  .forensic-content h2 > span {
    white-space: nowrap;
  }

  .certification-emblems-grid {
    grid-template-columns: 1fr;
  }

  .certification-emblem {
    min-height: 122px;
  }
}

html {
  font-size: 90%;
}

.offensive-services-section .offensive-service-card {
  --service-card-top: #171719;
  --service-card-mid: #0d0d0f;
  --service-card-bottom: #030304;
  --service-card-glow: rgba(196, 199, 208, 0.1);
  --service-card-edge: rgba(207, 210, 217, 0.14);
  border-color: var(--service-card-edge);
  border-top-color: transparent !important;
  background:
    radial-gradient(105% 62% at 18% 108%, var(--service-card-glow) 0%, transparent 62%),
    linear-gradient(158deg, var(--service-card-top) 0%, var(--service-card-mid) 48%, var(--service-card-bottom) 100%) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.025),
    0 18px 40px rgba(0, 0, 0, 0.26);
}

.offensive-services-section .offensive-service-network {
  --service-card-top: #1a1a1d;
  --service-card-mid: #101013;
  --service-card-bottom: #040405;
  --service-card-glow: rgba(205, 205, 214, 0.12);
  --service-card-edge: rgba(216, 216, 222, 0.16);
}

.offensive-services-section .offensive-service-ddos {
  --service-card-top: #15161a;
  --service-card-mid: #0b0c10;
  --service-card-bottom: #030304;
  --service-card-glow: rgba(145, 151, 166, 0.1);
  --service-card-edge: rgba(190, 195, 205, 0.14);
}

.offensive-services-section .offensive-service-redteam {
  --service-card-top: #191719;
  --service-card-mid: #0f0e10;
  --service-card-bottom: #040304;
  --service-card-glow: rgba(194, 190, 198, 0.1);
  --service-card-edge: rgba(211, 207, 214, 0.15);
}

.offensive-services-section .offensive-service-card::after {
  background:
    radial-gradient(72% 40% at 20% 104%, rgba(226, 227, 232, 0.11) 0%, transparent 72%),
    radial-gradient(64% 34% at 88% -4%, rgba(198, 201, 209, 0.055) 0%, transparent 74%),
    linear-gradient(180deg, rgba(255, 255, 255, 0.018), transparent 38%, rgba(255, 255, 255, 0.024));
  opacity: 0.42;
}

.offensive-services-section .offensive-service-copy h3 {
  color: #f2f2f4;
}

.offensive-services-section .offensive-service-copy p {
  color: rgba(218, 218, 222, 0.62);
}

.offensive-services-section .offensive-service-action {
  border: 1px solid rgba(218, 218, 224, 0.16);
  background: rgba(210, 210, 216, 0.08);
  color: rgba(244, 244, 246, 0.92);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.035);
}

.offensive-services-section .offensive-service-action b {
  color: rgba(218, 218, 224, 0.58);
}

@media (hover: hover) and (pointer: fine) {
  .offensive-services-section .offensive-service-card.hover-lift-card:hover {
    border-top-color: transparent !important;
    border-right-color: rgba(220, 220, 226, 0.22);
    border-bottom-color: rgba(220, 220, 226, 0.25);
    border-left-color: rgba(220, 220, 226, 0.22);
    background:
      radial-gradient(105% 62% at 18% 108%, var(--service-card-glow) 0%, transparent 62%),
      linear-gradient(158deg, var(--service-card-top) 0%, var(--service-card-mid) 48%, var(--service-card-bottom) 100%) !important;
    box-shadow:
      inset 0 1px 0 rgba(255, 255, 255, 0.035),
      0 22px 46px rgba(0, 0, 0, 0.34) !important;
    transform: none !important;
  }

  .offensive-services-section .offensive-service-card.hover-lift-card:hover::after {
    opacity: 0.78;
  }

  .offensive-services-section .offensive-service-card.hover-lift-card:hover .offensive-service-action,
  .offensive-services-section .offensive-service-action:hover,
  .offensive-services-section .offensive-service-action:focus-visible {
    border-color: rgba(224, 224, 230, 0.23);
    background: rgba(224, 224, 230, 0.13);
    color: #ffffff;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.055);
    transform: none;
  }
}

.offensive-services-section .offensive-service-card:focus-within {
  border-top-color: transparent !important;
  border-right-color: rgba(220, 220, 226, 0.22);
  border-bottom-color: rgba(220, 220, 226, 0.25);
  border-left-color: rgba(220, 220, 226, 0.22);
  background:
    radial-gradient(105% 62% at 18% 108%, var(--service-card-glow) 0%, transparent 62%),
    linear-gradient(158deg, var(--service-card-top) 0%, var(--service-card-mid) 48%, var(--service-card-bottom) 100%) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.035),
    0 22px 46px rgba(0, 0, 0, 0.34);
  transform: none !important;
}

.offensive-services-section .offensive-service-card,
.offensive-services-section .offensive-service-card.offensive-service-network,
.offensive-services-section .offensive-service-card.offensive-service-ddos,
.offensive-services-section .offensive-service-card.offensive-service-redteam {
  border: 0 !important;
  border-radius: 15px;
  background: #101011 !important;
  background-image: none !important;
  box-shadow: none !important;
}

.offensive-services-section .offensive-service-card::after {
  display: none !important;
}

.offensive-services-section .offensive-service-copy h3 {
  color: #f5f5f5;
}

.offensive-services-section .offensive-service-copy p {
  color: rgba(255, 255, 255, 0.62);
}

.offensive-services-section .offensive-service-action {
  border-color: rgba(255, 255, 255, 0.17);
  background: transparent;
  color: rgba(255, 255, 255, 0.88);
  box-shadow: none;
}

.offensive-services-section .offensive-service-action b {
  color: rgba(255, 255, 255, 0.64);
}

@media (hover: hover) and (pointer: fine) {
  .offensive-services-section .offensive-service-card.hover-lift-card:hover,
  .offensive-services-section .offensive-service-card.offensive-service-ddos.hover-lift-card:hover {
    border: 0 !important;
    background: #0d0e11 !important;
    box-shadow: none !important;
    transform: translateY(-2px) !important;
  }

  .offensive-services-section .offensive-service-card.hover-lift-card:hover .offensive-service-action,
  .offensive-services-section .offensive-service-action:hover,
  .offensive-services-section .offensive-service-action:focus-visible {
    border-color: rgba(255, 255, 255, 0.28);
    background: rgba(255, 255, 255, 0.07);
    color: #ffffff;
    box-shadow: none;
  }
}

.offensive-services-section .offensive-service-card:focus-within {
  border: 0 !important;
  background: #0d0e11 !important;
  box-shadow: none !important;
}

body .site-shell > main > .hero.hero-halftone {
  background:
    radial-gradient(ellipse 44% 42% at 76% 37%, rgba(244, 248, 244, 0.075), transparent 70%),
    linear-gradient(180deg, #020302 0%, #020302 74%, #030303 100%);
}

body .site-shell > main > .contact-section.impact-cta {
  background: linear-gradient(180deg, #030303 0%, #030303 58%, #020302 100%) !important;
}

body .site-shell > main > .focus-section {
  background: linear-gradient(180deg, #020302 0%, #020403 62%, #020403 100%);
}

body .site-shell > main > .beam-analysis-section {
  background: linear-gradient(180deg, #020403 0%, #020403 62%, #010201 100%);
}

body .site-shell > main > .validation-map-section {
  background: linear-gradient(180deg, #010201 0%, #000000 72%, #000000 100%);
}

body .site-shell > main > .analyzer-section {
  background: linear-gradient(180deg, #000000 0%, #020203 38%, #020202 74%, #020202 100%);
}

body .site-shell > main > .forensic-section {
  background: linear-gradient(180deg, #020202 0%, #010101 66%, #010101 100%);
}

body .site-shell > main > .result-guarantee-section.result-guarantee-editorial {
  background: linear-gradient(180deg, #010101 0%, #000000 72%, #000000 100%) !important;
}

body .site-shell > main > .offensive-services-section {
  background: linear-gradient(180deg, #000000 0%, #010101 64%, #020202 100%);
}

body .site-shell > main > .proof-section {
  background: linear-gradient(180deg, #0b0b0d 0%, #09090a 28%, #050506 62%, #020302 100%);
}

body .site-shell > main > .threat-news-section {
  background: linear-gradient(180deg, #020302 0%, #030404 42%, #050606 74%, #070808 100%);
}

body .site-shell > main > .certification-emblems-section {
  background: linear-gradient(180deg, #000000 0%, #010101 22%, #070708 58%, #09090a 82%, #0b0b0d 100%);
}

body .site-shell > main > .threat-news-section .threat-news-grid {
  gap: clamp(12px, 1.35vw, 18px);
}

body .site-shell > main > .threat-news-section .threat-news-card {
  min-height: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  transition: transform 180ms ease;
}

body .site-shell > main > .threat-news-section .threat-news-card:hover,
body .site-shell > main > .threat-news-section .threat-news-card:focus-visible {
  border-color: transparent;
  background: transparent;
  transform: none;
}

body .site-shell > main > .threat-news-section .threat-news-card-media {
  height: clamp(126px, 10vw, 142px);
  margin: 0 0 14px;
  border-radius: 6px;
  box-shadow: 0 16px 30px rgba(0, 0, 0, 0.3), 0 0 0 1px rgba(244, 248, 244, 0.08);
  transition: box-shadow 180ms ease;
}

body .site-shell > main > .threat-news-section .threat-news-card-media::after {
  background: linear-gradient(180deg, transparent 40%, rgba(4, 4, 4, 0.3) 100%);
}

body .site-shell > main > .threat-news-section .threat-news-card-media img {
  filter: grayscale(0.12) brightness(0.78) contrast(1.02);
  opacity: 0.88;
  border-radius: inherit;
  transform: none;
  transition: filter 180ms ease, opacity 180ms ease;
}

body .site-shell > main > .threat-news-section .threat-news-card:hover .threat-news-card-media img,
body .site-shell > main > .threat-news-section .threat-news-card:focus-visible .threat-news-card-media img {
  filter: grayscale(0) brightness(0.88) contrast(1.03);
  opacity: 1;
  transform: none;
}

body .site-shell > main > .threat-news-section .threat-news-card:hover .threat-news-card-media,
body .site-shell > main > .threat-news-section .threat-news-card:focus-visible .threat-news-card-media {
  box-shadow: 0 20px 36px rgba(0, 0, 0, 0.38), 0 0 0 1px rgba(244, 248, 244, 0.15);
}

body .site-shell > main > .threat-news-section .threat-news-card-header {
  gap: 8px;
  font-size: 0.48rem;
  letter-spacing: 0.1em;
}

body .site-shell > main > .threat-news-section .threat-news-card h3 {
  margin-top: 11px;
  font-size: clamp(0.96rem, 1.12vw, 1.14rem);
  font-weight: 540;
  letter-spacing: -0.035em;
  line-height: 1.12;
  -webkit-line-clamp: 2;
}

body .site-shell > main > .threat-news-section .threat-news-card p {
  margin-top: 8px;
  color: rgba(244, 248, 244, 0.48);
  font-size: 0.7rem;
  line-height: 1.45;
  -webkit-line-clamp: 2;
}

body .site-shell > main > .threat-news-section .threat-news-card-footer {
  margin-top: 16px;
  padding-top: 0;
  border-top: 0;
  justify-content: flex-end;
}

body .site-shell > main > .threat-news-section .threat-news-action {
  font-size: 0.48rem;
  letter-spacing: 0.1em;
}

@media (max-width: 760px) {
  body .site-shell > main > .threat-news-section .threat-news-card {
    min-height: 0;
  }

  body .site-shell > main > .threat-news-section .threat-news-card-media {
    height: auto;
    aspect-ratio: 16 / 9;
    margin-bottom: 14px;
  }
}

@media (min-width: 961px) {
  body .site-shell > main > .threat-news-section .threat-news-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }

  body .site-shell > main > .threat-news-section .threat-news-card {
    min-height: 0;
  }

  body .site-shell > main > .threat-news-section .threat-news-card-media {
    height: clamp(112px, 9vw, 132px);
  }
}

@keyframes threat-news-image-shimmer {
  from {
    background-position: 220% 0;
  }

  to {
    background-position: -40% 0;
  }
}

body .site-shell > main > .threat-news-section .threat-news-card-media.is-image-loading {
  background: #151718;
  isolation: isolate;
}

body .site-shell > main > .threat-news-section .threat-news-card-media.is-image-loading::before {
  position: absolute;
  z-index: 0;
  inset: 0;
  background: linear-gradient(
    105deg,
    rgba(255, 255, 255, 0.025) 20%,
    rgba(255, 255, 255, 0.12) 42%,
    rgba(255, 255, 255, 0.025) 64%
  );
  background-size: 220% 100%;
  content: "";
  animation: threat-news-image-shimmer 1.35s ease-in-out infinite;
}

body .site-shell > main > .threat-news-section .threat-news-card-media.is-image-loading::after {
  opacity: 0;
}

body .site-shell > main > .threat-news-section .threat-news-card-media.is-image-loading img {
  position: relative;
  z-index: 1;
  opacity: 0;
}

@media (prefers-reduced-motion: reduce) {
  body .site-shell > main > .threat-news-section .threat-news-card-media.is-image-loading::before {
    animation: none;
    background: rgba(255, 255, 255, 0.045);
  }
}

body .site-shell > main > .threat-news-section .threat-news-heading {
  width: min(100%, 1080px);
}

body .site-shell > main > .threat-news-section .threat-news-heading h2 {
  max-width: 1040px;
  font-size: clamp(1.8rem, 3vw, 3.35rem);
  line-height: 1.03;
  white-space: normal;
  text-wrap: balance;
}

body .site-shell > main > .threat-news-section .threat-news-heading h2 em {
  display: block;
  margin-top: 0.14em;
}

@media (max-width: 760px) {
  body .site-shell > main > .threat-news-section .threat-news-heading h2 {
    font-size: clamp(1.65rem, 8.3vw, 2.45rem);
    line-height: 1.05;
  }
}

body .site-shell > main > .beam-analysis-section .radar-analysis-layout .beam-analysis-heading h2 {
  letter-spacing: -0.02em;
  line-height: 0.94;
}

body .site-shell > main > .beam-analysis-section .radar-analysis-tag-ports,
body .site-shell > main > .beam-analysis-section .radar-analysis-tag-auth {
  transform: translate(0, -50%) !important;
  justify-content: flex-start;
  gap: 3px;
  text-align: left;
}

body .site-shell > main > .validation-map-section .validation-map-copy h2 {
  letter-spacing: -0.02em;
  line-height: 0.94;
}

body .site-shell > main > .validation-map-section .validation-map-copy p {
  margin-top: 30px;
}

body .site-shell > main > .validation-map-section .validation-map-copy h2 {
  max-width: none;
  font-size: clamp(2.2rem, 3.35vw, 3.6rem);
  white-space: nowrap;
}

@media (max-width: 900px) {
  body .site-shell > main > .validation-map-section .validation-map-copy h2 {
    white-space: normal;
  }
}

@media (min-width: 1201px) {
  body .site-shell > main > .validation-map-section .validation-map-copy {
    max-width: 680px;
  }

  body .site-shell > main > .validation-map-section .validation-map-copy h2 {
    font-size: clamp(3rem, 4.6vw, 5.25rem);
    white-space: nowrap;
  }
}

@media (max-width: 900px) {
  body .site-shell > main > .validation-map-section .validation-map-copy {
    max-width: none;
  }
}

body .site-shell > main > .result-guarantee-section {
  min-height: 118svh;
}

@media (max-width: 900px) {
  body .site-shell > main > .result-guarantee-section {
    min-height: 112svh;
  }
}

/* El móvil conserva el mismo halftone del PC en un único fotograma estático. */
.hero.hero-halftone .hero-halftone-canvas {
  display: block !important;
  opacity: 0.94;
}

@media (max-width: 760px) {
  .hero.hero-halftone .hero-halftone-canvas {
    display: block !important;
    opacity: 0.92;
  }
}

/* Las secciones fuera de pantalla conservan su contenido, pero no consumen
   maquetación ni pintura hasta acercarse al viewport. */
@supports (content-visibility: auto) {
  body .site-shell > main > #especialidad,
  body .site-shell > main > #nodos,
  body .site-shell > main > #validacion,
  body .site-shell > main > #vulnerabilidades,
  body .site-shell > main > #forense,
  body .site-shell > main > #garantia,
  body .site-shell > main > #certificacion,
  body .site-shell > main > #clientes,
  body .site-shell > main > #inteligencia {
    content-visibility: auto;
  }

  body .site-shell > main > #especialidad { contain-intrinsic-block-size: auto 730px; }
  body .site-shell > main > #nodos { contain-intrinsic-block-size: auto 592px; }
  body .site-shell > main > #validacion { contain-intrinsic-block-size: auto 560px; }
  body .site-shell > main > #vulnerabilidades { contain-intrinsic-block-size: auto 1085px; }
  body .site-shell > main > #forense { contain-intrinsic-block-size: auto 790px; }
  body .site-shell > main > #garantia { contain-intrinsic-block-size: auto 1062px; }
  body .site-shell > main > #certificacion { contain-intrinsic-block-size: auto 759px; }
  body .site-shell > main > #clientes { contain-intrinsic-block-size: auto 615px; }
  body .site-shell > main > #inteligencia {
    contain-intrinsic-block-size: auto 554px;
  }

  @media (max-width: 900px) {
    body .site-shell > main > #especialidad { contain-intrinsic-block-size: auto 1032px; }
    body .site-shell > main > #nodos { contain-intrinsic-block-size: auto 788px; }
    body .site-shell > main > #validacion { contain-intrinsic-block-size: auto 697px; }
    body .site-shell > main > #vulnerabilidades { contain-intrinsic-block-size: auto 1197px; }
    body .site-shell > main > #forense { contain-intrinsic-block-size: auto 865px; }
    body .site-shell > main > #garantia { contain-intrinsic-block-size: auto 945px; }
    body .site-shell > main > #certificacion { contain-intrinsic-block-size: auto 1208px; }
    body .site-shell > main > #clientes { contain-intrinsic-block-size: auto 656px; }
    body .site-shell > main > #inteligencia { contain-intrinsic-block-size: auto 842px; }
  }
}

/* Certification gallery: one visual weight for every credential. */
.certification-emblems-heading {
  margin-bottom: clamp(28px, 3.8vw, 48px);
}

.certification-emblems-heading h2 {
  margin: 0;
  font-size: clamp(2.4rem, 4.4vw, 4.6rem);
  letter-spacing: -0.075em;
  line-height: 0.92;
  white-space: normal;
}

.certification-emblems-intro-copy {
  display: none;
}

.certification-emblems-grid {
  width: min(100%, 1140px);
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
  row-gap: 18px;
}

.certification-emblem,
.certification-emblem--blue-belts,
.certification-emblem--microsoft,
.certification-emblem--specialist,
.certification-emblem--attackiq {
  grid-column: auto;
  grid-row: auto;
  grid-template-columns: 1fr;
  grid-template-rows: 1fr;
  justify-self: stretch;
  justify-items: stretch;
  align-items: stretch;
  width: 100%;
  min-height: 184px;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  transition: transform 180ms ease;
}

.certification-emblem-link,
.certification-emblem--blue-belts .certification-emblem-link,
.certification-emblem--microsoft .certification-emblem-link,
.certification-emblem--specialist .certification-emblem-link,
.certification-emblem--attackiq .certification-emblem-link {
  display: grid;
  width: 100%;
  min-height: 168px;
  place-items: center;
  padding: 0;
  border-radius: 0;
  background: transparent;
  color: inherit;
  text-decoration: none;
  overflow: visible;
  transform: translateZ(0);
  transition: transform 180ms ease;
}

.certification-emblem-link:not(a) {
  cursor: default;
}

.certification-emblem-image,
.certification-emblem--blue-belts .certification-emblem-image,
.certification-emblem--microsoft .certification-emblem-image,
.certification-emblem--specialist .certification-emblem-image,
.certification-emblem--attackiq .certification-emblem-image {
  display: block;
  width: 100%;
  max-width: 190px;
  height: 132px;
  object-fit: contain;
  background: transparent;
}

@media (hover: hover) and (pointer: fine) {
  .certification-emblem:hover {
    border-color: transparent;
    background: transparent;
    box-shadow: none;
    transform: translateY(-4px);
  }

  .certification-emblem:hover .certification-emblem-link {
    transform: translateY(-2px) scale(1.02);
  }
}

@media (max-width: 820px) {
  .certification-emblem,
  .certification-emblem--blue-belts,
  .certification-emblem--microsoft,
  .certification-emblem--specialist,
  .certification-emblem--attackiq {
    min-height: 168px;
  }
}

@media (max-width: 680px) {
  .certification-emblem,
  .certification-emblem--blue-belts,
  .certification-emblem--microsoft,
  .certification-emblem--specialist,
  .certification-emblem--attackiq {
    min-height: 154px;
    padding: 0;
  }

  .certification-emblem-link,
  .certification-emblem--blue-belts .certification-emblem-link,
  .certification-emblem--microsoft .certification-emblem-link,
  .certification-emblem--specialist .certification-emblem-link,
  .certification-emblem--attackiq .certification-emblem-link {
    min-height: 142px;
  }

  .certification-emblem-image,
  .certification-emblem--blue-belts .certification-emblem-image,
  .certification-emblem--microsoft .certification-emblem-image,
  .certification-emblem--specialist .certification-emblem-image,
  .certification-emblem--attackiq .certification-emblem-image {
    max-width: 170px;
    height: 116px;
  }
}

@media (min-width: 821px) {
  .certification-emblem--blue-belt {
    grid-column: 2;
  }
}

@media (max-width: 680px) {
  .certification-emblems-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}