/* Spacing, radii, borders, elevation, motion. */
:root{
  --space-1:4px;--space-2:8px;--space-3:12px;--space-4:16px;--space-5:20px;--space-6:24px;
  --space-8:32px;--space-10:40px;--space-12:48px;--space-16:64px;--space-20:80px;--space-24:96px;

  --frame-margin:40px;  /* outer margin of 1440-wide brand frames */

  --radius-xs:6px;
  --radius-sm:10px;
  --radius-md:15px;     /* colour swatch tiles */
  --radius-lg:28px;
  --radius-xl:56px;     /* tall "phone" cards in the plaquette */
  --radius-pill:999px;  /* outline pills / sommaire buttons */

  --border-hair:1px;
  --border-line:1.5px;  /* outline pills */
  --border-card:2px;    /* product outline cards */

  /* Brand is flat: no drop shadows on logo or brand frames. UI elevation is kept minimal. */
  --shadow-none:none;
  --shadow-overlay:0 12px 32px rgba(15,20,35,.18);
  --shadow-focus:0 0 0 3px rgba(182,209,249,.7);

  --ease-standard:cubic-bezier(.2,0,0,1); /* @kind other */
  --ease-out:cubic-bezier(0,0,.2,1); /* @kind other */
  --dur-fast:120ms; /* @kind other */--dur-base:200ms; /* @kind other */--dur-slow:360ms; /* @kind other */
  --dur-loader:1.2s; /* @kind other */    /* spoke rotation of the loader symbol */
}