/* =========================================================
   AIKLORE - tokens.css
   Tokens de design (variables :root), reset et styles de base.
   Ordre de chargement : 1er (NE PAS reordonner : cascade CSS).
   ========================================================= */
:root{
  --dark:#191c1f;
  --black:#000000;
  --white:#ffffff;
  --surface:#f4f4f4;
  --grey-tone:#c9c9cd;
  --muted:#8d969e;
  --slate:#505a63;
  --teal:#00a87e;
  --cobalt:#494fdf;
  --display:'Ubuntu', Arial, sans-serif;
  --body:'Inter', Arial, sans-serif;
  --ease:cubic-bezier(.16,1,.3,1);
  /* Gouttières larges comme Revolut (~10% sur grand écran), contenu plafonné ~1500px */
  --pad:max(24px, 10vw, calc((100vw - 1500px) / 2));
  /* Rythme vertical : chaque section fait au moins un écran */
  --vpad:clamp(80px, 10vh, 130px);
}
*{margin:0;padding:0;box-sizing:border-box;}
html{scroll-behavior:auto;} /* le smooth scroll est géré par Lenis (JS) */
body{font-family:var(--body);color:var(--dark);background:var(--white);-webkit-font-smoothing:antialiased;line-height:1.5;letter-spacing:0.16px;overflow-x:hidden;}
img{display:block;max-width:100%;}
a{text-decoration:none;color:inherit;}
h1,h2,h3{font-family:var(--display);font-weight:500;line-height:1.04;}
:focus-visible{outline:2px solid var(--teal);outline-offset:3px;border-radius:4px;}