questions/custom.css

/* Westra Engineering — a quiet skin over the default portal stylesheet
   (site.yaml `stylesheet`), drawn from the logo: navy and slate on
   concrete. */

:root {
  /* The wordmark's navy, as the accent. */
  --accent: #22304f;
  --accent-soft: rgba(34, 48, 79, 0.12);
  /* Concrete paper, steel ink. */
  --paper: #eceae6;
  --ink: #1c1f24;
  --ink-dim: #5c626b;
  --line: #c7c4bd;
  --card-bg: rgba(255, 255, 255, 0.6);
  --card-bg-opaque: rgba(255, 255, 255, 0.92);
  --card-shadow: rgba(28, 31, 36, 0.16);
  --hero-glow: rgba(236, 234, 230, 0.85);
}

@media (prefers-color-scheme: dark) {
  :root {
    /* The lighter slate reads on the dark ground. */
    --accent: #8c9cc0;
    --accent-soft: rgba(140, 156, 192, 0.16);
    --paper: #16181c;
    --ink: #e7e4dd;
    --ink-dim: #999a9a;
    --line: #33373d;
    --card-bg: rgba(32, 35, 40, 0.55);
    --card-bg-opaque: rgba(32, 35, 40, 0.92);
    --hero-glow: rgba(22, 24, 28, 0.85);
  }
}

.hero-copy h1 {
  font-weight: 800;
  letter-spacing: -0.01em;
}

/* Feature icons carry the accent; a slate left edge grounds each card,
   echoing the wordmark's ribbon. */
.feature-icon { color: var(--accent); }
.alt-card {
  border-left: 0.2rem solid #5c6a8f;
}

.alt-submit {
  border-radius: 0.4rem;
  letter-spacing: 0.01em;
}