/* Super Soldier — the Eden vault lab at night: electric serum cyan on abyss navy, Eden ultraviolet,
   hazard amber and alarm red (matches the procedural art in art/). Tokens + the concept-art gallery. */
:root {
  --bg: #050b13;
  --bg-rgb: 5, 11, 19;
  --bg-2: #08121d;
  --panel: #0c1826;
  --panel-2: #122236;
  --footer-bg: #03070d;
  --line: rgba(120, 220, 255, 0.15);
  --text: #e8f4fa;
  --muted: #a6bfcc;
  --dim: #7590a0;
  --red: #ff3347;
  --red-deep: #c4202f;
  --ochre: #45e3ff;
  --ochre-soft: #9cf0ff;
  --gum: #ffb21e;
  --violet: #9b72ff;
  --display: "Orbitron", "Arial Black", sans-serif;
  --body: "Lato", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --radius: 6px;
  --wrap: 1180px;
  --gutter: clamp(16px, 4vw, 40px);
}
h1, h2, h3, h4 { letter-spacing: 0.03em; line-height: 1.15; font-weight: 800; }
h1 { font-size: clamp(2rem, 4.6vw, 3.4rem); }
h2 { font-size: clamp(1.6rem, 3.2vw, 2.4rem); }
.btn { font-size: .95rem; letter-spacing: .08em; font-weight: 800; }
.hero h1 { font-size: clamp(1.3rem, 2.6vw, 2rem); }
.soon-badge { border-color: var(--gum); color: var(--gum); }
.frame { box-shadow: 0 30px 60px -30px rgba(0,0,0,.8), 0 0 50px -18px rgba(69, 227, 255, .35); }
/* Concept-art gallery (build-teaser IMAGES.gallery) */
.gallery-section .gallery { gap: 18px; }
.gallery-section .gallery img { aspect-ratio: 4 / 3; }
.gallery-section .gallery figure { transition: border-color .2s, box-shadow .2s; }
.gallery-section .gallery figure:hover { border-color: rgba(69, 227, 255, .45); box-shadow: 0 0 34px -12px rgba(69, 227, 255, .5); }
.gallery-section .gallery figcaption { color: var(--muted); border-top: 1px solid var(--line); }
.gallery-section .gallery { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.gallery-section .gallery-item:nth-child(-n+2) { grid-column: span 2; }
@media (max-width: 1000px) { .gallery-section .gallery { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 560px) { .gallery-section .gallery { grid-template-columns: 1fr; } .gallery-section .gallery-item:nth-child(-n+2) { grid-column: auto; } }
@media (max-width: 520px) { .hero h1 { letter-spacing: .03em; } .hero .strap { letter-spacing: .1em; } }
.teaser-hero .hero-media img { object-position: 68% 50%; }