/**
 * Amader Phultala — canonical design tokens (source of truth in CSS).
 * See DESIGN.md. Loaded first among project styles; legacy files may alias these.
 */
:root {
  /* —— Brand —— */
  --ap-color-forest: #1a5c45;
  --ap-color-forest-dark: #134432;
  --ap-color-teal: #0c6b74;
  --ap-color-teal-light: #14848e;
  --ap-color-orange: #d4892a;
  --ap-color-orange-soft: #f8e7c8;
  --ap-color-terracotta: #c4513a;
  --ap-color-navy: #163038;
  --ap-color-navy-deep: #0b242c;
  --ap-color-river: #1a5f8a;

  /* —— Surfaces —— */
  --ap-color-bg: #f7f6f3;
  --ap-color-bg-soft: #eef4f6;
  --ap-color-surface: #ffffff;
  --ap-color-border: #e4e8ea;
  --ap-color-border-strong: #d3e3e6;
  --ap-color-footer: #0a5259;

  /* —— Text —— */
  --ap-color-ink: #2a2f33;
  --ap-color-ink-strong: #163038;
  --ap-color-muted: #5f6b73;

  /* —— Semantic —— */
  --ap-color-success: #1a5c45;
  --ap-color-warning: #d4892a;
  --ap-color-danger: #c0392b;
  --ap-color-info-bg: #e5f4f6;
  --ap-color-warn-bg: #fff6e8;

  /* —— Typography (max 2 families on site) —— */
  --ap-font-ui: "Hind Siliguri", "Nirmala UI", "Kohinoor Bangla", "Bangla Sangam MN", "Noto Sans Bengali", system-ui, sans-serif;
  --ap-font-display: "Baloo Da 2", "Hind Siliguri", "Nirmala UI", sans-serif;

  --ap-weight-regular: 400;
  --ap-weight-medium: 500;
  --ap-weight-semibold: 600;
  --ap-weight-bold: 700;

  --ap-text-xs: 0.78rem;
  --ap-text-sm: 0.88rem;
  --ap-text-body: 1rem;
  --ap-text-lead: 1.0625rem;
  --ap-text-h3: 1.28rem;
  --ap-text-h2: clamp(1.35rem, 2.2vw, 1.75rem);
  --ap-text-h1: clamp(1.75rem, 3.5vw, 2.35rem);
  --ap-text-hero: clamp(1.85rem, 5vw, 3.25rem);

  --ap-leading-body: 1.65;
  --ap-leading-heading: 1.35;
  --ap-leading-display: 1.25;

  /* —— Spacing —— */
  --ap-space-1: 4px;
  --ap-space-2: 8px;
  --ap-space-3: 12px;
  --ap-space-4: 16px;
  --ap-space-5: 20px;
  --ap-space-6: 24px;
  --ap-space-8: 32px;
  --ap-space-10: 40px;
  --ap-space-12: 48px;
  --ap-space-section: 64px;
  --ap-space-section-lg: 80px;

  /* —— Layout —— */
  --ap-container-max: 1120px;
  --ap-container-narrow: 720px;
  --ap-breakpoint-sm: 576px;
  --ap-breakpoint-md: 768px;
  --ap-breakpoint-lg: 992px;
  --ap-breakpoint-xl: 1200px;

  /* —— Shape —— */
  --ap-radius-sm: 6px;
  --ap-radius-md: 8px;
  --ap-radius-lg: 12px;
  --ap-radius-xl: 16px;
  --ap-radius-pill: 9999px;

  /* —— Elevation —— */
  --ap-shadow-sm: 0 1px 2px rgba(26, 42, 36, 0.06);
  --ap-shadow-md: 0 4px 14px rgba(26, 42, 36, 0.08);
  --ap-shadow-lg: 0 10px 26px rgba(16, 58, 42, 0.12);

  /* —— Motion —— */
  --ap-ease-out: cubic-bezier(0.22, 1, 0.36, 1);
  --ap-duration-fast: 150ms;
  --ap-duration-normal: 280ms;
  --ap-duration-slow: 480ms;

  /* —— Focus —— */
  --ap-focus-ring: 3px solid #e0a83a;
  --ap-focus-offset: 2px;

  /* —— Legacy aliases (migrate files to --ap-* over time) —— */
  --brand-green: var(--ap-color-forest);
  --brand-green-dark: var(--ap-color-forest-dark);
  --brand-gold: var(--ap-color-orange);
  --brand-terracotta: var(--ap-color-terracotta);
  --ink: var(--ap-color-ink-strong);
  --muted: var(--ap-color-muted);
  --bg-soft: var(--ap-color-bg);
  --surface: var(--ap-color-surface);
  --border-soft: var(--ap-color-border);
  --footer-bg: var(--ap-color-footer);
  --font-body: var(--ap-font-ui);
  --font-display: var(--ap-font-display);
  --font-ui: var(--ap-font-ui);
  --discover-max: var(--ap-container-max);
  --radius: var(--ap-radius-md);
  --radius-lg: var(--ap-radius-lg);
  --shadow-soft: var(--ap-shadow-sm);
  --shadow-soft-hover: var(--ap-shadow-md);
}