/* ============================================================
   ECHTE STARS — Radii, shadows & effects
   Cards are softly rounded (16px) with a whisper-soft shadow. The big
   feature panels use a large 40px radius. Tags & filter pills are fully
   rounded. Buttons are lightly rounded (8px).
   ============================================================ */

:root {
  /* Corner radii */
  --radius-xs: 4px;      /* small chips / swatches (3.78px in source) */
  --radius-sm: 6px;
  --radius-md: 8px;      /* buttons, inputs */
  --radius-lg: 12px;     /* job cards */
  --radius-xl: 16px;     /* content cards (15.999px in source) */
  --radius-2xl: 24px;
  --radius-3xl: 40px;    /* feature panels (orange block, job panel) */
  --radius-pill: 999px;  /* tags, filter dropdowns */

  /* Shadows — deliberately subtle, warm-neutral */
  --shadow-card: 0 2px 8px rgba(0, 0, 0, 0.031);           /* rgba(0,0,0,0.0314) in source */
  --shadow-card-hover: 0 8px 24px rgba(29, 29, 27, 0.10);
  --shadow-raised: 0 12px 40px rgba(29, 29, 27, 0.14);
  --shadow-hero-text: 0 2px 24px rgba(0, 0, 0, 0.35);      /* text over hero photos */

  /* Motion */
  --ease-out: cubic-bezier(0.22, 1, 0.36, 1); /* @kind other */
  --ease-standard: cubic-bezier(0.4, 0, 0.2, 1); /* @kind other */
  --dur-fast: 140ms; /* @kind other */
  --dur: 220ms; /* @kind other */
  --dur-slow: 380ms; /* @kind other */

  /* Focus ring */
  --focus-ring: 0 0 0 3px rgba(237, 109, 53, 0.35);
}