/* Brownlee Tech Services — shared styles.
   Load order: tokens, fonts, base, then per-page sections.
   Palette and type rules come from docs/superpowers/specs/
   2026-08-25-brownlee-visual-identity-design.md §2. */

/* ---------------------------------------------------------------- tokens */

:root {
  --paper: #FBF7F2;
  --sand: #EDE4D8;
  --moss: #4A6B4F;
  --terracotta: #C4703F;
  --ink: #2A2320;

  /* Lightened accents for dark surfaces, where the base tones fail AA. */
  --moss-light: #9CBFA2;
  --terracotta-light: #E08B57;

  --font-display: "Fraunces", Georgia, "Times New Roman", serif;
  --font-body: "DM Sans", system-ui, -apple-system, "Segoe UI", sans-serif;
}

/* ----------------------------------------------------------------- fonts */

/* Fraunces — SIL Open Font License 1.1. Self-hosted so the site makes no
   third-party requests. This file is subset to the wordmark's glyphs only;
   see site/README.md before using it for body copy. */
@font-face {
  font-family: "Fraunces";
  src: url("fonts/Fraunces-wordmark.woff2") format("woff2");
  font-weight: 100 900;
  font-display: swap;
}

/* ------------------------------------------------------------------ base */

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

html,
body {
  height: 100%;
  margin: 0;
}

body {
  background: var(--paper);
  color: var(--ink);
  font-family: var(--font-body);
  -webkit-font-smoothing: antialiased;
}

/* ---------------------------------------------------------------- splash */

/* The landing page: the wordmark alone, filling the viewport. */

.splash {
  display: grid;
  place-items: center;
  min-height: 100%;
  padding: 0 4vw;
}

.splash__wordmark {
  margin: 0;
  font-family: var(--font-display);
  font-variation-settings: "SOFT" 40, "WONK" 1, "opsz" 144;
  font-weight: 600;
  letter-spacing: -0.015em;
  line-height: 1;
  /* Fills the viewport width without overflowing short or landscape screens. */
  font-size: min(14.2vw, 46vh);
  text-align: center;
  text-wrap: nowrap;
}

/* Terracotta carries the dot — the support accent, present on every surface
   without outweighing moss. */
.splash__dot { color: var(--terracotta); }
.splash__tld { color: var(--moss); }

@media (prefers-color-scheme: dark) {
  body {
    background: var(--ink);
    color: var(--paper);
  }

  .splash__dot { color: var(--terracotta-light); }
  .splash__tld { color: var(--moss-light); }
}