/* ForensiCore — Digital Forensics theme (static HTML build) */

:root {
  --radius: 0.75rem;

  --background: 0.16 0.03 264;
  --foreground: 0.97 0.01 247;
  --card: 0.21 0.035 264;
  --card-foreground: 0.97 0.01 247;
  --popover: 0.19 0.035 264;
  --popover-foreground: 0.97 0.01 247;
  --primary: 0.72 0.14 200;
  --primary-foreground: 0.16 0.03 264;
  --secondary: 0.27 0.04 260;
  --secondary-foreground: 0.97 0.01 247;
  --muted: 0.27 0.04 260;
  --muted-foreground: 0.7 0.03 256;
  --accent: 0.72 0.14 200;
  --accent-foreground: 0.16 0.03 264;
  --success: 0.72 0.16 162;
  --success-foreground: 0.16 0.03 264;
  --destructive: 0.62 0.22 25;
  --destructive-foreground: 0.97 0.01 247;
  --border: 0.32 0.04 258;
  --input: 0.3 0.04 258;
  --ring: 0.72 0.14 200;

  --cyber-gradient: linear-gradient(135deg, oklch(0.16 0.03 264) 0%, oklch(0.21 0.05 250) 50%, oklch(0.18 0.04 200) 100%);
  --accent-glow: 0 0 0 1px oklch(0.72 0.14 200 / 0.3), 0 0 30px -8px oklch(0.72 0.14 200 / 0.55);
  --shadow-cyber: 0 20px 50px -20px oklch(0.05 0.02 264 / 0.8);
}

.light {
  --background: 0.985 0.005 247;
  --foreground: 0.18 0.03 264;
  --card: 1 0 0;
  --card-foreground: 0.18 0.03 264;
  --popover: 1 0 0;
  --popover-foreground: 0.18 0.03 264;
  --primary: 0.55 0.13 200;
  --primary-foreground: 0.99 0 0;
  --secondary: 0.95 0.01 247;
  --secondary-foreground: 0.2 0.03 264;
  --muted: 0.95 0.01 247;
  --muted-foreground: 0.45 0.03 256;
  --accent: 0.55 0.13 200;
  --accent-foreground: 0.99 0 0;
  --success: 0.6 0.15 162;
  --success-foreground: 0.99 0 0;
  --destructive: 0.58 0.22 25;
  --destructive-foreground: 0.99 0 0;
  --border: 0.9 0.01 255;
  --input: 0.9 0.01 255;
  --ring: 0.55 0.13 200;
  --cyber-gradient: linear-gradient(135deg, oklch(0.97 0.01 247) 0%, oklch(0.93 0.03 200) 100%);
  --accent-glow: 0 0 0 1px oklch(0.55 0.13 200 / 0.2), 0 0 24px -10px oklch(0.55 0.13 200 / 0.4);
  --shadow-cyber: 0 20px 50px -25px oklch(0.5 0.05 264 / 0.25);
}

* {
  border-color: oklch(var(--border));
}
html {
  scroll-behavior: smooth;
}
body {
  background-color: oklch(var(--background));
  color: oklch(var(--foreground));
  font-family: "Inter", ui-sans-serif, system-ui, sans-serif;
  -webkit-font-smoothing: antialiased;
}
h1, h2, h3, h4, h5 {
  font-family: "Outfit", ui-sans-serif, system-ui, sans-serif;
  letter-spacing: -0.02em;
}

/* Component helpers */
.section-padding { padding-top: 5rem; padding-bottom: 5rem; }
@media (min-width: 768px) { .section-padding { padding-top: 7rem; padding-bottom: 7rem; } }

.cyber-gradient { background: var(--cyber-gradient); }
.shadow-cyber { box-shadow: var(--shadow-cyber); }
.glow-accent { box-shadow: var(--accent-glow); }

.text-gradient {
  background: linear-gradient(90deg, oklch(var(--foreground)), oklch(var(--accent)));
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

.card-forensics {
  position: relative;
  border-radius: 0.75rem;
  border: 1px solid oklch(var(--border));
  background-color: oklch(var(--card));
  padding: 1.5rem;
  transition: all 0.3s ease;
}
.card-forensics:hover {
  transform: translateY(-0.375rem);
  border-color: oklch(var(--accent) / 0.4);
  box-shadow: var(--accent-glow);
}

/* Cyber grid + scanline backdrop */
.cyber-grid {
  background-image:
    linear-gradient(to right, oklch(0.72 0.14 200 / 0.06) 1px, transparent 1px),
    linear-gradient(to bottom, oklch(0.72 0.14 200 / 0.06) 1px, transparent 1px);
  background-size: 44px 44px;
}

@keyframes scanline {
  0% { transform: translateY(-100%); }
  100% { transform: translateY(100vh); }
}
.scanline::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(to bottom, transparent, oklch(0.72 0.14 200 / 0.12), transparent);
  height: 30%;
  animation: scanline 4s linear infinite;
  pointer-events: none;
}

@keyframes pulse-ring {
  0% { box-shadow: 0 0 0 0 oklch(0.72 0.14 200 / 0.5); }
  70% { box-shadow: 0 0 0 12px oklch(0.72 0.14 200 / 0); }
  100% { box-shadow: 0 0 0 0 oklch(0.72 0.14 200 / 0); }
}
.pulse-ring { animation: pulse-ring 2s infinite; }

/* Scroll reveal */
.reveal {
  opacity: 0;
  transform: translateY(28px);
  transition: opacity 0.7s cubic-bezier(0.16, 1, 0.3, 1), transform 0.7s cubic-bezier(0.16, 1, 0.3, 1);
}
.reveal.reveal-left { transform: translateX(40px); }
.reveal.reveal-right { transform: translateX(-40px); }
.reveal.reveal-zoom { transform: scale(0.92); }
.reveal.is-visible {
  opacity: 1;
  transform: translate(0, 0) scale(1);
}

/* Preloader */
#preloader {
  position: fixed;
  inset: 0;
  z-index: 100;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  background: #020617;
  transition: opacity 0.5s ease;
}
#preloader.done { opacity: 0; pointer-events: none; }

[data-lucide] { width: 1em; height: 1em; }

/* Sticky header */
#site-header {
  position: sticky;
  top: 0;
  z-index: 50;
  transition: all 0.3s ease;
  background: transparent;
}
#site-header.scrolled {
  border-bottom: 1px solid oklch(var(--border));
  background: oklch(var(--background) / 0.85);
  backdrop-filter: blur(16px);
}
html,
body {
    overflow-x: hidden;
}