/* ============================================================
   ADIE Solutions — Feuille de styles principale
   Tokens (couleurs, typographie, espacements) + base + animations
   Dérivé du design system "DesignSystem_1788d1".
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Archivo:wght@500;600;700;800;900&family=Mulish:wght@400;500;600;700&family=IBM+Plex+Mono:wght@400;500;600&display=swap');

/* ---------- Couleurs (dérivées du logo ADIE Group) ---------- */
:root {
  --green-50:  #eff6ed;
  --green-100: #d6e8d0;
  --green-200: #afd2a4;
  --green-300: #82b873;
  --green-400: #5a9c49;
  --green-500: #337a2e; /* brand primary */
  --green-600: #2a6526;
  --green-700: #224f1e;
  --green-800: #1a3c18;
  --green-900: #122810;

  --neutral-0:   #ffffff;
  --neutral-50:  #f7f6f6;
  --neutral-100: #edecec;
  --neutral-200: #dad8d8;
  --neutral-300: #bdbaba;
  --neutral-400: #948f8f;
  --neutral-500: #666161;
  --neutral-600: #514d4d;
  --neutral-700: #3d3a3a;
  --neutral-800: #292727;
  --neutral-900: #161515;
  --ink:         #0a0a0a;

  --division-impressions: #337a2e;
  --division-bureautique: #666161;
  --division-librairies:  #0a0a0a;

  --success-500: #337a2e;  --success-50: #eff6ed;
  --warning-500: #c8861a;  --warning-50: #fbf2e2;
  --danger-500:  #c2342b;  --danger-50:  #fbeceb;
  --info-500:    #2563a8;  --info-50:    #eaf1f9;

  --color-primary:        var(--green-500);
  --color-primary-hover:  var(--green-600);
  --color-primary-active: var(--green-700);
  --color-primary-subtle: var(--green-50);
  --color-on-primary:     var(--neutral-0);

  --text-strong:  var(--ink);
  --text-body:    var(--neutral-700);
  --text-muted:   var(--neutral-500);
  --text-subtle:  var(--neutral-400);
  --text-on-dark: var(--neutral-0);
  --text-link:    var(--green-600);

  --surface-page:   var(--neutral-0);
  --surface-muted:  var(--neutral-50);
  --surface-card:   var(--neutral-0);
  --surface-sunken: var(--neutral-100);
  --surface-dark:   var(--ink);
  --surface-brand:  var(--green-500);

  --border-subtle:  var(--neutral-200);
  --border-default: var(--neutral-300);
  --border-strong:  var(--neutral-400);
  --border-focus:   var(--green-500);

  /* ---------- Typographie ---------- */
  --font-display: 'Archivo', 'Segoe UI', system-ui, sans-serif;
  --font-body:    'Mulish', 'Segoe UI', system-ui, sans-serif;
  --font-mono:    'IBM Plex Mono', ui-monospace, 'SFMono-Regular', monospace;

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

  --text-display: 4.5rem; --text-h1: 3rem; --text-h2: 2.25rem; --text-h3: 1.625rem;
  --text-h4: 1.25rem; --text-lg: 1.125rem; --text-base: 1rem; --text-sm: 0.875rem; --text-xs: 0.75rem;

  --leading-tight: 1.08; --leading-snug: 1.25; --leading-normal: 1.55; --leading-relaxed: 1.7;
  --tracking-tight: -0.02em; --tracking-normal: 0; --tracking-wide: 0.04em; --tracking-caps: 0.12em;

  /* ---------- Espacements / rayons / ombres ---------- */
  --space-0: 0; --space-1: 0.25rem; --space-2: 0.5rem; --space-3: 0.75rem; --space-4: 1rem;
  --space-5: 1.5rem; --space-6: 2rem; --space-7: 2.5rem; --space-8: 3rem; --space-9: 4rem;
  --space-10: 5rem; --space-12: 6rem;

  --radius-none: 0; --radius-sm: 4px; --radius-md: 8px; --radius-lg: 12px; --radius-xl: 18px; --radius-pill: 999px;
  --border-thin: 1px; --border-base: 1.5px; --border-thick: 2px;

  --shadow-xs: 0 1px 2px rgba(10,10,10,0.06);
  --shadow-sm: 0 1px 3px rgba(10,10,10,0.08), 0 1px 2px rgba(10,10,10,0.04);
  --shadow-md: 0 4px 12px rgba(10,10,10,0.08), 0 2px 4px rgba(10,10,10,0.04);
  --shadow-lg: 0 12px 28px rgba(10,10,10,0.12), 0 4px 8px rgba(10,10,10,0.05);
  --shadow-brand: 0 8px 20px rgba(51,122,46,0.25);
  --ring: 0 0 0 3px rgba(51,122,46,0.28);

  --container-max: 1200px;
  --container-pad: var(--space-5);
  --section-gap: var(--space-12);

  --ease-standard: cubic-bezier(0.4, 0.0, 0.2, 1);
  --ease-out:      cubic-bezier(0.0, 0.0, 0.2, 1);
  --dur-fast: 120ms; --dur-normal: 200ms; --dur-slow: 320ms;
}

/* ---------- Reset léger & base ---------- */
*, *::before, *::after { box-sizing: border-box; }

html { scroll-behavior: smooth; }
html, body { max-width: 100%; overflow-x: hidden; }

