:root {
  --bg: #f7f8fc;
  --surface: #ffffff;
  --purple: #6d4aff;
  --purple2: #8b5cf6;
  --purple-glow: rgba(109, 74, 255, .14);
  --teal: #00a98f;
  --gold: #ffb020;
  --white: #151421;
  --gray: #626177;
  --border: rgba(30, 27, 75, .10);
}

html { background: var(--bg); }
body {
  background:
    radial-gradient(circle at 8% 4%, rgba(109,74,255,.09), transparent 28rem),
    radial-gradient(circle at 92% 12%, rgba(0,212,170,.08), transparent 24rem),
    var(--bg);
  color: var(--white);
  cursor: auto;
}

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

#cursor-dot, #cursor-ring { display: none; }
p { color: var(--gray); }
em { color: var(--purple); }

section { padding: 112px 0; }
.container { max-width: 1240px; }

.section-label {
  color: var(--purple);
  border-color: rgba(109,74,255,.18);
  background: rgba(109,74,255,.06);
  font-weight: 600;
}

.btn-primary,
.btn-ghost,
.nav-hamburger,
.checkbox-item,
.checkbox-item label,
.checkbox-item input { cursor: pointer; }

.btn-primary {
  background: linear-gradient(135deg, #6d4aff, #8b5cf6);
  color: #fff;
  box-shadow: 0 12px 30px rgba(109,74,255,.22);
}
.btn-primary:hover {
  background: linear-gradient(135deg, #5e3ee8, #7c4de5);
  box-shadow: 0 18px 38px rgba(109,74,255,.30);
}
.btn-ghost {
  color: #29263b;
  border-color: rgba(30,27,75,.14);
  background: rgba(255,255,255,.68);
}
.btn-ghost:hover {
  border-color: rgba(109,74,255,.3);
  background: #fff;
}

#nav {
  top: 18px;
  max-width: 1080px;
  background: rgba(255,255,255,.78);
  border-color: rgba(30,27,75,.09);
  box-shadow: 0 12px 40px rgba(52,43,112,.08);
}
#nav.scrolled {
  background: rgba(255,255,255,.94);
  box-shadow: 0 16px 48px rgba(52,43,112,.13);
}
.nav-logo img { height: 30px; }
.nav-links a { color: #686579; }
.nav-links a:hover { color: #161423; background: #f0eefc; }
.nav-links .btn-ghost { color: #201d31; background: #fff; }
.nav-hamburger span { background: #1b1829; }
.nav-mobile-menu {
  background: rgba(255,255,255,.98);
  border-color: rgba(30,27,75,.1);
  box-shadow: 0 22px 60px rgba(52,43,112,.16);
}
.nav-mobile-menu a { color: #565268; }

#hero {
  min-height: auto;
  padding: 154px 32px 54px;
  text-align: left;
  display: block;
  overflow: hidden;
}
.hero-grid {
  background-image:
    linear-gradient(rgba(109,74,255,.045) 1px, transparent 1px),
    linear-gradient(90deg, rgba(109,74,255,.045) 1px, transparent 1px);
  mask-image: linear-gradient(to bottom, black, transparent 88%);
}
.orb { filter: blur(90px); opacity: .8; }
.orb-1 { background: rgba(109,74,255,.16); }
.orb-2 { background: rgba(0,212,170,.13); }
.orb-3 { background: rgba(255,176,32,.10); }

.hero-main {
  width: 100%;
  max-width: 1240px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1.05fr .95fr;
  align-items: center;
  gap: 72px;
  position: relative;
  z-index: 2;
}
.hero-content { max-width: 660px; width: 100%; }
.hero-kicker {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  font-size: .76rem;
  font-weight: 600;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: #565268;
  margin-bottom: 26px;
}
.hero-kicker span {
  width: 9px; height: 9px; border-radius: 50%; background: var(--teal);
  box-shadow: 0 0 0 6px rgba(0,169,143,.10);
}
.hero-content h1 {
  font-size: clamp(3.5rem, 6.3vw, 6.8rem);
  line-height: .98;
  margin-bottom: 30px;
  letter-spacing: -.045em;
}
.hero-content > p {
  margin: 0 0 38px;
  max-width: 590px;
  font-size: 1.08rem;
  color: #656176;
}
.hero-cta { justify-content: flex-start; margin-bottom: 44px; }
.hero-cta .btn-primary span { font-size: 1.1rem; }
.hero-proof {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
  max-width: 600px;
}
.hero-proof div { padding-left: 16px; border-left: 1px solid rgba(30,27,75,.12); }
.hero-proof strong { display: block; font-size: 1.05rem; color: #201d31; margin-bottom: 3px; }
.hero-proof span { display: block; font-size: .72rem; line-height: 1.4; color: #858196; }

.hero-system {
  width: 100%;
  aspect-ratio: 1 / 1;
  max-width: 530px;
  margin: 0 auto;
  position: relative;
  border-radius: 42px;
  background: linear-gradient(145deg, rgba(255,255,255,.95), rgba(242,240,255,.80));
  border: 1px solid rgba(109,74,255,.12);
  box-shadow: 0 35px 90px rgba(67,51,143,.16), inset 0 1px 0 #fff;
  isolation: isolate;
}
.hero-system::before {
  content: '';
  position: absolute; inset: 26px;
  border-radius: 30px;
  background-image: radial-gradient(rgba(109,74,255,.18) 1px, transparent 1px);
  background-size: 20px 20px;
  opacity: .38;
}
.system-glow {
  position: absolute; inset: 24%; border-radius: 50%;
  background: radial-gradient(circle, rgba(109,74,255,.26), transparent 70%);
  filter: blur(22px); animation: breathe 4s ease-in-out infinite;
}
.system-card-main {
  position: absolute; z-index: 5; left: 50%; top: 50%; transform: translate(-50%,-50%);
  width: 218px; padding: 25px; border-radius: 22px;
  background: rgba(255,255,255,.94); border: 1px solid rgba(109,74,255,.18);
  box-shadow: 0 22px 50px rgba(72,54,157,.20); text-align: left;
}
.system-card-main strong { display:block; color:#1f1b31; font-size:1.02rem; margin:12px 0 4px; }
.system-card-main small { color:#868195; font-size:.7rem; }
.system-status { font-size:.6rem; letter-spacing:.12em; color:var(--teal); font-weight:600; }
.system-status i { display:inline-block; width:7px; height:7px; border-radius:50%; background:var(--teal); margin-right:5px; animation:pulseDot 1.8s infinite; }
.system-orbit { position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); border-radius:50%; border:1px dashed rgba(109,74,255,.20); }
.orbit-one { width:62%; height:62%; animation:orbitSpin 22s linear infinite; }
.orbit-two { width:84%; height:84%; animation:orbitSpin 34s linear infinite reverse; }
.system-node {
  position:absolute; z-index:6; display:flex; align-items:center; gap:8px;
  padding:11px 14px; border-radius:14px; background:rgba(255,255,255,.94);
  border:1px solid rgba(30,27,75,.09); box-shadow:0 12px 35px rgba(51,41,109,.13);
  color:#393548; font-size:.7rem; font-weight:500; animation:nodeFloat 4s ease-in-out infinite;
}
.system-node svg { width:16px; height:16px; color:var(--purple); }
.node-one { left:5%; top:17%; }
.node-two { right:4%; top:24%; animation-delay:-1s; }
.node-three { left:8%; bottom:16%; animation-delay:-2s; }
.node-four { right:5%; bottom:18%; animation-delay:-3s; }
.data-pulse { position:absolute; width:9px; height:9px; background:var(--teal); border-radius:50%; box-shadow:0 0 18px var(--teal); z-index:4; }
.pulse-one { left:18%; top:49%; animation:dataMoveOne 5s ease-in-out infinite; }
.pulse-two { right:18%; top:49%; animation:dataMoveTwo 5s ease-in-out infinite; }

.tech-band { max-width:1000px; margin:58px auto 0; }
.tech-band-label { color:#9894a6; font-weight:500; }
.tech-marquee-fade-left { background:linear-gradient(to right,var(--bg),transparent); }
.tech-marquee-fade-right { background:linear-gradient(to left,var(--bg),transparent); }
.tech-pill { color:#777287; background:#fff; border-color:rgba(30,27,75,.08); box-shadow:0 4px 12px rgba(52,43,112,.04); }
.tech-pill:hover { color:#29253a; border-color:rgba(109,74,255,.22); }

#problem { background:#171522; color:#f6f4ff; }
#problem h2, #problem .problem-finale { color:#f6f4ff; }
#problem p { color:rgba(246,244,255,.62); }
#problem .section-label { color:#c8b8ff; border-color:rgba(200,184,255,.22); background:rgba(139,92,246,.12); }
.chaos-pill { color:#eeeaff; background:rgba(255,255,255,.05); border-color:rgba(255,255,255,.10); }

#sistem, #dashboard-preview, #cozum-modelleri { background:#fff; }
.sistem-header p, .section-intro p { color:#6f6a7d; }
.agent-card {
  background:#fff; border-color:rgba(30,27,75,.09);
  box-shadow:0 12px 35px rgba(43,35,92,.06);
}
.agent-card:hover { box-shadow:0 20px 44px rgba(88,67,178,.13); background:#fcfbff; }
.agent-icon { background:#f0edff; color:var(--purple); }
.agent-info h3 { color:#242032; }
.cortex-diagram-wrap video { box-shadow:0 30px 70px rgba(44,35,92,.18); }

.step-icon { background:#fff; border-color:rgba(30,27,75,.10); box-shadow:0 12px 30px rgba(44,35,92,.07); color:var(--purple); }
.step-item h3 { color:#292537; }
.steps-grid::before { opacity:.5; }
.steps-cta { color:#716c7e; }

#cozumler { background:linear-gradient(180deg,#f7f8fc,#f0effa); text-align:center; }
.platform-tier { background:#fff; border-color:rgba(30,27,75,.09); box-shadow:0 12px 30px rgba(44,35,92,.05); }
.platform-name { color:#292537; }
.platform-divider { background:rgba(30,27,75,.12); }
.dash-feature { background:#fff; border-color:rgba(30,27,75,.08); color:#5e596c; box-shadow:0 10px 28px rgba(44,35,92,.06); }
.dash-feature i { color:var(--purple); }

.dashboard-mockup { background:#11101a; border-color:rgba(30,27,75,.10); box-shadow:0 38px 90px rgba(35,28,75,.18); }
.mockup-bar { background:#181622; }

.pricing-card {
  background:#fff; border-color:rgba(30,27,75,.09); box-shadow:0 18px 45px rgba(44,35,92,.07);
}
.pricing-card.featured { background:linear-gradient(145deg,#f7f4ff,#fff); border-color:rgba(109,74,255,.35); box-shadow:0 26px 65px rgba(90,67,190,.16); }
.pricing-card h3 { color:#292537; line-height:1.45; font-size:1.12rem; min-height:3.2em; }
.pricing-name { color:var(--purple); }
.pricing-divider { background:rgba(30,27,75,.09); }
.pricing-feature { color:#666174; }
.pricing-badge { color:#fff; }

#demo { background:linear-gradient(145deg,#16131f,#221a38); }
#demo h2 { color:#fff; }
#demo .section-intro p { color:rgba(255,255,255,.60); }
#demo .section-label { color:#d5c9ff; border-color:rgba(213,201,255,.22); background:rgba(139,92,246,.14); }
.demo-form { background:rgba(255,255,255,.07); border-color:rgba(255,255,255,.12); box-shadow:0 35px 80px rgba(0,0,0,.25); }
.form-field label { color:rgba(255,255,255,.75); }
.form-field input[type="text"], .form-field input[type="url"], .form-field input[type="email"] { background:rgba(255,255,255,.08); border-color:rgba(255,255,255,.13); color:#fff; }
.checkbox-item label { color:rgba(255,255,255,.68); }

footer { background:#111019; color:#fff; border-color:rgba(255,255,255,.08); }
.footer-brand p, .footer-nav ul a, .footer-contact-item { color:rgba(255,255,255,.55); }
.footer-nav h4, .footer-contact h4 { color:rgba(255,255,255,.38); }
.footer-contact-icon { background:rgba(255,255,255,.06); border-color:rgba(255,255,255,.10); }

@keyframes orbitSpin { to { transform:translate(-50%,-50%) rotate(360deg); } }
@keyframes breathe { 0%,100%{transform:scale(.9);opacity:.6} 50%{transform:scale(1.15);opacity:1} }
@keyframes pulseDot { 0%,100%{box-shadow:0 0 0 0 rgba(0,169,143,.3)} 50%{box-shadow:0 0 0 7px rgba(0,169,143,0)} }
@keyframes nodeFloat { 0%,100%{transform:translateY(0)} 50%{transform:translateY(-8px)} }
@keyframes dataMoveOne { 0%,100%{transform:translate(0,-75px);opacity:0} 35%,65%{opacity:1} 50%{transform:translate(155px,0)} }
@keyframes dataMoveTwo { 0%,100%{transform:translate(0,78px);opacity:0} 35%,65%{opacity:1} 50%{transform:translate(-155px,0)} }

@media (max-width: 900px) {
  .hero-main { grid-template-columns:1fr; gap:54px; text-align:center; }
  .hero-content { margin:0 auto; }
  .hero-kicker { justify-content:center; }
  .hero-content > p { margin-left:auto; margin-right:auto; }
  .hero-cta { justify-content:center; }
  .hero-proof { margin:0 auto; text-align:left; }
  .hero-system { max-width:500px; }
}

@media (max-width: 768px) {
  #hero { padding:120px 20px 54px; }
  .hero-content h1 { font-size:clamp(3rem,13vw,4.4rem); }
  .hero-proof { grid-template-columns:1fr; max-width:300px; }
  .hero-proof div { display:grid; grid-template-columns:64px 1fr; align-items:center; }
  .hero-system { border-radius:28px; }
  .system-card-main { width:190px; padding:20px; }
  .system-node { padding:9px 11px; font-size:.62rem; }
  .node-one { left:2%; } .node-two { right:1%; }
  .node-three { left:3%; } .node-four { right:2%; }
}

@media (max-width: 480px) {
  .hero-main { gap:40px; }
  .hero-content h1 { font-size:2.75rem; }
  .hero-content > p { font-size:.98rem; }
  .hero-system { max-width:350px; }
  .system-card-main { width:165px; padding:17px; }
  .system-card-main strong { font-size:.84rem; }
  .system-node span { display:none; }
  .system-node { border-radius:50%; padding:11px; }
  .hero-cta a { max-width:100%; }
}

@media (prefers-reduced-motion: reduce) {
  .system-glow, .system-orbit, .system-node, .data-pulse { animation:none !important; }
}

/* Cinematic video hero */
#hero {
  background: #05040a;
  color: #f7f5ff;
  isolation: isolate;
}
.hero-bg-video {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  opacity: .52;
  filter: saturate(1.18) contrast(1.08);
  z-index: -4;
}
.hero-video-overlay {
  position: absolute;
  inset: 0;
  z-index: -3;
  background:
    linear-gradient(90deg, rgba(3,3,9,.98) 0%, rgba(3,3,9,.90) 42%, rgba(3,3,9,.55) 72%, rgba(3,3,9,.82) 100%),
    linear-gradient(180deg, rgba(3,3,9,.32), rgba(3,3,9,.92));
}
#hero::after {
  content: '';
  position: absolute;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  background:
    repeating-linear-gradient(90deg, transparent 0, transparent 79px, rgba(255,255,255,.035) 80px),
    repeating-linear-gradient(0deg, transparent 0, transparent 79px, rgba(255,255,255,.025) 80px);
  mask-image: linear-gradient(to bottom, rgba(0,0,0,.9), transparent 94%);
  animation: gridDrift 18s linear infinite;
}
#hero .hero-grid {
  opacity: .22;
  background-size: 42px 42px;
  background-image:
    linear-gradient(rgba(139,92,246,.16) 1px, transparent 1px),
    linear-gradient(90deg, rgba(139,92,246,.16) 1px, transparent 1px);
}
#hero .orb-1 { background: rgba(109,74,255,.34); opacity:.7; }
#hero .orb-2 { background: rgba(0,212,170,.24); opacity:.62; }
#hero .orb-3 { background: rgba(255,176,32,.16); opacity:.5; }
#hero .hero-kicker { color: rgba(255,255,255,.68); }
#hero .hero-content h1 { color: #f8f6ff; text-shadow: 0 12px 45px rgba(0,0,0,.28); }
#hero .hero-content h1 em { color: #a98aff; }
#hero .hero-content > p { color: rgba(244,241,255,.67); }
#hero .btn-ghost {
  color: #f8f6ff;
  border-color: rgba(255,255,255,.20);
  background: rgba(255,255,255,.06);
  backdrop-filter: blur(12px);
}
#hero .btn-ghost:hover { background: rgba(255,255,255,.12); border-color: rgba(255,255,255,.35); }
#hero .hero-proof div { border-color: rgba(255,255,255,.15); }
#hero .hero-proof strong { color: #fff; }
#hero .hero-proof span { color: rgba(255,255,255,.45); }
#hero .hero-system {
  background: linear-gradient(145deg, rgba(22,17,42,.76), rgba(8,7,18,.52));
  border-color: rgba(178,151,255,.24);
  box-shadow: 0 40px 100px rgba(0,0,0,.48), inset 0 1px 0 rgba(255,255,255,.12);
  backdrop-filter: blur(18px);
}
#hero .hero-system::before {
  background-image: radial-gradient(rgba(190,166,255,.28) 1px, transparent 1px);
  opacity: .35;
}
#hero .system-glow { background: radial-gradient(circle, rgba(120,78,255,.58), transparent 70%); }
#hero .system-orbit { border-color: rgba(190,166,255,.27); }
#hero .system-card-main {
  background: rgba(15,12,28,.84);
  border-color: rgba(190,166,255,.26);
  box-shadow: 0 25px 70px rgba(0,0,0,.44), 0 0 45px rgba(109,74,255,.18);
  backdrop-filter: blur(16px);
}
#hero .system-card-main strong { color: #fff; }
#hero .system-card-main small { color: rgba(255,255,255,.46); }
#hero .system-node {
  color: rgba(255,255,255,.82);
  background: rgba(15,12,28,.78);
  border-color: rgba(190,166,255,.20);
  box-shadow: 0 15px 42px rgba(0,0,0,.36);
  backdrop-filter: blur(14px);
}
#hero .system-node svg { color: #b79cff; }
#hero .tech-band-label { color: rgba(255,255,255,.28); }
#hero .tech-pill {
  color: rgba(255,255,255,.55);
  background: rgba(255,255,255,.055);
  border-color: rgba(255,255,255,.10);
  box-shadow: none;
  backdrop-filter: blur(10px);
}
#hero .tech-pill:hover { color:#fff; border-color:rgba(183,156,255,.35); }
#hero .tech-marquee-fade-left { background: linear-gradient(to right,#05040a,transparent); }
#hero .tech-marquee-fade-right { background: linear-gradient(to left,#05040a,transparent); }

@keyframes gridDrift {
  from { transform: translate3d(0,0,0); }
  to { transform: translate3d(80px,80px,0); }
}

@media (max-width: 900px) {
  .hero-video-overlay {
    background: linear-gradient(180deg, rgba(3,3,9,.88) 0%, rgba(3,3,9,.76) 58%, rgba(3,3,9,.94) 100%);
  }
  .hero-bg-video { opacity:.38; object-position:58% center; }
}

@media (prefers-reduced-motion: reduce) {
  .hero-bg-video { display:none; }
  #hero::after { animation:none; }
}

/* Ikonik monochrome + electric lime identity */
:root {
  --lime: #ccff00;
  --lime-soft: #ddff57;
  --lime-dark: #5f7600;
  --purple: #151515;
  --purple2: #ccff00;
  --teal: #a9d400;
  --gold: #ccff00;
  --purple-glow: rgba(204,255,0,.18);
}

em { color: var(--lime-dark); }
.section-label {
  color: #202020;
  border-color: rgba(20,20,20,.12);
  background: var(--lime);
}
.btn-primary {
  color: #0c0c0c;
  background: var(--lime);
  box-shadow: 0 14px 34px rgba(129,163,0,.20);
}
.btn-primary:hover {
  color: #0c0c0c;
  background: var(--lime-soft);
  box-shadow: 0 20px 44px rgba(129,163,0,.28);
}
a:focus-visible, button:focus-visible, input:focus-visible { outline-color: var(--lime); }
.nav-logo img, .footer-brand img { filter: grayscale(1) contrast(1.35); }
.nav-links a:hover { background: rgba(204,255,0,.22); }
.hero-kicker span { background: var(--lime); box-shadow: 0 0 0 6px rgba(204,255,0,.11); }
.tech-pill:hover { border-color: rgba(130,165,0,.35); }
.agent-icon { color:#171717; background:rgba(204,255,0,.30); }
.agent-card:hover { border-color:rgba(130,165,0,.30); box-shadow:0 20px 44px rgba(72,88,0,.12); }
.step-icon { color:#151515; }
.platform-badge, .pricing-name { color:#455600; background:rgba(204,255,0,.22); }
.dash-feature i { color:#536600; }
.pricing-card.featured { border-color:rgba(119,150,0,.42); background:linear-gradient(145deg,#f7ffd8,#fff); box-shadow:0 26px 65px rgba(88,108,0,.14); }
.pricing-badge { background:var(--lime); color:#111; }
.pricing-feature::before { background:rgba(204,255,0,.34); color:#344000; }

#hero .hero-bg-video {
  opacity: .54;
  filter: grayscale(.82) contrast(1.28) brightness(.62);
}
#hero .hero-video-overlay {
  background:
    radial-gradient(circle at 84% 36%, rgba(204,255,0,.12), transparent 30%),
    linear-gradient(90deg, rgba(2,2,2,.99) 0%, rgba(2,2,2,.90) 44%, rgba(2,2,2,.56) 74%, rgba(2,2,2,.86) 100%),
    linear-gradient(180deg, rgba(2,2,2,.28), rgba(2,2,2,.94));
}
#hero .hero-grid {
  background-image:
    linear-gradient(rgba(204,255,0,.08) 1px, transparent 1px),
    linear-gradient(90deg, rgba(204,255,0,.08) 1px, transparent 1px);
}
#hero .orb-1 { background:rgba(204,255,0,.16); }
#hero .orb-2 { background:rgba(204,255,0,.12); }
#hero .orb-3 { background:rgba(255,255,255,.08); }
#hero .hero-content h1 em { color:var(--lime); }
#hero .hero-kicker span { background:var(--lime); box-shadow:0 0 0 6px rgba(204,255,0,.12); }
#hero .hero-system { border-color:rgba(204,255,0,.22); }
#hero .hero-system::before { background-image:radial-gradient(rgba(204,255,0,.24) 1px, transparent 1px); }
#hero .system-glow { background:radial-gradient(circle,rgba(204,255,0,.27),transparent 70%); }
#hero .system-orbit { border-color:rgba(204,255,0,.25); }
#hero .system-card-main { border-color:rgba(204,255,0,.24); box-shadow:0 25px 70px rgba(0,0,0,.46),0 0 46px rgba(204,255,0,.10); }
#hero .system-status { color:var(--lime); }
#hero .system-status i, #hero .data-pulse { background:var(--lime); box-shadow:0 0 18px var(--lime); }
#hero .system-node { border-color:rgba(204,255,0,.20); }

/* Final hero treatment: true-black stage, visible MP4 and native dark logo plate */
#nav,
#nav.scrolled {
  background: rgba(7,8,12,.92);
  border-color: rgba(255,255,255,.12);
  box-shadow: 0 16px 46px rgba(0,0,0,.28);
}
.nav-logo {
  overflow: hidden;
  border-radius: 7px;
  background: #08090e;
}
.nav-logo img,
.footer-brand img {
  filter: none;
  display: block;
}
.nav-links a { color: rgba(255,255,255,.70); }
.nav-links a:hover { color:#fff; background:rgba(204,255,0,.12); }
.nav-links .btn-ghost {
  color:#0a0a0a;
  background:var(--lime);
  border-color:var(--lime);
}
.nav-hamburger span { background:#fff; }

#hero {
  background:#000;
  isolation:isolate;
}
#hero .hero-bg-video {
  z-index:0;
  opacity:.76;
  filter:grayscale(.72) contrast(1.22) brightness(.72);
}
#hero .hero-video-overlay {
  z-index:1;
  background:
    radial-gradient(circle at 84% 35%,rgba(204,255,0,.10),transparent 31%),
    linear-gradient(90deg,rgba(0,0,0,.96) 0%,rgba(0,0,0,.82) 43%,rgba(0,0,0,.30) 76%,rgba(0,0,0,.64) 100%),
    linear-gradient(180deg,rgba(0,0,0,.12),rgba(0,0,0,.82));
}
#hero::after,
#hero .hero-grid,
#hero .orb { z-index:2; }
#hero .hero-main { z-index:4; }

@media (max-width:900px) {
  #hero .hero-bg-video { opacity:.62; object-position:58% center; }
  #hero .hero-video-overlay {
    background:linear-gradient(180deg,rgba(0,0,0,.80),rgba(0,0,0,.66) 55%,rgba(0,0,0,.92));
  }
}

@media (prefers-reduced-motion:reduce) {
  #hero .hero-bg-video { display:block; }
}

/* Editorial motion system */
.hero-title {
  perspective:900px;
}
.hero-title > span,
.hero-title > em {
  display:block;
  width:max-content;
  max-width:100%;
  opacity:0;
  transform:translate3d(0,42px,0) rotateX(-8deg);
  transform-origin:left bottom;
  animation:titleEnter .9s cubic-bezier(.16,1,.3,1) forwards;
}
.hero-title > em {
  position:relative;
  padding-right:.12em;
  animation-delay:.12s;
}
.hero-title > span:last-child { animation-delay:.24s; }
.hero-title > em::after {
  content:'';
  position:absolute;
  left:0;
  right:0;
  bottom:.04em;
  height:2px;
  background:var(--lime);
  transform:scaleX(0);
  transform-origin:left;
  box-shadow:0 0 18px rgba(204,255,0,.65);
  animation:lineDraw .9s .75s cubic-bezier(.16,1,.3,1) forwards;
}
.hero-content::before {
  content:'AI / BUSINESS SYSTEMS';
  position:absolute;
  left:-48px;
  top:52%;
  color:rgba(255,255,255,.22);
  font-size:.56rem;
  font-weight:600;
  letter-spacing:.18em;
  writing-mode:vertical-rl;
  transform:rotate(180deg);
}
.hero-content::after {
  content:'';
  position:absolute;
  left:-25px;
  top:0;
  width:1px;
  height:100%;
  background:linear-gradient(transparent,rgba(204,255,0,.8),transparent);
  transform:scaleY(.35);
  animation:railPulse 4s ease-in-out infinite;
}
.hero-system {
  transform-style:preserve-3d;
  will-change:transform;
  transition:transform .18s ease-out,border-color .3s ease;
  overflow:hidden;
}
.hero-system:hover { border-color:rgba(204,255,0,.52); }
.system-index,
.system-coordinates {
  position:absolute;
  z-index:8;
  top:22px;
  color:rgba(255,255,255,.34);
  font-size:.55rem;
  font-weight:600;
  letter-spacing:.16em;
}
.system-index { left:25px; }
.system-coordinates { right:25px; }
.system-scan {
  position:absolute;
  z-index:3;
  left:0;
  right:0;
  height:90px;
  top:-100px;
  opacity:.55;
  background:linear-gradient(180deg,transparent,rgba(204,255,0,.10),rgba(204,255,0,.34),transparent);
  filter:blur(.3px);
  animation:systemScan 6s linear infinite;
}
.system-card-main::after {
  content:'LIVE';
  position:absolute;
  right:16px;
  top:16px;
  padding:4px 6px;
  border:1px solid rgba(204,255,0,.28);
  border-radius:999px;
  color:var(--lime);
  font-size:.46rem;
  letter-spacing:.12em;
}
#hero .hero-bg-video {
  animation:videoDrift 18s ease-in-out infinite alternate;
}

@keyframes titleEnter {
  to { opacity:1; transform:translate3d(0,0,0) rotateX(0); }
}
@keyframes lineDraw { to { transform:scaleX(1); } }
@keyframes railPulse {
  0%,100% { transform:translateY(-18%) scaleY(.28); opacity:.35; }
  50% { transform:translateY(18%) scaleY(.72); opacity:1; }
}
@keyframes systemScan {
  0% { transform:translateY(-110px); opacity:0; }
  12% { opacity:.55; }
  88% { opacity:.55; }
  100% { transform:translateY(640px); opacity:0; }
}
@keyframes videoDrift {
  from { transform:scale(1.02) translate3d(-.5%,0,0); }
  to { transform:scale(1.09) translate3d(.8%,-.8%,0); }
}

@media (max-width:900px) {
  .hero-title > span,.hero-title > em { width:auto; }
  .hero-content::before,.hero-content::after { display:none; }
  .system-coordinates { display:none; }
}

@media (max-width:480px) {
  #hero .hero-title { font-size:2.48rem; line-height:1.02; }
  #hero .hero-content > p { width:100%; max-width:360px; padding:0 6px; }
}

@media (prefers-reduced-motion:reduce) {
  .hero-title > span,.hero-title > em { opacity:1; transform:none; animation:none; }
  .hero-title > em::after { transform:scaleX(1); animation:none; }
  .system-scan,#hero .hero-bg-video { animation:none; }
}
#hero .system-node svg { color:var(--lime); }
#hero .tech-pill:hover { border-color:rgba(204,255,0,.32); }

#problem .section-label,
#demo .section-label { color:#111; background:var(--lime); border-color:transparent; }
#problem .problem-finale span { color:var(--lime); }
#problem h2 em, #demo h2 em { color:var(--lime); }