/* ==========================================================================

   Neurêkha — Fondations : couleurs, typographie, échelles.



   PALETTE DE MARQUE (Coolors « Neurekha Website ») — les sept couleurs sont

   reprises telles quelles :

     #856391 mauve   #F8C83A or      #FF5CC9 rose    #A6D062 vert clair

     #F7F5AA crème   #8B8FBF pervenche               #194224 vert forêt



   Deux familles de variantes sont DÉRIVÉES de ces sept teintes, et elles seules :

     · les « -text » : versions assombries, seules autorisées à porter du texte,

       car l'or, le rose et le vert clair de marque échouent au contraste ;

     · les « -tint » : versions très pâles, pour les aplats de fond.

   Aucune couleur hors palette n'est introduite. Fond de page : blanc.



   TYPOGRAPHIE : Ealing Black pour les titres, Ealing Regular pour le texte,

   Ealing Thin réservée au logotype. Fontes à graisse unique : on ne demande

   JAMAIS `font-weight: bold`, qui fabriquerait un faux gras.

   ========================================================================== */



@font-face {

  font-family: "Ealing Black";

  src: url("../fonts/EalingBlack.woff2") format("woff2"),

       url("../fonts/EalingBlack.ttf") format("truetype");

  font-weight: 400; font-style: normal; font-display: swap;

}

@font-face {

  font-family: "Ealing Regular";

  src: url("../fonts/EalingRegular.woff2") format("woff2"),

       url("../fonts/EalingRegular.ttf") format("truetype");

  font-weight: 400; font-style: normal; font-display: swap;

}

@font-face {

  font-family: "Ealing Thin";

  src: url("../fonts/EalingThin.woff2") format("woff2"),

       url("../fonts/EalingThin.woff") format("woff"),

       url("../fonts/EalingThin.ttf") format("truetype");

  font-weight: 400; font-style: normal; font-display: swap;

}



:root {

  /* ---- Les sept couleurs de marque ------------------------------------ */

  --nk-mauve:   #856391;

  --nk-gold:    #F8C83A;

  --nk-pink:    #FF5CC9;

  --nk-green:   #A6D062;

  --nk-cream:   #F7F5AA;

  --nk-peri:    #8B8FBF;

  --nk-forest:  #194224;



  /* ---- Versions lisibles (dérivées) : les seules à porter du texte ----- */

  --nk-mauve-deep:  #6B4E76;
  --nk-mauve-dark:  #5A4064;   /* violet le plus profond : titres sur aplat teinté */   /* survol des boutons pleins */

  --nk-gold-text:   #8A6200;

  --nk-pink-text:   #A8207A;

  --nk-green-text:  #4A6B18;

  --nk-peri-text:   #4E5285;
  --nk-orange-text: #9E5500;   /* orange en PETIT corps (4,7:1) */
  --nk-orange-vif:  #E07800;   /* orange vif, réservé aux très grands titres :
                                  3,1:1, au-dessus du seuil des textes de +24 px */   /* l'or de marque assombri : seul orange qui
                                  porte du texte : 4,7:1 sur blanc, donc
                                  valable aussi en petit corps */



  /* ---- Aplats pâles (dérivés) ----------------------------------------- */

  --nk-mauve-tint:  #F2ECF5;

  --nk-gold-tint:   #FEF6DC;

  --nk-pink-tint:   #FFEBF8;

  --nk-green-tint:  #F0F7E2;

  --nk-cream-tint:  #FDFCEB;

  --nk-peri-tint:   #EDEEF6;



  /* ---- Fonds ---------------------------------------------------------- */

  --nk-bg:         #FFFFFF;

  --nk-bg-soft:    #FAF7FB;   /* mauve très pâle */
  --nk-bg-deep:    #6B4E76;   /* panneaux profonds : contact, pied de page */



  /* ---- Encre ----------------------------------------------------------

     Le mauve #856391 est la couleur dominante du site : c'est donc SA

     famille qui porte le texte et les grands panneaux. Les valeurs ci-dessous

     en sont les déclinaisons sombres, seules assez contrastées pour lire.

     Le vert forêt redevient un simple accent (étiquettes, pictogrammes).  */

  --nk-ink:        #3B2B45;   /* mauve très profond — 13:1 sur blanc */

  --nk-ink-soft:   #5D4C68;   /* secondaire */

  --nk-ink-muted:  #6F5F7A;   /* légendes */



  /* ---- Traits & ombres ------------------------------------------------ */

  --nk-line:        rgba(59, 43, 69, 0.14);

  --nk-line-strong: rgba(59, 43, 69, 0.30);

  --nk-elev-1: 0 1px 2px rgba(59,43,69,.05), 0 1px 1px rgba(59,43,69,.04);

  --nk-elev-2: 0 6px 18px rgba(59,43,69,.08), 0 2px 5px rgba(59,43,69,.05);

  --nk-elev-3: 0 18px 44px rgba(59,43,69,.11), 0 5px 12px rgba(59,43,69,.06);

  --nk-elev-4: 0 34px 74px rgba(59,43,69,.14), 0 10px 22px rgba(59,43,69,.07);



  /* ---- Typographie ---------------------------------------------------- */

  --nk-display: "Ealing Black", "Trebuchet MS", system-ui, sans-serif;

  --nk-body:    "Ealing Regular", "Trebuchet MS", system-ui, sans-serif;

  --nk-logo:    "Ealing Thin", "Ealing Regular", system-ui, sans-serif;



  --nk-d0: clamp(44px, 7.2vw, 104px);
  --nk-d1: clamp(36px, 5vw, 70px);
  --nk-d2: clamp(27px, 3.4vw, 44px);
  --nk-h3: clamp(22px, 2.2vw, 28px);
  --nk-lead: clamp(20px, 1.85vw, 26px);
  --nk-base: 19px;   /* lecture confortable : plancher à 16 px ailleurs */


  /* ---- Rythme --------------------------------------------------------- */

  --nk-s1: 4px;  --nk-s2: 8px;  --nk-s3: 12px; --nk-s4: 16px; --nk-s5: 24px;

  --nk-s6: 32px; --nk-s7: 48px; --nk-s8: 64px; --nk-s9: 96px; --nk-s10: 128px;

  --nk-section: clamp(58px, 6.5vw, 104px);

  --nk-gutter:  clamp(20px, 5vw, 88px);

  --nk-max:     1400px;



  /* ---- Rayons --------------------------------------------------------- */

  --nk-r-sm: 10px; --nk-r-md: 18px; --nk-r-lg: 28px; --nk-r-xl: 40px;

  --nk-r-pill: 999px;



  /* ---- Mouvement ------------------------------------------------------ */

  --nk-ease:    cubic-bezier(.22, 1, .36, 1);

  --nk-ease-io: cubic-bezier(.65, 0, .35, 1);

  --nk-dur:     260ms;

}