
  /**
--------------------------------------------------
* CSS Variables
--------------------------------------------------
*/
  :root {
    /* UI Colors */
    --p-brand: #4596E4;
    --p-brand-contrast: #231F20;
    --p-brand-active-bg: #4596E41A; /* 10% opacity */
    --p-border: #D5D7DB;
    --p-border-dark: #FFFFFF0F;
    --p-focus: #181818;
    --p-success: #1B7E4B;
    --p-error: #D71D43;
    --p-info: #0078d4;
    --p-warning: #f59e0b;
    --p-live: #ff0000;
    --p-dark-mode: 0;

    /* Backgrounds */
    --p-bg: #FFFFFF;
    --p-bg-rgb: 255, 255, 255;
    --p-bg-light: #EEEDE3;
    --p-bg-light-rgb: 238, 237, 227;
    --p-bg-dark: #231F20;
    --p-bg-dark-rgb: 35, 31, 32;
    --p-bg-dark-700: #231F20B3;

    /* Body - General */
    --p-font: 'system-ui', sans-serif;
    --p-text-color: #231F20;
    --p-text-color-contrast-50: #231F200D; /* 5% opacity */
    --p-text-color-contrast-100: #231F201A; /* 10% opacity */
    --p-text-color-contrast-200: #231F2033; /* 20% opacity */
    --p-text-color-contrast-300: #231F204D; /* 20% opacity */
    --p-text-color-light: #F1F1F1;
    --p-text-color-light-contrast-50: #F1F1F10D; /* 5% opacity */
    --p-text-color-light-contrast-100: #F1F1F11A; /* 10% opacity */
    --p-text-color-light-contrast-200: #F1F1F133; /* 20% opacity */
    --p-text-color-light-contrast-300: #F1F1F14D; /* 30% opacity */
    --p-text-color-meta: #231F20CC; /* 80% opacity */
    --p-text-meta-opacity: 0.8;
    --p-font-size-smallest: 0.65rem;
    --p-font-size-small: 0.75rem;
    --p-font-size-normal: 1rem;
    --p-body-font-size: clamp(1rem, 0.7122rem + 0.6004vw, 1.2rem);
    --p-body-font-weight: inherit;
    --p-body-font-style: normal;
    --p-body-line-height: 1.6;
    --p-body-letter-spacing: 0em;

    /* Links */
    --p-link-text-decoration: Underline;
    --p-link-text-decoration-hover: None;
    --p-link-text-color: #2D2D2D;
    --p-link-text-color-hover: #2D2D2D;
    --p-link-text-color-dark: #F1F1F1;
    --p-link-text-color-dark-hover: #F1F1F1;

    /* Headings */
    --p-heading-color: #231F20;
    --p-heading-color-light: #F1F1F1;

    --p-h1-font-size: clamp(2.7rem, 0.8293rem + 3.9024vw, 4rem);
    --p-h1-font-weight: 600;
    --p-h1-font-style: normal;
    --p-h1-line-height: 1;
    --p-h1-letter-spacing: 0em;
    --p-h1-font: 'system-ui', sans-serif;
    --p-h1-transform: None;
    --p-h1-margin-bottom: 0.5em;
    --p-h1-color: initial;

    --p-h2-font-size: clamp(2.4rem, 1.5366rem + 1.8011vw, 3rem);
    --p-h2-font-weight: 600;
    --p-h2-font-style: normal;
    --p-h2-line-height: 1.1;
    --p-h2-letter-spacing: 0em;
    --p-h2-font: 'system-ui', sans-serif;
    --p-h2-transform: None;
    --p-h2-margin-bottom: 0.3em;
    --p-h2-color: initial;

    --p-h3-font-size: clamp(1.8rem, 1.2244rem + 1.2008vw, 2.2rem);
    --p-h3-font-weight: 600;
    --p-h3-font-style: normal;
    --p-h3-line-height: 1.1;
    --p-h3-letter-spacing: 0em;
    --p-h3-font: 'system-ui', sans-serif;
    --p-h3-transform: None;
    --p-h3-margin-bottom: 0.5em;
    --p-h3-color: initial;

    --p-h4-font-size: clamp(1.3rem, 0.8683rem + 0.9006vw, 1.6rem);
    --p-h4-font-weight: 700;
    --p-h4-font-style: normal;
    --p-h4-line-height: 1.3;
    --p-h4-letter-spacing: 0em;
    --p-h4-font: 'system-ui', sans-serif;
    --p-h4-transform: None;
    --p-h4-margin-bottom: 0.5em;
    --p-h4-color: initial;

    --p-h5-font-size: clamp(1.2rem, 1.2rem + 0vw, 1.2rem);
    --p-h5-font-weight: 700;
    --p-h5-font-style: normal;
    --p-h5-line-height: 1.4;
    --p-h5-letter-spacing: 0em;
    --p-h5-font: 'system-ui', sans-serif;
    --p-h5-transform: None;
    --p-h5-margin-bottom: 0.5em;
    --p-h5-color: initial;

    --p-h6-font-size: clamp(0.9rem, 0.7561rem + 0.3002vw, 1rem);
    --p-h6-font-weight: 700;
    --p-h6-font-style: normal;
    --p-h6-line-height: 1.4;
    --p-h6-letter-spacing: 0em;
    --p-h6-font: 'system-ui', sans-serif;
    --p-h6-transform: None;
    --p-h6-margin-bottom: 0.5em;
    --p-h6-color: initial;

    --p-h-pre-font-size: clamp(0.8rem, 0.8rem + 0vw, 0.8rem);
    --p-h-pre-font-weight: inherit;
    --p-h-pre-font-style: normal;
    --p-h-pre-line-height: 1.6;
    --p-h-pre-letter-spacing: 0.1em;
    --p-h-pre-font: 'system-ui', sans-serif;
    --p-h-pre-transform: None;
    --p-h-pre-margin-bottom: 0.4em;
    --p-h-pre-color: initial;

    /* Paragraphs */
    --p-p-margin-bottom: 1em;

    --p-preamble-font-size: clamp(1.1rem, 0.6683rem + 0.9006vw, 1.4rem);
    --p-preamble-font-weight: inherit;
    --p-preamble-font-style: normal;
    --p-preamble-line-height: 1.4;
    --p-preamble-letter-spacing: 0em;
    --p-preamble-font: 'system-ui', sans-serif;
    --p-preamble-margin-bottom: 1em;

    /* Grid and sections */
    --p-gap: clamp(0.9375rem, -1.311rem + 4.6904vw, 2.5rem);
    --p-section-padding: clamp(1.875rem, -2.622rem + 9.3809vw, 5rem);
    --p-container-width: 1400px;
    --p-text-max-width: 799px;
    --p-outer-wrap-width: 2400px;

    /* Video */
    --p-video-grid-gap: 18px;
    --p-video-item-width: 283px;

    /* Inputs */
    --p-input-height: 2.75rem;
    --p-input-height-small: 2.1875rem;
    --p-input-padding: 0.625rem;
    --p-input-margin-bottom: 0.9375rem;
    --p-input-font: var(--p-font);
    --p-input-font-weight: inherit;
    --p-input-font-size: 1rem;
    --p-input-letter-spacing: 0em;
    --p-input-border-radius: 4px;
    --p-input-border-width: 1px;
    --p-input-bg: #FFFFFF;
    --p-input-bg-hover: #FFFFFF;
    --p-input-bg-focus: #FFFFFF;
    --p-input-text-color: #333333;
    --p-input-placeholder-text-color: #AAAAAA;
    --p-input-border-color: #D5D7DB;
    --p-input-border-color-hover: #B3B5B8;
    --p-input-border-color-focus: #E2C353;

    /* Buttons */
    --p-button-font: 'system-ui', sans-serif;
    --p-button-font-weight: inherit;
    --p-button-font-style: null;
    --p-button-transform: None;
    --p-button-font-size: 0.9rem;
    --p-button-letter-spacing: 0em;
    --p-button-border-radius: 4px;
    --p-button-border-width: 0px;
    --p-button-padding-inline: 1.2em;
    --p-button-border-min-width: 1px; /* This needs to be 1 if --p-button-border-width is set to 0 else inherit */
    --p-button-primary-bg: #4596E4;
    --p-button-primary-bg-hover: #D0E5F5;
    --p-button-primary-text-color: #FFFFFF;
    --p-button-primary-text-color-hover: #4596E4;
    --p-button-primary-border-color: #4596E4;
    --p-button-primary-border-color-hover: #D0E5F5;
    --p-button-secondary-bg: #2D2D2D;
    --p-button-secondary-bg-hover: #444444;
    --p-button-secondary-text-color: #FFFFFF;
    --p-button-secondary-text-color-hover: #FFFFFF;
    --p-button-secondary-border-color: #252525;
    --p-button-secondary-border-color-hover: #252525;

    /* Misc */
    --p-shadow: 0 10px 25px -10px rgba(0, 0, 0, 0.1);
    --p-boxed-bg: white;
    --p-skeleton-border-radius: 5px;
    --p-skeleton-loading-rgb: 255, 255, 255;
    --p-skeleton-bg: #eee;

    /* Header */
    --p-header-bg: #FFFFFF;
    --p-header-border-color: #ADAFA6;
    --p-header-text-color: #231F20;
    --p-header-contrast-100: #231F201A; /* 10% opacity */
    --p-header-contrast-200: #231F2033; /* 20% opacity */
    --p-header-contrast-300: #231F204D; /* 30% opacity */
    --p-header-contrast-400: #231F2066; /* 40% opacity */
    --p-header-height: 70px;
    --p-logo-height: 55%;
    --p-main-nav-font-size: 1rem;
    --p-main-nav-gap: 25px;
    --p-header-border-width: 1px;

    --p-header-font: 'system-ui', sans-serif;
    --p-main-nav-font-weight: 400;
    --p-main-nav-font-style: null;
    --p-header-text-color-hover: #231F20;
    --p-main-nav-hover-decoration: Underline;
    --p-main-nav-hover-decoration-color: #231F205E;
    --p-main-nav-selected-color: #231F20;
    --p-main-nav-selected-decoration: Underline;
    --p-main-nav-selected-decoration-color: #2B7B57;

    /* Footer */
    --p-footer-bg: #231F20;
    --p-footer-text-color: #EEEDE3;
    --p-footer-contrast-100: #EEEDE31A; /* 10% opacity */
    --p-footer-contrast-200: #EEEDE333; /* 20% opacity */
    --p-footer-contrast-300: #EEEDE34D; /* 30% opacity */
    --p-footer-contrast-400: #EEEDE366; /* 40% opacity */
    --p-footer-padding: 66px;
    --p-footer-border-color: #231F20;
    --p-footer-logo-width: 50px;
    --p-footer-border-width: 0px;
    --p-footer-link-color: #EEEDE3;
    --p-footer-link-color-hover: #FFFFFF;
    --p-footer-link-text-decoration: None;
    --p-footer-link-text-decoration-hover: Underline;

    /* Sidebar */
    --p-sidebar-bg: #EEEDE3;
    --p-template-sidebar-bg: #FFFFFF;
    --p-sidebar-border-width: 1px;
    --p-sidebar-border-color: #00000022;
    --p-sidebar-link-color: #20231E;
    --p-sidebar-link-color-hover: #20231E;
    --p-sidebar-link-hover-decoration: Underline;
    --p-sidebar-link-hover-text-decoration-color: #20231E5E;
    --p-sidebar-link-font-size: 1rem;
    --p-sidebar-link-font: 'system-ui', sans-serif;
    --p-sidebar-link-font-weight: 400;
    --p-sidebar-link-font-style: null;
    --p-sidebar-link-selected-decoration: Underline;
    --p-sidebar-link-selected-decoration-color: #4596E4;
    --p-sidebar-link-selected-color: #20231E;
  }
