/* Red Hat brand tokens, from unfairly.ai/brand-guidelines/redhat (checked 2026-10-30).
   Sizes, spacing and components were measured on https://www.redhat.com/en/about/brand/standards (Red Hat brand standards (redhat.com/en/about/brand/standards, every public tab read from the live HTML and its images) and the Red Hat Design System foundations and tokens (ux.redhat.com), fetched 2026-10-30. Login-gated pages (The Source, Brand Portal, gradient specs, logo downloads) were not read).
   Fonts: --font-* use the open stand-ins (load them from Google Fonts); --font-*-original name Red Hat's own faces, which you may only use if you have a licence. */
:root {
  --color-paper: #FFFFFF;
  --color-surface: #F2F2F2;
  --color-ink: #151515;
  --color-ink-muted: #4D4D4D;
  --color-accent: #EE0000;
  --color-on-accent: #FFFFFF;
  --color-accent-secondary: #5E40BE;
  --color-night: #151515;
  --color-on-night: #FFFFFF;
  --color-white: #FFFFFF;
  --color-black: #000000;
  --color-red-05: #FEF0F0;
  --color-red-10: #FCE3E3;
  --color-red-20: #FBC5C5;
  --color-red-30: #F9A8A8;
  --color-red-40: #F56E6E;
  --color-red-50: #EE0000;
  --color-red-60: #A60000;
  --color-red-70: #5F0000;
  --color-red-80: #3F0000;
  --color-gray-10: #F2F2F2;
  --color-gray-20: #E0E0E0;
  --color-gray-30: #C7C7C7;
  --color-gray-40: #A3A3A3;
  --color-gray-45: #8C8C8C;
  --color-gray-50: #707070;
  --color-gray-60: #4D4D4D;
  --color-gray-70: #383838;
  --color-gray-80: #292929;
  --color-gray-90: #1F1F1F;
  --color-gray-95: #151515;
  --color-orange-10: #FFE8CC;
  --color-orange-20: #FCCB8F;
  --color-orange-30: #F8AE54;
  --color-orange-40: #F5921B;
  --color-orange-50: #CA6C0F;
  --color-orange-60: #9E4A06;
  --color-orange-70: #732E00;
  --color-orange-80: #4D1F00;
  --color-yellow-10: #FFF4CC;
  --color-yellow-20: #FFE072;
  --color-yellow-30: #FFCC17;
  --color-yellow-40: #DCA614;
  --color-yellow-50: #B98412;
  --color-yellow-60: #96640F;
  --color-yellow-70: #73480B;
  --color-yellow-80: #54330B;
  --color-teal-10: #DAF2F2;
  --color-teal-20: #B9E5E5;
  --color-teal-30: #9AD8D8;
  --color-teal-40: #63BDBD;
  --color-teal-50: #37A3A3;
  --color-teal-60: #147878;
  --color-teal-70: #004D4D;
  --color-teal-80: #003333;
  --color-purple-10: #ECE6FF;
  --color-purple-20: #D0C5F4;
  --color-purple-30: #B6A6E9;
  --color-purple-40: #876FD4;
  --color-purple-50: #5E40BE;
  --color-purple-60: #3D2785;
  --color-purple-70: #21134D;
  --color-purple-80: #1B0D33;
  --color-success-green-10: #E9F7DF;
  --color-success-green-20: #D1F1BB;
  --color-success-green-30: #AFDC8F;
  --color-success-green-40: #87BB62;
  --color-success-green-50: #63993D;
  --color-success-green-60: #3D7317;
  --color-success-green-70: #204D00;
  --color-success-green-80: #183301;
  --color-danger-orange-10: #FFE3D9;
  --color-danger-orange-20: #FBBEA8;
  --color-danger-orange-30: #F89B78;
  --color-danger-orange-40: #F4784A;
  --color-danger-orange-50: #F0561D;
  --color-danger-orange-60: #B1380B;
  --color-danger-orange-70: #731F00;
  --color-danger-orange-80: #4C1405;
  --color-interaction-blue-10: #E0F0FF;
  --color-interaction-blue-20: #B9DAFC;
  --color-interaction-blue-30: #92C5F9;
  --color-interaction-blue-40: #4394E5;
  --color-interaction-blue-50: #0066CC;
  --color-interaction-blue-60: #004D99;
  --color-interaction-blue-70: #003366;
  --color-interaction-blue-80: #032142;
  --color-cool-tone-10: #FFE3DC;
  --color-cool-tone-20: #F7C8BB;
  --color-cool-tone-30: #E8A997;
  --color-cool-tone-40: #CE8873;
  --color-cool-tone-50: #A66552;
  --color-cool-tone-60: #724335;
  --color-cool-tone-70: #40251D;
  --color-warm-tone-10: #FFE9DC;
  --color-warm-tone-20: #F9D5C0;
  --color-warm-tone-30: #EDBEA1;
  --color-warm-tone-40: #D8A381;
  --color-warm-tone-50: #B88564;
  --color-warm-tone-60: #8E6549;
  --color-warm-tone-70: #664934;
  --color-button-primary-fill: #EE0000;
  --color-button-primary-text: #FFFFFF;
  --color-button-primary-ring: #EE0000;
  --color-button-secondary-on-light-text: #151515;
  --color-button-secondary-on-light-ring: #151515;
  --color-button-secondary-on-dark-text: #FFFFFF;
  --color-button-secondary-on-dark-ring: #FFFFFF;
  --color-cta-link-text: #0066CC;
  --color-cta-link-on-dark-text: #92C5F9;
  --color-inline-link-text: #0066CC;
  --color-tag-outline-purple-fill: #151515;
  --color-tag-outline-purple-text: #B6A6E9;
  --color-tag-filled-gray-fill: #E0E0E0;
  --color-tag-filled-gray-text: #151515;
  --color-card-outline-fill: #FFFFFF;
  --color-card-dark-fill: #151515;
  --color-card-dark-text: #FFFFFF;
  --color-accent-bar-stat-text: #151515;
  --color-tabs-vertical-text: #4D4D4D;
  --color-tabs-vertical-on: #151515;
  --color-nav-link-text: #151515;
  --color-footer-link-text: #FFFFFF;
  --color-language-select-fill: #151515;
  --color-language-select-text: #FFFFFF;
  --color-focus-ring-ring: #0066CC;
  --font-display: "Red Hat Display", RedHatDisplay, 'Red Hat Display', Helvetica, Arial, sans-serif;
  --font-body: "Red Hat Text", RedHatText, 'Red Hat Text', Helvetica, Arial, sans-serif;
  --font-mono: "Red Hat Mono", RedHatMono, 'Red Hat Mono', 'Courier New', Courier, monospace;
  --page-margin: 32px;
  --section-padding: 96px;
  --container-max: 1440px;
  --hero-text-max: 672px;
  --card-gap: 32px;
  --nav-height: 82px;
  --grid-gutter: 32px;
  --grid-columns: 12;
  --text-display-hero-size: 64px;
  --text-display-hero-line: 1.1;
  --text-display-hero-weight: 400;
  --text-display-statement-size: 36px;
  --text-display-statement-line: 1.3;
  --text-display-statement-weight: 500;
  --text-heading-l-size: 28px;
  --text-heading-l-line: 1.3;
  --text-heading-l-weight: 500;
  --text-heading-m-size: 24px;
  --text-heading-m-line: 1.3;
  --text-heading-m-weight: 500;
  --text-heading-s-size: 20px;
  --text-heading-s-line: 1.3;
  --text-heading-s-weight: 500;
  --text-heading-xs-size: 18px;
  --text-heading-xs-line: 1.3;
  --text-heading-xs-weight: 500;
  --text-lead-size: 20px;
  --text-lead-line: 1.5;
  --text-lead-weight: 400;
  --text-body-l-size: 18px;
  --text-body-l-line: 1.5;
  --text-body-l-weight: 400;
  --text-body-size: 16px;
  --text-body-line: 1.5;
  --text-body-weight: 400;
  --text-cta-size: 16px;
  --text-cta-line: 1.5;
  --text-cta-weight: 700;
  --text-small-size: 14px;
  --text-small-line: 1.5;
  --text-small-weight: 400;
  --text-caption-size: 12px;
  --text-caption-line: 1.5;
  --text-caption-weight: 400;
  --radius-button-primary: 64px;
  --radius-button-secondary-on-light: 64px;
  --radius-button-secondary-on-dark: 64px;
  --radius-cta-link: 6px;
  --radius-tag-outline-purple: 64px;
  --radius-tag-filled-gray: 64px;
  --radius-card-outline: 16px;
  --radius-card-dark: 16px;
  --radius-tabs-vertical: 3px;
  --radius-language-select: 3px;
  --radius-focus-ring: 3px;
  --icon-standard-icon: 36px;
  --icon-ui-icon: 32px;
  --icon-micron: 20px;
}
/* Phone values measured at 390px. Red Hat's breakpoint wasn't measured: 600px is our default. */
@media (max-width: 600px) {
  :root {
    --page-margin: 16px;
    --section-padding: 64px;
    --text-display-hero-size: 35px;
    --text-heading-l-size: 24px;
    --text-heading-m-size: 20px;
    --text-heading-s-size: 18px;
    --text-heading-xs-size: 16px;
    --text-lead-size: 18px;
    --text-body-l-size: 16px;
  }
}
.button-primary {
  box-sizing: border-box; display: inline-flex; align-items: center; justify-content: center;
  border: 0; cursor: pointer; text-decoration: none;
  height: 59px; padding: 0 32px; border-radius: 64px;
  background: #EE0000; color: #FFFFFF;
  box-shadow: inset 0 0 0 1px #EE0000;
  font: 700 16px/1 var(--font-body);
}
.button-primary:hover { background-color: #A60000; box-shadow: inset 0 0 0 1px #A60000; text-decoration: underline 1px; text-underline-offset: 4px; } /* observed */
.button-primary:focus-visible { background-color: #A60000; outline: 1px solid #FFFFFF; outline-offset: -3px; } /* observed */
.button-secondary-on-light {
  box-sizing: border-box; display: inline-flex; align-items: center; justify-content: center;
  border: 0; cursor: pointer; text-decoration: none;
  height: 59px; padding: 0 32px; border-radius: 64px;
  background: var(--color-transparent); color: #151515;
  box-shadow: inset 0 0 0 1px #151515;
  font: 700 16px/1 var(--font-body);
}
.button-secondary-on-light:hover { box-shadow: inset 0 0 0 2px #151515; text-decoration: underline 1px #8C8C8C; text-underline-offset: 4px; } /* observed */
.button-secondary-on-dark {
  box-sizing: border-box; display: inline-flex; align-items: center; justify-content: center;
  border: 0; cursor: pointer; text-decoration: none;
  height: 59px; padding: 0 32px; border-radius: 64px;
  background: var(--color-transparent); color: #FFFFFF;
  box-shadow: inset 0 0 0 1px #FFFFFF;
  font: 700 16px/1 var(--font-body);
}
.button-secondary-on-dark:hover { box-shadow: inset 0 0 0 2px #FFFFFF; text-decoration: underline 1px #A3A3A3; text-underline-offset: 4px; } /* observed */