/* ============================================================
   QWELL · EFFECTS — borders, shadows, motion
   The system is FLAT & BRUTALIST: hard offset shadows,
   no soft drop blur, snappy motion, no easing drama.
   ============================================================ */

:root {
  /* ---- Borders (semantic) ---- */
  --border-bold: var(--stroke-2) solid var(--off-black);
  --border-heavy: var(--stroke-3) solid var(--off-black);

  /* ---- Hard offset "pop" shadows (no blur) ---- */
  --shadow-pop-sm: 3px 3px 0 var(--off-black);
  --shadow-pop: 5px 5px 0 var(--off-black);
  --shadow-pop-lg: 8px 8px 0 var(--off-black);
  /* colored pop for accent cards */
  --shadow-pop-fuchsia: 5px 5px 0 var(--freedom-fuchsia);
  --shadow-pop-blue: 5px 5px 0 var(--queer-blue);

  /* ---- A single soft elevation (used sparingly, e.g. menus) ---- */
  --shadow-soft: 0 8px 24px rgba(17, 17, 17, 0.14);
  --shadow-soft-sm: 0 2px 8px rgba(17, 17, 17, 0.10);

  /* ---- Focus ring ---- */
  --ring: 0 0 0 3px var(--warm-white), 0 0 0 6px var(--queer-blue);

  /* ---- Motion — fast, confident, no bounce ---- */
  --ease-out: cubic-bezier(0.2, 0.8, 0.2, 1);       /* @kind other */
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);    /* @kind other */
  --dur-fast: 120ms;    /* @kind other */
  --dur-base: 180ms;    /* @kind other */
  --dur-slow: 320ms;    /* @kind other */
  --transition-base: all var(--dur-base) var(--ease-out);

  /* ---- Halftone / texture overlays ---- */
  --halftone-dark: radial-gradient(var(--off-black) 1.4px, transparent 1.5px);
  --halftone-size: 8px 8px;
}