/* ============================================================
   Preppr — Effects: radii, borders, shadows, motion, texture
   Calm and enterprise-credible. Soft shadows, restrained motion.
   ============================================================ */
:root {
  /* Corner radii */
  --radius-xs:   4px;
  --radius-sm:   6px;
  --radius-md:   10px;  /* default control / card */
  --radius-lg:   16px;  /* large cards */
  --radius-xl:   24px;  /* hero panels / image frames */
  --radius-pill: 999px;

  /* Borders */
  --border-hair: 1px solid var(--border-subtle);
  --border-1:    1px solid var(--border-default);

  /* Shadows — soft, cool-tinted, low spread */
  --shadow-xs: 0 1px 2px rgba(13, 27, 42, 0.06);
  --shadow-sm: 0 1px 3px rgba(13, 27, 42, 0.08), 0 1px 2px rgba(13, 27, 42, 0.04);
  --shadow-md: 0 4px 12px rgba(13, 27, 42, 0.08), 0 2px 4px rgba(13, 27, 42, 0.04);
  --shadow-lg: 0 12px 32px rgba(13, 27, 42, 0.12), 0 4px 8px rgba(13, 27, 42, 0.05);
  --shadow-xl: 0 24px 56px rgba(13, 27, 42, 0.18);
  /* Teal glow — for accent emphasis only */
  --shadow-accent: 0 6px 20px rgba(0, 180, 166, 0.28);

  /* Motion — calm, no bounce */
  --ease-out:   cubic-bezier(0.22, 1, 0.36, 1); /* @kind other */
  --ease-in-out:cubic-bezier(0.65, 0, 0.35, 1); /* @kind other */
  --dur-fast:   120ms; /* @kind other */
  --dur-base:   200ms; /* @kind other */
  --dur-slow:   360ms; /* @kind other */

  /* Dot-grid texture — navy sections only, low opacity */
  --dot-grid:
    radial-gradient(rgba(255, 255, 255, 0.07) 1px, transparent 1px); /* @kind other */
  --dot-grid-size: 22px 22px; /* @kind other */

  /* Duotone treatment for imagery (navy shadows → teal highlights) */
  --duotone-shadow: #0d1b2a;
  --duotone-light:  #00b4a6;
}