/*
 * ExploreGlobal design tokens — the only place a colour, size, radius, shadow
 * or easing is defined. The marketing site, the phone app and the staff
 * console all read these, so they cannot drift apart.
 *
 * The look is an established company's, not a startup template: white pages,
 * one deep green-teal used with restraint, grey for structure, flat surfaces
 * with thin borders, small radii, and one plain typeface that reads the same
 * in English and Bangla. No gradients, glows, glass, grain or neon — if a
 * surface needs to stand out, it gets a border or a solid colour.
 */
:root {
  /* brand: a deep green-teal (health, calm), not the national green */
  --brand-50:  #eef6f4;
  --brand-100: #d6ebe6;
  --brand-200: #acd6cc;
  --brand-300: #78bbad;
  --brand-400: #3f9c8b;
  --brand-500: #1a8270;
  --brand-600: #0b6e5e;
  --brand-700: #0a5b4e;
  --brand-800: #0b4a40;
  --brand-900: #0c3c35;

  /* dark slate for the footer and the few dark surfaces */
  --navy-950: #0f161d;
  --navy-900: #17212b;
  --navy-800: #1f2b36;
  --navy-700: #2b3947;
  --navy-600: #3a4a5a;

  --amber-400: #e0a526;
  --amber-500: #c98a12;
  --amber-600: #9a6a0e;

  /* neutral greys, slightly warm */
  --ink-900: #1c2530;
  --ink-700: #36414d;
  --ink-500: #57616c;
  --ink-400: #7c858f;
  --ink-300: #aab1b9;
  --ink-200: #d4d9de;
  --ink-100: #e7eaed;
  --ink-50:  #f4f5f7;

  --bg:           #ffffff;
  --surface:      #ffffff;
  --surface-2:    var(--ink-50);
  --fg:           var(--ink-900);
  --fg-muted:     var(--ink-500);
  --fg-subtle:    var(--ink-400);
  --line:         #e3e6ea;
  --line-strong:  #cdd2d8;
  --primary:      var(--brand-600);
  --primary-hover:var(--brand-700);
  --primary-fg:   #ffffff;
  --primary-soft: var(--brand-50);
  --accent:       var(--amber-500);
  --focus:        #2f7de1;
  --danger:       #b42318;
  --success:      #117a43;
  --warning-bg:   #fdf6e7;
  --warning-line: #efd9a7;
  --warning-fg:   #7a5410;

  --on-dark:        #f3f5f7;
  --on-dark-muted:  #b5bec7;
  --on-dark-subtle: #8a96a2;
  --on-dark-line:   rgb(255 255 255 / .12);

  /* site: the darker green for dark sections, warm neutrals, one warm accent */
  --forest-950: #0a1f1b;
  --forest-900: #0f2a25;
  --forest-800: #173b34;
  --sand-50:    #f8f5ef;
  --sand-100:   #f1ebe0;
  --sand-200:   #e4dac8;
  --marigold-300: #f7cc6b;
  --marigold-400: #f3b23c;
  --marigold-500: #d9951a;
  --marigold-700: #996912; /* the same hue, dark enough for text on the page backgrounds (4.6:1 or more, WCAG AA) */

  /* kept for older rules while they are removed; all flat now */
  --brand-gradient: var(--brand-600);
  --glass:          transparent;
  --glass-strong:   transparent;
  --noise:          none;

  --font-sans: "Noto Sans", "Noto Sans Bengali", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  --font-bn:   "Noto Sans Bengali", "Noto Sans", system-ui, sans-serif;
  /* Headings on the site: Anek Bangla, drawn for Bangla and Latin together. */
  --font-display: "Anek Bangla", "Noto Sans Bengali", "Noto Sans", system-ui, sans-serif;
  --font-serif: var(--font-sans);
  --font-mono: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;

  /* type: modest steps, normal tracking */
  --text-xs:   .8125rem;
  --text-sm:   .875rem;
  --text-md:   1rem;
  --text-lg:   1.125rem;
  --text-xl:   1.25rem;
  --text-h3:   1.1875rem;
  --text-h2:   clamp(1.875rem, 1.35rem + 2vw, 3rem);
  --text-hero: clamp(2.5rem, 1.4rem + 4.4vw, 4.75rem);
  --leading-body: 1.6;
  --tracking-tight: -.01em;

  --sp-1: .25rem; --sp-2: .5rem; --sp-3: .75rem; --sp-4: 1rem; --sp-5: 1.25rem; --sp-6: 1.5rem;
  --sp-8: 2rem; --sp-10: 2.5rem; --sp-12: 3rem; --sp-16: 4rem; --sp-20: 5rem; --sp-24: 6rem; --sp-32: 8rem;

  --r-sm: 4px; --r-md: 6px; --r-lg: 8px; --r-xl: 10px; --r-2xl: 12px; --r-full: 999px;
  --r-card: 18px; --r-img: 22px;

  --shadow-sm: 0 1px 2px rgb(16 24 32 / .06);
  --shadow-md: 0 1px 3px rgb(16 24 32 / .08), 0 1px 2px rgb(16 24 32 / .04);
  --shadow-lg: 0 6px 16px rgb(16 24 32 / .08);
  --shadow-card-3d: var(--shadow-lg);
  --ring: 0 0 0 3px color-mix(in srgb, var(--focus) 30%, transparent);

  --container: 76rem;
  --gutter: clamp(1rem, 4vw, 2rem);
  --ease-out: cubic-bezier(.2, .8, .2, 1);
  --dur: .15s;
  --dur-slow: .25s;
}