:root {
  /* Primary Dark Base */
  --midnight-navy: #0B1D2E;
  --blueprint-navy: #112A42;
  --deep-indigo: #1A2F4A;

  /* Gold Accent System */
  --warm-eng-gold: #C8A24F;
  --soft-metallic-gold: #D8B96A;
  --muted-brass: #B38A3D;

  /* UI Neutrals */
  --systems-white: #F8F9FA;
  --technical-gray: #8BA1B5;
  --line-color: rgba(139, 161, 181, 0.2);
  --overlay-bg: rgba(11, 29, 46, 0.85);

  /* Typography */
  --font-sans: 'Inter', system-ui, -apple-system, sans-serif;
  --font-mono: 'JetBrains Mono', 'Fira Code', monospace;

  /* Layout */
  --container-width: 1200px;
  --grid-gap: 24px;
  --section-padding: 96px 0;
}

*, *::before, *::after {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

body {
  font-family: var(--font-sans);
  background-color: var(--midnight-navy);
  color: var(--systems-white);
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
  position: relative;
  overflow-x: hidden;
}

/* Swiss Design Alignment & Grid */
.container {
  width: 100%;
  max-width: var(--container-width);
  margin: 0 auto;
  padding: 0 24px;
  position: relative;
  z-index: 2;
}

/* Typography Scale */
h1, h2, h3, h4, h5, h6 {
  font-weight: 400;
  letter-spacing: -0.02em;
  margin-bottom: 0.5em;
  color: var(--systems-white);
  line-height: 1.2;
}

h1 { font-size: 3.5rem; letter-spacing: -0.03em; }
h2 { font-size: 2.5rem; }
h3 { font-size: 1.75rem; }

p {
  color: var(--technical-gray);
  margin-bottom: 1.5em;
  font-size: 1.125rem;
  max-width: 65ch;
}

a {
  color: var(--soft-metallic-gold);
  text-decoration: none;
  transition: color 0.3s ease;
}

a:hover {
  color: var(--warm-eng-gold);
}

/* Signal Routing Lines & Dividers */
hr {
  border: none;
  height: 1px;
  background-color: var(--line-color);
  margin: 48px 0;
  position: relative;
}

.signal-line {
  position: relative;
  width: 100%;
  height: 1px;
  background: var(--line-color);
}
.signal-line::before {
  content: '';
  position: absolute;
  left: 0;
  top: -2px;
  width: 5px;
  height: 5px;
  background: var(--warm-eng-gold);
  border-radius: 50%;
}

.blueprint-grid-bg {
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  background-image: 
    linear-gradient(var(--line-color) 1px, transparent 1px),
    linear-gradient(90deg, var(--line-color) 1px, transparent 1px);
  background-size: 40px 40px;
  background-position: center;
  z-index: 0;
  opacity: 0.15;
  pointer-events: none;
}