/* tokens.css -- Yale School of Management, Executive Education (YGELP)
 *
 * GENERATED by build/build_tokens.py. Do not hand-edit: run the generator.
 * Source: design system HkMrF2hwpGd1V495vZZb3H, discovered from the partner file
 * DXRbFWUlwOXt3tPgTFXofa -- never hardcoded.
 * 236 variables resolved, 66 of which vary by device mode.
 *
 * Breakpoints follow the library's own min/max-breakpoint variables:
 *   mobile 0-600   tablet 601-1024   desktop 1025+
 * Layout media queries in styles.css use the same two widths, so a token and the
 * layout it sizes always switch together.
 *
 * Verify with:  python3 build/check_tokens.py
 */
:root {
  --button-color-bg-primary: #000f9f;
  --button-color-bg-secondary: #ffffff;
  --button-color-border-dark: #000f9f;
  --button-color-border-light: #bec8e0;
  --button-color-border-primary: #000f9f;
  --button-color-border-secondary: #000f9f;
  --button-color-focus-ring: #2563eb;
  --button-color-hover-primary: #001c42;
  --button-color-hover-secondary: #bec8e0;
  --button-color-text-dark: #000f9f;
  --button-color-text-light: #ffffff;
  --button-gap: 8px;
  --button-icon-size: 20px;
  --button-min-height-lg: 56px;
  --button-min-height-md: 48px;
  --button-min-height-sm: 42px;
  --button-padding-lg: 18px;
  --button-padding-md: 14px;
  --button-padding-sm: 10px;
  --button-padding-xl: 20px;
  --button-padding-xs: 8px;
  --button-radius-lg: 16px;
  --button-radius-md: 8px;
  --button-radius-sm: 4px;
  --button-stroke-width: 1px;
  --card-color-bg: #ffffff;
  --card-color-bg-inverse: #000f9f;
  --card-color-bg-light: #bec8e0;
  --card-color-border: #bec8e0;
  --card-color-text: #121212;
  --card-color-text-inverse: #ffffff;
  --card-gap: 16px;
  --card-padding: 24px;
  --card-padding-off-set-hero: 40px;
  --card-radius-md: 16px;
  --card-radius-none: 0px;
  --card-radius-sm: 8px;
  --card-radius-xl: 56px;
  --card-stroke-width: 1px;
  --color-background-canvas: #ffffff;
  --color-background-dark: #001c42;
  --color-background-inverse: #000f9f;
  --color-background-subtle: #e6e6e6;
  --color-background-surface: #bec8e0;
  --color-border-black: #000000;
  --color-border-default: #121212;
  --color-border-inverse: #ffffff;
  --color-border-strong: #001c42;
  --color-border-subtle: #bec8e0;
  --color-border-transparent: rgba(255, 255, 255, 0);
  --color-border-white: #ffffff;
  --color-icon-blue: #000f9f;
  --color-icon-default: #121212;
  --color-icon-inverse: #ffffff;
  --color-icon-text: #121212;
  --color-link-default: #000f9f;
  --color-link-focus: #1e40af;
  --color-link-google-links: #1a0dab;
  --color-link-hover: #bec8e0;
  --color-link-inverse: #ffffff;
  --color-link-sms-links: #247ee5;
  --color-overlay-black: #000000;
  --color-text-error: #bd5319;
  --color-text-inverse: #ffffff;
  --color-text-muted: #bec8e0;
  --color-text-primary: #121212;
  --color-text-secondary: #000f9f;
  --color-text-valid: #5f712d;
  --container-gap-2xl: 40px;
  --container-gap-2xs: 12px;
  --container-gap-3xl: 64px;
  --container-gap-3xs: 8px;
  --container-gap-4xs: 6px;
  --container-gap-5xs: 4px;
  --container-gap-6xs: 2px;
  --container-gap-lg: 28px;
  --container-gap-md: 24px;
  --container-gap-neg-30: -30px;
  --container-gap-neg-60: -60px;
  --container-gap-sm: 20px;
  --container-gap-xl: 30px;
  --container-gap-xs: 16px;
  --container-padding-2xl: 36px;
  --container-padding-2xs: 14px;
  --container-padding-3xl: 40px;
  --container-padding-3xs: 10px;
  --container-padding-4xl: 48px;
  --container-padding-4xs: 8px;
  --container-padding-5xl: 56px;
  --container-padding-5xs: 6px;
  --container-padding-6xs: 4px;
  --container-padding-lg: 28px;
  --container-padding-md: 24px;
  --container-padding-none: 0px;
  --container-padding-sm: 20px;
  --container-padding-xl: 30px;
  --container-padding-xs: 18px;
  --container-roundedcorner-2xs: 8px;
  --container-roundedcorner-3xs: 4px;
  --container-roundedcorner-lg: 28px;
  --container-roundedcorner-md: 24px;
  --container-roundedcorner-sm: 20px;
  --container-roundedcorner-xl: 30px;
  --container-roundedcorner-xs: 16px;
  --container-size-2xl: 1000px;
  --container-size-2xs: 180px;
  --container-size-3xs: 160px;
  --container-size-4xs: 120px;
  --container-size-5xs: 100px;
  --container-size-lg: 600px;
  --container-size-md: 500px;
  --container-size-sm: 300px;
  --container-size-xl: 800px;
  --container-size-xs: 240px;
  --devices-mobile: 300px;
  --devices-tablet: 800px;
  --divider-thick: 3px;
  --divider-thin: 1px;
  --icon-size-2xl: 40px;
  --icon-size-2xs: 12px;
  --icon-size-3xl: 80px;
  --icon-size-3xs: 10px;
  --icon-size-4xs: 8px;
  --icon-size-lg: 24px;
  --icon-size-md: 20px;
  --icon-size-sm: 16px;
  --icon-size-xl: 32px;
  --icon-size-xs: 14px;
  --input-color-bg: #f3f3f3;
  --input-color-bg-hover: #ffffff;
  --input-color-border: #121212;
  --input-color-border-focus: #000f9f;
  --input-color-placeholder: #978d85;
  --input-color-text: #121212;
  --input-height: 40px;
  --input-label-color: #121212;
  --input-label-font-size: 12px;
  --input-label-gap: 8px;
  --input-padding-x: 14px;
  --input-padding-y: 10px;
  --input-radius: 8px;
  --input-stroke-width: 1px;
  --shape-radius-3xl: 80px;
  --shape-radius-md: 16px;
  --shape-radius-sm: 8px;
  --shape-radius-xs: 2px;
  --shape-stroke-default: 1px;
  --shape-stroke-strong: 3px;
  --stroke-width-border: 2px;
  --stroke-width-default: 1px;
  --stroke-width-divider: 4px;
  --stroke-width-headline: 4px;
  --stroke-width-nav-underline: 6px;
  --text-font-family-body-font: YaleNew;
  --text-font-family-figma-notes-font: Arial;
  --text-font-family-headings-font: Neue Haas Unica W1G;
  --text-paragraph-spacing-lg: 24px;
  --text-paragraph-spacing-md: 18px;
  --text-paragraph-spacing-sm: 16px;
  --text-paragraph-spacing-xl: 32px;
  --text-paragraph-spacing-xs: 14px;
  --text-size-heading-2xl: 48px;
  --text-size-heading-3xl: 60px;
  --text-size-heading-4xl: 72px;
  --text-size-heading-5xl: 80px;
  --text-size-heading-6xl: 96px;
  --text-size-heading-lg: 32px;
  --text-size-heading-md: 24px;
  --text-size-heading-sm: 18px;
  --text-size-heading-xl: 40px;
  --text-size-heading-xs: 16px;
  --text-size-label-2xs: 12px;
  --text-size-label-3xs: 10px;
  --text-size-label-lg: 20px;
  --text-size-label-md: 18px;
  --text-size-label-sm: 16px;
  --text-size-label-xl: 24px;
  --text-size-label-xs: 14px;
  --text-size-paragraph-2xs: 12px;
  --text-size-paragraph-3xs: 10px;
  --text-size-paragraph-lg: 20px;
  --text-size-paragraph-md: 18px;
  --text-size-paragraph-sm: 16px;
  --text-size-paragraph-xl: 24px;
  --text-size-paragraph-xs: 14px;
  --text-weight-bold: 700;
  --text-weight-emphasis: Italic;
  --text-weight-extra-bold: 800;
  --text-weight-light: 300;
  --text-weight-normal: 400;
  --text-width-max-width-large-text: 800px;
  --text-width-max-width-small-text: 700px;
  --wrapper-padding-2xl: 64px;
  --wrapper-padding-3xl: 80px;
  --wrapper-padding-4xl: 120px;
  --wrapper-padding-lg: 36px;
  --wrapper-padding-md: 24px;
  --wrapper-padding-sm: 20px;
  --wrapper-padding-xl: 48px;
  --wrapper-padding-xs: 16px;
  --wrapper-width-2xs: 700px;
  --wrapper-width-lg: 1440px;
  --wrapper-width-md: 1200px;
  --wrapper-width-sm: 1000px;
  --wrapper-width-xs: 800px;

  /* ---- declared non-Figma values (see NON_FIGMA in check_tokens.py) ----
     Line heights live on Figma TEXT STYLES, not variables: the H-tags and
     Display Headlines styles are lineHeight 1.2, the Paragraph styles 1.5.
     (No literal slash-star inside this comment: scripts/check-css.py counts
     comment openers, and a style-prefix glob written with one read as an
     unclosed block on 2026-09-11.) */
  --text-leading-tight: 1.2;
  --text-leading-body: 1.5;
  --text-leading-address: 1.4;

  --font-headings: "neue-haas-unica", "Neue Haas Unica W1G", "Helvetica Neue", Helvetica, Arial, sans-serif;
  --font-body: "YaleNew", Georgia, "Times New Roman", serif;
}