body {
  margin: 0;
  font-family: var(--font-body);
  font-size: var(--text-base);
  line-height: var(--leading-normal);
  color: var(--text-body);
  background: var(--surface-page);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

h1, h2, h3, h4 {
  font-family: var(--font-display);
  color: var(--text-strong);
  line-height: var(--leading-tight);
  letter-spacing: var(--tracking-tight);
  margin: 0;
}
h1 { font-size: var(--text-h1); font-weight: var(--weight-black); }
h2 { font-size: var(--text-h2); font-weight: var(--weight-bold); }
h3 { font-size: var(--text-h3); font-weight: var(--weight-bold); }
h4 { font-size: var(--text-h4); font-weight: var(--weight-semibold); }

p { margin: 0; }
a { color: var(--text-link); text-decoration: none; }
a:hover { text-decoration: underline; }

::selection { background: var(--green-200); color: var(--ink); }

img { max-width: 100%; }

/* Accessibilité : focus clavier visible */
a:focus-visible, button:focus-visible, input:focus-visible, textarea:focus-visible {
  outline: 3px solid var(--green-400);
  outline-offset: 2px;
}

/* ---------- Animations partagées ---------- */
/* Scroll reveal (piloté par js/site.js) */
[data-reveal] { opacity: 0; transform: translateY(22px); transition: opacity 0.7s var(--ease-out), transform 0.7s var(--ease-out); }
[data-reveal][data-revealed] { opacity: 1 !important; transform: none !important; }

/* Marquee logos clients */
@keyframes adie-marquee { from { transform: translateX(0); } to { transform: translateX(-50%); } }
.adie-marquee-track { display: flex; align-items: center; width: max-content; animation: adie-marquee 38s linear infinite; }
.adie-marquee:hover .adie-marquee-track { animation-play-state: paused; }
.adie-marquee-logo { height: 58px; width: auto; max-width: 150px; object-fit: contain; opacity: 0.9; transition: opacity 0.2s ease; }
.adie-marquee-logo:hover { opacity: 1; }

/* Carte "sourcing mondial" — flux & pulsation du hub */
@keyframes adie-route-flow { to { stroke-dashoffset: -28; } }
@keyframes adie-hub-pulse { 0% { transform: scale(1); opacity: 0.55; } 70% { transform: scale(2.6); opacity: 0; } 100% { transform: scale(2.6); opacity: 0; } }
.adie-route { stroke-dasharray: 5 9; animation: adie-route-flow 1.1s linear infinite; }
.adie-hub-ring { transform-box: fill-box; transform-origin: center; animation: adie-hub-pulse 2.4s ease-out infinite; }

input::placeholder, textarea::placeholder { color: var(--neutral-400); }

@media (prefers-reduced-motion: reduce) {
  * { animation-duration: 0.001ms !important; animation-iteration-count: 1 !important; scroll-behavior: auto !important; }
  [data-reveal] { opacity: 1 !important; transform: none !important; transition: none !important; }
}

/* ============================================================
   Utilitaires de survol — reproduisent les "style-hover" des maquettes
   ============================================================ */
.adie-nav-link:hover { color: var(--green-600) !important; text-decoration: none; }
.adie-link-arrow { transition: gap var(--dur-normal) var(--ease-standard); }
.adie-link-arrow:hover { gap: 12px !important; text-decoration: none; }
.adie-cta { transition: transform var(--dur-fast) var(--ease-standard), filter var(--dur-normal) var(--ease-standard); }
.adie-cta:hover { transform: translateY(-2px); text-decoration: none; }
.adie-cta-bright:hover { transform: translateY(-2px); filter: brightness(1.05); text-decoration: none; }
.adie-btn-primary { transition: filter var(--dur-normal) var(--ease-standard), transform var(--dur-fast) var(--ease-standard); }
.adie-btn-primary:hover { filter: brightness(0.93); transform: translateY(-1px); text-decoration: none; }
.adie-outline { transition: background var(--dur-normal) var(--ease-standard); }
.adie-outline:hover { background: var(--green-50) !important; text-decoration: none; }
.adie-ghost-light { transition: background var(--dur-normal) var(--ease-standard); }
.adie-ghost-light:hover { background: rgba(255,255,255,0.1) !important; text-decoration: none; }
.adie-ghost-strong { transition: background var(--dur-normal) var(--ease-standard); }
.adie-ghost-strong:hover { background: rgba(255,255,255,0.18) !important; text-decoration: none; }
.adie-ghost-on-green { transition: background var(--dur-normal) var(--ease-standard); }
.adie-ghost-on-green:hover { background: rgba(255,255,255,0.2) !important; text-decoration: none; }
.adie-white-cta { transition: transform var(--dur-fast) var(--ease-standard); }
.adie-white-cta:hover { transform: translateY(-2px); text-decoration: none; }
.adie-service-card { transition: box-shadow var(--dur-normal) var(--ease-standard), transform var(--dur-normal) var(--ease-standard); cursor: pointer; }
.adie-service-card:hover { box-shadow: var(--shadow-md); transform: translateY(-3px); }
.adie-service-card:hover .adie-service-arrow { transform: translateX(3px); }
.adie-service-arrow { transition: transform var(--dur-normal) var(--ease-standard); }
.adie-footer-link { transition: color var(--dur-normal) var(--ease-standard); }
.adie-footer-link:hover { color: var(--green-300) !important; text-decoration: none; }
.adie-group-item { transition: background var(--dur-normal) var(--ease-standard); }
.adie-group-item:hover { background: var(--surface-muted) !important; text-decoration: none; }
.adie-contact-line:hover { color: var(--green-600) !important; text-decoration: none; }