/* ============================================================
   ELEVATION — Cherry Noir
   Shadows are warm-tinted (plum ink, not neutral grey), soft and
   low-spread. On dark surfaces, elevation reads via hairline
   borders + subtle glow rather than drop shadow.
   ============================================================ */

:root {
  --shadow-xs:  0 1px 2px rgba(42, 19, 24, 0.06);
  --shadow-sm:  0 2px 8px rgba(42, 19, 24, 0.08);
  --shadow-md:  0 10px 28px rgba(42, 19, 24, 0.10);
  --shadow-lg:  0 22px 54px rgba(42, 19, 24, 0.16);
  --shadow-xl:  0 40px 90px rgba(42, 19, 24, 0.22);

  /* Hairline "border via shadow" — crisp editorial framing */
  --ring-hairline:     inset 0 0 0 1px rgba(42, 19, 24, 0.14);   /* @kind shadow */
  --ring-on-dark:      inset 0 0 0 1px rgba(235, 224, 202, 0.16);/* @kind shadow */

  /* Focus ring (paired with outline in components) */
  --shadow-focus:      0 0 0 3px rgba(124, 29, 44, 0.28);
  --shadow-focus-dark: 0 0 0 3px rgba(176, 131, 134, 0.40);

  /* Lifted media / hero portrait */
  --shadow-portrait:   0 30px 70px rgba(28, 12, 16, 0.34);
}