/* CelesticLabs Orbital — Retro film layer (site-wide) */

:root {
  --retro-sepia: 0.18;
  --retro-hue: -6deg;
  --retro-saturate: 0.88;
  --retro-contrast: 1.06;
  --retro-scanline-opacity: 0.07;
  --retro-scanline-gap: 4px;
  --retro-grain-opacity: 0.14;
  --retro-grain-size: 180px;
  --retro-warm: rgba(255, 196, 120, 0.05);
  --retro-cool: rgba(120, 160, 220, 0.035);
  --retro-vignette: rgba(18, 10, 6, 0.28);
  --retro-overlay-opacity: 0.42;
  --retro-media-filter: brightness(0.58) contrast(1.14) saturate(0.68) sepia(0.22) hue-rotate(-6deg);
  --retro-media-dark: brightness(0.22) contrast(1.1) saturate(0.58) sepia(0.25) hue-rotate(-6deg) blur(0.5px);
  --retro-media-dim: brightness(0.35) contrast(1.08) saturate(0.62) sepia(0.2) hue-rotate(-6deg);
  --retro-photo-filter: contrast(1.05) saturate(0.82) sepia(0.12) hue-rotate(-4deg);
}

/* Film grain */
body::before {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: 9997;
  opacity: var(--retro-grain-opacity);
  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.85' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.5'/%3E%3C/svg%3E");
  background-size: var(--retro-grain-size) var(--retro-grain-size);
}

/* Scanlines, vignette, warm/cool wash */
body::after {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: 9998;
  opacity: var(--retro-overlay-opacity);
  mix-blend-mode: soft-light;
  background:
    repeating-linear-gradient(
      0deg,
      rgba(0, 0, 0, var(--retro-scanline-opacity)) 0,
      rgba(0, 0, 0, var(--retro-scanline-opacity)) 1px,
      transparent 1px,
      transparent var(--retro-scanline-gap)
    ),
    radial-gradient(ellipse at center, transparent 52%, var(--retro-vignette) 100%),
    linear-gradient(135deg, var(--retro-warm) 0%, transparent 45%, var(--retro-cool) 100%);
}

/* Video / cinematic media */
.retro-media {
  filter: var(--retro-media-filter);
}

.retro-media--dark {
  filter: var(--retro-media-dark);
}

.retro-media--dim {
  filter: var(--retro-media-dim);
}

/* Still photography */
.retro-photo {
  filter: var(--retro-photo-filter);
}

/* Optional extra layer on media-heavy sections */
.retro-overlay {
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: 2;
  opacity: 0.35;
  mix-blend-mode: soft-light;
  background:
    repeating-linear-gradient(
      0deg,
      rgba(0, 0, 0, 0.06) 0,
      rgba(0, 0, 0, 0.06) 1px,
      transparent 1px,
      transparent 4px
    ),
    radial-gradient(ellipse at center, transparent 50%, rgba(18, 10, 6, 0.25) 100%);
}

@media (prefers-reduced-motion: reduce) {
  body::before,
  body::after,
  .retro-overlay {
    display: none;
  }

  .retro-media,
  .retro-media--dark,
  .retro-media--dim,
  .retro-photo {
    filter: none;
  }
}

@media print {
  body::before,
  body::after,
  .retro-overlay {
    display: none !important;
  }
}