/* ============================================================
   HRnytt design system tokens (--hr-*), for the platform pages
   built from the design reference: Utbildning, later Rekryteringsguiden
   and Lediga jobb. Values from hrnytt-utbildning/tokens.css and the
   composite values in its components/bundle.css. Only --hr-* names,
   so nothing here overrides the site's own tokens.css.
   ============================================================ */
:root {
  /* Colour */
  --hr-paper: #ffffff;
  --hr-sand: #f5f3f2;
  --hr-mint: #e7f2ea;
  --hr-black: #000000;
  --hr-ink: #000000;
  --hr-graphite: #54646a;
  --hr-green-brand: #49b170;
  --hr-green-cta: #48b06f;
  --hr-green-link: #1e7a48;
  --hr-green-deep: #0f5132;
  --hr-orange: #c05a2b;
  --hr-orange-soft: #fbefe3;
  --hr-sponsored: #5b6560;
  --hr-illu-200: #bfe6cc;
  --hr-border-card: rgba(28, 58, 64, 0.12);
  --hr-border-grid: rgba(0, 0, 0, 0.10);
  --hr-line-row: rgba(0, 0, 0, 0.09);
  --hr-rule: rgba(0, 0, 0, 0.08);
  --hr-middot: rgba(28, 58, 64, 0.30);
  --hr-focus-ring: 0 0 0 3px rgba(72, 176, 111, 0.25);

  /* Borders */
  --hr-card-border: 1px solid var(--hr-border-card);
  --hr-grid-border: 1px solid var(--hr-border-grid);
  --hr-row-divider: 1px solid var(--hr-line-row);
  --hr-section-rule: 1px solid var(--hr-rule);
  --hr-input-border: 1px solid rgba(0, 0, 0, 0.15);

  /* Type */
  --hr-font-display: "Playfair Display", Georgia, "Times New Roman", serif;
  --hr-font-body: "Public Sans", system-ui, -apple-system, sans-serif;
  --hr-h-page: 44px;
  --hr-h-puff-sm: 28px;
  --hr-h-feature: 24px;
  --hr-h-card: 21px;
  --hr-h-box: 25px;
  --hr-lead: 18px;
  --hr-dek: 17px;
  --hr-dek-sm: 15px;
  --hr-meta: 13.5px;
  --hr-meta-sm: 13px;
  --hr-ui-lg: 15.5px;
  --hr-kicker: 13px;
  --hr-kicker-sm: 12.5px;
  --hr-kicker-xs: 12px;
  --hr-w-regular: 400;
  --hr-w-semibold: 600;
  --hr-w-bold: 700;
  --hr-lh-card: 1.18;
  --hr-lh-title: 1.3;
  --hr-lh-body: 1.5;
  --hr-track-kicker: 0.07em;
  --hr-track-wide: 0.08em;
  --hr-track-xwide: 0.14em;

  /* Space, shape, size */
  --hr-maxw-read: 720px;
  --hr-grid-gap: 32px;
  --hr-radius: 12px;
  --hr-radius-avatar: 10px;
  --hr-radius-pill: 999px;
  --hr-h-btn: 48px;
  --hr-h-input: 52px;
  --hr-h-icon-btn: 40px;

  /* Motion: colour shifts, card title + arrow */
  --hr-ease: cubic-bezier(0.2, 0.7, 0.2, 1);
  --hr-dur-color: 0.15s;
  --hr-dur-title: 0.16s;
}