/* PAY-8 Sauge — Craft + Lora + Source Sans 3 + accent sauge teal */
:root {
  /* ----- SKIN ----- */
  --bg:            #E8F0EC;
  --bg-alt:        #F2F6F2;
  --surface:       #FAFCFA;
  --surface-dark:  #1F3531;
  --text:          #1F3531;
  --text-2:        #4A5F58;
  --text-mute:     #7F948C;
  --border:        rgba(31, 53, 49, 0.14);
  --accent:        #4A8B7F;            /* sauge teal — imposé PAY-8 */
  --accent-2:      #6FA89C;
  --accent-soft:   #D6E3DD;
  --accent-on-dark:#C8DDD8;
  --primary:       #4A8B7F;
  --wa-green:      #25D366;

  /* ----- TYPOGRAPHIE ----- */
  --ff-display: "Lora", "Libre Baskerville", Georgia, serif;
  --ff-body:    "Source Sans 3", "Source Sans Pro", system-ui, -apple-system, sans-serif;
  --ff-ui:      "Source Sans 3", "Source Sans Pro", system-ui, -apple-system, sans-serif;

  /* ----- RAYONS ----- */
  --r-sm: 6px;
  --r-md: 10px;
  --r-lg: 14px;
  --r-xl: 22px;

  /* ----- LAYOUT ----- */
  --container: 1200px;
  --header-h:         72px;
  --header-h-mobile:  64px;

  /* ----- Z-INDEX ----- */
  --z-base:   1;
  --z-header: 1100;     /* > z-menu (PIEGE PROD #1) */
  --z-menu:   1000;
  --z-burger: 1110;     /* > header pour rester cliquable */
  --z-fab:    900;
  --z-modal:  1200;

  /* ----- TRANSITIONS ----- */
  --t-fast: 160ms;
  --t-med:  280ms;
  --t-slow: 480ms;
}

::selection { background: var(--accent); color: #fff; }
::-moz-selection { background: var(--accent); color: #fff; }

::-webkit-scrollbar { width: 8px; height: 8px; }
::-webkit-scrollbar-track { background: var(--bg-alt); }
::-webkit-scrollbar-thumb { background: color-mix(in srgb, var(--accent) 55%, transparent); border-radius: 4px; }
::-webkit-scrollbar-thumb:hover { background: var(--accent); }

::placeholder { color: var(--text-mute); opacity: 1; }