:root {
  /* Colors */
  --color-bg:               #FFFFFF;
  --color-bg-alt:           #F5F5F5;
  --color-text-primary:     #1A1A1A;
  --color-text-secondary:   #404040;
  --color-text-muted:       #888888;
  --color-border:           #EEEEEE;
  --color-cta:              #000000;
  --color-cta-text:         #FFFFFF;
  --color-cta-hover:        #1A1A1A;
  --color-link:             #0066CC;
  --color-overlay:          rgba(0, 0, 0, 0.7);
  --color-yellow:           #F2A900;
  --color-yellow-faint:     #faf6ed;
  --color-yellow-faint:     #f5f3ef;
  --color-blue-primary:     #253746;
  --color-blue-secondary:   #41748D;
  --color-blue-light:       #9EB5CB;
  --color-blue-muted:       #5B6770;
  --color-blue-muted-dark:  #425563;
  --color-red:              #C54644;
  --color-cool-gray:        #D9D9D6;
  --color-green-faint:      #BEC6C4;
  --color-gray-0:           #FCFCFC;
  --color-gray-1:           #F7F7F7;
  --color-gray-2:           #EEEEEE;
  --color-gray-3:           #CCCCCC;
  --color-gray-4:           #DDDDDD;
  --color-gray-5:           #999999;
  --color-gray-6:           #666666;
  --color-gray-7:           #333333;

  /* Typography */
  --font-family-base:       "Lato", -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif;
  --font-weight-regular:    400;
  --font-weight-medium:     500;
  --font-weight-semibold:   600;
  --font-weight-bold:       700;

  --font-size-hero:         clamp(2rem, 4.5vw, 3.25rem);
  --font-size-h2:           clamp(1.75rem, 4vw, 2.5rem);
  --font-size-h3:           1.5rem;
  --font-size-body-lg:      1.5rem;
  --font-size-body:         1.625rem;
  --font-size-form:         1.125rem;
  --font-size-small:        0.875rem;
  --font-size-xs:           0.75rem;

  --line-height-tight:      1.15;
  --line-height-normal:     1.5;
  --line-height-relaxed:    1.7;

  /* Spacing */
  --space-xxs:              0.25rem;
  --space-xs:               0.5rem;
  --space-sm:               0.75rem;
  --space-md:               1rem;
  --space-lg:               1.5rem;
  --space-xl:               2rem;
  --space-2xl:              3rem;
  --space-3xl:              4rem;
  --space-section-y:        clamp(3rem, 8vw, 6rem);

  /* Layout */
  //--content-max-width:      1440px;
  --content-max-width:      1600px;
  --content-narrow-width:   900px;
  --header-height:          120px;

  /* Other */
  --radius-sm:              2px;
  --radius-md:              4px;
  --radius:                 6px;
  --radius-lg:              8px;
  --radius-xl:              40px;
  --transition-fast:        150ms ease;
  --transition-normal:      250ms ease;
}

@media (max-width: 767px) {
  :root {
    --header-height: 76px;
  }
}
