/*
  Visual system: "Atelier"
  Bright, photo-led and editorial. High-contrast serif display, crisp grotesk for
  everything else, pill actions, soft panels, generous centred rhythm.
  Broker colours arrive from the page as --brand, --brand-deep, --brand-ink-on, --mark.
*/
:root {
  --brand: #0f5257;
  --brand-deep: #0a3a3e;
  --brand-ink-on: #f4f6f4;
  --mark: #f0cf63;

  --ground: #ffffff;
  --ground-2: #f4f5f7;
  --paper: #ffffff;
  --ink: #12151c;
  --ink-2: #4a505c;
  --ink-3: #737a87;
  --rule: #e4e6eb;
  --rule-strong: #12151c;

  --font-display: "Gloock", "Times New Roman", serif;
  --font-ui: "Schibsted Grotesk", "Helvetica Neue", Arial, sans-serif;
  --font-read: "Schibsted Grotesk", "Helvetica Neue", Arial, sans-serif;

  --step--1: clamp(0.86rem, 0.84rem + 0.1vw, 0.92rem);
  --step-0: clamp(1.05rem, 1.01rem + 0.2vw, 1.15rem);
  --step-1: clamp(1.25rem, 1.15rem + 0.45vw, 1.5rem);
  --step-2: clamp(1.65rem, 1.4rem + 1.1vw, 2.3rem);
  --step-3: clamp(2.2rem, 1.7rem + 2.3vw, 3.7rem);
  --step-4: clamp(2.9rem, 1.9rem + 4.8vw, 6.2rem);

  --gutter: clamp(16px, 4vw, 56px);
  --wide: 1240px;
  --text: 680px;

  --radius-control: 999px;
  --radius-panel: 20px;
  --radius-media: 16px;

  --ease-out: cubic-bezier(0.22, 1, 0.36, 1);
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
}