/* ============================================================
   LémAlp — Design tokens
   ============================================================ */

:root {
  /* --- Couleurs ------------------------------------------- */
  --leman:        #315B6D;  /* bleu Léman */
  --leman-deep:   #23414E;  /* bleu Léman profond */
  --leman-soft:   #4B7889;  /* bleu Léman clair (hover, filets) */
  --glacier:      #DCE6E9;  /* bleu glacier */
  --glacier-pale: #EDF2F3;  /* bleu glacier très clair */
  --noir:         #0D0F10;
  --noir-soft:    #1A1D1F;
  --creme:        #F5F4F0;  /* blanc cassé */
  --blanc:        #FFFFFF;

  --texte:        var(--noir);
  --texte-mute:   #5C6367;
  --filet:        rgba(13, 15, 16, .12);
  --filet-clair:  rgba(255, 255, 255, .18);

  /* --- Typographie ---------------------------------------- */
  --sans:  "Instrument Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif;
  --serif: "Instrument Serif", Georgia, "Times New Roman", serif;

  /* échelle fluide — jamais absurde sur mobile */
  --t-display: clamp(2.65rem, 1.45rem + 5.1vw, 6.6rem);
  --t-h1:      clamp(2.3rem, 1.35rem + 4.1vw, 5.2rem);
  --t-h2:      clamp(1.85rem, 1.2rem + 2.7vw, 3.6rem);
  --t-h3:      clamp(1.35rem, 1.05rem + 1.3vw, 2.05rem);
  --t-lead:    clamp(1.02rem, .95rem + .5vw, 1.35rem);
  --t-body:    clamp(.97rem, .93rem + .2vw, 1.08rem);
  --t-small:   .875rem;
  --t-label:   .688rem;

  --ls-label: .16em;
  --ls-tight: -.028em;

  /* --- Grille & espacements ------------------------------- */
  --marge:   clamp(1.25rem, 4.2vw, 4.5rem);
  --max:     1560px;
  --gutter:  clamp(1rem, 2vw, 2rem);

  --sp-3xs: .35rem;
  --sp-2xs: .65rem;
  --sp-xs:  1rem;
  --sp-s:   1.6rem;
  --sp-m:   clamp(2.2rem, 4vw, 3.4rem);
  --sp-l:   clamp(3.4rem, 7vw, 6.2rem);
  --sp-xl:  clamp(4.6rem, 10vw, 9rem);
  --sp-2xl: clamp(6rem, 13vw, 12rem);

  /* --- Mouvement ------------------------------------------ */
  --ease:      cubic-bezier(.22, .61, .36, 1);
  --ease-out:  cubic-bezier(.16, 1, .3, 1);
  --ease-soft: cubic-bezier(.4, 0, .2, 1);
  --d-fast:  .3s;
  --d-mid:   .55s;
  --d-slow:  .9s;

  --header-h: 68px;
}

@media (min-width: 900px) {
  :root { --header-h: 84px; }
}
