/* ═══════════════════════════════════════════════════
   VARIABLES
   ═══════════════════════════════════════════════════ */
:root {
  --black: #000000;
  --off-black: #0a0a0a;
  --dark-1: #111111;
  --dark-2: #161616;
  --dark-3: #1a1a1a;
  --dark-4: #222222;
  --gray-1: #333333;
  --gray-2: #555555;
  --gray-3: #777777;
  --gray-4: #999999;
  --gray-5: #bbbbbb;
  --light-1: #d4d4d4;
  --white: #f0f0f0;
  --pure-white: #ffffff;
  --accent: #4a6cf7;
  --accent-hover: #3a5ce5;
  --border-faint: rgba(255,255,255,0.05);
  --border-subtle: rgba(255,255,255,0.08);
  --border-medium: rgba(255,255,255,0.12);
  --border-strong: rgba(255,255,255,0.2);
  --surface-hover: rgba(255,255,255,0.03);
  /* Light palette */
  --light-bg: #f7f7f8;
  --light-bg-2: #ffffff;
  --light-text: #111111;
  --light-text-2: #555555;
  --light-text-3: #888888;
  --light-border-faint: rgba(0,0,0,0.06);
  --light-border-subtle: rgba(0,0,0,0.1);
  --light-border-medium: rgba(0,0,0,0.15);
  --light-surface-hover: rgba(0,0,0,0.025);
  --font-body: 'Instrument Sans', -apple-system, sans-serif;
  --font-mono: 'DM Mono', 'Consolas', monospace;
  --container-max: 1320px;
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
}

*, *::before, *::after { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior:smooth; -webkit-font-smoothing:antialiased; cursor:none; }
body { font-family:var(--font-body); background:var(--black); color:var(--white); overflow-x:hidden; line-height:1.6; cursor:none; }

/* ═══════════════════════════════════════════════════
   SCROLL PROGRESS BAR
   ═══════════════════════════════════════════════════ */
.scroll-progress {
  position:fixed; top:0; left:0; width:0%; height:2px;
  background:var(--accent); z-index:10000;
  transition:none; will-change:width;
}

/* ═══════════════════════════════════════════════════
   TEXT SCRAMBLE
   ═══════════════════════════════════════════════════ */
.scramble-text { display:inline; }
.scramble-char { display:inline-block; min-width:0.3em; }
.scramble-char--space { min-width:0.25em; }

/* ═══════════════════════════════════════════════════
   DOT GRID (HERO)
   ═══════════════════════════════════════════════════ */
.hero-dotgrid {
  position:absolute; inset:0; z-index:0; pointer-events:none; opacity:0.4;
}
.hero-dotgrid canvas { width:100%; height:100%; }

/* ═══════════════════════════════════════════════════
   CASE STUDY SECTION
   ═══════════════════════════════════════════════════ */
.cases-grid {
  display:grid; grid-template-columns:repeat(3, 1fr);
  gap:1px; background:var(--border-faint); margin-top:clamp(40px,5vw,64px);
}
@media (max-width:768px) { .cases-grid { grid-template-columns:1fr; } }
.case-card {
  background:var(--dark-2); padding:clamp(28px,3vw,48px);
  position:relative; transition:background 0.4s;
}
.case-card:hover { background:var(--dark-3); }
.case-card__tag {
  font-family:var(--font-mono); font-size:0.6rem;
  letter-spacing:0.15em; text-transform:uppercase;
  color:var(--accent); margin-bottom:16px;
}
.case-card__title {
  font-size:clamp(1rem,1.3vw,1.2rem); font-weight:600;
  color:var(--white); line-height:1.4; margin-bottom:12px;
}
.case-card__text {
  font-size:0.8rem; color:var(--gray-4); line-height:1.7; margin-bottom:20px;
}
.case-card__result {
  display:flex; gap:24px; padding-top:16px;
  border-top:1px solid var(--border-faint);
}
.case-card__metric { text-align:left; }
.case-card__metric-value {
  font-family:var(--font-mono); font-size:1.1rem;
  font-weight:500; color:var(--pure-white);
}
.case-card__metric-label {
  font-size:0.6rem; letter-spacing:0.1em; text-transform:uppercase;
  color:var(--gray-3); margin-top:4px;
}

/* ═══════════════════════════════════════════════════
   FAQ ACCORDION
   ═══════════════════════════════════════════════════ */
.faq-list { margin-top:clamp(40px,5vw,64px); max-width:800px; }
.section--light .faq-item { border-bottom-color:var(--light-border-subtle); }
.section--light .faq-question { color:var(--light-text); }
.section--light .faq-question:hover { color:var(--accent); }
.section--light .faq-question::after { color:var(--light-text-3); }
.section--light .faq-answer { color:var(--light-text-2); }
.faq-item {
  border-bottom:1px solid var(--border-faint);
}
.faq-question {
  width:100%; text-align:left; padding:20px 0;
  font-size:clamp(0.9rem,1.1vw,1.05rem); font-weight:500;
  color:var(--white); cursor:pointer; display:flex;
  align-items:center; justify-content:space-between;
  transition:color 0.3s; background:none; border:none;
  font-family:var(--font-body);
}
.faq-question:hover { color:var(--accent); }
.faq-question::after {
  content:'+'; font-family:var(--font-mono); font-size:1.2rem;
  color:var(--gray-3); transition:transform 0.3s var(--ease-out);
  flex-shrink:0; margin-left:16px;
}
.faq-item.is-open .faq-question::after { transform:rotate(45deg); }
.faq-answer {
  max-height:0; overflow:hidden; transition:max-height 0.4s var(--ease-out);
  font-size:0.82rem; color:var(--gray-4); line-height:1.8;
}
.faq-item.is-open .faq-answer { max-height:300px; }
.faq-answer p { padding-bottom:20px; }

/* ═══════════════════════════════════════════════════
   PRELOADER
   ═══════════════════════════════════════════════════ */
.preloader {
  position:fixed; inset:0; z-index:99999; background:var(--black);
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  transition:opacity 0.6s ease, visibility 0.6s ease;
}
.preloader.is-done { opacity:0; visibility:hidden; pointer-events:none; }
.preloader__logo {
  width:80px; height:80px; margin-bottom:32px; position:relative;
}
.preloader__layer {
  position:absolute; inset:0; opacity:0;
}
.preloader__layer svg { width:100%; height:100%; }
.preloader__layer--1 { animation:preLayer1 2.2s 0.3s var(--ease-out) forwards; }
.preloader__layer--2 { animation:preLayer2 2.2s 0.7s var(--ease-out) forwards; }
.preloader__layer--3 { animation:preLayer3 2.2s 1.1s var(--ease-out) forwards; }

@keyframes preLayer1 {
  0%   { opacity:0; transform:translateY(-30px) translateX(15px); filter:blur(4px); }
  20%  { opacity:0.6; transform:translateY(-30px) translateX(15px); filter:blur(0); }
  25%  { opacity:0; transform:translateY(-15px) translateX(-8px); }
  45%  { opacity:0.8; transform:translateY(-5px); }
  50%  { opacity:0.3; }
  70%  { opacity:1; transform:translateY(0) translateX(0); }
  100% { opacity:1; transform:translateY(0); filter:blur(0); }
}
@keyframes preLayer2 {
  0%   { opacity:0; transform:translateX(-25px); filter:blur(4px); }
  20%  { opacity:0.6; transform:translateX(-25px); filter:blur(0); }
  25%  { opacity:0; transform:translateX(12px); }
  45%  { opacity:0.8; transform:translateX(-3px); }
  50%  { opacity:0.3; }
  70%  { opacity:1; transform:translateX(0); }
  100% { opacity:1; transform:translateX(0); filter:blur(0); }
}
@keyframes preLayer3 {
  0%   { opacity:0; transform:translateY(30px) translateX(-15px); filter:blur(4px); }
  20%  { opacity:0.6; transform:translateY(30px) translateX(-15px); filter:blur(0); }
  25%  { opacity:0; transform:translateY(15px) translateX(8px); }
  45%  { opacity:0.8; transform:translateY(5px); }
  50%  { opacity:0.3; }
  70%  { opacity:1; transform:translateY(0) translateX(0); }
  100% { opacity:1; transform:translateY(0); filter:blur(0); }
}

