/* SOLÉ Studio — design tokens. "A Riviera terrace salon at golden hour." */
:root {
  /* palette, pulled from the photography */
  --cream: #f7f0e6;
  --sand: #efe2d1;
  --blush: #ecd3c2;
  --terracotta: #a4583d;
  --terracotta-deep: #8a4631;
  --olive: #56593a;
  --olive-deep: #45482e;
  --brass: #b48a55;
  --ink: #33251d;
  --ink-soft: #5e4a3e;
  --on-dark: #fbf5ec;
  --on-dark-soft: rgba(251, 245, 236, 0.82);
  --line: rgba(51, 37, 29, 0.16);
  --line-light: rgba(251, 245, 236, 0.28);

  /* type */
  --font-sans: "Jost", "Helvetica Neue", Arial, sans-serif;
  --font-mark: "Cormorant Garamond", Georgia, serif; /* wordmark only, matches the signage */
  --w-thin: 200;
  --w-light: 300;
  --w-regular: 400;
  --w-medium: 500;

  --fs-display: clamp(2.9rem, 8.4vw, 7.6rem);
  --fs-h1: clamp(2.6rem, 6.2vw, 5.6rem);
  --fs-h2: clamp(2.1rem, 4.4vw, 4rem);
  --fs-h3: clamp(1.35rem, 2vw, 1.7rem);
  --fs-lede: clamp(1.06rem, 1.3vw, 1.25rem);
  --fs-body: 1rem;
  --fs-small: 0.9rem;
  --fs-label: 0.74rem;

  --track-label: 0.26em;
  --track-label-sm: 0.2em;
  --track-tight: -0.015em;
  --lh-body: 1.7;

  /* space */
  --gutter: clamp(20px, 5vw, 56px);
  --section: clamp(72px, 10vw, 136px);
  --maxw: 1320px;
  --measure: 60ch;
  --bar-h: 68px;

  /* shape: organic pebble frames echo the station mirror */
  --pebble: 44% 56% 50% 50% / 34% 36% 64% 66%;
  --pebble-b: 56% 44% 52% 48% / 38% 34% 66% 62%;
  --radius: 18px;
  --radius-pill: 999px;

  --ease: cubic-bezier(0.22, 0.61, 0.36, 1);
  --shadow: 0 24px 60px -30px rgba(51, 37, 29, 0.35);
}