/* =========================================================
   POLYANCE — Design tokens
   Palette et typographies verrouillées par la marque.
   ⚠ Coco Gothic = fichiers d'essai Zetafonts (licence CC BY-NC,
   non-commerciale). Licence commerciale à acquérir sur
   zetafonts.com/coco-gothic avant mise en ligne publique.
   ⚠ Les chiffres (0-9) sont volontairement cassés dans ce fichier
   d'essai : ne jamais appliquer --font-display à un texte qui
   contient un chiffre (utiliser --font-body à la place).
   ========================================================= */

@font-face{
  font-family:'Coco Gothic';
  src:url('../fonts/CocoGothic-UltraLight.ttf') format('truetype');
  font-weight:200; font-style:normal; font-display:swap;
}
@font-face{
  font-family:'Coco Gothic';
  src:url('../fonts/CocoGothic-Light.ttf') format('truetype');
  font-weight:300; font-style:normal; font-display:swap;
}
@font-face{
  font-family:'Coco Gothic';
  src:url('../fonts/CocoGothic-Regular.ttf') format('truetype');
  font-weight:400; font-style:normal; font-display:swap;
}
@font-face{
  font-family:'Coco Gothic';
  src:url('../fonts/CocoGothic-Bold.ttf') format('truetype');
  font-weight:700; font-style:normal; font-display:swap;
}
@font-face{
  font-family:'Coco Gothic';
  src:url('../fonts/CocoGothic-Heavy.ttf') format('truetype');
  font-weight:800; font-style:normal; font-display:swap;
}
@font-face{
  font-family:'Coco Gothic';
  src:url('../fonts/CocoGothic-Italic.ttf') format('truetype');
  font-weight:400; font-style:italic; font-display:swap;
}

:root{
  /* couleurs de marque */
  --blue:        #053D8C;
  --blue-deep:   #032b63;
  --orange:      #FC7D1E;
  --orange-deep: #E2650A;
  --blue-tint:   #EAF2FC;
  --grey-tint:   #F5F7FA;
  --navy:        #10182B;
  --white:       #FFFFFF;

  /* dérivés */
  --ink:         var(--navy);
  --ink-soft:    #51586b;
  --ink-faint:   #8892a6;
  --line:        #E1E7F0;
  --line-soft:   #EEF2F8;

  --font-display:'Coco Gothic', 'Segoe UI', sans-serif;
  --font-body: 'DM Sans', ui-sans-serif, system-ui, sans-serif;

  --container: 1220px;
  --gutter: 28px;

  --radius-s: 10px;
  --radius-m: 18px;
  --radius-l: 28px;
  --radius-pill: 100px;

  --ease: cubic-bezier(.22,.9,.24,1);
  --ease-soft: cubic-bezier(.4,0,.2,1);
  --dur-s: .25s;
  --dur-m: .5s;
  --dur-l: .8s;

  --shadow-s: 0 1px 2px rgba(16,24,43,.04), 0 4px 14px -6px rgba(16,24,43,.10);
  --shadow-m: 0 8px 24px -8px rgba(16,24,43,.14), 0 2px 6px -2px rgba(16,24,43,.08);
  --shadow-l: 0 30px 70px -20px rgba(5,61,140,.28), 0 10px 24px -10px rgba(16,24,43,.12);
  --shadow-card: 0 1px 0 rgba(16,24,43,.03), 0 16px 40px -20px rgba(16,24,43,.18);
}

@media (max-width:760px){
  :root{ --gutter:20px; }
}