.preloader__text {
  font-family:var(--font-mono); font-size:0.6rem;
  letter-spacing:0.2em; text-transform:uppercase;
  color:var(--gray-2); opacity:0;
  animation:fadeUp 0.5s 0.2s var(--ease-out) forwards;
}
.preloader__bar {
  width:120px; height:1px; background:var(--gray-1);
  margin-top:20px; overflow:hidden; opacity:0;
  animation:fadeUp 0.5s 0.4s var(--ease-out) forwards;
}
.preloader__bar-fill {
  width:0%; height:100%; background:var(--accent);
  animation:preBarFill 2.5s 0.5s var(--ease-out) forwards;
}
@keyframes preBarFill { to { width:100%; } }

/* ═══════════════════════════════════════════════════
   CUSTOM CURSOR
   ═══════════════════════════════════════════════════ */
.cursor {
  position:fixed; z-index:99998; pointer-events:none;
  mix-blend-mode:difference;
}
.cursor__dot {
  position:fixed; width:6px; height:6px;
  background:var(--pure-white); border-radius:50%;
  transform:translate(-50%,-50%);
  transition:width 0.2s, height 0.2s, background 0.2s;
  z-index:99999; pointer-events:none;
}
.cursor__ring {
  position:fixed; width:36px; height:36px;
  border:1px solid rgba(255,255,255,0.5); border-radius:50%;
  transform:translate(-50%,-50%);
  transition:width 0.3s var(--ease-out), height 0.3s var(--ease-out),
             border-color 0.3s, opacity 0.3s;
  z-index:99998; pointer-events:none;
}
/* Hover state */
.cursor__dot.is-hover {
  width:12px; height:12px; background:var(--accent);
}
.cursor__ring.is-hover {
  width:50px; height:50px; border-color:var(--accent); opacity:0.6;
}
/* Hide on mobile / touch */
@media (pointer:coarse) {
  html, body { cursor:auto; }
  .cursor { display:none; }
}

/* ═══════════════════════════════════════════════════
   MAGNETIC BUTTONS
   ═══════════════════════════════════════════════════ */
.btn-magnetic { transition:transform 0.3s var(--ease-out); }

/* ═══════════════════════════════════════════════════
   HERO PARALLAX
   ═══════════════════════════════════════════════════ */
.hero__content { position:relative; z-index:2; will-change:transform, opacity; }

/* ═══════════════════════════════════════════════════
   SCROLL SNAP
   ═══════════════════════════════════════════════════ */
@media (min-width:769px) {
  html { scroll-snap-type:y proximity; }
  .section, .hero, .stats-section, .footer { scroll-snap-align:start; }
}

/* ═══════════════════════════════════════════════════
   STATS / NUMERI SECTION
   ═══════════════════════════════════════════════════ */
.stats-section {
  background:var(--black); border-top:1px solid var(--border-subtle);
  padding:clamp(60px,8vw,100px) 0; position:relative; overflow:hidden;
}
.stats-grid {
  display:grid; grid-template-columns:repeat(4, 1fr);
  gap:0; border:1px solid var(--border-faint);
}
@media (max-width:768px) { .stats-grid { grid-template-columns:repeat(2, 1fr); } }
@media (max-width:480px) { .stats-grid { grid-template-columns:1fr; } }
.stat-card {
  padding:clamp(32px,4vw,56px); text-align:center;
  border-right:1px solid var(--border-faint);
  position:relative; transition:background 0.4s;
}
.stat-card:last-child { border-right:none; }
.stat-card:hover { background:var(--surface-hover); }
@media (max-width:768px) {
  .stat-card:nth-child(2) { border-right:none; }
  .stat-card:nth-child(-n+2) { border-bottom:1px solid var(--border-faint); }
}
@media (max-width:480px) {
  .stat-card { border-right:none !important; border-bottom:1px solid var(--border-faint); }
  .stat-card:last-child { border-bottom:none; }
}
.stat-card__value {
  font-family:var(--font-mono); font-size:clamp(2.2rem,4vw,3.2rem);
  font-weight:300; color:var(--pure-white); line-height:1;
}
.stat-card__label {
  font-size:0.68rem; letter-spacing:0.12em; text-transform:uppercase;
  color:var(--gray-2); margin-top:12px;
}
.stat-card__detail {
  font-size:0.75rem; color:var(--gray-4); margin-top:8px; line-height:1.5;
}
/* accent bar on hover */
.stat-card::after {
  content:''; position:absolute; bottom:0; left:0; right:0; height:2px;
  background:var(--accent); transform:scaleX(0);
  transition:transform 0.4s var(--ease-out);
}
.stat-card:hover::after { transform:scaleX(1); }

/* ═══════════════════════════════════════════════════
   TERMINAL EASTER EGG
   ═══════════════════════════════════════════════════ */
