:root {
  --ink: #050a13;
  --ink-2: #08111f;
  --ink-3: #0c192a;
  --paper: #f2f5f7;
  --paper-2: #e8edf1;
  --line-dark: rgba(172, 215, 255, .16);
  --line-light: rgba(9, 30, 50, .14);
  --white: #f5f8fb;
  --muted-dark: #8b9bab;
  --muted-light: #586675;
  --electric: #63c7ff;
  --electric-2: #2f83f7;
  --mint: #8dffcf;
  --alert: #ff5573;
  --serif: "Space Grotesk", sans-serif;
  --display: "Space Grotesk", sans-serif;
  --sans: "Manrope", sans-serif;
  --mono: "DM Mono", monospace;
  --ease: cubic-bezier(.22, .8, .2, 1);
}

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; background: var(--ink); }
body { margin: 0; overflow-x: hidden; color: var(--white); background: var(--ink); font-family: var(--sans); -webkit-font-smoothing: antialiased; }
body.menu-open { overflow: hidden; }
a { color: inherit; }
button, input, select, textarea { font: inherit; }
button { border: 0; }
::selection { color: var(--ink); background: var(--mint); }
::-webkit-scrollbar { width: 8px; }
::-webkit-scrollbar-track { background: var(--ink); }
::-webkit-scrollbar-thumb { background: #1b3c5a; border-radius: 99px; }

.noise { position: fixed; inset: 0; z-index: 20; pointer-events: none; opacity: .045; background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.55'/%3E%3C/svg%3E"); mix-blend-mode: soft-light; }
.content-wrap { width: min(1240px, calc(100% - 12vw)); margin: 0 auto; }
.section-dark { color: var(--white); background: var(--ink); }
.section-light { color: var(--ink); background: var(--paper); }

.cursor { position: fixed; z-index: 100; top: 0; left: 0; width: 34px; height: 34px; margin: -17px 0 0 -17px; border: 1px solid rgba(141, 255, 207, .72); border-radius: 50%; pointer-events: none; opacity: 0; transform: translate3d(-100px, -100px, 0); transition: width .25s var(--ease), height .25s var(--ease), opacity .3s; mix-blend-mode: difference; }
.cursor::before, .cursor::after { content: ""; position: absolute; background: var(--mint); opacity: .6; }
.cursor::before { width: 1px; height: 52px; left: 16px; top: -10px; }
.cursor::after { height: 1px; width: 52px; left: -10px; top: 16px; }
.cursor span { position: absolute; width: 4px; height: 4px; top: 14px; left: 14px; border-radius: 50%; background: var(--mint); }
.cursor.is-active { width: 56px; height: 56px; margin: -28px 0 0 -28px; border-color: var(--white); }
.scroll-progress { position: fixed; z-index: 60; top: 0; right: 0; width: 3px; height: 100vh; pointer-events: none; background: rgba(255,255,255,.04); }
.scroll-progress span { display: block; width: 100%; height: 0; background: linear-gradient(var(--electric), var(--mint)); box-shadow: 0 0 16px var(--electric); }

/* Header */
.site-header { position: fixed; z-index: 50; top: 0; left: 0; right: 0; height: 82px; padding: 0 6vw; display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid transparent; transition: background .45s, border-color .45s, backdrop-filter .45s; }
.site-header.scrolled { background: rgba(5, 10, 19, .76); border-color: var(--line-dark); backdrop-filter: blur(18px); }
.brand { display: inline-flex; align-items: center; gap: 10px; font: 700 17px var(--serif); letter-spacing: -.04em; text-decoration: none; white-space: nowrap; }
.brand-accent { color: var(--electric); }
.brand-mark { width: 24px; height: 24px; display: inline-flex; align-items: flex-end; gap: 3px; padding: 3px; border: 1px solid rgba(99,199,255,.7); transform: skewY(-13deg); }
.brand-mark i { display: block; width: 4px; background: var(--electric); box-shadow: 0 0 10px rgba(99,199,255,.7); }
.brand-mark i:nth-child(1) { height: 7px; opacity: .55; }.brand-mark i:nth-child(2) { height: 12px; }.brand-mark i:nth-child(3) { height: 17px; background: var(--mint); }
.desktop-nav { display: flex; gap: clamp(20px, 3vw, 48px); margin-left: auto; margin-right: clamp(24px, 4vw, 58px); }
.desktop-nav a, .nav-cta { position: relative; font: 500 11px var(--mono); text-transform: uppercase; letter-spacing: .1em; text-decoration: none; color: rgba(245,248,251,.68); transition: color .25s; }
.desktop-nav a::after { content: ""; position: absolute; bottom: -9px; left: 0; width: 0; height: 1px; background: var(--mint); transition: width .3s var(--ease); }
.desktop-nav a:hover, .desktop-nav a.active { color: var(--white); }.desktop-nav a:hover::after, .desktop-nav a.active::after { width: 100%; }
.nav-cta { display: inline-flex; gap: 12px; align-items: center; color: var(--ink); background: var(--mint); padding: 14px 18px; font-weight: 500; transition: transform .3s var(--ease), background .3s; }
.nav-cta:hover { background: var(--white); }.nav-cta span, .button span { font-size: 16px; line-height: 0; transition: transform .3s var(--ease); }.nav-cta:hover span, .button:hover span { transform: translate(3px, -3px); }
.menu-toggle { display: none; width: 44px; height: 44px; padding: 10px; background: transparent; cursor: pointer; }
.menu-toggle span { display: block; width: 22px; height: 1px; margin: 5px 0; background: var(--white); transition: transform .3s, opacity .3s; }
.menu-toggle.is-open span:nth-child(1) { transform: translateY(6px) rotate(45deg); }.menu-toggle.is-open span:nth-child(2) { opacity: 0; }.menu-toggle.is-open span:nth-child(3) { transform: translateY(-6px) rotate(-45deg); }
.mobile-menu { position: fixed; z-index: 45; inset: 82px 0 auto; display: none; flex-direction: column; padding: 14px 6vw 22px; background: rgba(5,10,19,.96); border-bottom: 1px solid var(--line-dark); backdrop-filter: blur(22px); }
.mobile-menu a { padding: 16px 0; font: 500 12px var(--mono); text-transform: uppercase; letter-spacing: .12em; text-decoration: none; border-bottom: 1px solid var(--line-dark); }.mobile-menu .mobile-cta { color: var(--ink); background: var(--mint); justify-content: center; margin-top: 16px; padding: 16px; border: 0; }

/* Shared type / reveal */
.eyebrow { display: flex; align-items: center; gap: 13px; color: var(--mint); font: 500 10px var(--mono); letter-spacing: .13em; text-transform: uppercase; }
.eyebrow.dark { color: var(--electric-2); }.eyebrow-index { color: currentColor; opacity: .65; }.eyebrow-rule { width: 40px; height: 1px; background: currentColor; opacity: .48; }
h1, h2, h3, p { margin: 0; }.hero-title, .section-heading h2, .threat-copy h2, .why-copy h2, .process-heading h2, .about-copy h2, .contact-copy h2 { font-family: var(--serif); font-weight: 600; letter-spacing: -.065em; line-height: .97; }
h1 em, h2 em { color: var(--electric); font-style: normal; }.section-heading h2, .threat-copy h2, .why-copy h2, .process-heading h2, .contact-copy h2 { font-size: clamp(48px, 7vw, 96px); }
.reveal { opacity: 0; transform: translateY(30px); transition: opacity .85s var(--ease), transform .85s var(--ease); }.reveal.is-visible { opacity: 1; transform: none; }.reveal:nth-child(2) { transition-delay: .06s; }.reveal:nth-child(3) { transition-delay: .12s; }.reveal:nth-child(4) { transition-delay: .18s; }
.reveal-up { opacity: 0; transform: translateY(30px); animation: reveal-up .9s var(--ease) forwards; }.delay-1 { animation-delay: .12s; }.delay-2 { animation-delay: .22s; }.delay-3 { animation-delay: .32s; }.delay-4 { animation-delay: .44s; }
@keyframes reveal-up { to { opacity: 1; transform: none; } }

/* Hero */
.hero { min-height: 100svh; padding: 160px 0 100px; display: flex; align-items: center; position: relative; isolation: isolate; overflow: hidden; }
#networkCanvas { position: absolute; inset: 0; width: 100%; height: 100%; opacity: .7; z-index: -2; }
.hero-grid, .contact-grid { position: absolute; inset: -10%; z-index: -3; opacity: .32; background-image: linear-gradient(rgba(99,199,255,.13) 1px, transparent 1px), linear-gradient(90deg, rgba(99,199,255,.13) 1px, transparent 1px); background-size: 72px 72px; transform: perspective(500px) rotateX(62deg) translateY(-14%); transform-origin: center bottom; mask-image: linear-gradient(to bottom, transparent 0%, black 35%, black 100%); }
.hero-grid::after { content: ""; position: absolute; inset: 0; background: linear-gradient(to bottom, transparent 30%, var(--ink) 95%); }
.hero-glow { position: absolute; width: 55vw; height: 55vw; left: 42%; top: 40%; z-index: -3; border-radius: 50%; background: radial-gradient(circle, rgba(47,131,247,.26), transparent 68%); filter: blur(10px); transform: translate(-50%, -50%); animation: breathe 7s ease-in-out infinite; }
@keyframes breathe { 50% { opacity: .55; transform: translate(-50%, -50%) scale(1.12); } }
.hero-orbit { position: absolute; z-index: -1; border: 1px solid rgba(99,199,255,.1); border-radius: 50%; pointer-events: none; }.orbit-a { width: 75vw; height: 75vw; right: -22vw; top: -12vw; animation: orbit 42s linear infinite; }.orbit-b { width: 55vw; height: 55vw; right: -12vw; top: -2vw; border-color: rgba(141,255,207,.1); animation: orbit 28s linear infinite reverse; }.orbit-c { width: 39vw; height: 39vw; right: -4vw; top: 6vw; border-style: dashed; animation: orbit 21s linear infinite; }
@keyframes orbit { to { transform: rotate(360deg); } }
.hero-content { position: relative; z-index: 2; width: min(700px, 56vw); margin-left: 12vw; }.hero-title { max-width: 700px; margin-top: 27px; font-size: clamp(62px, 8.2vw, 132px); }.hero-copy { max-width: 570px; margin-top: 30px; color: var(--muted-dark); font-size: clamp(15px, 1.4vw, 18px); line-height: 1.8; }
.hero-actions { display: flex; gap: 13px; flex-wrap: wrap; margin-top: 37px; }.button { display: inline-flex; align-items: center; justify-content: center; gap: 20px; min-height: 52px; padding: 0 23px; font: 500 11px var(--mono); letter-spacing: .08em; text-transform: uppercase; text-decoration: none; cursor: pointer; transition: background .3s, color .3s, border-color .3s, transform .3s var(--ease), box-shadow .3s; }.button-solid { color: var(--ink); background: var(--mint); }.button-solid:hover { background: var(--white); box-shadow: 0 13px 36px rgba(141,255,207,.17); }.button-ghost { color: var(--white); border: 1px solid var(--line-dark); background: rgba(255,255,255,.025); }.button-ghost:hover { background: rgba(255,255,255,.1); border-color: rgba(255,255,255,.45); }
.hero-stats { display: grid; grid-template-columns: repeat(4, auto); gap: 0; width: fit-content; margin-top: 76px; border-top: 1px solid var(--line-dark); }.hero-stats div { min-width: 122px; padding: 18px 22px 0 0; border-right: 1px solid var(--line-dark); }.hero-stats div:not(:first-child) { padding-left: 22px; }.hero-stats div:last-child { border-right: 0; }.hero-stats strong { display: block; font: 500 25px var(--serif); letter-spacing: -.05em; }.hero-stats strong span { color: var(--electric); }.hero-stats small { display: block; margin-top: 6px; color: var(--muted-dark); font: 9px var(--mono); letter-spacing: .07em; line-height: 1.4; text-transform: uppercase; }
.hero-visual { position: absolute; z-index: 1; right: 5vw; top: 50%; width: min(38vw, 560px); aspect-ratio: 1; transform: translateY(-44%); pointer-events: none; }.visual-kicker { position: absolute; top: 4%; left: 17%; color: rgba(245,248,251,.4); font: 10px var(--mono); letter-spacing: .16em; }.security-core { position: absolute; inset: 12%; }.core-ring { position: absolute; inset: 0; border-radius: 50%; border: 1px solid rgba(99,199,255,.22); }.ring-outer { animation: spin 25s linear infinite; border-style: dashed; }.ring-mid { inset: 12%; border-color: rgba(141,255,207,.3); animation: spin 19s linear infinite reverse; }.ring-inner { inset: 25%; border-color: rgba(99,199,255,.48); box-shadow: inset 0 0 45px rgba(47,131,247,.12), 0 0 45px rgba(47,131,247,.16); animation: pulse-ring 4s ease-in-out infinite; }.core-scan { position: absolute; inset: 25%; border-radius: 50%; overflow: hidden; }.core-scan::before { content: ""; position: absolute; inset: -10%; background: conic-gradient(from 30deg, transparent 0 78%, rgba(141,255,207,.5) 86%, transparent 94%); animation: spin 5s linear infinite; }.core-shield { position: absolute; z-index: 2; inset: 39%; display: grid; place-items: center; border: 1px solid rgba(141,255,207,.35); background: rgba(8,17,31,.82); box-shadow: 0 0 42px rgba(141,255,207,.12); }.core-shield svg { width: 43%; fill: none; stroke: var(--mint); stroke-linecap: round; stroke-linejoin: round; stroke-width: 2; filter: drop-shadow(0 0 7px rgba(141,255,207,.7)); }.core-label { position: absolute; z-index: 3; color: var(--muted-dark); font: 9px var(--mono); letter-spacing: .12em; }.label-top { top: 21%; right: 8%; }.label-bottom { bottom: 19%; left: 7%; color: var(--electric); }.core-node { position: absolute; z-index: 4; width: 6px; height: 6px; border-radius: 50%; background: var(--mint); box-shadow: 0 0 0 5px rgba(141,255,207,.08), 0 0 14px var(--mint); }.node-1 { top: 29%; left: 19%; }.node-2 { top: 11%; right: 23%; background: var(--alert); box-shadow: 0 0 0 5px rgba(255,85,115,.1), 0 0 14px var(--alert); }.node-3 { bottom: 18%; right: 11%; }
@keyframes spin { to { transform: rotate(360deg); } } @keyframes pulse-ring { 50% { transform: scale(.94); opacity: .65; } }
.visual-readout { position: absolute; left: 20%; right: 16%; bottom: 2%; display: flex; justify-content: space-between; padding-top: 12px; border-top: 1px solid var(--line-dark); color: rgba(245,248,251,.42); font: 9px var(--mono); letter-spacing: .08em; }.visual-readout b { color: var(--mint); font-weight: 400; }.visual-readout b i { display: inline-block; width: 5px; height: 5px; margin-right: 7px; border-radius: 50%; background: var(--mint); box-shadow: 0 0 10px var(--mint); }
.scroll-cue { position: absolute; z-index: 2; bottom: 35px; left: 6vw; display: flex; align-items: center; gap: 16px; color: rgba(245,248,251,.4); font: 9px var(--mono); letter-spacing: .1em; text-transform: uppercase; }.scroll-cue i { display: block; width: 64px; height: 1px; background: linear-gradient(90deg, var(--mint), transparent); animation: cue 1.8s ease-in-out infinite; }.scroll-cue i::after { content: ""; display: block; width: 6px; height: 6px; margin-top: -3px; border-top: 1px solid var(--mint); border-right: 1px solid var(--mint); transform: rotate(45deg); }
@keyframes cue { 50% { transform: translateX(10px); opacity: .5; } }

/* Ticker */
.ticker-wrap { overflow: hidden; padding: 17px 0; background: #071323; border-top: 1px solid var(--line-dark); border-bottom: 1px solid var(--line-dark); }.ticker-track { display: flex; width: max-content; gap: 42px; animation: ticker 40s linear infinite; }.ticker-item { display: flex; align-items: center; gap: 12px; color: rgba(245,248,251,.62); font: 10px var(--mono); letter-spacing: .08em; white-space: nowrap; }.ticker-item i { width: 5px; height: 5px; border-radius: 50%; background: var(--alert); box-shadow: 0 0 10px var(--alert); }.ticker-item.clear i { background: var(--mint); box-shadow: 0 0 10px var(--mint); }@keyframes ticker { to { transform: translateX(-50%); } }

/* Services */
.services { padding: 150px 0 170px; }.section-heading { margin-bottom: 72px; }.section-heading h2 { margin-top: 24px; }.heading-row { display: flex; align-items: flex-end; justify-content: space-between; gap: 40px; }.heading-row p { width: min(340px, 100%); margin-bottom: 7px; color: var(--muted-light); font-size: 14px; line-height: 1.8; }.services-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; background: var(--line-light); border: 1px solid var(--line-light); }.service-card { min-height: 310px; padding: 27px 28px 31px; display: flex; flex-direction: column; background: var(--paper); border: 0; transition: transform .4s var(--ease), background .4s, color .4s; transform-style: preserve-3d; }.service-card::before { content: ""; position: absolute; inset: 0; opacity: 0; background: radial-gradient(circle at var(--mx,50%) var(--my,0%), rgba(47,131,247,.14), transparent 43%); transition: opacity .4s; pointer-events: none; }.service-card { position: relative; overflow: hidden; }.service-card:hover { z-index: 2; color: var(--white); background: var(--ink-2); transform: translateY(-7px); }.service-card:hover::before { opacity: 1; }.card-top { position: relative; z-index: 1; display: flex; justify-content: space-between; align-items: center; }.service-number { color: #91a1ad; font: 10px var(--mono); }.service-icon { display: grid; place-items: center; width: 42px; height: 42px; color: var(--electric-2); border: 1px solid var(--line-light); font: 26px var(--serif); transition: color .3s, border-color .3s, transform .3s; }.service-card:hover .service-icon { color: var(--mint); border-color: rgba(141,255,207,.4); transform: rotate(10deg); }.service-card h3 { position: relative; z-index: 1; margin-top: 61px; font: 600 23px var(--serif); letter-spacing: -.045em; }.service-card p { position: relative; z-index: 1; margin-top: 15px; color: var(--muted-light); font-size: 12px; line-height: 1.75; transition: color .3s; }.service-card:hover p { color: #9cabb9; }.service-tag { position: relative; z-index: 1; width: fit-content; margin-top: auto; padding-top: 26px; color: var(--electric-2); font: 9px var(--mono); letter-spacing: .09em; text-transform: uppercase; }.service-card:hover .service-tag { color: var(--mint); }

/* Threat intelligence */
.threat-room { padding: 155px 0 120px; isolation: isolate; }.threat-room-bg { position: absolute; inset: 0; z-index: -2; opacity: .6; background: radial-gradient(ellipse at 75% 45%, rgba(47,131,247,.18), transparent 36%), radial-gradient(ellipse at 15% 80%, rgba(141,255,207,.06), transparent 30%); }.threat-room-bg::after { content: ""; position: absolute; inset: 0; background-image: linear-gradient(rgba(99,199,255,.07) 1px, transparent 1px), linear-gradient(90deg, rgba(99,199,255,.07) 1px, transparent 1px); background-size: 58px 58px; mask-image: radial-gradient(circle at 72% 45%, black, transparent 58%); }.threat-layout { display: grid; grid-template-columns: .76fr 1.24fr; gap: 7vw; align-items: center; }.threat-copy h2 { margin-top: 27px; font-size: clamp(54px, 6.3vw, 90px); }.threat-copy p { max-width: 430px; margin-top: 27px; color: var(--muted-dark); font-size: 14px; line-height: 1.85; }.threat-legend { display: flex; flex-direction: column; gap: 10px; margin-top: 42px; color: rgba(245,248,251,.56); font: 9px var(--mono); letter-spacing: .06em; text-transform: uppercase; }.threat-legend span { display: flex; align-items: center; gap: 10px; }.legend-dot { width: 6px; height: 6px; border-radius: 50%; }.dot-threat { background: var(--alert); box-shadow: 0 0 10px var(--alert); }.dot-clear { background: var(--mint); box-shadow: 0 0 10px var(--mint); }.legend-line { width: 17px; height: 1px; background: var(--electric); }.threat-stage { min-height: 560px; position: relative; overflow: hidden; border: 1px solid var(--line-dark); background: rgba(4,12,23,.46); box-shadow: inset 0 0 100px rgba(47,131,247,.06); }.threat-stage::before, .threat-stage::after { content: ""; position: absolute; z-index: 1; width: 20px; height: 20px; border-color: var(--mint); }.threat-stage::before { top: 17px; left: 17px; border-top: 1px solid; border-left: 1px solid; }.threat-stage::after { right: 17px; bottom: 17px; border-right: 1px solid; border-bottom: 1px solid; }.threat-stage canvas { position: absolute; inset: 0; width: 100%; height: 100%; }.stage-hud { position: absolute; z-index: 2; left: 25px; right: 25px; display: flex; justify-content: space-between; color: rgba(245,248,251,.43); font: 9px var(--mono); letter-spacing: .1em; }.hud-top { top: 24px; }.hud-top b { color: var(--mint); font-weight: 400; }.hud-bottom { bottom: 24px; }.hud-bottom b { color: var(--mint); font-weight: 400; }.stage-crosshair { position: absolute; z-index: 2; top: 50%; left: 50%; width: 50px; height: 50px; transform: translate(-50%, -50%); border: 1px solid rgba(141,255,207,.35); border-radius: 50%; pointer-events: none; }.stage-crosshair::before, .stage-crosshair::after { content: ""; position: absolute; background: rgba(141,255,207,.4); }.stage-crosshair::before { width: 72px; height: 1px; left: -12px; top: 24px; }.stage-crosshair::after { width: 1px; height: 72px; left: 24px; top: -12px; }.stage-crosshair i { position: absolute; width: 4px; height: 4px; border-radius: 50%; background: var(--mint); box-shadow: 0 0 13px var(--mint); }.stage-crosshair i:first-child { top: -3px; left: 23px; }.stage-crosshair i:last-child { bottom: -3px; right: 23px; }.threat-stats { display: grid; grid-template-columns: repeat(4, 1fr); margin-top: 100px; border-top: 1px solid var(--line-dark); border-bottom: 1px solid var(--line-dark); }.threat-stat { min-height: 145px; padding: 31px 25px 26px 0; border-right: 1px solid var(--line-dark); }.threat-stat:not(:first-child) { padding-left: 25px; }.threat-stat:last-child { border-right: 0; }.threat-stat strong { display: block; color: var(--electric); font: 500 clamp(27px, 3.1vw, 46px) var(--serif); letter-spacing: -.06em; }.threat-stat span { display: block; max-width: 160px; margin-top: 11px; color: var(--muted-dark); font: 9px var(--mono); line-height: 1.55; text-transform: uppercase; letter-spacing: .05em; }

/* Why */
.why { padding: 160px 0; }.why-layout { display: grid; grid-template-columns: 1fr .72fr; gap: 9vw; align-items: center; }.why-copy h2 { margin-top: 26px; font-size: clamp(52px, 6.4vw, 88px); }.why-copy .intro { max-width: 540px; margin-top: 29px; color: var(--muted-light); font-size: 14px; line-height: 1.85; }.why-features { display: flex; flex-direction: column; gap: 0; margin-top: 47px; }.why-feature { display: grid; grid-template-columns: 48px 1fr; gap: 18px; padding: 19px 0; border-top: 1px solid var(--line-light); transition: padding-left .35s var(--ease); }.why-feature:last-child { border-bottom: 1px solid var(--line-light); }.why-feature:hover { padding-left: 10px; }.feature-icon { display: grid; place-items: center; width: 36px; height: 36px; color: var(--electric-2); border: 1px solid var(--line-light); font: 9px var(--mono); }.why-feature h3 { font: 600 16px var(--serif); letter-spacing: -.03em; }.why-feature p { max-width: 470px; margin-top: 7px; color: var(--muted-light); font-size: 12px; line-height: 1.7; }.why-visual { position: relative; aspect-ratio: 1; min-height: 430px; border: 1px solid var(--line-light); background: radial-gradient(circle, rgba(47,131,247,.14), transparent 47%); overflow: hidden; }.radar-grid { position: absolute; inset: 12%; border: 1px solid rgba(47,131,247,.18); border-radius: 50%; background: repeating-radial-gradient(circle, transparent 0 28px, rgba(47,131,247,.13) 29px 30px), linear-gradient(rgba(47,131,247,.13) 1px, transparent 1px), linear-gradient(90deg, rgba(47,131,247,.13) 1px, transparent 1px); background-size: auto, 25% 25%, 25% 25%; }.radar-grid::after { content: ""; position: absolute; inset: 20%; border: 1px solid rgba(47,131,247,.15); border-radius: 50%; }.radar-sweep { position: absolute; top: 50%; left: 50%; width: 48%; height: 1px; transform-origin: left center; background: linear-gradient(90deg, var(--mint), transparent); animation: sweep 4s linear infinite; box-shadow: 0 0 12px var(--mint); }.radar-sweep::after { content: ""; position: absolute; right: -4px; top: -3px; width: 7px; height: 7px; background: var(--mint); border-radius: 50%; }.radar-core { position: absolute; top: 50%; left: 50%; width: 108px; height: 108px; transform: translate(-50%, -50%); display: flex; flex-direction: column; align-items: center; justify-content: center; border-radius: 50%; border: 1px solid rgba(141,255,207,.6); color: var(--mint); background: rgba(5,10,19,.82); box-shadow: 0 0 0 13px rgba(141,255,207,.05), 0 0 45px rgba(141,255,207,.18); }.radar-core span { font: 600 23px var(--serif); letter-spacing: -.08em; }.radar-core small { margin-top: 2px; text-align: center; font: 7px var(--mono); line-height: 1.35; letter-spacing: .14em; }.radar-label { position: absolute; color: rgba(9,30,50,.55); font: 9px var(--mono); letter-spacing: .08em; }.radar-label-a { top: 17%; left: 12%; }.radar-label-b { top: 34%; right: 8%; }.radar-label-c { bottom: 23%; left: 21%; }.radar-point { position: absolute; width: 7px; height: 7px; border-radius: 50%; background: var(--electric-2); box-shadow: 0 0 0 6px rgba(47,131,247,.1), 0 0 14px var(--electric-2); animation: point 2.8s ease-in-out infinite; }.point-a { top: 24%; right: 23%; }.point-b { bottom: 22%; right: 28%; animation-delay: .8s; }.point-c { top: 32%; left: 23%; animation-delay: 1.5s; }.radar-readout { position: absolute; right: 22px; bottom: 20px; display: flex; flex-direction: column; gap: 5px; color: #627382; font: 8px var(--mono); letter-spacing: .08em; }.radar-readout strong { color: var(--electric-2); font-weight: 400; }.radar-readout i { display: inline-block; width: 5px; height: 5px; margin-left: 6px; border-radius: 50%; background: var(--mint); }@keyframes sweep { to { transform: rotate(360deg); } }@keyframes point { 50% { transform: scale(1.45); opacity: .55; } }

/* Process */
.process { padding: 155px 0 170px; background: var(--ink-2); }.process-heading { display: grid; grid-template-columns: 1fr .7fr; column-gap: 8vw; }.process-heading .eyebrow { grid-column: 1 / -1; }.process-heading h2 { margin-top: 26px; }.process-heading p { align-self: end; max-width: 310px; margin-bottom: 7px; color: var(--muted-dark); font-size: 14px; line-height: 1.8; }.process-list { position: relative; max-width: 850px; margin-top: 92px; margin-left: calc(12vw + 8vw); }.process-line { position: absolute; left: 24px; top: 33px; bottom: 33px; width: 1px; background: linear-gradient(var(--electric), rgba(99,199,255,.06)); }.process-line span { display: block; width: 1px; height: 25%; background: var(--mint); box-shadow: 0 0 10px var(--mint); animation: line-flow 5s ease-in-out infinite; }.process-step { position: relative; display: grid; grid-template-columns: 50px 1fr; gap: 30px; padding: 25px 0; border-bottom: 1px solid var(--line-dark); }.process-index { position: relative; z-index: 1; display: grid; place-items: center; width: 50px; height: 50px; color: var(--mint); background: var(--ink-2); border: 1px solid rgba(141,255,207,.55); border-radius: 50%; font: 10px var(--mono); transition: color .3s, background .3s, box-shadow .3s; }.process-step:hover .process-index { color: var(--ink); background: var(--mint); box-shadow: 0 0 0 8px rgba(141,255,207,.08), 0 0 24px rgba(141,255,207,.3); }.process-step h3 { padding-top: 9px; font: 600 21px var(--serif); letter-spacing: -.04em; }.process-step p { max-width: 630px; margin-top: 9px; color: var(--muted-dark); font-size: 12px; line-height: 1.8; }@keyframes line-flow { 50% { transform: translateY(250%); } }

/* About */
.about { padding: 165px 0 175px; }.about-layout { display: grid; grid-template-columns: .76fr 1.24fr; gap: 9vw; align-items: center; }.founder-visual { position: relative; min-height: 540px; }.founder-frame { position: absolute; inset: 30px 30px 30px 0; overflow: hidden; background: radial-gradient(circle at 50% 28%, rgba(47,131,247,.5), transparent 28%), linear-gradient(145deg, #0b1c31, #060d18 63%); border: 1px solid rgba(99,199,255,.33); }.founder-frame::before { content: ""; position: absolute; inset: 0; background: linear-gradient(115deg, transparent 25%, rgba(141,255,207,.1) 26%, transparent 27%), repeating-linear-gradient(0deg, transparent 0 4px, rgba(141,255,207,.04) 5px 6px); opacity: .6; }.founder-frame::after { content: "01 / HUMAN OPERATIVE"; position: absolute; top: 24px; right: 24px; color: rgba(245,248,251,.43); font: 9px var(--mono); letter-spacing: .1em; }.founder-silhouette { position: absolute; left: 21%; right: 21%; top: 12%; bottom: 0; display: grid; place-items: center; border-radius: 48% 48% 0 0 / 34% 34% 0 0; background: linear-gradient(180deg, rgba(99,199,255,.7), rgba(7,18,32,.98) 68%); clip-path: polygon(50% 0, 75% 4%, 87% 18%, 100% 58%, 92% 100%, 8% 100%, 0 58%, 13% 18%, 25% 4%); filter: drop-shadow(0 -12px 25px rgba(99,199,255,.25)); }.founder-silhouette::before { content: ""; position: absolute; top: 9%; left: 28%; width: 44%; aspect-ratio: 1; border-radius: 50%; background: #081626; box-shadow: inset 0 0 0 1px rgba(141,255,207,.25); }.founder-silhouette::after { content: ""; position: absolute; bottom: 18%; left: 19%; right: 19%; height: 1px; background: rgba(141,255,207,.55); box-shadow: 0 0 14px var(--mint); }.founder-silhouette span { position: relative; z-index: 2; margin-top: 36%; color: var(--mint); font: 600 clamp(47px, 7vw, 80px) var(--serif); letter-spacing: -.12em; text-shadow: 0 0 30px rgba(141,255,207,.25); }.founder-scan { position: absolute; z-index: 3; left: 8%; right: 8%; top: 38%; height: 1px; background: var(--mint); opacity: .6; box-shadow: 0 0 12px var(--mint); animation: scan 4s ease-in-out infinite; }.founder-overlay { position: absolute; z-index: 4; left: 24px; bottom: 24px; display: flex; flex-direction: column; gap: 7px; color: rgba(245,248,251,.52); font: 9px var(--mono); letter-spacing: .08em; }.founder-overlay b { color: var(--mint); font-weight: 400; }.founder-corner { position: absolute; width: 72px; height: 72px; border-color: var(--electric-2); }.corner-a { top: 0; right: 0; border-top: 1px solid; border-right: 1px solid; }.corner-b { bottom: 0; left: -1px; border-left: 1px solid; border-bottom: 1px solid; }.founder-badge { position: absolute; right: -13px; bottom: 0; display: flex; flex-direction: column; gap: 8px; padding: 18px 19px; color: var(--ink); background: var(--mint); box-shadow: 14px 14px 0 rgba(47,131,247,.25); }.founder-badge small { font: 9px var(--mono); text-transform: uppercase; }.founder-badge strong { font: 10px var(--mono); letter-spacing: .06em; }.founder-name { margin-top: 25px; font-size: clamp(62px, 8vw, 112px); text-transform: uppercase; }.founder-name em { color: var(--electric-2); }.founder-role { margin-top: 20px; color: var(--electric-2); font: 500 11px var(--mono); letter-spacing: .14em; text-transform: uppercase; }.about-bio { max-width: 680px; margin-top: 26px; color: var(--muted-light); font-size: 13px; line-height: 1.88; }.skill-chips { display: flex; flex-wrap: wrap; gap: 7px; max-width: 700px; margin-top: 32px; }.skill-chips span { padding: 8px 10px; color: var(--muted-light); border: 1px solid var(--line-light); font: 9px var(--mono); transition: color .3s, background .3s, border-color .3s; }.skill-chips span:hover { color: var(--ink); border-color: var(--mint); background: var(--mint); }@keyframes scan { 0%,100% { transform: translateY(-100px); opacity: 0; } 20%,80% { opacity: .7; } 50% { transform: translateY(180px); } }

/* Contact */
.contact { padding: 165px 0 150px; overflow: hidden; isolation: isolate; }.contact-grid { transform: perspective(500px) rotateX(62deg) translateY(15%); z-index: -3; mask-image: linear-gradient(to bottom, transparent, black 40%, transparent); }.contact-glow { position: absolute; z-index: -2; top: 24%; right: 5%; width: 55vw; height: 55vw; border-radius: 50%; background: radial-gradient(circle, rgba(47,131,247,.2), transparent 67%); }.contact-layout { display: grid; grid-template-columns: .9fr 1.1fr; gap: 9vw; align-items: start; }.contact-copy h2 { margin-top: 28px; font-size: clamp(56px, 7.4vw, 105px); }.contact-copy > p { max-width: 380px; margin-top: 31px; color: var(--muted-dark); font-size: 14px; line-height: 1.85; }.contact-meta { display: flex; flex-direction: column; gap: 13px; margin-top: 60px; color: rgba(245,248,251,.45); font: 10px var(--mono); letter-spacing: .05em; }.contact-form { padding: 30px; border: 1px solid var(--line-dark); background: rgba(7,19,35,.6); backdrop-filter: blur(12px); }.contact-form label { display: block; margin-bottom: 18px; }.contact-form label > span { display: block; margin-bottom: 8px; color: rgba(245,248,251,.42); font: 9px var(--mono); letter-spacing: .08em; text-transform: uppercase; }.form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 15px; }.contact-form input, .contact-form select, .contact-form textarea { width: 100%; padding: 15px 14px; color: var(--white); background: rgba(255,255,255,.045); border: 1px solid var(--line-dark); border-radius: 0; outline: none; font: 12px var(--sans); transition: border-color .3s, background .3s, box-shadow .3s; }.contact-form input::placeholder, .contact-form textarea::placeholder { color: #657383; }.contact-form select { color: #657383; }.contact-form select:valid { color: var(--white); }.contact-form option { color: var(--white); background: var(--ink-2); }.contact-form textarea { min-height: 130px; resize: vertical; }.contact-form input:focus, .contact-form select:focus, .contact-form textarea:focus { background: rgba(99,199,255,.06); border-color: var(--electric); box-shadow: 0 0 0 3px rgba(99,199,255,.08); }.form-button { width: 100%; margin-top: 7px; }.form-status { min-height: 17px; margin-top: 14px; color: var(--mint); font: 10px var(--mono); line-height: 1.5; }

/* Footer */
.site-footer { padding: 84px 0 25px; color: var(--white); background: #03070d; }.footer-top { display: grid; grid-template-columns: 2fr 1fr 1fr; gap: 8vw; padding-bottom: 75px; }.footer-brand p { max-width: 260px; margin-top: 22px; color: var(--muted-dark); font-size: 12px; line-height: 1.8; }.footer-col h3 { margin: 5px 0 21px; color: rgba(245,248,251,.42); font: 9px var(--mono); letter-spacing: .12em; text-transform: uppercase; }.footer-col a { display: block; width: fit-content; margin-bottom: 13px; color: rgba(245,248,251,.65); font: 11px var(--mono); text-decoration: none; transition: color .25s, transform .25s; }.footer-col a:hover { color: var(--mint); transform: translateX(4px); }.footer-bottom { display: flex; justify-content: space-between; gap: 20px; padding-top: 25px; color: #56616e; border-top: 1px solid rgba(255,255,255,.1); font: 9px var(--mono); letter-spacing: .04em; }

@media (max-width: 1100px) {
  .hero-content { margin-left: 8vw; width: 56vw; }.hero-visual { right: -5vw; width: 49vw; opacity: .8; }.services-grid { grid-template-columns: repeat(2, 1fr); }.threat-layout, .about-layout { gap: 5vw; }.process-list { margin-left: 8vw; }
}
@media (max-width: 780px) {
  .content-wrap { width: min(100% - 40px, 620px); }.site-header { height: 70px; padding: 0 20px; }.desktop-nav, .nav-cta { display: none; }.menu-toggle { display: block; }.mobile-menu { top: 70px; display: none; }.mobile-menu.is-open { display: flex; }.hero { min-height: 850px; padding: 140px 0 90px; align-items: flex-start; }.hero-content { width: 100%; margin: 0 auto; }.hero-title { font-size: clamp(58px, 15vw, 95px); }.hero-copy { max-width: 510px; font-size: 14px; }.hero-visual { top: auto; bottom: 0; right: -19vw; width: 75vw; opacity: .38; transform: none; }.hero-stats { width: 100%; margin-top: 54px; grid-template-columns: repeat(2, 1fr); }.hero-stats div, .hero-stats div:not(:first-child) { min-width: 0; padding: 17px 12px 0 0; border-right: 1px solid var(--line-dark); }.hero-stats div:nth-child(2n) { padding-left: 12px; border-right: 0; }.hero-stats div:nth-child(n+3) { padding-top: 16px; }.scroll-cue { left: 20px; bottom: 20px; }.section-heading, .services { padding-top: 100px; }.services { padding-bottom: 110px; }.section-heading { margin-bottom: 48px; }.heading-row, .process-heading { display: block; }.heading-row p, .process-heading p { margin-top: 25px; }.section-heading h2, .threat-copy h2, .why-copy h2, .process-heading h2, .contact-copy h2 { font-size: clamp(51px, 13vw, 78px); }.services-grid { grid-template-columns: 1fr; }.service-card { min-height: 295px; }.threat-room, .why, .process, .about, .contact { padding: 105px 0; }.threat-layout, .why-layout, .about-layout, .contact-layout { display: block; }.threat-copy p { max-width: 500px; }.threat-legend { margin-top: 28px; }.threat-stage { min-height: 410px; margin-top: 60px; }.threat-stats { grid-template-columns: repeat(2, 1fr); margin-top: 64px; }.threat-stat { min-height: 120px; padding: 23px 12px 20px 0; }.threat-stat:not(:first-child) { padding-left: 12px; }.threat-stat:nth-child(2) { border-right: 0; }.threat-stat:nth-child(n+3) { border-top: 1px solid var(--line-dark); }.why-visual { width: min(100%, 480px); margin: 70px auto 0; min-height: 360px; }.process-list { margin: 60px auto 0; }.process-heading p { max-width: 500px; }.process-step { gap: 17px; }.process-step h3 { font-size: 18px; }.founder-visual { min-height: 480px; width: min(100%, 500px); margin: 0 auto 70px; }.founder-badge { right: 0; }.founder-frame { right: 20px; }.founder-name { font-size: clamp(61px, 16vw, 100px); }.contact-layout { display: flex; flex-direction: column; }.contact-copy > p { max-width: 500px; }.contact-meta { margin: 36px 0 52px; }.contact-form { padding: 22px 18px; }.form-row { grid-template-columns: 1fr; gap: 0; }.footer-top { grid-template-columns: 1fr 1fr; gap: 40px; }.footer-brand { grid-column: 1 / -1; }.footer-bottom { flex-direction: column; }
}
@media (max-width: 480px) {
  .hero { min-height: 820px; }.hero-title { font-size: 56px; }.hero-actions { flex-direction: column; align-items: stretch; }.button { width: 100%; }.hero-stats strong { font-size: 23px; }.hero-stats small { font-size: 8px; }.threat-stage { min-height: 330px; }.hud-bottom span:nth-child(2) { display: none; }.founder-visual { min-height: 430px; }.founder-badge { left: 18px; right: auto; padding: 13px 14px; }.founder-badge strong, .founder-badge small { font-size: 8px; }.footer-top { grid-template-columns: 1fr; }.footer-brand { grid-column: auto; }.footer-bottom { font-size: 8px; }
}
@media (pointer: coarse) { .cursor { display: none; } }
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }.ticker-track, .hero-orbit, .core-ring, .core-scan::before, .radar-sweep, .radar-point, .founder-scan, .process-line span { animation: none !important; }.reveal, .reveal-up { opacity: 1; transform: none; animation: none; transition: none; }.cursor { display: none; }
}

/* SGProtected brand theme: white, blue, and the supplied visual assets. */
:root {
  --ink: #071d4a;
  --ink-2: #0b3d91;
  --ink-3: #0f5fd8;
  --paper: #ffffff;
  --paper-2: #eef6ff;
  --line-dark: rgba(25, 93, 196, .18);
  --line-light: rgba(17, 57, 119, .14);
  --white: #ffffff;
  --muted-dark: #627694;
  --muted-light: #536784;
  --electric: #146ee8;
  --electric-2: #0967e8;
  --mint: #cfe5ff;
  --alert: #ef476f;
}

body { color: var(--ink); background: var(--paper); }
.noise { opacity: .02; mix-blend-mode: multiply; }
.cursor { border-color: rgba(9,103,232,.72); mix-blend-mode: multiply; }.cursor::before, .cursor::after, .cursor span { background: var(--electric-2); }.scroll-progress { background: rgba(9,103,232,.08); }.scroll-progress span { background: linear-gradient(var(--electric-2), #71b7ff); box-shadow: 0 0 16px rgba(9,103,232,.45); }

.site-header { color: var(--ink); }.site-header.scrolled { background: rgba(255,255,255,.86); border-color: var(--line-dark); box-shadow: 0 10px 35px rgba(23,85,174,.08); }.brand { color: var(--ink); }.brand-accent { color: var(--electric-2); }.brand-image { display: block; width: 42px; height: 42px; object-fit: contain; border-radius: 9px; }.desktop-nav a { color: rgba(7,29,74,.68); }.desktop-nav a:hover, .desktop-nav a.active { color: var(--ink); }.desktop-nav a::after { background: var(--electric-2); }.nav-cta { color: #fff; background: var(--electric-2); box-shadow: 0 10px 25px rgba(9,103,232,.18); }.nav-cta:hover { color: #fff; background: var(--ink-2); }.menu-toggle span { background: var(--ink); }.mobile-menu { background: rgba(255,255,255,.97); border-color: var(--line-dark); box-shadow: 0 18px 35px rgba(23,85,174,.12); }.mobile-menu a { color: var(--ink); border-color: var(--line-light); }.mobile-menu .mobile-cta { color: #fff; background: var(--electric-2); }

.hero { color: var(--ink); background: linear-gradient(135deg, #fff 0%, #f8fbff 56%, #e4f0ff 100%); }.hero-grid { opacity: .34; background-image: linear-gradient(rgba(20,110,232,.13) 1px, transparent 1px), linear-gradient(90deg, rgba(20,110,232,.13) 1px, transparent 1px); }.hero-grid::after { background: linear-gradient(to bottom, transparent 30%, #f7fbff 96%); }.hero-glow { background: radial-gradient(circle, rgba(61,142,242,.2), transparent 68%); }.hero-orbit { border-color: rgba(20,110,232,.13); }.orbit-b { border-color: rgba(9,103,232,.12); }.orbit-c { border-color: rgba(20,110,232,.18); }.eyebrow { color: var(--electric-2); }.eyebrow.dark { color: var(--electric-2); }.hero-title { color: var(--ink); }.hero-title em, h1 em, h2 em { color: var(--electric-2); }.hero-copy { color: var(--muted-dark); }.button-solid { color: #fff; background: var(--electric-2); box-shadow: 0 11px 28px rgba(9,103,232,.18); }.button-solid:hover { color: #fff; background: var(--ink-2); box-shadow: 0 13px 36px rgba(9,103,232,.25); }.button-ghost { color: var(--ink); border-color: var(--line-dark); background: rgba(255,255,255,.64); }.button-ghost:hover { color: var(--electric-2); background: #fff; border-color: var(--electric-2); }.hero-stats { border-color: var(--line-dark); }.hero-stats div { border-color: var(--line-dark); }.hero-stats strong { color: var(--ink); }.hero-stats strong span { color: var(--electric-2); }.hero-stats small { color: var(--muted-dark); }.scroll-cue { color: var(--muted-dark); }.scroll-cue i { background: linear-gradient(90deg, var(--electric-2), transparent); }.scroll-cue i::after { border-color: var(--electric-2); }

.hero-visual { pointer-events: none; }.security-core { z-index: 1; }.core-ring { border-color: rgba(20,110,232,.26); }.ring-mid { border-color: rgba(9,103,232,.28); }.ring-inner { border-color: rgba(9,103,232,.46); box-shadow: inset 0 0 45px rgba(9,103,232,.12), 0 0 45px rgba(9,103,232,.17); }.core-scan::before { background: conic-gradient(from 30deg, transparent 0 78%, rgba(9,103,232,.45) 86%, transparent 94%); }.core-shield { background: rgba(255,255,255,.86); border-color: rgba(9,103,232,.38); box-shadow: 0 0 42px rgba(9,103,232,.16); }.core-shield svg { stroke: var(--electric-2); }.core-label { color: var(--muted-dark); }.label-bottom { color: var(--electric-2); }.core-node { background: var(--electric-2); box-shadow: 0 0 0 5px rgba(9,103,232,.1), 0 0 14px var(--electric-2); }.node-2 { background: var(--alert); box-shadow: 0 0 0 5px rgba(239,71,111,.1), 0 0 14px var(--alert); }.visual-kicker, .visual-readout { color: var(--muted-dark); }.visual-readout { border-color: var(--line-dark); }.visual-readout b { color: var(--electric-2); }.visual-readout b i { background: var(--electric-2); box-shadow: 0 0 10px var(--electric-2); }

.ticker-wrap { background: var(--electric-2); border-color: rgba(255,255,255,.28); }.ticker-item { color: rgba(255,255,255,.9); }.ticker-item i { background: #ffcfdb; box-shadow: 0 0 10px rgba(255,255,255,.6); }.ticker-item.clear i { background: #d9f8ff; box-shadow: 0 0 10px rgba(255,255,255,.75); }
.section-heading h2, .why-copy h2, .process-heading h2, .about-copy h2, .contact-copy h2 { color: var(--ink); }.heading-row p, .why-copy .intro, .about-bio { color: var(--muted-light); }.services-grid { background: var(--line-light); border-color: var(--line-light); }.service-card { background: #fff; }.service-card:hover { color: var(--ink); background: #f5f9ff; box-shadow: 0 18px 45px rgba(33,101,193,.12); }.service-card p { color: var(--muted-light); }.service-card:hover p { color: var(--muted-light); }.service-icon { color: var(--electric-2); border-color: var(--line-light); }.service-card:hover .service-icon { color: var(--electric-2); border-color: rgba(9,103,232,.4); }.service-tag { color: var(--electric-2); }.service-card:hover .service-tag { color: var(--electric-2); }

.threat-room { color: var(--ink); background: linear-gradient(135deg, #f4f9ff 0%, #eaf4ff 100%); }.threat-room-bg { background: radial-gradient(ellipse at 75% 45%, rgba(47,131,247,.12), transparent 36%), radial-gradient(ellipse at 15% 80%, rgba(9,103,232,.06), transparent 30%); }.threat-room-bg::after { background-image: linear-gradient(rgba(20,110,232,.09) 1px, transparent 1px), linear-gradient(90deg, rgba(20,110,232,.09) 1px, transparent 1px); }.threat-copy p, .threat-legend, .threat-stat span { color: var(--muted-light); }.threat-stage { background: rgba(255,255,255,.74); border-color: var(--line-dark); box-shadow: inset 0 0 100px rgba(47,131,247,.06); }.stage-hud { color: rgba(7,29,74,.58); }.hud-top b, .hud-bottom b { color: var(--electric-2); }.stage-crosshair { border-color: rgba(9,103,232,.4); }.stage-crosshair::before, .stage-crosshair::after { background: rgba(9,103,232,.4); }.stage-crosshair i { background: var(--electric-2); box-shadow: 0 0 13px var(--electric-2); }.threat-stats { border-color: var(--line-dark); }.threat-stat { border-color: var(--line-dark); }.threat-stat strong { color: var(--electric-2); }
.why-visual { background: radial-gradient(circle, rgba(47,131,247,.14), transparent 47%); }.radar-core { color: var(--electric-2); background: rgba(255,255,255,.86); border-color: rgba(9,103,232,.5); box-shadow: 0 0 0 13px rgba(9,103,232,.05), 0 0 45px rgba(9,103,232,.15); }.radar-sweep { background: linear-gradient(90deg, var(--electric-2), transparent); box-shadow: 0 0 12px var(--electric-2); }.radar-sweep::after { background: var(--electric-2); }.radar-label { color: rgba(7,29,74,.55); }.radar-readout { color: var(--muted-light); }.radar-readout strong { color: var(--electric-2); }.radar-readout i { background: var(--electric-2); }

.process { color: var(--ink); background: #f5f9ff; }.process-heading p, .process-step p { color: var(--muted-light); }.process-line { background: linear-gradient(var(--electric-2), rgba(20,110,232,.08)); }.process-line span { background: var(--electric-2); box-shadow: 0 0 10px rgba(9,103,232,.45); }.process-index { color: var(--electric-2); background: #fff; border-color: rgba(9,103,232,.55); box-shadow: 0 0 0 5px #f5f9ff; }.process-step:hover .process-index { color: #fff; background: var(--electric-2); }.process-step { border-color: var(--line-dark); }
.founder-frame { background: #dcecff; border-color: rgba(9,103,232,.34); box-shadow: 0 25px 55px rgba(23,85,174,.14); }.founder-photo { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center top; filter: saturate(.92) contrast(1.04); }.founder-frame::before { background: linear-gradient(115deg, transparent 25%, rgba(141,196,255,.18) 26%, transparent 27%), repeating-linear-gradient(0deg, transparent 0 4px, rgba(9,103,232,.04) 5px 6px); }.founder-frame::after { color: rgba(7,29,74,.65); }.founder-overlay { color: rgba(255,255,255,.88); text-shadow: 0 1px 7px rgba(0,0,0,.3); }.founder-overlay b { color: #d9f8ff; }.founder-corner { border-color: var(--electric-2); }.founder-badge { color: #fff; background: var(--electric-2); box-shadow: 14px 14px 0 rgba(9,61,145,.18); }.founder-name em { color: var(--electric-2); }.founder-role { color: var(--electric-2); }.skill-chips span { color: var(--muted-light); border-color: var(--line-light); }.skill-chips span:hover { color: #fff; border-color: var(--electric-2); background: var(--electric-2); }

.contact.section-dark { color: #fff; background: linear-gradient(135deg, #063d9d 0%, #0967e8 60%, #2188ed 100%); }.contact-grid { opacity: .24; background-image: linear-gradient(rgba(255,255,255,.16) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.16) 1px, transparent 1px); }.contact-glow { background: radial-gradient(circle, rgba(255,255,255,.16), transparent 67%); }.contact-copy h2 { color: #fff; }.contact-copy h2 em { color: #dcecff; }.contact-copy > p, .contact-meta { color: rgba(255,255,255,.78); }.contact-form { background: rgba(4,37,103,.24); border-color: rgba(255,255,255,.34); }.contact-form label > span { color: rgba(255,255,255,.72); }.contact-form input, .contact-form select, .contact-form textarea { color: #fff; background: rgba(255,255,255,.1); border-color: rgba(255,255,255,.34); }.contact-form input::placeholder, .contact-form textarea::placeholder, .contact-form select { color: rgba(255,255,255,.68); }.contact-form input:focus, .contact-form select:focus, .contact-form textarea:focus { background: rgba(255,255,255,.17); border-color: #fff; box-shadow: 0 0 0 3px rgba(255,255,255,.1); }.contact-form option { color: var(--ink); background: #fff; }.form-status { color: #d9f8ff; }.contact .button-solid { color: var(--electric-2); background: #fff; }.contact .button-solid:hover { color: var(--ink); background: #dcecff; }
.site-footer { background: #061b46; }.footer-brand .brand { color: #fff; }.footer-brand .brand-accent { color: #9dd0ff; }.footer-brand p, .footer-col a { color: rgba(255,255,255,.62); }.footer-col h3, .footer-bottom { color: rgba(255,255,255,.52); }.footer-bottom { border-color: rgba(255,255,255,.2); }
.footer-brand p { margin-top: 22px; }

@media (max-width: 780px) {
  .hero-visual { opacity: .46; }.hero-title { color: var(--ink); }.founder-frame { right: 20px; }
}

/* Quiet hero treatment: keep the brand mark without competing graphic layers. */
.hero-orbit, .security-core, .visual-kicker, .visual-readout { display: none !important; }
.hero-visual { width: min(29vw, 380px); aspect-ratio: 1; right: 10vw; top: 50%; transform: translateY(-50%); opacity: 1; }
.hero-minimal-logo { position: absolute; inset: 12%; display: grid; place-items: center; overflow: hidden; background: rgba(255,255,255,.92); border: 1px solid rgba(9,103,232,.22); box-shadow: 22px 28px 65px rgba(25,93,196,.13); transform: rotate(-3deg); }
.hero-minimal-logo::before, .hero-minimal-logo::after { content: ""; position: absolute; width: 42px; height: 42px; border-color: var(--electric-2); }
.hero-minimal-logo::before { top: 16px; left: 16px; border-top: 2px solid; border-left: 2px solid; }
.hero-minimal-logo::after { right: 16px; bottom: 16px; border-right: 2px solid; border-bottom: 2px solid; }
.hero-minimal-logo img { width: 82%; height: 82%; object-fit: contain; mix-blend-mode: multiply; }
@media (max-width: 780px) {
  .hero-visual { right: -4vw; bottom: 8px; top: auto; width: 46vw; opacity: .22; transform: none; }
  .hero-minimal-logo { inset: 8%; }
}

/* Scroll timeline: sections enter with depth, settle into focus, then drift out. */
.scene { --scene-enter: 1; --scene-focus: 0; --scene-leave: 0; --scene-shift: 0px; --scene-scale: 1; --scene-clip: 0%; --scene-opacity: 1; --scene-blur: 0px; --scene-wash-opacity: 0; --scene-wash-y: 0px; --scene-transition-opacity: 0; --scene-transition-y: 0px; --scene-title-y: 0px; --scene-title-scale: 1; --scene-title-opacity: 1; --hero-y: 0px; --hero-scale: 1; --hero-opacity: 1; --hero-blur: 0px; --hero-visual-y: 0px; position: relative; isolation: isolate; }
.scene > .content-wrap, .scene > .hero-content { will-change: transform, opacity, filter; }
.scene:not(.hero) > .content-wrap { transform: translate3d(0, var(--scene-shift), 0) scale(var(--scene-scale)); opacity: var(--scene-opacity); filter: blur(var(--scene-blur)); clip-path: inset(var(--scene-clip) 0 0 0); }
.scene:not(.hero)::before { content: ""; position: absolute; z-index: -1; inset: 0; pointer-events: none; opacity: var(--scene-wash-opacity); transform: translateY(var(--scene-wash-y)); background: linear-gradient(180deg, rgba(255,255,255,.72), transparent 23%); }
.scene:not(.hero)::after { content: ""; position: absolute; z-index: 3; top: 0; left: 0; right: 0; height: 15vh; pointer-events: none; opacity: var(--scene-transition-opacity); transform: translateY(var(--scene-transition-y)); background: linear-gradient(180deg, rgba(255,255,255,.82), transparent); mix-blend-mode: screen; }
.hero > .hero-content { transform: translate3d(0, var(--hero-y), 0) scale(var(--hero-scale)); opacity: var(--hero-opacity); filter: blur(var(--hero-blur)); }
.hero > .hero-visual { translate: 0 var(--hero-visual-y); opacity: var(--hero-opacity); }
.scene:not(.hero) h2 { transform: translate3d(0, var(--scene-title-y), 0) scale(var(--scene-title-scale)); opacity: var(--scene-title-opacity); will-change: transform, opacity; }
.scene[data-active="true"] { z-index: 2; }
.scene[data-active="true"] .eyebrow-rule { animation: cinematic-rule 1.2s var(--ease) both; }
.scene:not(.hero)::after { height: 1px; background: linear-gradient(90deg, transparent 0%, rgba(9,103,232,.08) 18%, var(--electric-2) 50%, rgba(9,103,232,.08) 82%, transparent 100%); box-shadow: 0 0 18px rgba(9,103,232,.28); mix-blend-mode: normal; }
.reveal { transition-delay: var(--reveal-delay, 0ms); }
@keyframes cinematic-rule { from { width: 0; opacity: 0; } to { width: 40px; opacity: .48; } }
@media (prefers-reduced-motion: reduce) {
  .scene:not(.hero) > .content-wrap, .hero > .hero-content, .hero > .hero-visual, .scene:not(.hero) h2 { transform: none !important; translate: none !important; opacity: 1 !important; filter: none !important; }
  .scene::before, .scene::after { display: none; }
}

/* Scroll-led product story: an original SGProtected take on premium product-page pacing. */
.experience { min-height: 285vh; overflow: clip; color: #f6f9ff; background: #061a42; }
.experience::before, .experience::after { display: none; }
.experience-backdrop { position: absolute; inset: 0; pointer-events: none; overflow: hidden; background: radial-gradient(circle at 70% 48%, rgba(20,110,232,.25), transparent 28%), linear-gradient(115deg, #061a42 0%, #082a67 52%, #04142f 100%); }
.experience-backdrop::before, .experience-backdrop::after { content: ""; position: absolute; width: 60vw; height: 1px; background: linear-gradient(90deg, transparent, rgba(141,205,255,.32), transparent); transform: rotate(-28deg); }
.experience-backdrop::before { top: 28%; left: -10%; }.experience-backdrop::after { top: 69%; right: -12%; transform: rotate(22deg); }
.experience-backdrop span { position: absolute; display: block; width: 1px; height: 72%; opacity: .18; background: linear-gradient(180deg, transparent, #8dccff, transparent); transform: rotate(32deg); }
.experience-backdrop span:nth-child(1) { left: 25%; top: -8%; }.experience-backdrop span:nth-child(2) { right: 27%; top: 13%; transform: rotate(-32deg); }.experience-backdrop span:nth-child(3) { right: 8%; top: -12%; height: 90%; opacity: .1; transform: rotate(46deg); }
.experience-intro { position: relative; z-index: 1; padding-top: 18vh; padding-bottom: 7vh; }
.experience-intro h2 { max-width: 850px; color: #fff; font-size: clamp(60px, 9.8vw, 142px); letter-spacing: -.075em; line-height: .9; }
.experience-intro h2 em { color: #6fbaff; }
.experience-intro p { max-width: 590px; margin: 34px 0 0; color: rgba(225,237,255,.68); font-size: 16px; line-height: 1.8; }
.experience-stage { position: relative; min-height: 215vh; }
.experience-sticky { position: sticky; top: 0; display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(350px, .95fr); gap: clamp(28px, 7vw, 120px); align-items: center; width: min(100% - 12vw, 1380px); height: 100svh; min-height: 660px; margin: 0 auto; }
.experience-visual { position: relative; display: grid; place-items: center; width: min(38vw, 520px); aspect-ratio: .86; margin-inline: auto; transform: translate3d(0, var(--experience-visual-y, 0px), 0); transition: transform .8s cubic-bezier(.2,.7,.2,1); }
.visual-orbit { position: absolute; width: 69%; aspect-ratio: .72; border: 1px solid rgba(120,193,255,.3); border-radius: 48px; transform: rotate(-16deg); box-shadow: 0 0 80px rgba(20,110,232,.12); transition: transform 1.2s cubic-bezier(.2,.75,.2,1), opacity 1.2s ease; }
.orbit-outer { width: 86%; opacity: .5; transform: rotate(16deg) translate(7%, -2%); }
.orbit-inner { width: 61%; opacity: .8; transform: rotate(-16deg) translate(-5%, 2%); }
.experience-visual[data-story-state="1"] .orbit-outer { transform: rotate(24deg) translate(9%, -3%) scale(1.05); }.experience-visual[data-story-state="1"] .orbit-inner { transform: rotate(-25deg) translate(-7%, 3%) scale(.94); }
.experience-visual[data-story-state="2"] .orbit-outer { transform: rotate(31deg) translate(12%, -3%) scale(1.1); }.experience-visual[data-story-state="2"] .orbit-inner { transform: rotate(-33deg) translate(-10%, 4%) scale(.88); }
.defense-device { position: relative; z-index: 2; width: min(54%, 250px); aspect-ratio: .66; padding: 9px; border: 1px solid rgba(182,222,255,.56); border-radius: 40px; background: linear-gradient(140deg, rgba(255,255,255,.82), rgba(83,157,237,.13) 38%, rgba(2,13,39,.86)); box-shadow: 0 35px 90px rgba(0,0,0,.34), inset 0 0 0 1px rgba(255,255,255,.13), 0 0 75px rgba(52,151,255,.2); transform: perspective(1100px) rotateY(-14deg) rotateZ(4deg) translateY(var(--experience-device-y, 0px)); transition: transform 1s cubic-bezier(.2,.75,.2,1), box-shadow 1s ease; }
.experience-visual[data-story-state="1"] .defense-device { transform: perspective(1100px) rotateY(8deg) rotateZ(-3deg) translateY(-12px) scale(1.04); box-shadow: 0 42px 105px rgba(0,0,0,.4), 0 0 90px rgba(52,151,255,.32); }
.experience-visual[data-story-state="2"] .defense-device { transform: perspective(1100px) rotateY(-4deg) rotateZ(2deg) translateY(-18px) scale(1.08); box-shadow: 0 48px 120px rgba(0,0,0,.48), 0 0 110px rgba(52,151,255,.4); }
.device-edge { position: absolute; z-index: 3; top: 22%; left: -3px; width: 3px; height: 48px; border-radius: 4px 0 0 4px; background: #77bdff; box-shadow: 0 64px 0 #77bdff; }
.device-screen { position: relative; display: flex; flex-direction: column; justify-content: space-between; height: 100%; overflow: hidden; padding: 22px 15px 17px; border-radius: 32px; background: linear-gradient(145deg, #0b55b7 0%, #08285e 47%, #03112e 100%); }
.device-screen::before { content: ""; position: absolute; inset: -35% 18% 30%; border-radius: 50%; background: rgba(96,194,255,.33); filter: blur(35px); transform: rotate(20deg); }
.screen-grid { position: absolute; inset: 0; opacity: .16; background-image: linear-gradient(rgba(180,228,255,.35) 1px, transparent 1px), linear-gradient(90deg, rgba(180,228,255,.35) 1px, transparent 1px); background-size: 19px 19px; mask-image: linear-gradient(180deg, #000 0 68%, transparent); }
.screen-topline, .screen-foot { position: relative; z-index: 1; display: flex; justify-content: space-between; color: rgba(220,241,255,.66); font: 7px var(--mono); letter-spacing: .11em; }
.screen-topline i { width: 6px; height: 6px; border-radius: 50%; background: #9dffd9; box-shadow: 0 0 12px #9dffd9; }
.screen-core { position: relative; z-index: 1; display: grid; place-items: center; width: 110px; aspect-ratio: 1; margin: 10px auto 0; border: 1px solid rgba(187,232,255,.55); border-radius: 50%; background: radial-gradient(circle, rgba(150,220,255,.18), rgba(14,96,207,.04) 52%, transparent 53%); box-shadow: 0 0 0 14px rgba(144,212,255,.05), 0 0 50px rgba(103,195,255,.35); }
.screen-core::before, .screen-core::after { content: ""; position: absolute; background: rgba(177,229,255,.42); }.screen-core::before { width: 145%; height: 1px; }.screen-core::after { width: 1px; height: 145%; }
.screen-core span { color: #fff; font: 700 33px var(--display); letter-spacing: -.14em; transform: translateX(-2px); }.screen-core b { position: absolute; width: 9px; height: 9px; border-radius: 50%; background: #9dffd9; box-shadow: 0 0 18px #9dffd9; }
.screen-telemetry { position: relative; z-index: 1; display: flex; flex-direction: column; align-items: center; gap: 3px; margin-top: 12px; }.screen-telemetry strong { color: #fff; font: 700 27px var(--display); letter-spacing: -.08em; }.screen-telemetry span { color: rgba(220,241,255,.65); font: 8px var(--mono); letter-spacing: .08em; text-transform: uppercase; }
.screen-bars { position: relative; z-index: 1; display: flex; align-items: end; justify-content: center; gap: 3px; height: 48px; margin-top: 15px; }.screen-bars i { width: 7px; height: 34%; background: #72c6ff; box-shadow: 0 0 10px rgba(114,198,255,.6); animation: story-bars 1.7s ease-in-out infinite alternate; }.screen-bars i:nth-child(2) { height: 65%; animation-delay: -.6s; }.screen-bars i:nth-child(3) { height: 46%; animation-delay: -.3s; }.screen-bars i:nth-child(4) { height: 84%; animation-delay: -.8s; }.screen-bars i:nth-child(5) { height: 58%; animation-delay: -.2s; }.screen-bars i:nth-child(6) { height: 91%; animation-delay: -.9s; }.screen-bars i:nth-child(7) { height: 71%; animation-delay: -.45s; }.screen-bars i:nth-child(8) { height: 52%; animation-delay: -.7s; }
.screen-foot { padding-top: 13px; border-top: 1px solid rgba(180,228,255,.18); }.screen-foot b { color: #9dffd9; font-weight: 400; }
.visual-caption { position: absolute; bottom: 2%; left: 50%; z-index: 3; display: flex; flex-direction: column; gap: 7px; width: max-content; transform: translateX(-50%); color: rgba(219,239,255,.56); font: 9px var(--mono); letter-spacing: .14em; text-align: center; text-transform: uppercase; }.visual-caption b { color: #9ed4ff; font-weight: 400; }
.experience-copy { position: relative; align-self: center; min-height: 320px; }.story-panel { position: absolute; top: 50%; left: 0; width: min(100%, 470px); opacity: 0; transform: translate3d(0, 42px, 0); filter: blur(9px); pointer-events: none; transition: opacity .7s ease, transform .9s cubic-bezier(.2,.75,.2,1), filter .7s ease; }.story-panel.is-active { opacity: 1; transform: translate3d(0, -50%, 0); filter: blur(0); pointer-events: auto; }.story-label { display: inline-flex; align-items: center; gap: 13px; color: #77c2ff; font: 10px var(--mono); letter-spacing: .16em; text-transform: uppercase; }.story-label::before { content: ""; width: 32px; height: 1px; background: currentColor; box-shadow: 0 0 12px currentColor; }.story-panel h3 { margin: 23px 0 19px; color: #fff; font: 700 clamp(36px, 4.2vw, 66px)/.98 var(--display); letter-spacing: -.065em; }.story-panel p { max-width: 410px; color: rgba(225,237,255,.67); font-size: 16px; line-height: 1.75; }.experience-progress { position: absolute; top: 50%; right: 4.4vw; width: 2px; height: 150px; overflow: hidden; transform: translateY(-50%); background: rgba(149,211,255,.22); }.experience-progress span { display: block; width: 100%; height: var(--experience-progress-height, 0%); background: #83ccff; box-shadow: 0 0 14px #83ccff; transition: height .35s ease; }
@keyframes story-bars { from { transform: scaleY(.72); opacity: .65; } to { transform: scaleY(1.08); opacity: 1; } }

/* Replace instrument-panel numbering with quiet visual markers. */
.service-number, .process-index, .feature-icon { font-size: 0 !important; }.service-number::before { content: ""; display: block; width: 24px; height: 2px; background: var(--electric-2); box-shadow: 0 0 12px rgba(9,103,232,.35); }.process-index::before, .feature-icon::before { content: ""; display: block; width: 7px; height: 7px; margin: 9px auto; border: 1px solid var(--electric-2); border-radius: 50%; box-shadow: 0 0 0 4px rgba(9,103,232,.08); }.feature-icon::before { margin: 12px 0; }

/* Clean architectural visual in place of the old radar treatment. */
.architecture-visual { position: relative; min-height: 520px; overflow: hidden; background: linear-gradient(145deg, #f7fbff, #ddecff); border: 1px solid rgba(9,103,232,.2); box-shadow: 25px 30px 70px rgba(23,85,174,.12); }
.architecture-grid { position: absolute; inset: 0; opacity: .28; background-image: linear-gradient(rgba(9,103,232,.12) 1px, transparent 1px), linear-gradient(90deg, rgba(9,103,232,.12) 1px, transparent 1px); background-size: 28px 28px; mask-image: linear-gradient(135deg, #000, transparent 76%); }
.architecture-grid::after { content: ""; position: absolute; width: 45%; height: 150%; left: 41%; top: -23%; background: linear-gradient(90deg, transparent, rgba(255,255,255,.9), transparent); transform: rotate(34deg); animation: architecture-sheen 6s ease-in-out infinite; }
.architecture-stack { position: absolute; inset: 14% 12%; display: flex; flex-direction: column; justify-content: center; gap: 15px; perspective: 900px; transform: rotate(-8deg) skewY(5deg); }.architecture-layer { position: relative; display: grid; grid-template-columns: 38px 1fr; grid-template-rows: 1fr 1fr; width: 100%; min-height: 98px; padding: 22px 24px; border: 1px solid rgba(9,103,232,.25); background: rgba(255,255,255,.75); box-shadow: 18px 18px 0 rgba(9,103,232,.06), 0 18px 38px rgba(23,85,174,.1); transform: translateX(calc(var(--layer-offset, 0px))); transition: transform .7s cubic-bezier(.2,.75,.2,1), background .4s ease; }.architecture-layer:nth-child(1) { --layer-offset: 0px; }.architecture-layer:nth-child(2) { --layer-offset: 38px; }.architecture-layer:nth-child(3) { --layer-offset: 76px; }.architecture-layer:hover { transform: translateX(calc(var(--layer-offset, 0px) + 12px)); background: #fff; }.architecture-layer span { display: grid; place-items: center; grid-row: 1 / -1; align-self: center; width: 17px; height: 17px; color: transparent; font-size: 0; border: 1px solid var(--electric-2); border-radius: 50%; }.architecture-layer span::before { content: ""; width: 5px; height: 5px; border-radius: 50%; background: var(--electric-2); box-shadow: 0 0 9px var(--electric-2); }.architecture-layer b { color: var(--ink); font: 700 18px var(--display); letter-spacing: .04em; }.architecture-layer small { color: var(--muted-light); font: 10px var(--mono); letter-spacing: .04em; }.architecture-caption { position: absolute; right: 28px; bottom: 27px; display: flex; flex-direction: column; gap: 7px; color: rgba(7,29,74,.52); font: 9px var(--mono); letter-spacing: .12em; text-align: right; }.architecture-caption b { color: var(--electric-2); font-weight: 400; }.why-visual.architecture-visual::before, .why-visual.architecture-visual::after { display: none; }
@keyframes architecture-sheen { 0%, 55% { transform: translateX(-90%) rotate(34deg); opacity: 0; } 68% { opacity: .65; } 90%, 100% { transform: translateX(180%) rotate(34deg); opacity: 0; } }

@media (max-width: 780px) {
  .experience { min-height: 280vh; }.experience-intro { padding-top: 13vh; padding-bottom: 3vh; }.experience-intro h2 { font-size: clamp(55px, 14vw, 92px); }.experience-intro p { font-size: 14px; }
  .experience-stage { min-height: 215vh; }.experience-sticky { display: block; width: min(100% - 40px, 620px); min-height: 0; padding-top: 12vh; }.experience-visual { width: min(74vw, 390px); margin: 0 auto; }.experience-copy { position: absolute; right: 0; bottom: 8vh; left: 0; min-height: 270px; }.story-panel { width: 100%; }.story-panel h3 { font-size: clamp(35px, 10vw, 54px); }.story-panel p { max-width: 520px; font-size: 14px; }.experience-progress { top: auto; right: 20px; bottom: 7vh; height: 100px; transform: none; }.architecture-visual { min-height: 390px; margin-top: 64px; }.architecture-stack { inset: 12% 8%; }.architecture-layer { min-height: 80px; padding: 16px; }.architecture-layer b { font-size: 15px; }.architecture-layer:nth-child(2) { --layer-offset: 20px; }.architecture-layer:nth-child(3) { --layer-offset: 40px; }
}
@media (prefers-reduced-motion: reduce) {
  .experience-visual, .defense-device, .visual-orbit, .architecture-grid::after { transform: none !important; animation: none !important; }.story-panel { transition: none; }.story-panel:not(.is-active) { display: none; }.experience-progress span { transition: none; }
}

/* Whole-page cinematic choreography: every chapter reacts to the scroll timeline. */
.scene { --chapter-progress: 0; }
.hero { overflow: clip; }
.hero-grid { transform: perspective(500px) rotateX(62deg) translate3d(var(--hero-grid-x, 0px), var(--hero-grid-y, 0px), 0); transition: transform .25s linear; }
.hero-glow { left: var(--hero-glow-left, 42%); top: var(--hero-glow-top, 40%); transform: translate(-50%, -50%) scale(var(--hero-glow-scale, 1)); transition: left .25s linear, top .25s linear, transform .25s linear; }
.hero-content { position: relative; z-index: 2; }
.hero-title { text-wrap: balance; }
.hero-title em { display: inline-block; transform: translate3d(var(--hero-title-x, 0px), 0, 0); transition: transform .25s linear; }
.hero-visual { transition: opacity .3s linear, translate .3s linear; }
.hero-stats { transform: translateY(var(--hero-stats-y, 0px)); transition: transform .25s linear; }

.services { position: relative; isolation: isolate; overflow: clip; }
.services::after { content: ""; position: absolute; z-index: -1; inset: 0; pointer-events: none; opacity: .5; background: linear-gradient(115deg, transparent 20%, rgba(153,205,255,.15) 48%, transparent 70%); transform: translate3d(var(--services-sheen-x, 0%), 0, 0); transition: transform .25s linear; }
.services-grid { transform: translate3d(0, var(--services-drift, 0px), 0); transition: transform .25s linear; }
.service-card { --card-y: 48px; --card-scale: .94; --tilt-x: 0deg; --tilt-y: 0deg; transform: perspective(1050px) rotateX(var(--tilt-x)) rotateY(var(--tilt-y)) translate3d(0, var(--card-y), 0) scale(var(--card-scale)); transition: transform .7s cubic-bezier(.2,.75,.2,1), background .4s, color .4s, box-shadow .4s; }
.service-card::after { content: ""; position: absolute; z-index: 0; top: 0; right: 0; width: 1px; height: 100%; opacity: var(--card-glow, 0); background: linear-gradient(180deg, #6fbaff, transparent); box-shadow: 0 0 18px rgba(111,186,255,.7); transition: opacity .6s ease; }
.service-card:hover { transform: perspective(1050px) rotateX(var(--tilt-x)) rotateY(var(--tilt-y)) translate3d(0, calc(var(--card-y) - 7px), 0) scale(var(--card-scale)); }

.threat-room { overflow: clip; }
.threat-room-bg { transform: translate3d(var(--threat-bg-x, 0px), var(--threat-bg-y, 0px), 0) scale(var(--threat-bg-scale, 1)); transition: transform .25s linear; }
.threat-copy { transform: translate3d(0, var(--threat-copy-y, 0px), 0); transition: transform .25s linear; }
.threat-stage { transform: translate3d(0, var(--threat-drift, 0px), 0) scale(var(--threat-scale, 1)); transition: transform .35s cubic-bezier(.2,.75,.2,1), box-shadow .35s ease; }
.threat-stats { transform: translateY(var(--threat-stats-y, 0px)); transition: transform .25s linear; }

.why { overflow: clip; }
.why-copy { transform: translate3d(0, var(--why-copy-y, 0px), 0); transition: transform .25s linear; }
.why-feature { position: relative; --feature-y: 34px; transform: translate3d(0, var(--feature-y), 0); transition: transform .75s cubic-bezier(.2,.75,.2,1), padding-left .35s var(--ease); }
.why-feature::after { content: ""; position: absolute; left: 0; bottom: -1px; width: var(--feature-line-width, 0%); height: 1px; background: var(--electric-2); opacity: .3; pointer-events: none; }
.why-visual.architecture-visual { transform: translate3d(0, var(--architecture-shift, 0px), 0); transition: transform .35s cubic-bezier(.2,.75,.2,1), box-shadow .35s ease; }
.architecture-stack { transform: rotate(-8deg) skewY(5deg) translate3d(var(--architecture-x, 0px), 0, 0); transition: transform .35s linear; }

.process { overflow: clip; }
.process-heading { transform: translate3d(0, var(--process-heading-y, 0px), 0); transition: transform .25s linear; }
.process-step { --process-x: 54px; --process-opacity: .42; transform: translate3d(var(--process-x), 0, 0); opacity: var(--process-opacity); transition: transform .75s cubic-bezier(.2,.75,.2,1), opacity .75s ease, border-color .3s; }
.process-step:hover { transform: translate3d(calc(var(--process-x) + 8px), 0, 0); }
.process-line span { height: 0; animation: none; transition: height .25s linear; }

.about { overflow: clip; }
.founder-visual { --about-visual-y: 0px; transform: translate3d(0, var(--about-visual-y), 0); transition: transform .35s cubic-bezier(.2,.75,.2,1); }
.about-copy { --about-copy-y: 0px; transform: translate3d(0, var(--about-copy-y), 0); transition: transform .35s cubic-bezier(.2,.75,.2,1); }
.founder-frame { transform: rotate(var(--founder-rotation, 0deg)) scale(var(--founder-scale, 1)); transition: transform .5s cubic-bezier(.2,.75,.2,1), box-shadow .4s ease; }
.founder-photo { transform: scale(var(--founder-photo-scale, 1.04)) translate3d(0, var(--founder-photo-y, 0px), 0); transition: transform .35s linear; }

.contact { overflow: clip; }
.contact-grid { transform: perspective(500px) rotateX(62deg) translate3d(var(--contact-grid-x, 0px), var(--contact-grid-y, 15%), 0); transition: transform .25s linear; }
.contact-glow { transform: translate3d(var(--contact-glow-x, 0px), var(--contact-glow-y, 0px), 0) scale(var(--contact-glow-scale, 1)); transition: transform .25s linear; }
.contact-copy { --contact-copy-y: 0px; transform: translate3d(0, var(--contact-copy-y), 0); transition: transform .45s cubic-bezier(.2,.75,.2,1); }
.contact-form { --contact-form-y: 0px; transform: translate3d(0, var(--contact-form-y), 0) scale(var(--contact-form-scale, 1)); transition: transform .45s cubic-bezier(.2,.75,.2,1), box-shadow .4s ease; box-shadow: 0 var(--contact-shadow-y, 0px) 70px rgba(3,27,83,.18); }

@media (max-width: 780px) {
  .hero-grid { transform: perspective(500px) rotateX(62deg) translate3d(0, var(--hero-grid-y, 0px), 0); }
  .hero-title em, .hero-stats { transform: none; }
  .services-grid { transform: none; }
  .service-card { transform: translate3d(0, var(--card-y), 0) scale(var(--card-scale)); }
  .service-card:hover { transform: translate3d(0, calc(var(--card-y) - 5px), 0) scale(var(--card-scale)); }
  .threat-stage { transform: translate3d(0, var(--threat-drift, 0px), 0) scale(var(--threat-scale, 1)); }
  .why-copy, .process-heading, .contact-copy { transform: none; }
  .why-visual.architecture-visual { transform: translate3d(0, var(--architecture-shift, 0px), 0); }
  .process-step:hover { transform: translate3d(var(--process-x), 0, 0); }
  .founder-frame { transform: none; }
  .contact-grid { transform: perspective(500px) rotateX(62deg) translateY(15%); }
}

@media (prefers-reduced-motion: reduce) {
  .hero-grid, .hero-glow, .hero-title em, .hero-stats, .services::after, .services-grid, .service-card, .threat-room-bg, .threat-copy, .threat-stage, .threat-stats, .why-copy, .why-feature, .why-visual.architecture-visual, .architecture-stack, .process-heading, .process-step, .founder-visual, .about-copy, .founder-frame, .founder-photo, .contact-grid, .contact-glow, .contact-copy, .contact-form { transform: none !important; transition: none !important; opacity: 1 !important; }
}

/* Hero object film: the opening chapter now carries the story from the first scroll. */
.hero { min-height: 260vh; padding: 0; display: block; overflow: clip; }
.hero-sticky { position: sticky; top: 0; display: flex; align-items: center; min-height: 100svh; height: 100svh; overflow: hidden; }
.hero .hero-content { position: relative; z-index: 5; transform: translate3d(0, var(--hero-y, 0px), 0) scale(var(--hero-scale, 1)); opacity: var(--hero-opacity, 1); filter: blur(var(--hero-blur, 0px)); }
.hero-object-stage { position: absolute; z-index: 2; top: 50%; right: 3vw; width: min(51vw, 780px); height: min(78vh, 760px); aspect-ratio: auto; pointer-events: none; transform: translateY(-50%) translate3d(0, var(--hero-visual-y, 0px), 0) scale(var(--hero-object-stage-scale, 1)); opacity: var(--hero-opacity, 1); transition: transform .25s linear, opacity .25s linear; }
.hero-object-stage::before { content: ""; position: absolute; inset: 11%; border: 1px solid rgba(20,110,232,.16); border-radius: 50%; background: radial-gradient(circle at center, rgba(20,110,232,.14), transparent 56%); box-shadow: inset 0 0 80px rgba(20,110,232,.08), 0 0 85px rgba(20,110,232,.09); }
.hero-object-stage::after { content: ""; position: absolute; inset: 4% 0; opacity: .35; background: linear-gradient(90deg, transparent, rgba(20,110,232,.12) 50%, transparent), linear-gradient(180deg, transparent 49.8%, rgba(20,110,232,.18) 50%, transparent 50.2%); mask-image: radial-gradient(ellipse, #000 0 37%, transparent 72%); }
#heroParticleCanvas { position: absolute; inset: 0; z-index: 0; width: 100%; height: 100%; opacity: .95; }
.cyber-object { position: absolute; z-index: 3; top: 50%; left: 50%; display: grid; place-items: center; width: 80%; height: 72%; opacity: 0; filter: blur(18px); transform: translate(-50%, -50%) scale(.7) rotate(-9deg); transition: opacity .9s cubic-bezier(.2,.75,.2,1), filter .9s ease, transform 1.05s cubic-bezier(.2,.75,.2,1); }
.hero-object-stage[data-object-state="0"] .object-laptop, .hero-object-stage[data-object-state="1"] .object-phone, .hero-object-stage[data-object-state="2"] .object-key, .hero-object-stage[data-object-state="3"] .object-terminal, .hero-object-stage[data-object-state="4"] .object-shield { opacity: 1; filter: blur(0); transform: translate(-50%, -50%) scale(1) rotate(0); }
.hero-object-stage[data-object-state="1"] .object-phone { transform: translate(-50%, -50%) scale(1.05) rotate(4deg); }.hero-object-stage[data-object-state="2"] .object-key { transform: translate(-50%, -50%) scale(1.1) rotate(-12deg); }.hero-object-stage[data-object-state="3"] .object-terminal { transform: translate(-50%, -50%) scale(1.02) rotate(-3deg); }.hero-object-stage[data-object-state="4"] .object-shield { transform: translate(-50%, -50%) scale(1.08) rotate(2deg); }
.hero-object-caption { position: absolute; z-index: 6; right: 10%; bottom: 8%; display: flex; flex-direction: column; gap: 8px; color: rgba(7,29,74,.55); font: 9px var(--mono); letter-spacing: .14em; text-align: right; text-transform: uppercase; }.hero-object-caption b { color: var(--electric-2); font-size: 10px; font-weight: 400; }.hero-object-caption i { display: block; width: 54px; height: 1px; margin-left: auto; background: var(--electric-2); box-shadow: 0 0 12px var(--electric-2); }

/* Laptop / field console */
.object-laptop { perspective: 1000px; }.laptop-lid { position: relative; width: min(74%, 560px); aspect-ratio: 1.56; padding: 12px; border: 2px solid #7dc1ff; border-bottom: 6px solid #174eaa; border-radius: 18px 18px 8px 8px; background: linear-gradient(145deg, #e9f5ff, #1b5dbb 23%, #051a43 90%); box-shadow: 0 30px 70px rgba(9,65,150,.25), inset 0 0 0 1px rgba(255,255,255,.65); transform: rotateX(-3deg); }.laptop-camera { position: absolute; z-index: 2; top: 5px; left: 50%; width: 3px; height: 3px; border-radius: 50%; background: #06296b; transform: translateX(-50%); }.terminal-window { position: absolute; inset: 12px; overflow: hidden; padding: 13px 16px; border: 1px solid rgba(125,193,255,.5); background: linear-gradient(145deg, #03122d, #072e6a); color: #b9e1ff; font: 10px var(--mono); box-shadow: inset 0 0 30px rgba(57,151,255,.14); }.terminal-top { display: flex; align-items: center; gap: 5px; padding-bottom: 12px; border-bottom: 1px solid rgba(125,193,255,.2); color: rgba(196,229,255,.64); font-size: 7px; letter-spacing: .1em; }.terminal-top span { width: 5px; height: 5px; border-radius: 50%; background: #70bcff; }.terminal-top span:nth-child(2) { background: #9dffd9; }.terminal-top span:nth-child(3) { background: #ff9ab1; }.terminal-top b { margin-left: auto; font-weight: 400; }.terminal-window p { margin-top: 16px; }.terminal-window i { color: #9dffd9; font-style: normal; }.terminal-window strong { color: #fff; font-weight: 400; }.terminal-chart { position: absolute; right: 18px; bottom: 16px; display: flex; align-items: end; gap: 4px; height: 46px; }.terminal-chart i { display: block; width: 7px; height: 35%; background: #65b9ff; box-shadow: 0 0 10px rgba(101,185,255,.6); }.terminal-chart i:nth-child(2) { height: 70%; }.terminal-chart i:nth-child(3) { height: 46%; }.terminal-chart i:nth-child(4) { height: 88%; }.terminal-chart i:nth-child(5) { height: 58%; }.terminal-chart i:nth-child(6) { height: 77%; }.terminal-chart i:nth-child(7) { height: 96%; }.laptop-base { position: absolute; left: 10%; bottom: 10%; width: 80%; height: 13%; border: 1px solid rgba(20,110,232,.35); border-radius: 3px 3px 20px 20px; background: linear-gradient(180deg, #b9ddff, #477ec3 24%, #0b2c65); box-shadow: 0 16px 30px rgba(7,50,120,.22); transform: perspective(400px) rotateX(65deg); }.laptop-base::after { content: ""; position: absolute; top: 10%; left: 43%; width: 14%; height: 5px; border-radius: 0 0 8px 8px; background: rgba(5,35,87,.65); }.laptop-label, .phone-label, .key-label, .terminal-label, .shield-label { position: absolute; bottom: 1%; color: rgba(7,54,128,.6); font: 9px var(--mono); letter-spacing: .16em; }

/* Mobile endpoint */
.object-phone { width: 64%; height: 82%; }.phone-frame { position: relative; width: min(205px, 47%); height: 78%; padding: 8px; border: 2px solid #8acaff; border-radius: 32px; background: linear-gradient(145deg, #e6f4ff, #1c63c9 30%, #051a43 90%); box-shadow: 0 32px 72px rgba(9,65,150,.28), inset 0 0 0 1px rgba(255,255,255,.66); transform: rotate(8deg); }.phone-screen { position: relative; display: flex; flex-direction: column; align-items: center; height: 100%; overflow: hidden; padding: 28px 12px 14px; border-radius: 25px; color: #fff; background: radial-gradient(circle at 50% 35%, rgba(81,182,255,.28), transparent 31%), linear-gradient(145deg, #0a5ec4, #03112d 72%); }.phone-screen::after { content: ""; position: absolute; inset: 0; opacity: .22; background-image: linear-gradient(rgba(180,228,255,.4) 1px, transparent 1px), linear-gradient(90deg, rgba(180,228,255,.4) 1px, transparent 1px); background-size: 18px 18px; mask-image: linear-gradient(180deg, #000, transparent 80%); }.phone-notch { position: absolute; z-index: 3; top: 13px; left: 50%; width: 39%; height: 10px; border-radius: 0 0 10px 10px; background: #04132e; transform: translateX(-50%); }.phone-status { position: relative; z-index: 2; font: 7px var(--mono); letter-spacing: .1em; }.phone-lock { position: relative; z-index: 2; display: grid; place-items: center; width: 66px; height: 66px; margin-top: 58px; border: 1px solid #9dffd9; border-radius: 50%; color: #9dffd9; font: 38px var(--display); box-shadow: 0 0 0 12px rgba(157,255,217,.07), 0 0 35px rgba(157,255,217,.38); }.phone-screen b { position: relative; z-index: 2; margin-top: 26px; color: #fff; font: 700 15px/1.02 var(--display); letter-spacing: -.04em; text-align: center; }.phone-screen small { position: relative; z-index: 2; margin-top: 8px; color: rgba(224,242,255,.66); font: 8px var(--mono); }.phone-signal { position: relative; z-index: 2; display: flex; align-items: end; gap: 3px; height: 23px; margin-top: auto; }.phone-signal i { width: 4px; height: 30%; background: #9dffd9; }.phone-signal i:nth-child(2) { height: 48%; }.phone-signal i:nth-child(3) { height: 65%; }.phone-signal i:nth-child(4) { height: 82%; }.phone-signal i:nth-child(5) { height: 100%; }

/* Identity key / physical security token */
.object-key { width: 72%; height: 68%; }.security-key { position: relative; display: flex; align-items: center; width: 80%; height: 105px; transform: rotate(-22deg); filter: drop-shadow(0 25px 25px rgba(9,65,150,.25)); }.key-head { display: block; width: 125px; aspect-ratio: 1; border: 13px solid #176ce5; border-radius: 50%; background: #eaf5ff; box-shadow: inset 0 0 0 10px rgba(9,103,232,.08), 0 0 34px rgba(20,110,232,.24); }.key-head::after { content: ""; position: absolute; left: 40px; width: 24px; height: 24px; border-radius: 50%; background: #061a42; }.key-shaft { display: block; width: 220px; height: 42px; border: 10px solid #176ce5; border-left: 0; border-radius: 0 17px 17px 0; background: linear-gradient(180deg, #97ceff, #0b3d91); }.key-tooth { display: block; width: 55px; height: 27px; margin-left: -1px; border-right: 11px solid #176ce5; border-bottom: 11px solid #176ce5; transform: translateY(18px); }.key-pulse { position: absolute; width: 42%; aspect-ratio: 1; border: 1px solid rgba(20,110,232,.32); border-radius: 50%; animation: key-pulse 2.6s ease-in-out infinite; }.key-pulse::before, .key-pulse::after { content: ""; position: absolute; inset: 15%; border: 1px solid rgba(20,110,232,.25); border-radius: 50%; }.key-pulse::after { inset: 30%; border-color: rgba(20,110,232,.18); }.key-label { bottom: 6%; }
@keyframes key-pulse { 50% { transform: scale(1.35); opacity: .25; } }

/* Detection engine */
.object-terminal { width: 75%; height: 72%; }.terminal-panel { position: relative; width: min(75%, 500px); height: 58%; padding: 25px; border: 1px solid rgba(20,110,232,.45); background: linear-gradient(145deg, rgba(255,255,255,.94), rgba(216,234,255,.72)); box-shadow: 0 28px 75px rgba(9,65,150,.22), inset 0 0 60px rgba(128,193,255,.16); transform: rotate(-5deg); }.terminal-panel::before { content: ""; position: absolute; inset: 12px; border: 1px solid rgba(20,110,232,.17); }.panel-kicker { position: relative; color: rgba(7,54,128,.6); font: 8px var(--mono); letter-spacing: .13em; }.panel-wave { position: relative; display: flex; align-items: center; gap: 6px; height: 40%; margin-top: 24px; border-top: 1px solid rgba(20,110,232,.2); border-bottom: 1px solid rgba(20,110,232,.2); }.panel-wave i { display: block; width: 7px; height: 28%; background: #176ce5; box-shadow: 0 0 11px rgba(20,110,232,.5); animation: panel-wave 1.6s ease-in-out infinite alternate; }.panel-wave i:nth-child(2) { height: 68%; animation-delay: -.6s; }.panel-wave i:nth-child(3) { height: 45%; animation-delay: -.2s; }.panel-wave i:nth-child(4) { height: 82%; animation-delay: -.8s; }.panel-wave i:nth-child(5) { height: 52%; animation-delay: -.4s; }.panel-wave i:nth-child(6) { height: 74%; animation-delay: -.7s; }.panel-wave i:nth-child(7) { height: 38%; animation-delay: -.1s; }.panel-wave i:nth-child(8) { height: 91%; animation-delay: -.5s; }.panel-wave i:nth-child(9) { height: 60%; animation-delay: -.9s; }.panel-wave i:nth-child(10) { height: 77%; animation-delay: -.3s; }.terminal-panel strong { position: relative; display: block; margin-top: 24px; color: #071d4a; font: 700 clamp(22px, 3.1vw, 42px)/.88 var(--display); letter-spacing: -.06em; }.terminal-panel small { position: relative; display: block; margin-top: 11px; color: #176ce5; font: 8px var(--mono); letter-spacing: .08em; }.terminal-label { bottom: 6%; }
@keyframes panel-wave { from { transform: scaleY(.72); opacity: .55; } to { transform: scaleY(1.1); opacity: 1; } }

/* Defensive shield */
.object-shield { width: 70%; height: 78%; }.shield-shape { position: relative; z-index: 2; display: grid; place-items: center; width: 190px; height: 230px; clip-path: polygon(50% 0, 91% 18%, 84% 68%, 50% 100%, 16% 68%, 9% 18%); background: linear-gradient(145deg, #ffffff 0%, #70b8ff 45%, #0c52b5 100%); box-shadow: 0 0 70px rgba(20,110,232,.45); }.shield-shape::before { content: ""; position: absolute; inset: 6px; clip-path: inherit; background: linear-gradient(145deg, #eaf6ff, #277fe8 54%, #07245a); }.shield-shape span { position: relative; z-index: 1; color: #fff; font: 700 39px var(--display); letter-spacing: -.14em; text-shadow: 0 2px 15px rgba(5,35,100,.45); }.shield-rings { position: absolute; width: 68%; aspect-ratio: 1; border: 1px solid rgba(20,110,232,.32); border-radius: 50%; }.shield-rings i { position: absolute; inset: -13%; border: 1px solid rgba(20,110,232,.22); border-radius: 50%; }.shield-rings i:nth-child(2) { inset: -27%; border-style: dashed; }.shield-rings i:nth-child(3) { inset: -41%; opacity: .55; }.shield-label { bottom: 2%; }

@media (max-width: 780px) {
  .hero { min-height: 235vh; }.hero-sticky { align-items: flex-start; padding-top: 110px; }.hero .hero-content { width: min(100% - 40px, 620px); margin: 0 auto; }.hero-object-stage { top: auto; right: 0; bottom: 3vh; width: 100%; height: 51vh; transform: translate3d(0, var(--hero-visual-y, 0px), 0); }.hero-object-caption { right: 6%; bottom: 3%; font-size: 8px; }.hero-object-stage::before { inset: 12% 18%; }.laptop-lid { width: 78%; }.terminal-window { padding: 9px 11px; }.terminal-window p { margin-top: 10px; font-size: 8px; }.object-phone .phone-frame { width: 152px; }.terminal-panel { width: 76%; padding: 18px; }.security-key { transform: rotate(-22deg) scale(.7); }.shield-shape { width: 145px; height: 178px; }.shield-shape span { font-size: 30px; }.hero-visual { opacity: 1; }
}
@media (prefers-reduced-motion: reduce) {
  .hero-sticky { position: relative; }.hero-object-stage { transform: translateY(-50%) !important; transition: none !important; }.cyber-object { opacity: 0 !important; filter: none !important; transition: none !important; }.hero-object-stage[data-object-state="0"] .object-laptop { opacity: 1 !important; transform: translate(-50%, -50%) scale(.9) !important; }.terminal-chart i, .panel-wave i, .key-pulse { animation: none !important; }
}

/* Repeated product-film stages keep every major section in the same visual language. */
.services, .threat-room, .why, .process, .about, .contact { overflow: visible; }
.chapter-film { --film-drift-x: 0px; --film-drift-y: 0px; --film-scale: 1; --film-rotation: 0deg; position: sticky; top: 0; z-index: 0; display: grid; place-items: center; width: 100%; height: 100svh; min-height: 620px; margin-bottom: -100svh; overflow: clip; pointer-events: none; transform: translate3d(var(--film-drift-x), var(--film-drift-y), 0) scale(var(--film-scale)) rotate(var(--film-rotation)); transform-origin: center; transition: transform .35s cubic-bezier(.2,.75,.2,1); }
.chapter-film::before { content: ""; position: absolute; inset: 19% 8% 15% 48%; border: 1px solid rgba(20,110,232,.16); border-radius: 50%; background: radial-gradient(circle at center, rgba(20,110,232,.15), transparent 58%); box-shadow: 0 0 100px rgba(20,110,232,.08), inset 0 0 55px rgba(20,110,232,.07); }.chapter-film::after { content: ""; position: absolute; inset: 0 7% 0 36%; opacity: .3; background: linear-gradient(90deg, transparent, rgba(20,110,232,.12) 50%, transparent), linear-gradient(180deg, transparent 49.8%, rgba(20,110,232,.14) 50%, transparent 50.2%); mask-image: radial-gradient(ellipse at 70% 50%, #000 0 32%, transparent 72%); }
.chapter-film[data-film-name="threats"], .chapter-film[data-film-name="process"], .chapter-film[data-film-name="contact"] { color: #fff; }.chapter-film[data-film-name="threats"]::before, .chapter-film[data-film-name="process"]::before, .chapter-film[data-film-name="contact"]::before { border-color: rgba(127,203,255,.25); background: radial-gradient(circle at center, rgba(39,139,255,.25), transparent 58%); }.chapter-film[data-film-name="threats"]::after, .chapter-film[data-film-name="process"]::after, .chapter-film[data-film-name="contact"]::after { opacity: .48; }
.film-particle { position: absolute; z-index: 1; left: var(--particle-x); top: var(--particle-y); width: 3px; height: 3px; border-radius: 50%; background: #74bdff; box-shadow: 0 0 12px rgba(20,110,232,.7); animation: film-particle-float 4.8s var(--particle-delay) ease-in-out infinite alternate; }.film-particle:nth-child(5n) { width: 5px; height: 5px; background: #9dffd9; box-shadow: 0 0 15px rgba(157,255,217,.75); }.film-particle:nth-child(7n) { opacity: .42; }
@keyframes film-particle-float { from { transform: translate3d(0, var(--particle-drift-neg), 0) scale(.7); opacity: .2; } to { transform: translate3d(var(--particle-drift), var(--particle-drift), 0) scale(1.35); opacity: .95; } }
.film-object { position: absolute; z-index: 3; top: 50%; left: 72%; display: grid; place-items: center; width: 38%; height: 46%; opacity: 0; filter: blur(14px); transform: translate(-50%, -50%) scale(.72) rotate(-8deg); transition: opacity .8s cubic-bezier(.2,.75,.2,1), filter .8s ease, transform 1s cubic-bezier(.2,.75,.2,1); }.chapter-film[data-film-state="0"] .film-console, .chapter-film[data-film-state="1"] .film-device, .chapter-film[data-film-state="2"] .film-shield { opacity: .94; filter: blur(0); transform: translate(-50%, -50%) scale(1) rotate(0deg); }.chapter-film[data-film-state="1"] .film-device { transform: translate(-50%, -50%) scale(1.06) rotate(5deg); }.chapter-film[data-film-state="2"] .film-shield { transform: translate(-50%, -50%) scale(1.1) rotate(-3deg); }
.film-console-shell { position: relative; width: min(100%, 390px); height: 58%; padding: 25px; border: 1px solid rgba(20,110,232,.45); background: linear-gradient(145deg, rgba(255,255,255,.96), rgba(211,233,255,.72)); box-shadow: 0 28px 80px rgba(9,65,150,.2), inset 0 0 55px rgba(128,193,255,.14); transform: perspective(900px) rotateY(-12deg) rotateZ(-3deg); }.film-console-shell::before { content: ""; position: absolute; inset: 12px; border: 1px solid rgba(20,110,232,.16); }.film-console-shell > span { position: relative; color: rgba(7,54,128,.58); font: 8px var(--mono); letter-spacing: .14em; }.film-console-shell > b { position: relative; display: block; margin-top: 30px; color: #071d4a; font: 700 clamp(31px, 4vw, 58px)/.88 var(--display); letter-spacing: -.08em; }.film-console-shell > small { position: relative; display: block; margin-top: 13px; color: var(--electric-2); font: 8px var(--mono); letter-spacing: .08em; }.film-wave { position: absolute; right: 25px; bottom: 23px; display: flex; align-items: end; gap: 4px; height: 60px; }.film-wave i { width: 6px; height: 35%; background: var(--electric-2); box-shadow: 0 0 10px rgba(20,110,232,.55); animation: film-wave 1.7s ease-in-out infinite alternate; }.film-wave i:nth-child(2) { height: 70%; animation-delay: -.6s; }.film-wave i:nth-child(3) { height: 46%; animation-delay: -.3s; }.film-wave i:nth-child(4) { height: 87%; animation-delay: -.8s; }.film-wave i:nth-child(5) { height: 58%; animation-delay: -.2s; }.film-wave i:nth-child(6) { height: 77%; animation-delay: -.7s; }.film-wave i:nth-child(7) { height: 98%; animation-delay: -.45s; }.film-wave i:nth-child(8) { height: 66%; animation-delay: -.9s; }
@keyframes film-wave { from { transform: scaleY(.7); opacity: .55; } to { transform: scaleY(1.12); opacity: 1; } }
.film-device-shell { position: relative; display: flex; flex-direction: column; align-items: center; width: 145px; height: 78%; padding: 22px 12px 13px; border: 2px solid #8acaff; border-radius: 28px; color: #fff; background: radial-gradient(circle at 50% 33%, rgba(81,182,255,.3), transparent 28%), linear-gradient(145deg, #0a5ec4, #03112d 73%); box-shadow: 0 32px 76px rgba(9,65,150,.28), inset 0 0 0 1px rgba(255,255,255,.4); transform: rotate(9deg); }.film-device-shell::before { content: ""; position: absolute; inset: 0; opacity: .18; border-radius: inherit; background-image: linear-gradient(rgba(180,228,255,.4) 1px, transparent 1px), linear-gradient(90deg, rgba(180,228,255,.4) 1px, transparent 1px); background-size: 18px 18px; mask-image: linear-gradient(180deg, #000, transparent 80%); }.film-device-shell span, .film-device-shell small, .film-device-shell strong { position: relative; z-index: 1; }.film-device-shell span { font: 7px var(--mono); letter-spacing: .1em; }.film-device-shell strong { display: grid; place-items: center; width: 59px; height: 59px; margin-top: 48px; border: 1px solid #9dffd9; border-radius: 50%; color: #9dffd9; font: 35px var(--display); box-shadow: 0 0 0 11px rgba(157,255,217,.07), 0 0 35px rgba(157,255,217,.35); }.film-device-shell small { margin-top: 18px; color: rgba(224,242,255,.7); font: 8px var(--mono); }
.film-shield-shape { position: relative; display: grid; place-items: center; width: 164px; height: 205px; clip-path: polygon(50% 0, 91% 18%, 84% 68%, 50% 100%, 16% 68%, 9% 18%); background: linear-gradient(145deg, #ffffff, #70b8ff 45%, #0c52b5); box-shadow: 0 0 70px rgba(20,110,232,.42); }.film-shield-shape::before { content: ""; position: absolute; inset: 6px; clip-path: inherit; background: linear-gradient(145deg, #eaf6ff, #277fe8 54%, #07245a); }.film-shield-shape span { position: relative; z-index: 1; color: #fff; font: 700 35px var(--display); letter-spacing: -.14em; text-shadow: 0 2px 15px rgba(5,35,100,.45); }.film-shield small { position: absolute; bottom: 6%; color: rgba(7,54,128,.6); font: 8px var(--mono); letter-spacing: .13em; }.film-caption { position: absolute; z-index: 4; right: 6%; bottom: 14%; display: flex; flex-direction: column; align-items: flex-end; gap: 8px; color: rgba(7,54,128,.55); font: 8px var(--mono); letter-spacing: .13em; text-align: right; text-transform: uppercase; }.film-caption b { color: var(--electric-2); font-size: 10px; font-weight: 400; }.film-caption i { width: 52px; height: 1px; background: var(--electric-2); box-shadow: 0 0 12px var(--electric-2); }
.chapter-film[data-film-name="threats"] .film-caption, .chapter-film[data-film-name="process"] .film-caption, .chapter-film[data-film-name="contact"] .film-caption { color: rgba(219,239,255,.55); }.chapter-film[data-film-name="threats"] .film-console-shell, .chapter-film[data-film-name="process"] .film-console-shell, .chapter-film[data-film-name="contact"] .film-console-shell { background: linear-gradient(145deg, rgba(235,247,255,.98), rgba(19,91,187,.8)); }
.services > .section-heading, .services > .services-grid, .threat-room > .threat-layout, .threat-room > .threat-stats, .why > .why-layout, .process > .process-heading, .process > .process-list, .about > .about-layout, .contact > .contact-layout { position: relative; z-index: 2; }

@media (max-width: 780px) {
  .chapter-film { position: absolute; top: 0; height: 100vh; min-height: 0; margin-bottom: 0; transform: translate3d(0, var(--film-drift-y), 0) scale(var(--film-scale)); }.chapter-film::before { inset: 25% 0 15% 26%; }.chapter-film::after { inset: 0; }.film-object { left: 72%; width: 51%; height: 42%; }.film-console-shell { padding: 17px; }.film-console-shell > b { margin-top: 21px; font-size: 34px; }.film-device-shell { width: 115px; }.film-device-shell strong { margin-top: 34px; }.film-shield-shape { width: 126px; height: 158px; }.film-shield-shape span { font-size: 27px; }.film-caption { right: 5%; bottom: 9%; max-width: 180px; font-size: 7px; }.services > .section-heading, .services > .services-grid, .threat-room > .threat-layout, .threat-room > .threat-stats, .why > .why-layout, .process > .process-heading, .process > .process-list, .about > .about-layout, .contact > .contact-layout { z-index: 3; }
}
@media (prefers-reduced-motion: reduce) {
  .chapter-film { position: absolute; transform: none !important; transition: none !important; }.film-particle, .film-wave i { animation: none !important; }.film-object { transition: none !important; }.chapter-film[data-film-state="0"] .film-console { opacity: .82; filter: none; transform: translate(-50%, -50%) scale(.92); }
}

/* Section-specific objects: each chapter has its own visual metaphor. */
.chapter-film .film-object.is-active { opacity: .94; filter: blur(0); transform: translate(-50%, -50%) scale(1) rotate(0deg); }
.chapter-film .film-object.is-active:nth-of-type(2) { transform: translate(-50%, -50%) scale(1.05) rotate(4deg); }.chapter-film .film-object.is-active:nth-of-type(3) { transform: translate(-50%, -50%) scale(1.09) rotate(-3deg); }
.film-object small { position: absolute; bottom: 4%; color: rgba(7,54,128,.6); font: 8px var(--mono); letter-spacing: .13em; text-align: center; white-space: nowrap; }

/* Services: rack, hardware key, and telemetry constellation. */
.server-rack { position: relative; width: min(100%, 335px); height: 66%; padding: 25px; border: 1px solid rgba(20,110,232,.42); border-radius: 12px; background: linear-gradient(145deg, #edf8ff, #6bb2f1 28%, #093d91 100%); box-shadow: 0 30px 75px rgba(9,65,150,.24), inset 0 0 0 1px rgba(255,255,255,.6); transform: perspective(900px) rotateY(-14deg) rotateZ(-3deg); }.server-rack::before { content: ""; position: absolute; inset: 12px; border: 1px solid rgba(255,255,255,.35); border-radius: 7px; }.server-rack > span { position: relative; color: rgba(7,39,98,.62); font: 7px var(--mono); letter-spacing: .13em; }.server-rack > b { position: relative; display: block; margin: 25px 0 16px; color: #fff; font: 700 22px var(--display); letter-spacing: -.04em; }.server-rack i { position: relative; display: block; width: 100%; height: 16px; margin-top: 8px; border: 1px solid rgba(190,231,255,.55); background: linear-gradient(90deg, #0b55b7 0 66%, #9dffd9 67% 69%, transparent 70%); box-shadow: 0 0 12px rgba(126,203,255,.2); }.server-rack i:nth-of-type(2) { background: linear-gradient(90deg, #0b55b7 0 42%, #9dffd9 43% 45%, transparent 46%); }.server-rack i:nth-of-type(3) { background: linear-gradient(90deg, #0b55b7 0 78%, #9dffd9 79% 81%, transparent 82%); }.server-rack i:nth-of-type(4) { background: linear-gradient(90deg, #0b55b7 0 53%, #9dffd9 54% 56%, transparent 57%); }.server-rack i:nth-of-type(5) { background: linear-gradient(90deg, #0b55b7 0 88%, #9dffd9 89% 91%, transparent 92%); }.film-key .security-key { transform: rotate(-23deg) scale(.72); }.film-key .key-head, .film-key .key-shaft { filter: drop-shadow(0 0 12px rgba(20,110,232,.35)); }.network-cluster { position: relative; width: 205px; height: 205px; border: 1px solid rgba(20,110,232,.35); border-radius: 50%; background: radial-gradient(circle, rgba(116,196,255,.18), transparent 58%); box-shadow: 0 0 0 16px rgba(20,110,232,.05), 0 0 60px rgba(20,110,232,.25); }.network-cluster::before, .network-cluster::after { content: ""; position: absolute; left: 50%; top: 50%; background: rgba(20,110,232,.28); transform-origin: left center; }.network-cluster::before { width: 86%; height: 1px; transform: rotate(24deg); }.network-cluster::after { width: 78%; height: 1px; transform: rotate(-43deg); }.network-cluster i { position: absolute; z-index: 2; width: 12px; height: 12px; border: 2px solid #176ce5; border-radius: 50%; background: #eaf6ff; box-shadow: 0 0 15px rgba(20,110,232,.55); }.network-cluster i:nth-child(1) { left: 15%; top: 27%; }.network-cluster i:nth-child(2) { right: 12%; top: 18%; }.network-cluster i:nth-child(3) { right: 16%; bottom: 22%; }.network-cluster i:nth-child(4) { left: 24%; bottom: 13%; }.network-cluster i:nth-child(5) { left: 46%; top: 47%; background: #9dffd9; border-color: #9dffd9; }.network-cluster b { position: absolute; z-index: 3; inset: 44% 0 auto; color: var(--ink); font: 700 18px var(--display); text-align: center; letter-spacing: -.08em; }.threat-cluster { border-color: rgba(255,85,115,.38); box-shadow: 0 0 0 16px rgba(255,85,115,.05), 0 0 70px rgba(255,85,115,.18); }.threat-cluster i { border-color: #ff5573; }.threat-cluster b { color: #a20c3b; }

/* Threat intelligence: packet, globe, and active node geometry. */
.packet-cube { position: relative; width: 135px; height: 135px; border: 1px solid #8dccff; background: linear-gradient(145deg, #eff9ff, #1973de 52%, #092d6f); box-shadow: 0 30px 75px rgba(9,65,150,.28); transform: rotate(21deg) skewY(-8deg); }.packet-cube::before, .packet-cube::after { content: ""; position: absolute; background: rgba(218,242,255,.65); }.packet-cube::before { top: 50%; left: -17%; width: 135%; height: 1px; transform: rotate(-25deg); }.packet-cube::after { left: 50%; top: -17%; width: 1px; height: 135%; transform: rotate(-25deg); }.packet-cube span { position: absolute; inset: 37% 0; color: #fff; font: 700 29px var(--display); text-align: center; text-shadow: 0 0 15px #fff; transform: rotate(-21deg); }.packet-trail { position: absolute; width: 260px; height: 1px; background: linear-gradient(90deg, transparent, #ff5573, transparent); box-shadow: 0 0 17px #ff5573; transform: translate(44px, -55px) rotate(-16deg); }.globe-shell { position: relative; width: 230px; aspect-ratio: 1; border: 1px solid rgba(126,203,255,.68); border-radius: 50%; background: radial-gradient(circle at 35% 30%, #a4ddff, #1667c8 35%, #041e4d 78%); box-shadow: 0 0 0 18px rgba(95,185,255,.06), 0 0 75px rgba(20,110,232,.34); overflow: hidden; }.globe-shell::before, .globe-shell::after { content: ""; position: absolute; inset: -3% 27%; border: 1px solid rgba(223,247,255,.5); border-radius: 50%; transform: rotate(28deg); }.globe-shell::after { inset: 25% -4%; transform: rotate(-10deg); }.globe-shell i { position: absolute; width: 7px; height: 7px; border-radius: 50%; background: #ff5573; box-shadow: 0 0 15px #ff5573; }.globe-shell i:nth-child(1) { left: 29%; top: 32%; }.globe-shell i:nth-child(2) { right: 23%; top: 47%; }.globe-shell i:nth-child(3) { left: 47%; bottom: 24%; }.globe-shell b { position: absolute; z-index: 2; inset: 45% 0; color: #fff; font: 700 20px var(--display); text-align: center; letter-spacing: -.08em; }

/* Why SGProtected: lens, silicon, and layered architecture. */
.lens-ring { position: relative; display: grid; place-items: center; width: 218px; aspect-ratio: 1; border: 14px solid #176ce5; border-radius: 50%; background: radial-gradient(circle, #bfe9ff 0 12%, #0a55b7 13% 31%, #08275d 32% 54%, #bfe9ff 55% 59%, #176ce5 60%); box-shadow: 0 0 0 16px rgba(20,110,232,.08), 0 30px 65px rgba(9,65,150,.28); transform: rotate(-16deg); }.lens-ring::before, .lens-ring::after { content: ""; position: absolute; width: 135%; height: 1px; background: rgba(255,255,255,.44); }.lens-ring::after { transform: rotate(90deg); }.lens-ring i { position: absolute; width: 14px; height: 14px; border-radius: 50%; background: #9dffd9; box-shadow: 0 0 16px #9dffd9; }.lens-ring i:first-child { top: 7%; right: 17%; }.lens-ring i:last-of-type { left: 14%; bottom: 18%; }.lens-ring b { position: relative; z-index: 2; color: #fff; font: 700 20px var(--display); }.chip-body { position: relative; display: grid; place-items: center; width: 220px; height: 180px; border: 7px solid #6ab4fa; border-radius: 22px; background: linear-gradient(145deg, #f3fbff, #1b6bd2 50%, #06265e); box-shadow: 0 0 0 11px rgba(20,110,232,.08), 0 30px 70px rgba(9,65,150,.28); transform: rotate(7deg); }.chip-body::before, .chip-body::after { content: ""; position: absolute; inset: -24px -10px; background: repeating-linear-gradient(90deg, transparent 0 22px, #176ce5 23px 26px, transparent 27px 47px); opacity: .72; }.chip-body::after { transform: rotate(90deg); }.chip-body span, .chip-body b { position: relative; z-index: 1; color: #fff; font: 700 16px var(--display); }.chip-body b { margin-top: 8px; color: #9dffd9; font: 8px var(--mono); letter-spacing: .12em; }.stack-layers { display: flex; flex-direction: column; gap: 11px; width: 290px; transform: rotate(-8deg) skewY(5deg); }.stack-layers i { display: block; padding: 25px 28px; border: 1px solid rgba(20,110,232,.28); color: var(--ink); background: rgba(255,255,255,.82); box-shadow: 16px 16px 0 rgba(20,110,232,.08), 0 18px 35px rgba(9,65,150,.1); font: 700 13px var(--display); letter-spacing: .08em; }.stack-layers i:nth-child(2) { transform: translateX(30px); }.stack-layers i:nth-child(3) { transform: translateX(60px); color: #fff; background: linear-gradient(135deg, #0b55b7, #07265b); }

/* Process: flow, report, and verification seal. */
.flow-track { display: flex; align-items: center; gap: 0; transform: rotate(-8deg); }.flow-track i { position: relative; display: grid; place-items: center; width: 102px; height: 102px; border: 1px solid #79c6ff; border-radius: 50%; color: #fff; background: linear-gradient(145deg, #176ce5, #06265e); box-shadow: 0 0 0 9px rgba(120,198,255,.06), 0 20px 45px rgba(0,28,90,.28); font: 8px var(--mono); letter-spacing: .09em; font-style: normal; }.flow-track i + i { margin-left: -15px; }.flow-track i:nth-child(2) { background: linear-gradient(145deg, #2f85ea, #0c3f91); }.flow-track i:nth-child(3) { background: linear-gradient(145deg, #56a8fa, #1461c2); }.flow-track i:nth-child(4) { background: linear-gradient(145deg, #9dffd9, #176ce5); color: #06245a; }.report-sheet { position: relative; display: flex; flex-direction: column; width: 250px; height: 300px; padding: 26px; border: 1px solid rgba(126,203,255,.65); background: linear-gradient(145deg, #fff, #bce2ff); box-shadow: 20px 24px 55px rgba(0,20,75,.3); transform: rotate(7deg); }.report-sheet::after { content: ""; position: absolute; right: -18px; top: 22px; width: 38px; height: 38px; border: 1px solid #9dffd9; border-radius: 50%; background: #0a5ec4; box-shadow: 0 0 20px rgba(157,255,217,.5); }.report-sheet span { color: rgba(7,54,128,.6); font: 8px var(--mono); letter-spacing: .1em; }.report-sheet b { margin-top: 47px; color: #071d4a; font: 700 22px var(--display); letter-spacing: -.06em; }.report-sheet i { width: 88%; height: 5px; margin-top: 22px; background: #6fbaff; }.report-sheet i:nth-of-type(2) { width: 64%; margin-top: 11px; }.report-sheet i:nth-of-type(3) { width: 79%; margin-top: 11px; }.report-sheet i:nth-of-type(4) { width: 42%; margin-top: 11px; }.check-seal { display: grid; place-items: center; width: 205px; height: 205px; border: 1px solid #9dffd9; border-radius: 50%; background: radial-gradient(circle, #2e9af0, #062760 68%); box-shadow: 0 0 0 18px rgba(157,255,217,.06), 0 0 75px rgba(20,110,232,.35); transform: rotate(-9deg); }.check-seal::before { content: ""; position: absolute; width: 165px; height: 165px; border: 1px dashed rgba(157,255,217,.55); border-radius: 50%; }.check-seal b { position: relative; color: #9dffd9; font: 600 64px var(--display); }.check-seal span { position: absolute; margin-top: 130px; color: #fff; font: 8px var(--mono); letter-spacing: .1em; text-align: center; }

/* About: portrait, terminal, and operator signature. */
.profile-card { position: relative; display: flex; flex-direction: column; justify-content: end; width: 235px; height: 300px; overflow: hidden; padding: 21px; border: 1px solid #8acaff; background: #06245a; box-shadow: 0 30px 75px rgba(9,65,150,.25); transform: rotate(-6deg); }.profile-card::after { content: ""; position: absolute; inset: 0; background: linear-gradient(0deg, rgba(2,15,45,.85), transparent 55%); }.profile-card img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; filter: saturate(.8) contrast(1.08); }.profile-card span, .profile-card b { position: relative; z-index: 1; color: #fff; font: 700 15px var(--display); letter-spacing: .04em; }.profile-card b { margin-top: 7px; color: #9dffd9; font: 8px var(--mono); letter-spacing: .1em; }.mini-terminal { position: relative; display: flex; flex-direction: column; width: 290px; height: 210px; padding: 23px; border: 1px solid #8acaff; background: linear-gradient(145deg, #06245a, #0b65ca); box-shadow: 0 30px 75px rgba(9,65,150,.28); transform: rotate(6deg); }.mini-terminal span { color: rgba(225,242,255,.7); font: 8px var(--mono); letter-spacing: .12em; }.mini-terminal b { margin-top: 32px; color: #fff; font: 700 25px var(--display); }.mini-terminal i { width: 80%; height: 4px; margin-top: 13px; background: #71c2ff; }.mini-terminal i:nth-of-type(2) { width: 58%; }.mini-terminal i:nth-of-type(3) { width: 73%; }.mini-terminal i:nth-of-type(4) { width: 42%; background: #9dffd9; }.signature-card { display: flex; flex-direction: column; justify-content: end; width: 320px; height: 165px; padding: 25px; border-top: 1px solid #176ce5; border-bottom: 1px solid #176ce5; transform: rotate(-4deg); }.signature-card span { color: #176ce5; font: 700 34px var(--display); letter-spacing: -.08em; }.signature-card b { margin-top: 16px; color: rgba(7,54,128,.62); font: 8px var(--mono); letter-spacing: .1em; }.signature-card i { width: 100%; height: 1px; margin-top: 19px; background: #176ce5; box-shadow: 0 0 15px #176ce5; }

/* Give the founder chapter a calmer editorial hierarchy: the moving artefact is atmosphere, never a layer over readable copy. */
.about { position: relative; }
.about .chapter-film { z-index: 1; opacity: .3; }
.about .chapter-film::before, .about .chapter-film::after { opacity: .42; }
.about .about-layout { position: relative; z-index: 5; }
.about .about-copy { position: relative; z-index: 8; }
.about .film-object { left: 92%; width: 20%; height: 25%; }
.about .film-object.is-active { opacity: .2; filter: blur(0); }
.about .film-caption { display: none; }
.about .founder-name { font-size: clamp(54px, 6.4vw, 90px); }

/* The experience object is a defense core, not a repeated phone mockup. */
.experience .defense-device { width: min(58%, 340px); aspect-ratio: 1.08; border-radius: 28px; }
.experience .device-screen { border-radius: 20px; }

@media (max-width: 780px) {
  .server-rack { transform: perspective(900px) rotateY(-14deg) rotateZ(-3deg) scale(.7); }
  .film-key .security-key { transform: rotate(-23deg) scale(.52); }
  .network-cluster { transform: scale(.72); }
  .packet-cube { transform: rotate(21deg) skewY(-8deg) scale(.7); }
  .globe-shell { transform: scale(.72); }
  .lens-ring { transform: rotate(-16deg) scale(.7); }
  .chip-body { transform: rotate(7deg) scale(.7); }
  .stack-layers { transform: rotate(-8deg) skewY(5deg) scale(.64); }
  .flow-track { transform: rotate(-8deg) scale(.56); }
  .report-sheet { transform: rotate(7deg) scale(.66); }
  .check-seal { transform: rotate(-9deg) scale(.7); }
  .profile-card { transform: rotate(-6deg) scale(.68); }
  .mini-terminal { transform: rotate(6deg) scale(.66); }
  .signature-card { transform: rotate(-4deg) scale(.66); }
  .chapter-film .secure-envelope { transform: rotate(-6deg) scale(.66); }
  .chapter-film .lock-body { transform: scale(.68); }
  .chapter-film .bridge-nodes { transform: scale(.68); }
  .experience .defense-device { width: min(70%, 300px); aspect-ratio: 1.08; }
}

@media (prefers-reduced-motion: reduce) {
  .chapter-film .film-object.is-active { filter: none; transition: none; }
}

/* Hero composition: give the statement and the security object separate reading zones. */
@media (min-width: 781px) {
  .hero-content { width: min(690px, 47vw); margin-left: 11vw; }
  .hero-title { max-width: 680px; font-size: clamp(58px, 6.2vw, 112px); letter-spacing: -.075em; }
  .hero-copy { max-width: 520px; }
  .hero-object-stage { right: 0; width: min(48vw, 760px); }
}

@media (max-width: 780px) {
  .hero-title { font-size: clamp(54px, 13vw, 82px); }
  .hero-object-stage { opacity: .78; }
}

/* Contact: secure message, response lock, and trusted connection. */
.secure-envelope { position: relative; display: flex; flex-direction: column; justify-content: center; width: 315px; height: 205px; padding: 28px; border: 1px solid #9bd4ff; background: linear-gradient(145deg, #fff, #9fd4ff 54%, #1667c8); box-shadow: 0 30px 75px rgba(0,28,90,.28); transform: rotate(-6deg); }.secure-envelope::before, .secure-envelope::after { content: ""; position: absolute; bottom: 0; width: 71%; height: 1px; background: #176ce5; transform-origin: left; }.secure-envelope::before { left: 0; transform: rotate(31deg); }.secure-envelope::after { right: 0; transform: rotate(-31deg); transform-origin: right; }.secure-envelope span { color: rgba(7,54,128,.62); font: 8px var(--mono); letter-spacing: .1em; }.secure-envelope b { margin-top: 23px; color: #071d4a; font: 700 28px var(--display); letter-spacing: -.07em; }.secure-envelope i { width: 62%; height: 4px; margin-top: 13px; background: #6fbaff; }.secure-envelope i:nth-of-type(2) { width: 42%; margin-top: 8px; }.lock-body { position: relative; display: grid; place-items: center; width: 155px; height: 135px; margin-top: 34px; border: 1px solid #9dffd9; border-radius: 18px; color: #fff; background: linear-gradient(145deg, #1979df, #06245a); box-shadow: 0 0 0 15px rgba(157,255,217,.06), 0 0 75px rgba(20,110,232,.35); }.lock-body::before { content: ""; position: absolute; left: 34px; top: -74px; width: 85px; height: 90px; border: 12px solid #176ce5; border-bottom: 0; border-radius: 50px 50px 0 0; }.lock-body span { color: #9dffd9; font: 700 24px var(--display); letter-spacing: -.12em; }.lock-body b { position: absolute; bottom: 16px; color: #fff; font: 8px var(--mono); letter-spacing: .08em; }.bridge-nodes { position: relative; display: flex; align-items: center; gap: 72px; }.bridge-nodes::before { content: ""; position: absolute; left: 16px; right: 16px; height: 1px; background: #9dffd9; box-shadow: 0 0 15px #9dffd9; }.bridge-nodes i { position: relative; z-index: 1; width: 32px; height: 32px; border: 1px solid #9dffd9; border-radius: 50%; background: #0b65ca; box-shadow: 0 0 0 8px rgba(157,255,217,.06), 0 0 22px rgba(157,255,217,.5); }.bridge-nodes i:nth-child(2) { transform: scale(1.55); background: #9dffd9; }.bridge-nodes b { position: absolute; left: 50%; top: 58px; width: 200px; color: #9dffd9; font: 8px var(--mono); letter-spacing: .12em; text-align: center; transform: translateX(-50%); }