
:root {
  --dl-layout-size-large: 144px;
  --dl-layout-size-small: 48px;
  --dl-layout-space-unit: 16px;
  --dl-layout-size-medium: 96px;
  --dl-layout-size-xlarge: 192px;
  --dl-layout-size-xsmall: 16px;
  --dl-color-default-black: rgba(0, 0, 0, 1);
  --dl-color-default-white: rgba(255, 255, 255, 1);
  --dl-color-theme-accent1: #FFFFFF;
  --dl-color-theme-accent2: #F5D1B0;
  --dl-layout-radius-round: 50%;
  --dl-layout-size-xxlarge: 288px;
  --dl-color-theme-primary1: #BF4408;
  --dl-color-theme-primary2: #E65103;
  --dl-layout-size-maxwidth: 1400px;
  --dl-layout-radius-radius2: 2px;
  --dl-layout-radius-radius4: 4px;
  --dl-layout-radius-radius8: 8px;
  --dl-layout-space-halfunit: 8px; 
  --dl-layout-space-sixunits: 96px;
  --dl-layout-space-twounits: 32px;
  --dl-color-theme-secondary1: #FFFFFF;
  --dl-color-theme-secondary2: #FBF1EB;
  --dl-layout-space-fiveunits: 80px;
  --dl-layout-space-fourunits: 64px;
  --dl-layout-space-threeunits: 48px;
  --dl-color-theme-neutral-dark: #191818;
  --dl-layout-radius-cardradius: 8px;
  --dl-color-theme-neutral-light: #FBFAF9;
  --dl-layout-radius-imageradius: 8px;
  --dl-layout-radius-inputradius: 24px;
  --dl-layout-radius-buttonradius: 24px;
  --dl-layout-space-oneandhalfunits: 24px;
}

/* ========================================
   TYPOGRAPHY CLASSES
   ======================================== */

.heading1 {
  font-style: normal;
  font-family: Recoleta;
  font-weight: 700;
  font-stretch: normal;
  letter-spacing: -0.01em;
  /* Mobile first - below 768px */
  font-size: 40px;
  line-height: 1.1;
}

/* Tablet - 768px to 1024px */
@media (min-width: 768px) and (max-width: 1024px) {
  .heading1 {
    font-size: 52px;
  }
}

/* Desktop - above 1024px */
@media (min-width: 1025px) {
  .heading1 {
    font-size: 60px;
  }
}

.heading2 {
  font-style: normal;
  font-family: Recoleta;
  font-weight: 700;
  font-stretch: normal;
  letter-spacing: 0em;
  /* Mobile first - below 768px */
  font-size: 32px;
}

/* Tablet - 768px to 1024px */
@media (min-width: 768px) and (max-width: 1024px) {
  .heading2 {
    font-size: 40px;
  }
}

/* Desktop - above 1024px */
@media (min-width: 1025px) {
  .heading2 {
    font-size: 44px;
  }
}

.heading3 {
  font-style: normal;
  font-family: Recoleta;
  font-weight: 700;
  font-stretch: normal;
  letter-spacing: 0em;
  /* Mobile first - below 768px */
  font-size: 26px;
}

/* Tablet - 768px to 1024px */
@media (min-width: 768px) and (max-width: 1024px) {
  .heading3 {
    font-size: 28px;
  }
}

/* Desktop - above 1024px */
@media (min-width: 1025px) {
  .heading3 {
    font-size: 36px;
  }
}

.heading4 {
  font-style: normal;
  font-family: var(--font-primary);
  font-weight: 700;
  font-stretch: normal;
  letter-spacing: 0em;
  /* Mobile first - below 768px */
  font-size: 18px;
}

/* Tablet - 768px to 1024px */
@media (min-width: 768px) and (max-width: 1024px) {
  .heading4 {
    font-size: 18px;
  }
}

/* Desktop - above 1024px */
@media (min-width: 1025px) {
  .heading4 {
    font-size: 22px;
  }
}

.heading5 {
  font-style: normal;
  font-family: var(--font-primary);
  font-weight: 700;
  font-stretch: normal;
  letter-spacing: 0em;
  /* Mobile first - below 768px */
  font-size: 16px;
}

/* Tablet - 768px to 1024px */
@media (min-width: 768px) and (max-width: 1024px) {
  .heading5 {
    font-size: 16px;
  }
}

/* Desktop - above 1024px */
@media (min-width: 1025px) {
  .heading5 {
    font-size: 18px;
  }
}

.subheading {
  font-size: 14px;
  font-style: normal;
  font-family: var(--font-primary);
  font-weight: 500;
  font-stretch: normal;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

.body-lg {
  font-size: 18px;
  font-style: normal;
  font-family: var(--font-primary);
  font-weight: 400;
  font-stretch: normal;
  letter-spacing: 0em;
}

.body-sm {
  font-size: 16px;
  font-style: normal;
  font-family: var(--font-primary);
  font-weight: 400;
  font-stretch: normal;
  letter-spacing: 0em;
}

.sans-serif-3xs {
  font-size: 16px;
  font-style: normal;
  font-family: var(--font-primary);
  font-weight: 700;
  font-stretch: normal;
  letter-spacing: 0em;
}

.content {
  font-size: 16px;
  font-family: Inter;
  font-weight: 400;
  line-height: 1.15;
  text-transform: none;
  text-decoration: none;
}
