/* ══════════════════════════════════════════════════
   MiarTek — css/variables.css
   Tokens de design officiels — basés sur le logo
   ══════════════════════════════════════════════════ */

:root {
  /* ── Palette officielle (logo vert + bleu) ── */
  --green:        #3ab03a;
  --green-mid:    #2a8a2a;
  --green-dark:   #1c6c1c;
  --green-light:  #5cd45c;
  --blue:         #1a35c8;
  --blue-mid:     #2244d4;
  --blue-light:   #3a5ae8;
  --navy:         #0a1428;
  --navy-2:       #0d1e3c;
  --navy-3:       #06101e;
  --white:        #ffffff;

  /* ── Texte ── */
  --text:         #0d1830;
  --text-mid:     #2e3f5c;
  --text-muted:   #6b7a99;
  --text-light:   rgba(255,255,255,.88);
  --text-sub:     rgba(255,255,255,.65);

  /* ── Gris (arrière-plans) ── */
  --gray-50:      #f5f7fb;
  --gray-100:     #eef1f7;
  --gray-200:     #dde3ef;
  --gray-300:     #c8d0e6;

  /* ── Dégradés ── */
  --g-green:    linear-gradient(135deg, #1c6c1c, #3ab03a);
  --g-blue:     linear-gradient(135deg, #0d2080, #2244d4);
  --g-gb:       linear-gradient(135deg, #1c6c1c, #1a35c8);
  --g-navy:     linear-gradient(145deg, #091226 0%, #0c1e50 40%, #0a3280 70%, #082060 100%);
  --g-dark-ov:  linear-gradient(90deg, rgba(9,18,38,.93) 0%, rgba(9,18,38,.78) 42%, rgba(9,18,38,.38) 72%, rgba(9,18,38,.1) 100%);
  --g-card:     linear-gradient(145deg, rgba(13,30,60,.96), rgba(10,28,80,.92));
  --g-orange:   linear-gradient(135deg, #a83800, #d05000);
  --g-teal:     linear-gradient(135deg, #004a3a, #00aa80);
  --g-cyan:     linear-gradient(135deg, #00456e, #0090cc);
  --g-purple:   linear-gradient(135deg, #3a006e, #8833cc);

  /* ── Ombres ── */
  --sh-sm:   0 2px 8px  rgba(0,0,0,.06);
  --sh-md:   0 6px 24px rgba(0,0,0,.09);
  --sh-lg:   0 14px 44px rgba(0,0,0,.14);
  --sh-xl:   0 22px 60px rgba(0,0,0,.18);
  --sh-g:    0 5px 18px rgba(42,138,42,.38);
  --sh-b:    0 5px 18px rgba(26,53,200,.35);
  --sh-gb:   0 6px 22px rgba(26,53,150,.3);

  /* ── Typographie ── */
  --fd: 'Exo 2', sans-serif;
  --fb: 'Nunito', sans-serif;

  /* ── Espacements ── */
  --sp-2:  8px;   --sp-3:  12px;  --sp-4:  16px;
  --sp-5:  20px;  --sp-6:  24px;  --sp-8:  32px;
  --sp-10: 40px;  --sp-12: 48px;  --sp-16: 64px;

  /* ── Rayons ── */
  --r-sm:   6px;  --r-md:  12px;  --r-lg:  18px;
  --r-xl:  24px;  --r-2xl: 32px;  --r-full: 9999px;

  /* ── Transitions ── */
  --ease:    all .28s ease;
  --ease-f:  all .15s ease;
  --ease-s:  all .45s cubic-bezier(.25,.8,.25,1);

  /* ── Layout ── */
  --nav-h:   70px;
  --max-w:   1140px;
  --px:      5%;
  --sec-py:  70px;
}