/* ==========================================================================
   Nicolas Emmenegger — design tokens
   One place for colour, type, space and timing. Change here, changes everywhere.
   ========================================================================== */

:root {
  /* ---- Type ------------------------------------------------------------
     Two faces, each doing the job it is good at.

     Display is a book serif — the lettering of a printed programme note or a
     record sleeve. It is a system stack rather than a webfont: every platform
     already ships something in this family, so headings render on the first
     paint with no download and no layout shift.

     Body is Raleway, self-hosted (two woff2 files, ~80 KB, variable across
     200–800). Wide, quiet, and legible at the small sizes the concert list
     and the track listings run at. */
  --font-display: "Iowan Old Style", "Palatino Linotype", "Book Antiqua",
                  Palatino, "Georgia", "Times New Roman", serif;
  --font-body:    "Raleway", ui-sans-serif, system-ui, "Segoe UI", Arial, sans-serif;
  --font-mono:    "Raleway", ui-sans-serif, system-ui, "Segoe UI", Arial, sans-serif;

  /* Fluid type scale — clamps between 360px and 1600px viewports */
  --fs-xs:    clamp(0.72rem, 0.70rem + 0.10vw, 0.78rem);
  --fs-sm:    clamp(0.82rem, 0.79rem + 0.14vw, 0.92rem);
  --fs-base:  clamp(0.98rem, 0.94rem + 0.20vw, 1.08rem);
  --fs-md:    clamp(1.10rem, 1.03rem + 0.34vw, 1.30rem);
  --fs-lg:    clamp(1.34rem, 1.18rem + 0.72vw, 1.85rem);
  --fs-xl:    clamp(1.75rem, 1.38rem + 1.65vw, 2.90rem);
  --fs-2xl:   clamp(2.30rem, 1.55rem + 3.25vw, 4.60rem);
  --fs-3xl:   clamp(2.85rem, 1.55rem + 5.70vw, 7.00rem);

  --lh-tight: 1.08;
  --lh-snug: 1.3;
  --lh-body: 1.7;

  --tracking-wide: 0.16em;
  --tracking-wider: 0.28em;

  /* ---- Space (8pt-ish, fluid at the top end) --------------------------- */
  --sp-1: 0.25rem;
  --sp-2: 0.5rem;
  --sp-3: 0.75rem;
  --sp-4: 1rem;
  --sp-5: 1.5rem;
  --sp-6: 2rem;
  --sp-7: 3rem;
  --sp-8: clamp(3rem, 6vw, 5rem);
  --sp-9: clamp(4rem, 10vw, 8rem);
  --sp-10: clamp(6rem, 14vw, 12rem);

  --gutter: clamp(1.15rem, 4vw, 3.5rem);
  --measure: 64ch;
  --max-w: 1280px;
  --max-w-text: 700px;

  /* ---- Radius ------------------------------------------------------------
     Everything is square — the geometry of a printed programme, not an app.
     Kept as tokens so the whole site's shape stays a one-line decision. */
  --r-sm: 0;
  --r-md: 0;
  --r-lg: 0;
  --r-pill: 0;

  /* ---- Motion ---------------------------------------------------------- */
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
  --t-fast: 160ms;
  --t-mid: 340ms;
  --t-slow: 700ms;

  --z-bg: 0;
  --z-content: 10;
  --z-header: 60;
  --z-modal: 100;
}

/* ---- Palette ------------------------------------------------------------
   One theme: the hall with the house lights down. Near-black with a little
   blue in it, warm off-white type the colour of programme paper, and brass
   for anything that asks to be looked at — dates, links, the leading rule.

   There is no light variant and no toggle. A recital site is read in the
   evening, on a phone, on the way to a concert; it should look like the room
   the visitor is walking into.
   ------------------------------------------------------------------------ */
:root {
  --c-bg:        #0a0b0e;
  --c-bg-raise:  #101218;
  --c-bg-sink:   #06070a;
  --c-surface:   #14161d;
  --c-surface-2: #1c1f28;

  --c-text:      #f4f1ea;
  --c-text-soft: #b6b2a8;
  --c-text-mute: #85827b;

  --c-line:      rgba(244, 241, 234, 0.13);
  --c-line-str:  rgba(244, 241, 234, 0.28);

  --c-accent:      #d0a94a;  /* brass */
  --c-accent-soft: #e3c477;
  --c-accent-deep: #9a7c28;
  --c-second:      #7f93b5;  /* cold stage-light blue, used sparingly */

  --c-glow: rgba(208, 169, 74, 0.16);
  --c-shadow: rgba(0, 0, 0, 0.55);
  --c-scrim: rgba(10, 11, 14, 0.9);

  --shadow-sm: 0 1px 2px rgba(0,0,0,.4), 0 2px 10px rgba(0,0,0,.3);
  --shadow-md: 0 6px 18px rgba(0,0,0,.45), 0 20px 50px rgba(0,0,0,.35);
  --shadow-lg: 0 16px 40px rgba(0,0,0,.5), 0 50px 110px rgba(0,0,0,.45);

  color-scheme: dark;
}

/* No prefers-color-scheme override: a visitor whose OS is set to light still
   gets the dark site, because there is only the dark site. */