.terminal-overlay {
  position:fixed; inset:0; z-index:100000; background:rgba(0,0,0,0.92);
  display:none; align-items:center; justify-content:center;
  backdrop-filter:blur(8px);
}
.terminal-overlay.is-open { display:flex; }
.terminal {
  width:min(600px, 90vw); background:var(--dark-2);
  border:1px solid var(--border-subtle); font-family:var(--font-mono);
  font-size:0.72rem; color:var(--gray-4); overflow:hidden;
}
.terminal__bar {
  display:flex; align-items:center; gap:8px;
  padding:10px 16px; background:var(--dark-3);
  border-bottom:1px solid var(--border-faint);
}
.terminal__dot { width:8px; height:8px; border-radius:50%; }
.terminal__dot--r { background:#ff5f57; }
.terminal__dot--y { background:#febc2e; }
.terminal__dot--g { background:#28c840; }
.terminal__title {
  flex:1; text-align:center; font-size:0.6rem;
  letter-spacing:0.1em; color:var(--gray-2);
}
.terminal__body {
  padding:20px; max-height:350px; overflow-y:auto;
  line-height:1.8;
}
.terminal__line { white-space:pre-wrap; }
.terminal__line--accent { color:var(--accent); }
.terminal__line--green { color:#3ecf6e; }
.terminal__line--white { color:var(--white); }
.terminal__cursor { animation:termBlink 1s step-end infinite; }
@keyframes termBlink { 0%,100%{opacity:1;} 50%{opacity:0;} }
/* ═══════════════════════════════════════════════════
   LANGUAGE TOGGLE
   ═══════════════════════════════════════════════════ */
.lang-toggle {
  display:flex; align-items:center; gap:0;
  font-family:var(--font-mono); font-size:0.65rem;
  letter-spacing:0.08em; margin-left:20px;
}
.lang-btn {
  padding:6px 10px; background:none; border:1px solid var(--border-subtle);
  color:var(--gray-3); cursor:pointer; transition:all 0.3s;
  font-family:var(--font-mono); font-size:0.65rem; letter-spacing:0.08em;
}
.lang-btn:first-child { border-radius:4px 0 0 4px; border-right:none; }
.lang-btn:last-child { border-radius:0 4px 4px 0; }
.lang-btn.is-active {
  background:var(--accent); color:var(--pure-white);
  border-color:var(--accent);
}
.lang-btn:hover:not(.is-active) { border-color:var(--gray-2); color:var(--white); }
@media (max-width:768px) {
  .lang-toggle { margin-left:0; margin-top:24px; }
}

a { color:inherit; text-decoration:none; }
button { font-family:inherit; cursor:pointer; border:none; background:none; color:inherit; }
ul { list-style:none; }

.container { max-width:var(--container-max); margin:0 auto; padding:0 clamp(24px,5vw,72px); }
.container--narrow { max-width:880px; }

/* ═══════════════════════════════════════════════════
   NOISE OVERLAY
   ═══════════════════════════════════════════════════ */
.noise {
  position:fixed; inset:0; z-index:9999; pointer-events:none; opacity:0.025;
  background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  background-repeat:repeat; background-size:256px 256px;
}

/* ═══════════════════════════════════════════════════
   NAV
   ═══════════════════════════════════════════════════ */
.nav {
  position:fixed; top:0; left:0; right:0; z-index:1000;
  height:72px; display:flex; align-items:center;
  transition:background 0.4s, backdrop-filter 0.4s;
}
.nav.is-scrolled {
  background:rgba(0,0,0,0.85);
  backdrop-filter:blur(24px);
  -webkit-backdrop-filter:blur(24px);
  border-bottom:1px solid var(--border-faint);
}
.nav__inner {
  display:flex; align-items:center; justify-content:space-between;
  width:100%; max-width:var(--container-max); margin:0 auto;
  padding:0 clamp(24px,5vw,72px);
}
.nav__logo {
  display:flex; align-items:center; gap:10px;
  font-weight:700; font-size:1.1rem; letter-spacing:0.08em; text-transform:uppercase;
}
.nav__logo-mark {
  width:28px; height:28px;
  display:flex; align-items:center; justify-content:center; position:relative;
}
.nav__logo-mark svg { width:100%; height:100%; }
.nav__links { display:flex; align-items:center; gap:36px; }
.nav__links a {
  font-size:0.78rem; font-weight:500; letter-spacing:0.08em;
  text-transform:uppercase; color:var(--gray-4); transition:color 0.3s;
}
.nav__links a:hover { color:var(--pure-white); }
.nav__cta {
  padding:10px 28px; font-size:0.75rem; font-weight:600;
  letter-spacing:0.1em; text-transform:uppercase;
  border:1px solid var(--border-strong); transition:all 0.3s;
}
.nav__cta:hover { background:var(--pure-white); color:var(--black); }
.nav__burger { display:none; flex-direction:column; gap:5px; padding:8px; }
.nav__burger span { width:22px; height:1.5px; background:var(--white); }

@media (max-width:960px) {
  .nav__links, .nav__cta { display:none; }
  .nav__burger { display:flex; }
  .hero__logo-glitch { display:none; }
  .hero-status { display:none; }
  .deco-radar, .deco-reticle, .deco-topo, .deco-datastream { display:none; }
}

/* Mobile menu */
.mobile-menu {
  display:none; position:fixed; inset:0; z-index:999; background:var(--black);
  flex-direction:column; justify-content:center; align-items:center; gap:32px;
}
.mobile-menu.is-open { display:flex; }
.mobile-menu a { font-size:1.8rem; font-weight:600; color:var(--gray-3); transition:color 0.3s; }
.mobile-menu a:hover { color:var(--white); }
.mobile-menu__close { position:absolute; top:24px; right:24px; font-size:1.5rem; color:var(--gray-3); }

/* ═══════════════════════════════════════════════════
   BUTTONS
   ═══════════════════════════════════════════════════ */
.btn {
  display:inline-flex; align-items:center; gap:10px;
  font-size:0.8rem; font-weight:600; letter-spacing:0.1em;
  text-transform:uppercase; padding:16px 40px;
  transition:all 0.35s var(--ease-out); position:relative;
}
.btn--primary { background:var(--pure-white); color:var(--black); border:1px solid var(--pure-white); }
.btn--primary:hover { background:transparent; color:var(--pure-white); }
.btn--outline { background:transparent; color:var(--white); border:1px solid var(--border-strong); }
.btn--outline:hover { border-color:var(--pure-white); background:var(--surface-hover); }
.btn--sm { padding:10px 24px; font-size:0.72rem; }
.btn--arrow::after { content:'→'; transition:transform 0.3s; }
.btn--arrow:hover::after { transform:translateX(4px); }

/* ═══════════════════════════════════════════════════
   HERO
   ═══════════════════════════════════════════════════ */
.hero {
  min-height:100vh; display:flex; align-items:center;
  padding-top:72px; position:relative; overflow:hidden;
}
.hero::before {
  content:''; position:absolute; inset:0;
  background:radial-gradient(ellipse 60% 50% at 50% 40%, rgba(255,255,255,0.015) 0%, transparent 70%);
  pointer-events:none;
}
.hero__grid {
  position:absolute; inset:0;
  background-image:
    linear-gradient(rgba(255,255,255,0.025) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,0.025) 1px, transparent 1px);
  background-size:80px 80px;
  mask-image:linear-gradient(to bottom, black 40%, transparent 80%);
  -webkit-mask-image:linear-gradient(to bottom, black 40%, transparent 80%);
  pointer-events:none;
}
/* Hero hologram logo */
.hero__logo-glitch {
  position:absolute; right:clamp(40px,8vw,140px); top:50%; transform:translateY(-50%);
  width:clamp(260px,30vw,440px); height:clamp(260px,30vw,440px);
  z-index:1;
}

/* Each layer assembles independently */
.hero__logo-glitch .logo-layer {
  position:absolute; inset:0; opacity:0;
}
.hero__logo-glitch .logo-layer svg { width:100%; height:100%; }

.hero__logo-glitch .logo-layer--1 {
  animation:layerAssemble1 1.8s 0.6s var(--ease-out) forwards;
}
.hero__logo-glitch .logo-layer--2 {
  animation:layerAssemble2 1.8s 1.0s var(--ease-out) forwards;
}
.hero__logo-glitch .logo-layer--3 {
  animation:layerAssemble3 1.8s 1.4s var(--ease-out) forwards;
}

@keyframes layerAssemble1 {
  0%   { opacity:0; transform:translateY(-60px) translateX(30px); }
  8%   { opacity:0.09; transform:translateY(-60px) translateX(30px); }
  10%  { opacity:0; transform:translateY(-35px) translateX(-15px); }
  18%  { opacity:0.08; transform:translateY(-35px) translateX(-15px); }
  20%  { opacity:0; transform:translateY(-20px) translateX(10px); }
  30%  { opacity:0.07; transform:translateY(-20px) translateX(10px); }
  32%  { opacity:0; }
  42%  { opacity:0.06; transform:translateY(-8px) translateX(-5px); }
  44%  { opacity:0; }
  55%  { opacity:0.07; transform:translateY(-3px) translateX(2px); }
  58%  { opacity:0.03; }
  70%  { opacity:0.07; transform:translateY(0) translateX(0); }
  75%  { opacity:0.04; transform:translateY(0) translateX(3px); }
  80%  { opacity:0.07; }
  100% { opacity:0.07; transform:translateY(0) translateX(0); }
}
@keyframes layerAssemble2 {
  0%   { opacity:0; transform:translateX(-40px) translateY(15px); }
  10%  { opacity:0.08; transform:translateX(-40px) translateY(15px); }
  12%  { opacity:0; transform:translateX(20px) translateY(-10px); }
  22%  { opacity:0.07; transform:translateX(20px) translateY(-10px); }
  24%  { opacity:0; transform:translateX(-12px) translateY(5px); }
  35%  { opacity:0.06; transform:translateX(-12px) translateY(5px); }
  38%  { opacity:0; }
  48%  { opacity:0.07; transform:translateX(5px); }
  50%  { opacity:0.03; }
  62%  { opacity:0.07; transform:translateX(-2px); }
  68%  { opacity:0.04; }
  78%  { opacity:0.07; transform:translateX(0); }
  100% { opacity:0.07; transform:translateX(0) translateY(0); }
}
@keyframes layerAssemble3 {
  0%   { opacity:0; transform:translateY(60px) translateX(-25px); }
  6%   { opacity:0.09; transform:translateY(60px) translateX(-25px); }
  8%   { opacity:0; transform:translateY(30px) translateX(18px); }
  16%  { opacity:0.08; transform:translateY(30px) translateX(18px); }
  18%  { opacity:0; transform:translateY(15px) translateX(-8px); }
  28%  { opacity:0.06; }
  30%  { opacity:0; }
  40%  { opacity:0.07; transform:translateY(6px) translateX(4px); }
  45%  { opacity:0.03; }
  55%  { opacity:0.07; transform:translateY(2px) translateX(-2px); }
  60%  { opacity:0.04; }
  72%  { opacity:0.07; transform:translateY(0) translateX(0); }
  78%  { opacity:0.04; transform:translateX(2px); }
  85%  { opacity:0.07; }
  100% { opacity:0.07; transform:translateY(0) translateX(0); }
}

/* Subtle CRT scanlines over logo */
.hero__logo-glitch::after {
  content:''; position:absolute; inset:0; pointer-events:none;
  background:repeating-linear-gradient(
    0deg, transparent, transparent 3px,
    rgba(255,255,255,0.008) 3px, rgba(255,255,255,0.008) 4px
  );
  animation:scanDrift 6s linear infinite;
}
@keyframes scanDrift {
  0% { transform:translateY(0); }
  100% { transform:translateY(8px); }
}

/* Idle breathing glow */
.hero__logo-glitch .logo-glow {
  position:absolute; inset:-20%; border-radius:50%;
  background:radial-gradient(circle, rgba(74,108,247,0.06) 0%, transparent 65%);
  animation:breathe 5s ease-in-out infinite;
  pointer-events:none;
}
@keyframes breathe {
  0%,100% { opacity:0.4; transform:scale(0.95); }
  50%     { opacity:1; transform:scale(1.05); }
}

/* Animated horizontal scan line across hero */
.hero__scanline {
  position:absolute; left:0; right:0; height:1px; z-index:3;
  background:linear-gradient(90deg, transparent, rgba(74,108,247,0.12), transparent);
  animation:heroScan 10s linear infinite; pointer-events:none;
}
@keyframes heroScan {
  0% { top:-1px; opacity:0; }
  5% { opacity:1; }
  95% { opacity:1; }
  100% { top:100%; opacity:0; }
}

.hero__content { position:relative; z-index:2; }
.hero__eyebrow {
  display:inline-flex; align-items:center; gap:12px; margin-bottom:32px;
  animation:fadeUp 0.7s var(--ease-out) both;
}
.hero__eyebrow-dot {
  width:6px; height:6px; background:var(--accent);
  animation:blink 2.5s ease-in-out infinite;
}
@keyframes blink { 0%,100%{opacity:1;} 50%{opacity:0.2;} }

.t-label {
  font-family:var(--font-mono); font-size:0.7rem; font-weight:500;
  letter-spacing:0.18em; text-transform:uppercase; color:var(--gray-3);
}
.t-display {
  font-size:clamp(3.2rem,7.5vw,6.5rem); font-weight:700;
  line-height:1.0; letter-spacing:-0.04em;
}
.t-h1 {
  font-size:clamp(2.4rem,5vw,4.2rem); font-weight:700;
  line-height:1.05; letter-spacing:-0.035em;
}
.t-h2 {
  font-size:clamp(1.8rem,3.5vw,3rem); font-weight:600;
  line-height:1.1; letter-spacing:-0.025em;
}
.t-h3 { font-size:clamp(1.2rem,2vw,1.6rem); font-weight:600; line-height:1.25; }
.t-h4 { font-size:1.05rem; font-weight:600; line-height:1.35; }
.t-body { font-size:1rem; font-weight:400; line-height:1.7; color:var(--gray-4); }
.t-body-lg { font-size:clamp(1.05rem,1.5vw,1.2rem); font-weight:400; line-height:1.7; color:var(--gray-4); }

.hero__title { animation:fadeUp 0.7s 0.1s var(--ease-out) both; }
.hero__subtitle { max-width:600px; margin-top:28px; animation:fadeUp 0.7s 0.2s var(--ease-out) both; }
.hero__actions { display:flex; gap:16px; margin-top:48px; flex-wrap:wrap; animation:fadeUp 0.7s 0.3s var(--ease-out) both; }
@keyframes fadeUp { from{opacity:0;transform:translateY(32px);} to{opacity:1;transform:translateY(0);} }

.hero__metrics {
  display:flex; gap:clamp(40px,6vw,80px); margin-top:clamp(60px,8vw,100px);
  padding-top:40px; border-top:1px solid var(--border-subtle);
  animation:fadeUp 0.7s 0.45s var(--ease-out) both;
}
.hero__metric-value {
  font-family:var(--font-mono); font-size:clamp(1.6rem,3vw,2.4rem);
  font-weight:400; color:var(--pure-white);
}
.hero__metric-label {
  font-size:0.72rem; letter-spacing:0.12em; text-transform:uppercase;
  color:var(--gray-2); margin-top:6px;
}

/* ═══════════════════════════════════════════════════
   SECTIONS
   ═══════════════════════════════════════════════════ */
.section { position:relative; padding:clamp(80px,12vw,160px) 0; }
.section--bordered { border-top:1px solid var(--border-subtle); }
.section--dark { background:var(--dark-1); }
.section-header { margin-bottom:clamp(48px,6vw,80px); }
.section-header .t-label { margin-bottom:20px; }

/* ═══════════════════════════════════════════════════
   LIGHT SECTION THEME
   ═══════════════════════════════════════════════════ */
.section--light {
  background:var(--light-bg); color:var(--light-text);
  border-top:1px solid var(--light-border-faint);
}
.section--light .t-label { color:var(--light-text-3); }
.section--light .t-h1,
.section--light .t-h2,
.section--light .t-h3,
.section--light .t-h4 { color:var(--light-text); }
.section--light .t-body,
.section--light .t-body-lg { color:var(--light-text-2); }

/* Timeline in light */
.section--light .timeline { border-color:var(--light-border-subtle); }
.section--light .timeline__step { border-right-color:var(--light-border-subtle); }
.section--light .timeline__step:hover { background:var(--light-surface-hover); }
.section--light .timeline__row-2 { border-top-color:var(--light-border-subtle); }
.section--light .timeline__row-2 .timeline__step:first-child { border-right-color:var(--light-border-subtle); }
.section--light .timeline__step-num { color:var(--light-text-3); }
.section--light .timeline__step-title { color:var(--light-text); }
.section--light .timeline__step-text { color:var(--light-text-2); }
.section--light .timeline__deliverables { border-top-color:var(--light-border-subtle); }
.section--light .timeline__deliverable-label { color:var(--light-text-3); }
.section--light .timeline__deliverable-item { color:var(--light-text-2); }
.section--light .timeline__deliverable-item::before { background:var(--light-text-3); }
@media (max-width:768px) {
  .section--light .timeline__step { border-bottom-color:var(--light-border-subtle); }
}

/* Reasons in light */
.section--light .reasons { border-color:var(--light-border-subtle); }
.section--light .reason { border-right-color:var(--light-border-subtle); border-bottom-color:var(--light-border-subtle); }
.section--light .reason:hover { background:var(--light-surface-hover); }
.section--light .reason__num { color:var(--light-text-3); }
.section--light .reason__icon { border-color:var(--light-border-subtle); color:var(--light-text-3); }
.section--light .reason__title { color:var(--light-text); }
.section--light .reason__text { color:var(--light-text-2); }
@media (max-width:960px) {
  .section--light .reason:nth-child(3n) { border-right-color:var(--light-border-subtle); }
}
@media (max-width:640px) {
  .section--light .reason { border-bottom-color:var(--light-border-subtle) !important; }
}

/* Contact in light */
.section--light .form-group label { color:var(--light-text-3); }
.section--light .form-input {
  background:var(--light-bg-2); border-color:var(--light-border-subtle);
  color:var(--light-text);
}
.section--light .form-input:focus { border-color:var(--accent); }
.section--light .form-input::placeholder { color:#bbb; }
.section--light select.form-input {
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%23999' d='M6 8L1 3h10z'/%3E%3C/svg%3E");
  background-repeat:no-repeat; background-position:right 16px center;
}
.section--light .btn--primary {
  background:var(--light-text); color:var(--light-bg-2);
  border-color:var(--light-text);
}
.section--light .btn--primary:hover {
  background:var(--accent); color:var(--pure-white);
  border-color:var(--accent);
}
.section--light .contact-process { border-color:var(--light-border-subtle); }
.section--light .contact-step { border-bottom-color:var(--light-border-subtle); }
.section--light .contact-step:hover { background:var(--light-surface-hover); }
.section--light .contact-step__num { border-right-color:var(--light-border-subtle); color:var(--light-text-3); }
.section--light .contact-step__title { color:var(--light-text); }
.section--light .contact-step__text { color:var(--light-text-2); }
.section--light .contact-stats { border-color:var(--light-border-subtle); }
.section--light .contact-stat { border-right-color:var(--light-border-subtle); }
.section--light .contact-stat__value { color:var(--light-text); }
.section--light .contact-stat__label { color:var(--light-text-3); }
.section--light .contact-bottom { border-color:var(--light-border-subtle); }
.section--light .contact-bottom__item { border-right-color:var(--light-border-subtle); }
.section--light .contact-bottom__item .t-label { color:var(--light-text-3); }
.section--light .contact-bottom__item a { color:var(--light-text); }
.section--light .contact-bottom__item p { color:var(--light-text-2); }

/* ═══════════════════════════════════════════════════
   SERVICE BLOCKS — Full-width alternating
   ═══════════════════════════════════════════════════ */
.svc-block {
  display:grid; grid-template-columns:1fr 1fr;
  gap:clamp(48px,6vw,100px); align-items:start;
  padding:clamp(64px,8vw,120px) 0;
  border-top:1px solid var(--border-subtle);
}
.svc-block--reverse { direction:rtl; }
.svc-block--reverse > * { direction:ltr; }

@media (max-width:960px) {
  .svc-block, .svc-block--reverse { grid-template-columns:1fr; direction:ltr; gap:40px; }
}

.svc-block__num {
  font-family:var(--font-mono); font-size:5rem; font-weight:300;
  color:var(--dark-4); line-height:1; margin-bottom:24px;
  letter-spacing:-0.04em;
}

.svc-block__title { margin-bottom:16px; }

.svc-block__text {
  font-size:0.95rem; color:var(--gray-4); line-height:1.75;
  max-width:500px; margin-bottom:32px;
}

/* Feature rows inside service blocks */
.svc-features {
  display:flex; flex-direction:column; gap:0;
  border:1px solid var(--border-faint);
}
.svc-feat {
  display:grid; grid-template-columns:56px 1fr;
  gap:0; border-bottom:1px solid var(--border-faint);
  transition:background 0.3s;
}
.svc-feat:last-child { border-bottom:none; }
.svc-feat:hover { background:var(--surface-hover); }

.svc-feat__icon {
  display:flex; align-items:center; justify-content:center;
  border-right:1px solid var(--border-faint);
  font-family:var(--font-mono); font-size:0.6rem; color:var(--gray-3);
  letter-spacing:0.1em;
}
.svc-feat__body { padding:20px 24px; }
h3.svc-feat__title { font-size:0.9rem; font-weight:600; margin:0 0 4px 0; }
.svc-feat__text { font-size:0.8rem; color:var(--gray-4); line-height:1.6; }

/* Tags */
.tags { display:flex; flex-wrap:wrap; gap:8px; margin-top:24px; }
.tag {
  font-family:var(--font-mono); font-size:0.62rem; letter-spacing:0.08em;
  text-transform:uppercase; padding:4px 10px;
  border:1px solid var(--border-subtle); color:var(--gray-3);
}

/* ═══════════════════════════════════════════════════
   APPROACH — Horizontal timeline
   ═══════════════════════════════════════════════════ */
.approach-intro {
  max-width:640px; margin-bottom:clamp(40px,5vw,64px);
}
.timeline {
  display:grid; grid-template-columns:repeat(3, 1fr);
  gap:0; border:1px solid var(--border-faint);
}
.timeline__row-2 {
  grid-column:1 / -1;
  display:grid; grid-template-columns:repeat(2, 1fr);
  border-top:1px solid var(--border-faint);
}
@media (max-width:960px) {
  .timeline { grid-template-columns:repeat(2, 1fr); }
  .timeline__row-2 { grid-template-columns:1fr; }
}
@media (max-width:640px) {
  .timeline { grid-template-columns:1fr; }
  .timeline__row-2 { grid-template-columns:1fr; }
}

.timeline__step {
  padding:clamp(28px,3vw,44px);
  border-right:1px solid var(--border-faint);
  position:relative;
  transition:background 0.4s;
}
.timeline__step:last-child { border-right:none; }
.timeline__step:hover { background:var(--surface-hover); }
.timeline__row-2 .timeline__step:first-child { border-right:1px solid var(--border-faint); }
@media (max-width:640px) {
  .timeline__step { border-right:none !important; border-bottom:1px solid var(--border-faint); }
  .timeline__step:last-child { border-bottom:none; }
  .timeline__row-2 { border-top:none; }
}

.timeline__step-num {
  font-family:var(--font-mono); font-size:0.6rem; color:var(--gray-2);
  letter-spacing:0.15em; text-transform:uppercase; margin-bottom:16px;
}
.timeline__step-title { font-size:0.95rem; font-weight:600; margin-bottom:8px; }
.timeline__step-text { font-size:0.8rem; color:var(--gray-4); line-height:1.65; margin-bottom:16px; }
.timeline__deliverables {
  padding-top:16px; border-top:1px solid var(--border-faint);
}
.timeline__deliverable-label {
  font-family:var(--font-mono); font-size:0.58rem; color:var(--gray-2);
  letter-spacing:0.12em; text-transform:uppercase; margin-bottom:8px;
}
.timeline__deliverable-item {
  font-size:0.75rem; color:var(--gray-3); line-height:1.8;
  padding-left:12px; position:relative;
}
.timeline__deliverable-item::before {
  content:''; position:absolute; left:0; top:0.55em;
  width:4px; height:4px; background:var(--gray-2);
}

/* ═══════════════════════════════════════════════════
   WHY US — Card grid
   ═══════════════════════════════════════════════════ */
.reasons {
  display:grid; grid-template-columns:repeat(3, 1fr);
  gap:0; counter-reset:reason;
  border:1px solid var(--border-faint);
}
.reason {
  padding:clamp(28px,3vw,44px);
  border-right:1px solid var(--border-faint);
  border-bottom:1px solid var(--border-faint);
  position:relative;
  transition:background 0.4s;
}
.reason:nth-child(3n) { border-right:none; }
.reason:nth-last-child(-n+2) { border-bottom:none; }
.reason:nth-last-child(-n+3):nth-child(3n+1) { border-bottom:none; }
.reason:nth-last-child(-n+3):nth-child(3n+1) ~ .reason { border-bottom:none; }
.reason:hover { background:var(--surface-hover); }
.reason__num {
  font-family:var(--font-mono); font-size:0.6rem; color:var(--gray-2);
  letter-spacing:0.15em; text-transform:uppercase; margin-bottom:20px;
  counter-increment:reason;
}
.reason__num::before { content:counter(reason, decimal-leading-zero); }
.reason__icon {
  width:40px; height:40px; border:1px solid var(--border-subtle);
  display:flex; align-items:center; justify-content:center;
  margin-bottom:20px; font-family:var(--font-mono); font-size:0.65rem;
  color:var(--gray-3); letter-spacing:0.08em;
}
.reason__title { font-size:1.05rem; font-weight:600; margin-bottom:10px; }
.reason__text { font-size:0.84rem; color:var(--gray-4); line-height:1.7; }

@media (max-width:960px) {
  .reasons { grid-template-columns:repeat(2, 1fr); }
  .reason:nth-child(3n) { border-right:1px solid var(--border-faint); }
  .reason:nth-child(2n) { border-right:none; }
  .reason { border-bottom:1px solid var(--border-faint); }
  .reason:nth-last-child(-n+2) { border-bottom:none; }
}
@media (max-width:640px) {
  .reasons { grid-template-columns:1fr; }
  .reason { border-right:none !important; border-bottom:1px solid var(--border-faint); }
  .reason:last-child { border-bottom:none; }
}

/* ═══════════════════════════════════════════════════
   MARQUEE — Infinite scroll carousel
   ═══════════════════════════════════════════════════ */
.marquee-section {
  border-top:1px solid var(--border-subtle);
  border-bottom:1px solid var(--border-subtle);
  background:var(--dark-1);
  padding:48px 0 40px;
  overflow:hidden;
}
.marquee-section .t-label { text-align:center; margin-bottom:28px; }
.marquee-wrap {
  position:relative;
  mask-image:linear-gradient(90deg, transparent, black 8%, black 92%, transparent);
  -webkit-mask-image:linear-gradient(90deg, transparent, black 8%, black 92%, transparent);
}
.marquee-track {
  display:flex; align-items:center; width:max-content;
  animation:marquee 45s linear infinite;
}
.marquee-track:hover { animation-play-state:paused; }
.marquee-item {
  flex-shrink:0; display:flex; align-items:center; gap:10px;
  padding:0 clamp(20px,2.5vw,36px); height:64px;
  font-family:var(--font-mono); font-size:0.68rem; font-weight:500;
  letter-spacing:0.08em; text-transform:uppercase;
  color:var(--gray-3); white-space:nowrap;
  transition:color 0.3s, opacity 0.3s;
}
.marquee-item:hover { color:var(--white); }
.marquee-item img {
  width:22px; height:22px; object-fit:contain;
  filter:grayscale(1) brightness(0.5);
  transition:filter 0.3s;
}
.marquee-item:hover img { filter:grayscale(0) brightness(1); }
.marquee-div {
  flex-shrink:0; width:1px; align-self:stretch;
  background:var(--border-faint); margin:0 2px;
}

@keyframes marquee {
  0% { transform:translateX(0); }
  100% { transform:translateX(-50%); }
}

/* ═══════════════════════════════════════════════════
   CONTACT SECTION
   ═══════════════════════════════════════════════════ */
.contact-split {
  display:grid; grid-template-columns:1fr 1fr;
  gap:clamp(48px,6vw,100px); align-items:start;
}
@media (max-width:960px) { .contact-split { grid-template-columns:1fr; } }

.form-group { margin-bottom:20px; }
.form-group label {
  display:block; font-size:0.68rem; font-weight:600;
  letter-spacing:0.12em; text-transform:uppercase;
  color:var(--gray-3); margin-bottom:8px;
}
.form-input {
  width:100%; padding:14px 16px; font-family:var(--font-body);
  font-size:0.9rem; background:var(--dark-2);
  border:1px solid var(--border-subtle); color:var(--white);
  outline:none; transition:border-color 0.3s;
}
.form-input:focus { border-color:var(--gray-3); }
.form-input::placeholder { color:var(--gray-2); }
textarea.form-input { resize:vertical; min-height:140px; }
select.form-input {
  appearance:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%23555' d='M6 8L1 3h10z'/%3E%3C/svg%3E");
  background-repeat:no-repeat; background-position:right 16px center;
}

.contact-info-block {
  padding:32px; border:1px solid var(--border-subtle); background:var(--dark-2);
  margin-bottom:24px;
}
.contact-info-block .t-label { margin-bottom:12px; }

/* Contact sidebar — process steps */
.contact-process {
  border:1px solid var(--border-faint); margin-bottom:32px;
}
.contact-step {
  display:grid; grid-template-columns:48px 1fr; gap:0;
  border-bottom:1px solid var(--border-faint);
  transition:background 0.3s;
}
.contact-step:last-child { border-bottom:none; }
.contact-step:hover { background:var(--surface-hover); }
.contact-step__num {
  display:flex; align-items:center; justify-content:center;
  border-right:1px solid var(--border-faint);
  font-family:var(--font-mono); font-size:0.6rem; color:var(--gray-2);
  letter-spacing:0.1em;
}
.contact-step__body { padding:20px 24px; }
.contact-step__title { font-size:0.88rem; font-weight:600; margin-bottom:4px; }
.contact-step__text { font-size:0.78rem; color:var(--gray-4); line-height:1.6; }

/* Contact stats row */
.contact-stats {
  display:grid; grid-template-columns:repeat(3, 1fr);
  gap:0; border:1px solid var(--border-faint); margin-bottom:32px;
}
.contact-stat {
  padding:24px; text-align:center;
  border-right:1px solid var(--border-faint);
}
.contact-stat:last-child { border-right:none; }
.contact-stat__value {
  font-family:var(--font-mono); font-size:1.4rem; font-weight:300;
  color:var(--pure-white); margin-bottom:4px;
}
.contact-stat__label {
  font-size:0.62rem; color:var(--gray-2); text-transform:uppercase;
  letter-spacing:0.1em;
}

/* Contact bottom info */
.contact-bottom {
  display:grid; grid-template-columns:1fr 1fr; gap:0;
  border:1px solid var(--border-faint);
}
.contact-bottom__item {
  padding:24px;
  border-right:1px solid var(--border-faint);
}
.contact-bottom__item:last-child { border-right:none; }
.contact-bottom__item .t-label { margin-bottom:8px; }

/* ═══════════════════════════════════════════════════
   FOOTER
   ═══════════════════════════════════════════════════ */
.footer {
  border-top:none;
  padding:60px 0 40px;
  background:var(--black);
}
.footer__inner {
  display:flex; justify-content:space-between; align-items:center;
  flex-wrap:wrap; gap:16px;
}
.footer__links { display:flex; gap:24px; }
.footer__links a { font-size:0.75rem; color:var(--gray-2); transition:color 0.3s; }
.footer__links a:hover { color:var(--gray-4); }
.footer__copy { font-size:0.72rem; color:var(--gray-2); }

/* ═══════════════════════════════════════════════════
   DECORATIVE ELEMENTS
   ═══════════════════════════════════════════════════ */

/* Crosshair markers — Palantir style */
.deco-cross {
  position:absolute; width:24px; height:24px; pointer-events:none; opacity:0.15;
}
.deco-cross::before, .deco-cross::after {
  content:''; position:absolute; background:currentColor;
}
.deco-cross::before { width:1px; height:100%; left:50%; top:0; }
.deco-cross::after { width:100%; height:1px; top:50%; left:0; }

/* Corner brackets */
.deco-bracket {
  position:absolute; width:40px; height:40px; pointer-events:none; opacity:0.1;
}
.deco-bracket::before, .deco-bracket::after {
  content:''; position:absolute; border-color:currentColor; border-style:solid;
}
.deco-bracket--tl::before { top:0; left:0; width:16px; height:16px; border-width:1px 0 0 1px; }
.deco-bracket--tr::before { top:0; right:0; width:16px; height:16px; border-width:1px 1px 0 0; }
.deco-bracket--bl::before { bottom:0; left:0; width:16px; height:16px; border-width:0 0 1px 1px; }
.deco-bracket--br::before { bottom:0; right:0; width:16px; height:16px; border-width:0 1px 1px 0; }

/* Radial glow for light sections */
.section--light .deco-glow {
  position:absolute; pointer-events:none;
  width:600px; height:600px; border-radius:50%;
  background:radial-gradient(circle, rgba(74,108,247,0.04) 0%, transparent 70%);
}

/* Grid pattern overlay for specific sections */
.deco-grid {
  position:absolute; inset:0; pointer-events:none; overflow:hidden;
}
.deco-grid::before {
  content:''; position:absolute; inset:0;
  background-image:
    linear-gradient(rgba(0,0,0,0.04) 1px, transparent 1px),
    linear-gradient(90deg, rgba(0,0,0,0.04) 1px, transparent 1px);
  background-size:60px 60px;
  mask-image:radial-gradient(ellipse 70% 50% at 80% 50%, black 0%, transparent 70%);
  -webkit-mask-image:radial-gradient(ellipse 70% 50% at 80% 50%, black 0%, transparent 70%);
}

/* Diamond/rhombus accent */
.deco-diamond {
  position:absolute; pointer-events:none; opacity:0.06;
}
.deco-diamond::before {
  content:''; display:block; width:120px; height:120px;
  border:1px solid currentColor; transform:rotate(45deg);
}

/* Horizontal scan line */
.deco-scanline {
  position:absolute; left:0; right:0; height:1px; pointer-events:none;
  background:linear-gradient(90deg, transparent, rgba(74,108,247,0.08) 20%, rgba(74,108,247,0.08) 80%, transparent);
}

/* Floating coordinates label */
.deco-coord {
  position:absolute; pointer-events:none;
  font-family:var(--font-mono); font-size:0.55rem;
  letter-spacing:0.15em; text-transform:uppercase;
  opacity:0.12;
}

/* Large watermark logo in background */
.deco-watermark {
  position:absolute; pointer-events:none; opacity:0.025;
}
.deco-watermark svg { width:100%; height:100%; }

/* ═══════════════════════════════════════════════════
   ANIMATED GEOMETRIC DECORATIONS
   ═══════════════════════════════════════════════════ */

/* Rotating square — slow spin */
.deco-rotate {
  position:absolute; pointer-events:none; opacity:0.05;
  width:80px; height:80px; border:1px solid currentColor;
  animation:decoSpin 30s linear infinite;
}
@keyframes decoSpin { to { transform:rotate(360deg); } }

/* Orbiting dot */
.deco-orbit {
  position:absolute; pointer-events:none; width:100px; height:100px; opacity:0.1;
  animation:decoSpin 20s linear infinite;
}
.deco-orbit::before {
  content:''; position:absolute; top:0; left:50%;
  width:4px; height:4px; border-radius:50%;
  background:var(--accent); transform:translateX(-50%);
}
.deco-orbit::after {
  content:''; position:absolute; inset:10px;
  border:1px solid currentColor; border-radius:50%;
  opacity:0.5;
}

/* Animated line that draws itself */
.deco-line-h {
  position:absolute; height:1px; pointer-events:none;
  background:currentColor; opacity:0.06;
  transform-origin:left; transform:scaleX(0);
}
.deco-line-h.is-visible { animation:drawLineH 1.5s var(--ease-out) forwards; }
@keyframes drawLineH {
  to { transform:scaleX(1); }
}
.deco-line-v {
  position:absolute; width:1px; pointer-events:none;
  background:currentColor; opacity:0.06;
  transform-origin:top; transform:scaleY(0);
}
.deco-line-v.is-visible { animation:drawLineV 1.5s var(--ease-out) forwards; }
@keyframes drawLineV {
  to { transform:scaleY(1); }
}

/* Hexagon */
.deco-hex {
  position:absolute; pointer-events:none; opacity:0.04;
  width:100px; height:100px;
}
.deco-hex::before {
  content:''; display:block; width:100%; height:100%;
  clip-path:polygon(50% 0%, 100% 25%, 100% 75%, 50% 100%, 0% 75%, 0% 25%);
  border:1px solid currentColor;
  background:transparent;
  box-shadow:inset 0 0 0 1px currentColor;
}

/* Concentric rings */
.deco-rings {
  position:absolute; pointer-events:none; opacity:0.04;
}
.deco-rings::before, .deco-rings::after {
  content:''; position:absolute; border:1px solid currentColor; border-radius:50%;
}
.deco-rings::before { inset:0; }
.deco-rings::after { inset:15px; }

/* Dashed circle */
.deco-dashed-circle {
  position:absolute; pointer-events:none; opacity:0.05;
  width:120px; height:120px;
  border:1px dashed currentColor; border-radius:50%;
  animation:decoSpin 40s linear infinite reverse;
}

/* ═══════════════════════════════════════════════════
   FUTURISTIC HUD ELEMENTS
   ═══════════════════════════════════════════════════ */

/* Radar sweep */
.deco-radar {
  position:absolute; pointer-events:none;
  width:200px; height:200px;
}
.deco-radar::before {
  content:''; position:absolute; inset:0;
  border:1px solid currentColor; border-radius:50%; opacity:0.06;
}
.deco-radar::after {
  content:''; position:absolute; top:50%; left:50%;
  width:50%; height:1px; transform-origin:left center;
  background:linear-gradient(90deg, rgba(74,108,247,0.3), transparent);
  animation:radarSweep 4s linear infinite;
}
@keyframes radarSweep {
  from { transform:rotate(0deg); }
  to { transform:rotate(360deg); }
}
.deco-radar .radar-ring {
  position:absolute; border:1px solid currentColor; border-radius:50%; opacity:0.04;
}
.deco-radar .radar-ring--1 { inset:25%; }
.deco-radar .radar-ring--2 { inset:50%; }
.deco-radar .radar-dot {
  position:absolute; width:3px; height:3px; border-radius:50%;
  background:var(--accent); opacity:0;
  animation:radarDot 4s ease-out infinite;
}
@keyframes radarDot {
  0%,20% { opacity:0; }
  25% { opacity:0.8; }
  100% { opacity:0; }
}

/* Targeting reticle */
.deco-reticle {
  position:absolute; pointer-events:none;
  width:60px; height:60px; opacity:0.07;
}
.deco-reticle::before, .deco-reticle::after {
  content:''; position:absolute;
}
.deco-reticle::before {
  inset:0; border:1px solid currentColor; border-radius:50%;
}
.deco-reticle::after {
  inset:20%; border:1px solid currentColor; border-radius:50%;
  animation:reticlePulse 2s ease-in-out infinite;
}
@keyframes reticlePulse {
  0%,100% { transform:scale(1); opacity:1; }
  50% { transform:scale(0.85); opacity:0.5; }
}
.deco-reticle .reticle-h, .deco-reticle .reticle-v {
  position:absolute; background:currentColor;
}
.deco-reticle .reticle-h { width:100%; height:1px; top:50%; }
.deco-reticle .reticle-v { width:1px; height:100%; left:50%; }

/* HUD corner frames */
.deco-hud-corner {
  position:absolute; pointer-events:none; opacity:0.08;
}
.deco-hud-corner::before, .deco-hud-corner::after {
  content:''; position:absolute; background:currentColor;
}
.deco-hud-corner--tl::before { top:0; left:0; width:30px; height:1px; }
.deco-hud-corner--tl::after  { top:0; left:0; width:1px; height:30px; }
.deco-hud-corner--tr::before { top:0; right:0; width:30px; height:1px; }
.deco-hud-corner--tr::after  { top:0; right:0; width:1px; height:30px; }
.deco-hud-corner--bl::before { bottom:0; left:0; width:30px; height:1px; }
.deco-hud-corner--bl::after  { bottom:0; left:0; width:1px; height:30px; }
.deco-hud-corner--br::before { bottom:0; right:0; width:30px; height:1px; }
.deco-hud-corner--br::after  { bottom:0; right:0; width:1px; height:30px; }

/* System status bar */
.hero-status {
  position:absolute; bottom:0; left:0; right:0; z-index:5;
  display:flex; align-items:center; gap:clamp(16px,3vw,40px);
  padding:12px clamp(24px,5vw,72px);
  border-top:1px solid var(--border-faint);
  font-family:var(--font-mono); font-size:0.55rem;
  letter-spacing:0.12em; text-transform:uppercase;
  color:var(--gray-2);
  animation:fadeUp 0.7s 0.8s var(--ease-out) both;
}
.hero-status__item { display:flex; align-items:center; gap:6px; }
.hero-status__dot {
  width:4px; height:4px; border-radius:50%;
}
.hero-status__dot--green { background:#3ecf6e; box-shadow:0 0 6px rgba(62,207,110,0.4); }
.hero-status__dot--blue { background:var(--accent); box-shadow:0 0 6px rgba(74,108,247,0.4); }
.hero-status__dot--amber { background:#f0a030; box-shadow:0 0 6px rgba(240,160,48,0.4); animation:blink 2s ease-in-out infinite; }

/* Data stream — falling characters */
.deco-datastream {
  position:absolute; pointer-events:none; overflow:hidden;
  width:16px; opacity:0.06;
  font-family:var(--font-mono); font-size:0.5rem; line-height:1.4;
  color:var(--accent); writing-mode:vertical-rl;
}
.deco-datastream span {
  display:block;
  animation:streamFall 8s linear infinite;
}
@keyframes streamFall {
  0% { transform:translateY(-100%); opacity:0; }
  10% { opacity:1; }
  90% { opacity:1; }
  100% { transform:translateY(200px); opacity:0; }
}

/* Topographic contour lines */
.deco-topo {
  position:absolute; pointer-events:none; opacity:0.03;
  width:300px; height:300px;
}
.deco-topo::before {
  content:''; position:absolute; inset:0;
  background:
    radial-gradient(ellipse 80% 60% at 50% 50%, transparent 20%, transparent 20.5%, currentColor 20.5%, currentColor 21%, transparent 21%),
    radial-gradient(ellipse 80% 60% at 50% 50%, transparent 35%, transparent 35.5%, currentColor 35.5%, currentColor 36%, transparent 36%),
    radial-gradient(ellipse 80% 60% at 50% 50%, transparent 50%, transparent 50.5%, currentColor 50.5%, currentColor 51%, transparent 51%),
    radial-gradient(ellipse 80% 60% at 50% 50%, transparent 65%, transparent 65.5%, currentColor 65.5%, currentColor 66%, transparent 66%),
    radial-gradient(ellipse 80% 60% at 50% 50%, transparent 80%, transparent 80.5%, currentColor 80.5%, currentColor 81%, transparent 81%);
}

/* Animated gradient border on sections */
.section--light::after {
  content:''; position:absolute; bottom:0; left:0; right:0; height:1px;
  background:linear-gradient(90deg, transparent 0%, var(--accent) 50%, transparent 100%);
  background-size:200% 100%;
  animation:gradientSlide 6s linear infinite;
  opacity:0.15;
}
@keyframes gradientSlide {
  0% { background-position:200% 0; }
  100% { background-position:-200% 0; }
}

/* Parallax-ready depth layers */
.deco-parallax { transition:transform 0.1s linear; will-change:transform; }

/* ═══════════════════════════════════════════════════
   SCROLL REVEAL — Extended
   ═══════════════════════════════════════════════════ */
.reveal {
  opacity:0; transform:translateY(36px);
  transition:opacity 1.2s var(--ease-out), transform 1.2s var(--ease-out);
}
.reveal.is-visible { opacity:1; transform:translateY(0); }
.reveal-d1 { transition-delay:0.2s; }
.reveal-d2 { transition-delay:0.4s; }
.reveal-d3 { transition-delay:0.6s; }
.reveal-d4 { transition-delay:0.8s; }

/* Slide from left */
.reveal-left {
  opacity:0; transform:translateX(-80px);
  transition:opacity 1.4s var(--ease-out), transform 1.4s var(--ease-out);
}
.reveal-left.is-visible { opacity:1; transform:translateX(0); }

/* Slide from right */
.reveal-right {
  opacity:0; transform:translateX(80px);
  transition:opacity 1.4s var(--ease-out), transform 1.4s var(--ease-out);
}
.reveal-right.is-visible { opacity:1; transform:translateX(0); }

/* Scale up */
.reveal-scale {
  opacity:0; transform:scale(0.9);
  transition:opacity 1.2s var(--ease-out), transform 1.2s var(--ease-out);
}
.reveal-scale.is-visible { opacity:1; transform:scale(1); }

/* Clip reveal — wipes in from left */
.reveal-clip {
  clip-path:inset(0 100% 0 0);
  transition:clip-path 1.4s var(--ease-out);
}
.reveal-clip.is-visible { clip-path:inset(0 0 0 0); }

/* Stagger children — each child animates in sequence */
.stagger-children > * {
  opacity:0; transform:translateY(24px);
  transition:opacity 0.8s var(--ease-out), transform 0.8s var(--ease-out);
}
.stagger-children.is-visible > *:nth-child(1) { transition-delay:0.1s; opacity:1; transform:translateY(0); }
.stagger-children.is-visible > *:nth-child(2) { transition-delay:0.25s; opacity:1; transform:translateY(0); }
.stagger-children.is-visible > *:nth-child(3) { transition-delay:0.4s; opacity:1; transform:translateY(0); }
.stagger-children.is-visible > *:nth-child(4) { transition-delay:0.55s; opacity:1; transform:translateY(0); }
.stagger-children.is-visible > *:nth-child(5) { transition-delay:0.7s; opacity:1; transform:translateY(0); }
.stagger-children.is-visible > *:nth-child(6) { transition-delay:0.85s; opacity:1; transform:translateY(0); }
.stagger-children.is-visible > *:nth-child(7) { transition-delay:1.0s; opacity:1; transform:translateY(0); }
.stagger-children.is-visible > *:nth-child(8) { transition-delay:1.15s; opacity:1; transform:translateY(0); }

/* ═══════════════════════════════════════════════════
   PALANTIR-STYLE ANIMATIONS
   ═══════════════════════════════════════════════════ */

/* Typing cursor for deco-coord */
.deco-coord--typed::after {
  content:'█'; animation:cursorBlink 1s step-end infinite;
  margin-left:2px;
}
@keyframes cursorBlink { 0%,100%{opacity:1;} 50%{opacity:0;} }

/* Pulsing rings on crosshairs */
.deco-cross--pulse::after {
  content:''; position:absolute; top:50%; left:50%;
  width:32px; height:32px; border-radius:50%;
  border:1px solid currentColor; opacity:0;
  transform:translate(-50%,-50%) scale(0.5);
  animation:crossPulse 3s ease-out infinite;
}
@keyframes crossPulse {
  0% { transform:translate(-50%,-50%) scale(0.5); opacity:0.3; }
  100% { transform:translate(-50%,-50%) scale(2); opacity:0; }
}

/* Ambient floating particles */
.deco-particle {
  position:absolute; width:2px; height:2px;
  background:var(--accent); border-radius:50%;
  pointer-events:none; opacity:0;
  animation:particleFloat 12s ease-in-out infinite;
}
@keyframes particleFloat {
  0%   { opacity:0; transform:translateY(0) translateX(0); }
  10%  { opacity:0.3; }
  50%  { opacity:0.15; transform:translateY(-80px) translateX(20px); }
  90%  { opacity:0.3; }
  100% { opacity:0; transform:translateY(-160px) translateX(-10px); }
}

/* Service block number animation */
.svc-block__num {
  opacity:0;
  animation:numReveal 1s var(--ease-out) forwards;
}
.svc-block.is-visible .svc-block__num { opacity:1; }
@keyframes numReveal {
  0% { opacity:0; transform:translateY(20px); filter:blur(8px); }
  60% { filter:blur(0); }
  100% { opacity:1; transform:translateY(0); }
}

/* Timeline step hover glow */
.timeline__step::before {
  content:''; position:absolute; top:0; left:0; right:0; height:2px;
  background:linear-gradient(90deg, transparent, var(--accent), transparent);
  opacity:0; transition:opacity 0.4s;
}
.timeline__step:hover::before { opacity:0.3; }
.section--light .timeline__step::before {
  background:linear-gradient(90deg, transparent, var(--accent), transparent);
}

/* ═══════════════════════════════════════════════════
   SERVICE BLOCK — Component assembly animations
   ═══════════════════════════════════════════════════ */

/* Number — glitch count up */
.svc-block .svc-block__num {
  opacity:0; transform:translateX(-30px); filter:blur(6px);
  transition:none;
}
.svc-block.is-visible .svc-block__num {
  animation:svcNumAssemble 1.3s 0.2s var(--ease-out) forwards;
}
@keyframes svcNumAssemble {
  0%   { opacity:0; transform:translateX(-30px); filter:blur(6px); }
  30%  { opacity:0.15; transform:translateX(5px); filter:blur(0); }
  35%  { opacity:0; transform:translateX(-8px); }
  50%  { opacity:0.3; transform:translateX(2px); }
  55%  { opacity:0.1; }
  70%  { opacity:1; transform:translateX(0); }
  100% { opacity:1; transform:translateX(0); filter:blur(0); }
}

/* Title — typewriter slide */
.svc-block .svc-block__title {
  opacity:0; transform:translateY(16px);
  transition:none;
}
.svc-block.is-visible .svc-block__title {
  animation:svcTitleIn 1.0s 0.6s var(--ease-out) forwards;
}
@keyframes svcTitleIn {
  0%   { opacity:0; transform:translateY(16px); clip-path:inset(0 100% 0 0); }
  100% { opacity:1; transform:translateY(0); clip-path:inset(0 0 0 0); }
}

/* Description text — fade in */
.svc-block .svc-block__text {
  opacity:0;
  transition:none;
}
.svc-block.is-visible .svc-block__text {
  animation:svcTextIn 1.0s 1.0s var(--ease-out) forwards;
}
@keyframes svcTextIn {
  0%   { opacity:0; transform:translateY(10px); }
  100% { opacity:1; transform:translateY(0); }
}

/* Tags — pop in one by one */
.svc-block .tags .tag {
  opacity:0; transform:scale(0.7) translateY(8px);
  transition:none;
}
.svc-block.is-visible .tags .tag {
  animation:tagPop 0.5s var(--ease-out) forwards;
}
.svc-block.is-visible .tags .tag:nth-child(1) { animation-delay:1.3s; }
.svc-block.is-visible .tags .tag:nth-child(2) { animation-delay:1.42s; }
.svc-block.is-visible .tags .tag:nth-child(3) { animation-delay:1.54s; }
.svc-block.is-visible .tags .tag:nth-child(4) { animation-delay:1.66s; }
.svc-block.is-visible .tags .tag:nth-child(5) { animation-delay:1.78s; }
.svc-block.is-visible .tags .tag:nth-child(6) { animation-delay:1.9s; }
.svc-block.is-visible .tags .tag:nth-child(7) { animation-delay:2.02s; }
.svc-block.is-visible .tags .tag:nth-child(8) { animation-delay:2.14s; }
@keyframes tagPop {
  0%   { opacity:0; transform:scale(0.7) translateY(8px); }
  60%  { transform:scale(1.05) translateY(0); }
  100% { opacity:1; transform:scale(1) translateY(0); }
}

/* Feature rows — slide in from the side with stagger */
.svc-block .svc-features .svc-feat {
  opacity:0;
  transition:none;
}
/* Normal blocks: features slide from right */
.svc-block.is-visible .svc-features .svc-feat {
  animation:featSlideRight 0.8s var(--ease-out) forwards;
}
/* Reversed blocks: features slide from left */
.svc-block--reverse.is-visible .svc-features .svc-feat {
  animation:featSlideLeft 0.8s var(--ease-out) forwards;
}
.svc-block.is-visible .svc-features .svc-feat:nth-child(1) { animation-delay:0.4s; }
.svc-block.is-visible .svc-features .svc-feat:nth-child(2) { animation-delay:0.6s; }
.svc-block.is-visible .svc-features .svc-feat:nth-child(3) { animation-delay:0.8s; }
.svc-block.is-visible .svc-features .svc-feat:nth-child(4) { animation-delay:1.0s; }
.svc-block.is-visible .svc-features .svc-feat:nth-child(5) { animation-delay:1.2s; }

@keyframes featSlideRight {
  0%   { opacity:0; transform:translateX(40px); }
  100% { opacity:1; transform:translateX(0); }
}
@keyframes featSlideLeft {
  0%   { opacity:0; transform:translateX(-40px); }
  100% { opacity:1; transform:translateX(0); }
}

/* Feature icon — rotate in */
.svc-block .svc-feat__icon {
  opacity:0;
  transition:none;
}
.svc-block.is-visible .svc-feat__icon {
  animation:iconSpin 0.9s var(--ease-out) forwards;
}
@keyframes iconSpin {
  0%   { opacity:0; transform:rotateY(90deg) scale(0.5); }
  100% { opacity:1; transform:rotateY(0deg) scale(1); }
}

/* Feature border — draws itself */
.svc-block .svc-features {
  clip-path:inset(0 0 100% 0);
  transition:none;
}
.svc-block.is-visible .svc-features {
  animation:featBoxReveal 1.2s 0.2s var(--ease-out) forwards;
}
@keyframes featBoxReveal {
  0%   { clip-path:inset(0 0 100% 0); }
  100% { clip-path:inset(0 0 0 0); }
}

/* Reason card hover accent line */
.reason::before {
  content:''; position:absolute; top:0; left:0; bottom:0; width:2px;
  background:var(--accent); opacity:0; transition:opacity 0.4s;
}
.reason:hover::before { opacity:0.5; }