/* Hoorad design tokens. Brand palette from the brand book; derived tints are documented in design-rationale.md. */
@font-face {
  font-family: "Vazirmatn";
  src: url("../fonts/Vazirmatn-subset.woff2") format("woff2");
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
  unicode-range: U+0600-06FF, U+0750-077F, U+FB50-FDFF, U+FE70-FEFF, U+200C-200F, U+0020-007E;
}
@font-face {
  font-family: "Libre Franklin";
  src: url("../fonts/LibreFranklin-subset.woff2") format("woff2");
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
}
:root {
  /* brand */
  --blue: #14345F;
  --blue-ink: #0D2446;      /* darker step for hover/pressed */
  --blue-deep: #091A33;     /* darkest surfaces */
  --soft: #8FA8C7;          /* Soft Blue Grey: decoration, large text on dark, never small text on white */
  --soft-100: #EEF2F7;      /* 12% tint of soft on white */
  --soft-200: #DCE4EE;
  --soft-300: #C3D0E1;
  --black: #000000;
  --white: #FFFFFF;
  /* text (contrast-checked) */
  --ink: #0B1220;
  --ink-2: #2B3A52;         /* body text, 10.6:1 on white */
  --muted: #536580;         /* 5.6:1 on white */
  --line: #D5DEEA;
  --focus: #14345F;
  --danger: #A32D2D;        /* error text, 6.6:1 */
  --ok: #1E6B3A;
  --warn-bg: #FFF4E0;
  --warn-ink: #7A4B00;
  /* typography */
  --font-fa: "Vazirmatn", "Vazir", "Segoe UI", Tahoma, Arial, sans-serif;
  --font-en: "Libre Franklin", "Franklin Gothic Medium", "Helvetica Neue", Arial, sans-serif;
  --font-mono: ui-monospace, "SF Mono", Menlo, Consolas, monospace;
  --fs-0: clamp(0.8125rem, 0.78rem + 0.15vw, 0.875rem);
  --fs-1: clamp(0.9375rem, 0.9rem + 0.2vw, 1.0625rem);
  --fs-2: clamp(1.0625rem, 1rem + 0.35vw, 1.25rem);
  --fs-3: clamp(1.25rem, 1.1rem + 0.7vw, 1.625rem);
  --fs-4: clamp(1.5rem, 1.25rem + 1.3vw, 2.25rem);
  --fs-5: clamp(1.9rem, 1.5rem + 2.2vw, 3.25rem);
  --fs-6: clamp(2.3rem, 1.6rem + 3.6vw, 4.5rem);
  --lh-tight: 1.15;
  --lh-snug: 1.3;
  --lh-body: 1.75;
  /* layout */
  --max: 1200px;
  --gutter: 16px;
  --space-1: 0.5rem;
  --space-2: 1rem;
  --space-3: 1.5rem;
  --space-4: 2.5rem;
  --space-5: 4rem;
  --space-6: 6.5rem;
  --radius: 6px;
  --radius-lg: 10px;
  --shadow: 0 1px 2px rgba(11, 18, 32, 0.06), 0 8px 24px -12px rgba(20, 52, 95, 0.25);
  /* motion system */
  --dur-1: 160ms;
  --dur-2: 320ms;
  --dur-3: 640ms;
  --dur-4: 1100ms;
  --ease-out: cubic-bezier(0.2, 0.7, 0.2, 1);
  --ease-inout: cubic-bezier(0.65, 0, 0.35, 1);
  --ease-draw: cubic-bezier(0.4, 0, 0.2, 1);
  --stagger: 70ms;
}
html[lang="fa"] { --font-body: var(--font-fa); --font-head: var(--font-fa); --lh-body: 1.9; }
html[lang="en"] { --font-body: var(--font-en); --font-head: var(--font-en); --lh-body: 1.65; }
@media (prefers-reduced-motion: reduce) {
  :root { --dur-1: 1ms; --dur-2: 1ms; --dur-3: 1ms; --dur-4: 1ms; --stagger: 0ms; }
}
html.reduce-motion { --dur-1: 1ms; --dur-2: 1ms; --dur-3: 1ms; --dur-4: 1ms; --stagger: 0ms; }