/* بانوی ایران — space, shape, elevation, motion, layout */
: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; --space-32:128px;

  --radius-xs:4px;
  --radius-sm:8px;
  --radius-md:12px;
  --radius-lg:20px;
  --radius-xl:28px;
  --radius-squircle:22%; /* @kind radius */   /* the thumbnail-mark rounded square */
  --radius-pill:999px;
  --radius-circle:50%;

  --border-hair:1px;
  --border-thick:2px;
  --border-rule:3px;       /* the short gold rule under section labels */

  --shadow-xs:0 1px 2px rgba(20,10,50,.06);
  --shadow-sm:0 2px 6px rgba(20,10,50,.08);
  --shadow-md:0 8px 24px rgba(20,10,50,.10);
  --shadow-lg:0 18px 48px rgba(20,10,50,.14);
  --shadow-mark:0 10px 30px rgba(48,15,114,.22);   /* under the app-icon mark */
  --shadow-inset-hair:inset 0 0 0 1px rgba(255,255,255,.10);
  --glow-mint:0 0 0 4px rgba(22,234,158,.32);

  --dur-fast:120ms; /* @kind other */
  --dur-base:200ms; /* @kind other */
  --dur-slow:320ms; /* @kind other */
  --dur-slower:560ms; /* @kind other */
  --ease-standard:cubic-bezier(.2,.8,.2,1); /* @kind other */
  --ease-out:cubic-bezier(.16,1,.3,1); /* @kind other */
  --ease-in-out:cubic-bezier(.5,0,.5,1); /* @kind other */

  --container:1200px;
  --container-narrow:760px;   /* narrative / reading column */
  --gutter:24px;
  --header-h:76px;
}

@media (max-width:720px){:root{--gutter:16px;--header-h:60px}}