/* JS Artisan Beauté — brand tokens. Shared contract: do not rename anything here. */

/* Fonts: Latin subset, WOFF2. Sources are kept outside the site in ../website-font-sources. */
@font-face { font-family: "Newsreader"; src: url("../assets/fonts/Newsreader.woff2") format("woff2"); font-weight: 300 500; font-style: normal; font-display: swap; }
@font-face { font-family: "IBM Plex Mono"; src: url("../assets/fonts/IBMPlexMono-Regular.woff2") format("woff2"); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: "IBM Plex Mono"; src: url("../assets/fonts/IBMPlexMono-Medium.woff2") format("woff2"); font-weight: 500; font-style: normal; font-display: swap; }

:root {
  /* the three brand colours */
  --manzanita: #3A1014;   /* oxblood: the dark */
  --fog: #ECE9E3;         /* the light */
  --reagent: #D6DD45;     /* the one signal colour: shapes only, never small text on fog */

  /* two voices */
  --font-text: "Newsreader", Georgia, "Times New Roman", serif;          /* reading text */
  --font-lab: "IBM Plex Mono", ui-monospace, "SFMono-Regular", monospace; /* facts, labels, references */

  /* the horizon: where the sun rests in the opening scene, measured from the top of the stage */
  --horizon: 44%;

  /* layout */
  --measure: 34rem;                       /* comfortable line length for reading text */
  --gutter: clamp(1.25rem, 5vw, 5rem);
  --hair: 1px;
}

/* Each section names its sky. That sets its paper, its ink and the sun colour. */
[data-sky="night"]   { --paper: var(--manzanita); --ink: var(--fog);       --sun: var(--reagent);   --rule: rgba(236, 233, 227, .28); }
[data-sky="fog"]     { --paper: var(--fog);       --ink: var(--manzanita); --sun: var(--manzanita); --rule: rgba(58, 16, 20, .22); }
[data-sky="reagent"] { --paper: var(--reagent);   --ink: var(--manzanita); --sun: var(--manzanita); --rule: rgba(58, 16, 20, .30); }