/* PAY-17 Mousse - Neo-Editorial */
:root {
  /* Couleurs skin */
  --bg: #F6F0E6;
  --bg-alt: #ECE5D4;
  --surface: #FBF7EF;
  --text: #2E2820;
  --text-2: #5B5247;
  --text-mute: #8A8276;
  --border: #E0D7C5;
  --accent: #557544;
  --accent-2: #9A7B4F;
  --accent-soft: #DDE5D4;
  --surface-deep: #1F2A19;
  --accent-on-dark: #C8D9B6;
  --text-on-dark: #EDE7DA;
  --border-on-dark: rgba(237, 231, 218, .18);
  --primary: var(--accent);
  --wa-green: #25D366;
  --gold: #C99A2E;

  /* Polices */
  --ff-display: "Fraunces", "Cormorant Garamond", Georgia, serif;
  --ff-body: "DM Sans", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --ff-ui: var(--ff-body);

  /* Rayons */
  --r-sm: 8px;
  --r-md: 12px;
  --r-lg: 18px;
  --r-xl: 24px;

  /* Header */
  --header-h: 76px;
  --header-h-mobile: 64px;

  /* z-index */
  --z-header: 1100;
  --z-menu: 1000;
  --z-burger: 1110;
  --z-fab: 1050;
  --z-modal: 1200;

  /* Layout */
  --container: 1200px;

  /* Transitions */
  --t-fast: .18s ease;
  --t: .25s ease;
}

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

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

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

:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 3px;
  border-radius: 4px;
}