@font-face {
  font-family: 'Geist';
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url('../fonts/geist-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Geist';
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url('../fonts/geist-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-0101, U+0103-0113, U+0116-012B, U+012E-0130, U+0132-0137, U+0139-013E, U+0141-0148, U+014A-014D, U+0150-0151, U+0154-017E, U+018F, U+0192, U+01A0-01A1, U+01AF-01B0, U+01CD-01CE, U+01E4-01E9, U+0218-021B, U+0237, U+0259, U+02B9, U+02C7-02C8, U+02DD, U+1E20-1E21, U+1E80-1E85, U+1E9E, U+1EF2-1EF9, U+2020, U+20AA, U+20B1, U+20B4, U+20B9, U+20BD, U+A78B-A78C;
}
@font-face {
  font-family: 'Young Serif';
  src: url('../fonts/young-serif-400.woff2') format('woff2');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

:root {
  
  color-scheme: light;
  
  --cyc: #D6D7D3;            
  --penombre: #858985;       
  --lumiere: #F5F6F3;        
  --nuit: #0C1016;           
  --el-nuit-2: #151E2B;      
  --el-bande: #131A24;       
  --blanc: #FFFFFF;          
  --noir: #000000;           

  --encre: #0C1016;          
  --encre-2: #2B2F33;        
  --encre-3: #3A3E40;        
  --anneau-logo: #10151B;    

  --or: #8A5A22;             
  --or-texte: #7A4E1A;       
  --or-nuit: #C48A4A;        
  --or-vif: #D7A55A;         
  --or-vif-survol: #E2B477;  
  --or-encre: #140D05;       
  --el-cta-survol: #E7B877;  
  --or-halo: rgba(231, 169, 83, .16); 

  --or-disque: var(--or-nuit);

  --froid: #344E74;          
  --froid-nuit: #7FA1D0;     
  --froid-pale: #8FA0BB;     
  --el-halo-bleu: #5076AA;   

  --creme: #F3F0EA;          
  --nuit-texte-2: #9AA2B1;   
  --el-texte-2: #A3AAB6;     

  --filet-ecran: #CDD0CA;
  --filet-ecran-doux: #E6E8E3;
  --encre-ecran: #4B5058;
  --gris-etat: #6B7078;
  --fond-mini: #F7F8F6;
  --grille-ecran: #ECEDEA;
  --barre-valeur: #C9CCC6;
  --gris-ecran: #D6D9D3;

  --da-voile-025: #ffffff06;

  --marge: clamp(16px, 3.4vw, 48px);
  --gouttiere: clamp(16px, 5.4vw, 96px);
  --barre-h: 64px;

  --f-titre: 'Young Serif', Georgia, 'Times New Roman', serif;
  --f-corps: 'Geist', 'Helvetica Neue', Arial, sans-serif;
  --f-chiffre: 'Geist', 'Helvetica Neue', Arial, sans-serif;

  --fs-1: 0.75rem;      
  --fs-2: 0.84375rem;   
  --fs-3: 0.90625rem;   
  --fs-4: 1rem;         
  --fs-5: 1.125rem;     
  --fs-6: 1.3125rem;    
  --fs-2-3: clamp(var(--fs-2), 1.3vw, var(--fs-3));
  --fs-3-4: clamp(var(--fs-3), 1.4vw, var(--fs-4));
  --fs-4-5: clamp(var(--fs-4), 1.6vw, var(--fs-5));
  --fs-5-6: clamp(var(--fs-5), 1.9vw, var(--fs-6));
  --rf: clamp(1, calc(1rem / 16px), 1.5);
  --fs-d1: calc(clamp(20px, 2.2vw, 26px) * var(--rf));   
  --fs-d2: calc(clamp(24px, 3vw, 34px) * var(--rf));     
  --fs-d3: calc(clamp(28px, 4vw, 44px) * var(--rf));     
  --fs-d4: calc(clamp(34px, 5.4vw, 64px) * var(--rf));   
  --fs-hero: calc(clamp(56px, min(6.6vw, 10.5svh), 96px) * var(--rf));

  --t-reponse: 180ms;        
  --t-passage: 420ms;        
  --t-geste: 320ms;          
  --e-doux: cubic-bezier(0.4, 0, 0.2, 1);        
  --e-sortie: cubic-bezier(0, 0, .2, 1);         
}
@media (max-width: 760px), (max-width: 1040px) and (max-height: 500px) {
  :root { --barre-h: 56px; }
}
@media (max-width: 760px) {
  :root { --gouttiere: 16px; --marge: 16px; }
}

@media (min-width: 1921px) {
  :root { --gouttiere: calc(96px + (100vw - 1920px) / 2); --marge: calc(48px + (100vw - 1920px) / 2); }
}