/* ------------------------------------------------------------------
   Coco Beauty Salon — Shape & elevation tokens
   One drop-shadow in the whole system, reserved for product imagery.
------------------------------------------------------------------ */

:root {
  /* --- Border radius --- */
  --radius-none: 0px;      /* full-bleed tiles */
  --radius-xs: 5px;        /* inline chip links (rare) */
  --radius-sm: 8px;        /* dark utility buttons, inline card imagery */
  --radius-md: 11px;       /* pearl white button capsules */
  --radius-lg: 18px;       /* store / accessory cards */
  --radius-pill: 9999px;   /* cocoa pill CTA, search, chips — the signature */
  --radius-full: 9999px;   /* circular control chips */

  /* --- Elevation --- */
  --shadow-product: rgba(36, 22, 15, 0.22) 3px 5px 30px 0;  /* the ONLY shadow */
  --border-hairline: 1px solid var(--color-hairline);
  --border-soft: 1px solid var(--color-border-faint);

  /* --- Backdrop blur (frosted bars) --- */
  --blur-frosted: saturate(180%) blur(20px); /* @kind other */

  /* --- Motion --- */
  --press-scale: scale(0.95); /* @kind other */
  --ease-standard: cubic-bezier(0.4, 0, 0.2, 1); /* @kind other */
  --duration-press: 120ms; /* @kind other */
}