:root {
  --space-neg-1: -1px;

  /* A tidy, luxurious type scale */
  --fontSz-3: 0.25rem;            
  --fontSz-2: 0.5rem;            
  --fontSz-1: 0.9375rem;
  --fontSz0:  1rem;                                    
  --fontSz1:  1.18rem;   
  --fontSz2:  1.55rem;  
  --fontSz3:  2.1rem;   
  --fontSz4:  2.8rem;  
  --font-color: #1C1A19; /*dark warm antracite color*/
  --font-muted-color: #544a44; /*dark warm antracite color*/

  --space-rem-CTA: 10rem;          

  --site-width: 1200px;
  --site-bg: #faf9f6;
/* --header-bg scope: header, prop: bg */
  --header_bg_color: #e9e8e6;
  --header-bg: color-mix(in srgb, var(--header_bg_color), transparent 20%);
  --footer-bg: var(--header-bg);
  --overall-bg:var(--header-bg);

  --transition-fast: 180ms cubic-bezier(.2,.8,.2,1);
  --transition-medium: 360ms cubic-bezier(.2,.8,.2,1);
  --transition-slow: 540ms cubic-bezier(.2,.8,.2,1);
  --thumb-radius: 0;
  
  --card-radius: 12px;
  --card-border-width: 1px;
  --card-border-color: rgba(15, 15, 20, 0.12);
  --card-shadow: 0 8px 24px rgba(0,0,0,.04);
  --card-bg: var(--site-bg);
  --card-padding-x: var(--fontSz2);
  --card-padding-y: var(--fontSz2);
  --card-shadow-hover: 0 16px 40px rgba(0,0,0,.08);
  --card-hover-translate-y: -2px;
  --card-hover-border-color: rgba(15,15,20,0.20);
  --card-transition: transform var(--transition-slow), box-shadow var(--transition-slow), border-color var(--transition-slow);


  --header-h: 8vh;   /*for all the pages this is the size of the header on top */

  /*--font-serif: "Spectral", ui-serif, Georgia, "Times New Roman", serif;
  --font-sans: "Manrope", ui-sans-serif, system-ui, -apple-system, "Segoe UI",
               Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif;*/


  /* --av-accordion-body-lh: 1.65  | scope: av-accordion-body, prop: lh */
  --av-accordion-body-lh: 1.65;
  /* --av-accordion-trigger-radius: 6px  | scope: av-accordion-trigger, prop: radius */
  --av-accordion-trigger-radius: 6px;
  /* --av-accordion-trigger-shadow: 0 0 0 3px rgba(10,102,194,.25)  | scope: av-accordion-trigger, prop: shadow */
  --av-accordion-trigger-shadow: 0 0 0 3px rgba(10,102,194,.25);
  
  /* --btn-cta-bg: #d0111100  | scope: btn-cta, prop: bg */
  --btn-cta-bg: #d0111100;
  /* --btn-cta-bg-hover: #00000017  | scope: btn-cta, prop: bg */
  --btn-cta-bg-hover: #00000017;
  /* --btn-cta-border: #000000  | scope: btn-cta, prop: border */
  --btn-cta-border: #000000;
  /* --btn-cta-border-hover: #ff413300  | scope: btn-cta, prop: border */
  --btn-cta-border-hover: #bcbcbc;
  /* --btn-cta-color: #000000  | scope: btn-cta, prop: color */
  --btn-cta-color: var(--font-color);
  
  /* --btn-header-bg: #00000005  | scope: btn-header, prop: bg */
  --btn-header-bg: var(--header_bg_color);
  /* --btn-header-bg-hover: #00000017  | scope: btn-header, prop: bg */
  --btn-header-bg-hover: color-mix(in srgb, var(--header_bg_color) 80%, black 20%); 
  /* --btn-header-border: #00000000  | scope: btn-header, prop: border */
  --btn-header-border: #00000000;
  /* --btn-header-border-hover: #ff413300  | scope: btn-header, prop: border */
  --btn-header-border-hover: #ff413300;
  /* --btn-header-color: #000000  | scope: btn-header, prop: color */
  --btn-header-color: var(--font-color);
  
  
  /* --carousel-nav-bg scope: carousel-nav, prop: bg */
  --carousel-nav-bg: rgba(81, 81, 81, 0.506);
  /* --carousel-nav-bg-hover scope: carousel-nav, prop: bg */
  --carousel-nav-bg-hover: rgb(239, 236, 236); /*var(--btn-cta-bg);*/
  /* --carousel-nav-lh: 38px  | scope: carousel, prop: lh */
  --carousel-nav-lh: 38px;
  /* --carousel-nav-radius: 999px  | scope: carousel, prop: radius */
  --carousel-nav-radius: 12px;
  
  

  /* --h2-fs: 2rem  | scope: h2, prop: fs */
  
  
  /* --modal-backdrop-bg scope modal, prop: bg */
  --modal-backdrop-bg: rgba(0, 0, 0, 0.774);
  /* --modal-content-bg scope modal, prop: bg */
  --modal-content-bg: rgb(236, 238, 229);
  /* --modal-content-radius: 8px  | scope: modal-content, prop: radius */
  --modal-content-radius: 12px;
  

  --meta-font-size: 0.85rem;
  --meta-letter-spacing: .06em;

  --in-header-logo-height: 5vh;
  --in-footer-logo-width: 5vw;
}
