:root {
  /* Color tokens */
  --color-command-blue: var(--gcid-command-blue, #192e42);
  --color-legacy-linen: var(--gcid-legacy-linen, #efe3c7);
  --color-new-haven-blue: var(--gcid-new-haven-blue, #274768);
  --color-dream-blue: #b2c5db;
  --color-golden-future: var(--gcid-golden-future, #c8ae79);
  --color-editorial-white: var(--gcid-editorial-white, #fefaee);
  --color-rich-black: var(--gcid-rich-black, #000104);
  --color-dark-gray: var(--gcid-dark-gray, #4d4d4f);
  --color-medium-gray: var(--gcid-medium-gray, #bbbcbe);
  --color-light-gray: var(--gcid-light-gray, #f0f2f4);
  --color-white: var(--gcid-white, #ffffff);

  /* Common utility colors */
  --color-overlay-black-12: var(--gcid-overlay-black-12, rgba(0, 0, 0, 0.12));
  --color-legacy-linen-10: var(--gcid-legacy-linen-10, rgba(239, 227, 199, 0.1));

  /* Font family tokens */
  --font-heading: var(--gvid-font-heading, "IvyPresto Headline", Georgia, serif);
  --font-heading-text: var(--gvid-font-heading-text, "IvyPresto Text", Georgia, serif);
  --font-body: var(--gvid-font-body, "Nexa", "Helvetica Neue", Arial, sans-serif);

  /* Type scale tokens */
  --text-h1-size: var(--gvid-text-h1-size, 64px);
  --text-h1-line-height: var(--gvid-text-h1-line-height, 68px);
  --text-h1-letter-spacing: var(--gvid-text-h1-letter-spacing, 1.92px);

  --text-h2-size: var(--gvid-text-h2-size, 44px);
  --text-h2-line-height: var(--gvid-text-h2-line-height, 50px);
  --text-h2-letter-spacing: var(--gvid-text-h2-letter-spacing, 1.76px);

  --text-h2-small-size: var(--gvid-text-h2-small-size, 36px);
  --text-h2-small-line-height: var(--gvid-text-h2-small-line-height, 40px);
  --text-h2-small-letter-spacing: var(--gvid-text-h2-small-letter-spacing, 1.44px);

  --text-h3-size: var(--gvid-text-h3-size, 28px);
  --text-h3-line-height: var(--gvid-text-h3-line-height, 34px);
  --text-h3-letter-spacing: 0;

  --text-h4-size: var(--gvid-text-h4-size, 22px);
  --text-h4-line-height: var(--gvid-text-h4-line-height, 26px);
  --text-h4-letter-spacing: var(--gvid-text-h4-letter-spacing, 0.22px);

  --text-h5-size: var(--gvid-text-h5-size, 17px);
  --text-h5-line-height: var(--gvid-text-h5-line-height, 21px);
  --text-h5-letter-spacing: var(--gvid-text-h5-letter-spacing, 0.34px);

  --text-intro-size: var(--gvid-text-intro-size, 20px);
  --text-intro-line-height: var(--gvid-text-intro-line-height, 1.4);
  --text-intro-letter-spacing: 0;

  --text-paragraph-size: var(--gvid-text-paragraph-size, 15px);
  --text-paragraph-line-height: var(--gvid-text-paragraph-line-height, 1.4);
  --text-paragraph-letter-spacing: 0;

  --text-caption-size: var(--gvid-text-caption-size, 12px);
  --text-caption-line-height: var(--gvid-text-caption-line-height, 16px);
  --text-caption-letter-spacing: var(--gvid-text-caption-letter-spacing, 0.12px);

  --text-button-size: var(--gvid-text-button-size, 12px);
  --text-button-line-height: normal;
  --text-button-letter-spacing: var(--gvid-text-button-letter-spacing, 0.48px);

  --text-footnote-size: var(--gvid-text-footnote-size, 9px);
  --text-footnote-line-height: var(--gvid-text-footnote-line-height, 13px);
  --text-footnote-letter-spacing: var(--gvid-text-footnote-letter-spacing, 0.18px);

  /* Font weight tokens */
  --font-weight-light: 300;
  --font-weight-regular: 400;
  --font-weight-bold: 700;
  --font-weight-extra-bold: 800;

  /* Layout and spacing tokens */
  --layout-max-width: var(--gvid-layout-max-width, 1440px);
  --layout-content-width: var(--gvid-layout-content-width, 1152px);
  --layout-gutter-desktop: var(--gvid-layout-gutter-desktop, 144px);
  --layout-gutter-tablet-landscape: var(--gvid-layout-gutter-tablet-landscape, 80px);
  --layout-gutter-tablet-portrait: var(--gvid-layout-gutter-tablet-portrait, 48px);
  --layout-gutter-mobile: var(--gvid-layout-gutter-mobile, 24px);

  --section-padding-y-min: var(--gvid-section-padding-y-min, 80px);
  --section-padding-y-max: var(--gvid-section-padding-y-max, 100px);

  --space-xxs: 6px;
  --space-xs: var(--gvid-space-xs, 11px);
  --space-sm: var(--gvid-space-sm, 16px);
  --space-md: var(--gvid-space-md, 24px);
  --space-lg: var(--gvid-space-lg, 40px);
  --space-xl: var(--gvid-space-xl, 60px);
  --space-2xl: var(--gvid-space-2xl, 80px);
  --space-3xl: var(--gvid-space-3xl, 100px);

  --card-padding: var(--gvid-card-padding, 40px);
  --button-padding-x: var(--gvid-button-padding-x, 24px);
  --button-padding-y: 10px;
  /* --button-padding-y: var(--gvid-button-padding-y, 10px); */
  --tag-padding-y: var(--gvid-tag-padding-y, 8px);
  --tag-padding-x: var(--gvid-tag-padding-x, 11px);

  /* Border and radius tokens */
  --border-width-default: var(--gvid-border-width-default, 1px);
  --radius-button: var(--gvid-radius-button, 70px);
  --radius-tag: var(--gvid-radius-tag, 50px);
  --radius-card: var(--gvid-radius-card, 4px);

  /* Divi color variables without a correlating custom token */
  --divi-primary-color: var(--gcid-primary-color, #192e42);
  --divi-secondary-color: var(--gcid-secondary-color, #2ea3f2);
  --divi-heading-color: var(--gcid-heading-color, #1c2a50);
  --divi-body-color: var(--gcid-body-color, #363636);
  --color-legacy-linen-20: var(--gcid-sarxcgvkrr, rgba(239, 227, 199, 0.2));

  /* Divi typography variables without a correlating custom token */
  --text-footer-menu-size: var(--gvid-venmqvufr8, 12px);
  --text-footer-menu-letter-spacing: var(--gvid-3rrwievd55, 0.24px);
  --divi-heading-font: var(--et_global_heading_font, "IvyPresto Headline");
  --divi-body-font: var(--et_global_body_font, "Nexa");
  --divi-heading-font-weight: var(--et_global_heading_font_weight, 500);
  --divi-body-font-weight: var(--et_global_body_font_weight, 500);

  /* Divi layout variables without a correlating custom token */
  --divi-content-width: var(--content-width, 80%);
  --divi-content-max-width: var(--content-max-width, 1080px);
  --divi-section-padding: var(--section-padding, 56px);
  --divi-section-gutter: var(--section-gutter, 60px);
  --divi-row-gutter-horizontal: var(--row-gutter-horizontal, 5.5%);
  --divi-row-gutter-vertical: var(--row-gutter-vertical, 40px);
  --divi-module-gutter: var(--module-gutter, 30px);
}

/* Responsive token adjustments */
@media (max-width: 1279px) {
  :root {
    --layout-gutter-desktop: var(--layout-gutter-tablet-landscape);
  }
}

@media (max-width: 1023px) {
  :root {
    --layout-gutter-desktop: var(--layout-gutter-tablet-portrait);
  }
}

@media (max-width: 767px) {
  :root {
    --layout-gutter-desktop: var(--layout-gutter-mobile);

    /* Mobile type scale proposal from the plan */
    --text-h1-size: 40px;
    --text-h1-line-height: 44px;
    --text-h2-size: 32px;
    --text-h2-line-height: 36px;
    --text-h2-small-size: 28px;
    --text-h2-small-line-height: 32px;
    --text-h3-size: 24px;
    --text-h3-line-height: 30px;
  }
}
