/* Karofi PH — radii, shadows, motion, blur, borders.
   Shadows are tinted with deep water ink (--k-ink-800 rgb) rather than pure black,
   so elevation reads cool and clean rather than muddy. */

:root{
  /* Radii — softly rounded, never pill-shaped except on chips/badges */
  --radius-none:0;
  --radius-xs:2px;
  --radius-sm:4px;
  --radius-md:6px;
  --radius-lg:8px;
  --radius-xl:12px;
  --radius-2xl:16px;
  --radius-3xl:24px;
  --radius-full:999px;

  --radius-button:var(--radius-md);
  --radius-input:var(--radius-md);
  --radius-card:var(--radius-xl);
  --radius-media:var(--radius-lg);
  --radius-chip:var(--radius-full);
  --radius-modal:var(--radius-2xl);

  /* Shadows */
  --shadow-none:none;
  --shadow-xs:0 1px 2px rgb(6 38 58 / .06);
  --shadow-sm:0 1px 3px rgb(6 38 58 / .08),0 1px 2px rgb(6 38 58 / .04);
  --shadow-md:0 4px 12px rgb(6 38 58 / .08),0 1px 3px rgb(6 38 58 / .05);
  --shadow-lg:0 12px 28px rgb(6 38 58 / .10),0 4px 8px rgb(6 38 58 / .05);
  --shadow-xl:0 24px 48px rgb(6 38 58 / .14),0 8px 16px rgb(6 38 58 / .06);
  /* Brand glow — hover on primary CTAs and active product cards only */
  --shadow-brand:0 8px 20px rgb(0 167 226 / .28);
  --shadow-inset-top:inset 0 1px 0 rgb(255 255 255 / .12);
  --shadow-focus:0 0 0 3px rgb(0 167 226 / .35);

  /* Borders */
  --border-w-hairline:1px; /* @kind other */
  --border-w-thick:2px; /* @kind other */
  --border-hairline:var(--border-w-hairline) solid var(--border-subtle);
  --border-card:var(--border-w-hairline) solid var(--border-subtle);

  /* Blur / transparency */
  --blur-sm:6px; /* @kind other */
  --blur-md:12px; /* @kind other */
  --blur-lg:24px; /* @kind other */
  --glass-bg:rgb(255 255 255 / .82);
  --glass-bg-dark:rgb(6 38 58 / .62);

  /* Motion — clean, quick, no bounce. Water is calm, not springy. */
  --ease-standard:cubic-bezier(.4,0,.2,1); /* @kind other */
  --ease-out:cubic-bezier(0,0,.2,1); /* @kind other */
  --ease-in:cubic-bezier(.4,0,1,1); /* @kind other */
  --dur-instant:80ms; /* @kind other */
  --dur-fast:140ms; /* @kind other */
  --dur-base:220ms; /* @kind other */
  --dur-slow:360ms; /* @kind other */
  --dur-reveal:600ms; /* @kind other */
  --transition-control:background-color var(--dur-fast) var(--ease-standard),border-color var(--dur-fast) var(--ease-standard),color var(--dur-fast) var(--ease-standard),box-shadow var(--dur-fast) var(--ease-standard); /* @kind other */

  /* Z layers */
  --z-base:0; /* @kind other */
  --z-sticky:100; /* @kind other */
  --z-header:200; /* @kind other */
  --z-dropdown:300; /* @kind other */
  --z-overlay:400; /* @kind other */
  --z-modal:500; /* @kind other */
  --z-toast:600; /* @kind other */
}