/* ---- tablet: 601-1024px ---- */
@media (max-width: 1024px) {
  :root {
    --container-size-2xl: 1200px;
    --devices-tablet: 700px;
    --text-size-heading-md: 20px;
    --wrapper-padding-2xl: 56px;
    --wrapper-padding-3xl: 64px;
    --wrapper-padding-4xl: 80px;
    --wrapper-padding-lg: 30px;
    --wrapper-padding-md: 22px;
    --wrapper-padding-sm: 18px;
    --wrapper-padding-xl: 40px;
    --wrapper-padding-xs: 14px;
  }
}

/* ---- mobile: 0-600px ---- */
@media (max-width: 600px) {
  :root {
    --button-gap: 6px;
    --button-padding-lg: 16px;
    --button-padding-xl: 18px;
    --card-gap: 14px;
    --card-padding: 20px;
    --card-padding-off-set-hero: 0px;
    --container-gap-2xl: 36px;
    --container-gap-2xs: 10px;
    --container-gap-3xl: 56px;
    --container-gap-3xs: 6px;
    --container-gap-4xs: 4px;
    --container-gap-5xs: 2px;
    --container-gap-lg: 22px;
    --container-gap-md: 18px;
    --container-gap-sm: 16px;
    --container-gap-xl: 24px;
    --container-gap-xs: 14px;
    --container-padding-2xl: 30px;
    --container-padding-3xl: 36px;
    --container-padding-4xl: 40px;
    --container-padding-5xl: 48px;
    --container-padding-lg: 24px;
    --container-padding-md: 20px;
    --container-padding-sm: 18px;
    --container-padding-xl: 26px;
    --container-padding-xs: 16px;
    --container-size-2xs: 160px;
    --container-size-3xs: 120px;
    --container-size-4xs: 100px;
    --container-size-5xs: 80px;
    --container-size-sm: 240px;
    --container-size-xs: 180px;
    --devices-mobile: 240px;
    --input-label-gap: 6px;
    --text-size-heading-2xl: 40px;
    --text-size-heading-3xl: 48px;
    --text-size-heading-4xl: 64px;
    --text-size-heading-5xl: 56px;
    --text-size-heading-6xl: 80px;
    --text-size-heading-lg: 24px;
    --text-size-heading-md: 18px;
    --text-size-heading-sm: 16px;
    --text-size-heading-xl: 32px;
    --text-size-heading-xs: 14px;
    --text-size-label-2xs: 11px;
    --text-size-label-lg: 18px;
    --text-size-label-md: 16px;
    --text-size-label-sm: 14px;
    --text-size-label-xl: 22px;
    --text-size-label-xs: 12px;
    --text-size-paragraph-2xs: 11px;
    --text-size-paragraph-lg: 18px;
    --text-size-paragraph-md: 16px;
    --text-size-paragraph-sm: 14px;
    --text-size-paragraph-xl: 20px;
    --text-size-paragraph-xs: 12px;
    --wrapper-padding-2xl: 40px;
    --wrapper-padding-3xl: 48px;
    --wrapper-padding-4xl: 56px;
    --wrapper-padding-lg: 26px;
    --wrapper-padding-md: 20px;
    --wrapper-padding-sm: 16px;
    --wrapper-padding-xl: 30px;
    --wrapper-padding-xs: 12px;
  }
}