/* Cervana docs — the SAME editorial system as the console (services/console/
   src/styles.css): warm ivory paper, Fraunces display with true italics,
   Inter body, Poppins wordmark, IBM Plex Mono metadata. All fonts are
   self-hosted files sitting right next to this stylesheet — zero CDN calls,
   the DH1 no-external-fetch posture that this whole site is built on. */

@font-face {
  font-family: "Fraunces Var";
  src: url("./fraunces-normal.woff2") format("woff2");
  font-weight: 300 600;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Fraunces Var";
  src: url("./fraunces-italic.woff2") format("woff2");
  font-weight: 300 600;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: "Inter Var";
  src: url("./inter.woff2") format("woff2");
  font-weight: 380 620;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Plex Mono";
  src: url("./plex-mono.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Poppins";
  src: url("./poppins-500.woff2") format("woff2");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Poppins";
  src: url("./poppins-600.woff2") format("woff2");
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}

:root {
  --ivory: #f7f3ec;
  --ivory-deep: #f2eee7;
  --surface: #fcfbf8;
  --card: #ffffff;
  --line: #e9e3da;
  --hairline: rgba(80, 70, 60, 0.08);
  --ink: #22211f;
  --ink-soft: #6f6b66;
  --ink-mute: #a39d95;
  --mist: #d8e8f5;
  --mist-deep: #4f6b82;
  --lavender: #dccff1;
  --sage: #dce8d5;
  --sage-deep: #5c7050;
  --sand: #e8ddce;
  --sand-deep: #85715a;
  --terracotta: #d9b8ae;
  --terracotta-deep: #96604f;
  --peach: #f1dccf;
  --shadow-paper: 0 12px 40px rgba(30, 25, 20, 0.04);
  --shadow-lift: 0 24px 60px rgba(30, 25, 20, 0.08), 0 4px 14px rgba(30, 25, 20, 0.03);
  --ease: cubic-bezier(0.22, 1, 0.36, 1);
}

* { box-sizing: border-box; }

html, body { height: 100%; }

body {
  margin: 0;
  background: var(--ivory);
  color: var(--ink);
  font-family: "Inter Var", ui-sans-serif, system-ui, -apple-system, sans-serif;
  -webkit-font-smoothing: antialiased;
  position: relative;
}

.font-display { font-family: "Fraunces Var", Georgia, serif; font-variation-settings: "opsz" 60, "SOFT" 60; letter-spacing: -0.015em; }
.font-display em { font-style: italic; }

/* Enormous blurred daylight clouds — the same ambient light as the console,
   built from pure CSS so this static site needs zero extra image assets. */
.light-field {
  position: fixed; inset: -20%; z-index: 0; pointer-events: none;
  filter: blur(90px);
}
.light-field i { position: absolute; border-radius: 9999px; }

.rule-fade {
  height: 1px;
  background: linear-gradient(to right, transparent, rgba(80,70,60,.16) 15%, rgba(80,70,60,.16) 85%, transparent);
}

::selection { background: var(--sand); color: var(--ink); }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .01ms !important; transition-duration: .01ms !important; }
}