/* Kana Studio — Spacing, radius, layout, motion, elevation.
   Generous whitespace is a brand rule; the scale skews large. */

:root {
  /* Spacing scale (px) */
  --sp-1: 4px;
  --sp-2: 8px;
  --sp-3: 12px;
  --sp-4: 16px;
  --sp-5: 24px;
  --sp-6: 32px;
  --sp-7: 48px;
  --sp-8: 64px;
  --sp-9: 96px;
  --sp-10: 128px;
  --sp-11: 180px;   /* section rhythm on marketing pages */

  /* Layout */
  --maxw: 1440px;
  --maxw-text: 680px;   /* readable measure for long copy */
  --gutter: clamp(20px, 5vw, 88px);  /* @kind spacing */

  /* Radius — the brand is near-square. Sharp by default. */
  --r-none: 0px;
  --r-sm: 2px;
  --r-md: 4px;
  --r-pill: 999px;      /* only for tags / small chips */

  /* Borders */
  --bw-hair: 1px;
  --bw-strong: 2px;

  /* Elevation — restrained; on black, shadow reads as a subtle lift only */
  --shadow-none: none;
  --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.5);
  --shadow-md: 0 12px 40px rgba(0, 0, 0, 0.55);
  --shadow-lift: 0 30px 80px rgba(0, 0, 0, 0.6);

  /* Image treatment — b&w, faint film grain feel via low contrast lift */
  --img-grayscale: grayscale(1) contrast(1.02);  /* @kind other */

  /* Motion — quiet, editorial. No bounce. Long, eased fades. */
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);     /* @kind other */
  --ease-inout: cubic-bezier(0.65, 0, 0.35, 1);  /* @kind other */
  --dur-fast: 160ms;   /* @kind other */
  --dur-base: 320ms;   /* @kind other */
  --dur-slow: 620ms;   /* @kind other */

  /* Interaction */
  --hover-dim: 0.62;     /* @kind other */
  --press-scale: 0.985;  /* @kind other */
}