/* Fonts */
@font-face {
  font-family: 'Asap';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('../fonts/asap-v30-latin_latin-ext-regular.woff2') format('woff2');
}
@font-face {
  font-family: 'Asap';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('../fonts/asap-v30-latin_latin-ext-700.woff2') format('woff2');
}
/* Variables */
:root {
  /*
   * EYO design tokens
   * Breakpoint tokens are documentation values. CSS custom properties cannot be
   * interpolated in media queries, so matching literal values are used there.
   */
  --eyo-color-primary: #e1121b;
  --eyo-color-primary-hover: #bd0e16;
  --eyo-color-primary-active: #970b12;
  --eyo-color-primary-soft: #fff0f1;
  --eyo-color-charcoal: #17191c;
  --eyo-color-text: #20242a;
  --eyo-color-text-secondary: #5b6470;
  --eyo-color-text-muted: #7b8490;
  --eyo-color-page: #f5f6f8;
  --eyo-color-surface: #ffffff;
  --eyo-color-surface-alt: #eef1f4;
  --eyo-color-border: #dfe3e8;
  --eyo-color-border-strong: #b9c0c9;
  --eyo-color-focus: #1769aa;
  --eyo-color-success: #16794b;
  --eyo-color-success-soft: #e9f7f0;
  --eyo-color-warning: #9a5800;
  --eyo-color-warning-soft: #fff5df;
  --eyo-color-danger: #c62828;
  --eyo-color-danger-soft: #fff0f0;
  --eyo-color-info: #1769aa;
  --eyo-color-info-soft: #edf6ff;

  --eyo-font-sans: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --eyo-font-display: var(--eyo-font-sans);
  --eyo-font-mono: ui-monospace, SFMono-Regular, Consolas, "Liberation Mono", monospace;
  --eyo-font-size-xs: 0.75rem;
  --eyo-font-size-sm: 0.875rem;
  --eyo-font-size-base: 1rem;
  --eyo-font-size-lg: 1.125rem;
  --eyo-font-size-xl: 1.25rem;
  --eyo-font-size-2xl: 1.5rem;
  --eyo-font-size-3xl: 1.875rem;
  --eyo-font-size-4xl: 2.25rem;
  --eyo-font-weight-regular: 400;
  --eyo-font-weight-medium: 500;
  --eyo-font-weight-semibold: 600;
  --eyo-font-weight-bold: 700;
  --eyo-line-height-tight: 1.15;
  --eyo-line-height-normal: 1.5;
  --eyo-line-height-relaxed: 1.7;
  --eyo-letter-spacing-tight: -0.02em;
  --eyo-letter-spacing-wide: 0.04em;

  --eyo-space-0: 0;
  --eyo-space-1: 0.25rem;
  --eyo-space-2: 0.5rem;
  --eyo-space-3: 0.75rem;
  --eyo-space-4: 1rem;
  --eyo-space-5: 1.25rem;
  --eyo-space-6: 1.5rem;
  --eyo-space-8: 2rem;
  --eyo-space-10: 2.5rem;
  --eyo-space-12: 3rem;
  --eyo-space-16: 4rem;
  --eyo-space-20: 5rem;
  --eyo-space-24: 6rem;

  --eyo-radius-sm: 0.25rem;
  --eyo-radius-md: 0.5rem;
  --eyo-radius-lg: 0.75rem;
  --eyo-radius-xl: 1rem;
  --eyo-radius-pill: 999px;
  --eyo-shadow-subtle: 0 1px 2px rgba(23, 25, 28, 0.08);
  --eyo-shadow-card: 0 8px 24px rgba(23, 25, 28, 0.09);
  --eyo-shadow-nav: 0 4px 16px rgba(23, 25, 28, 0.1);
  --eyo-shadow-overlay: 0 16px 48px rgba(23, 25, 28, 0.18);
  --eyo-shadow-modal: 0 24px 64px rgba(23, 25, 28, 0.24);

  --eyo-layout-max: 90rem;
  --eyo-layout-readable: 44rem;
  --eyo-layout-gutter-mobile: 1rem;
  --eyo-layout-gutter-tablet: 1.5rem;
  --eyo-layout-gutter-desktop: 2rem;
  --eyo-breakpoint-compact: 20rem;
  --eyo-breakpoint-regular: 30rem;
  --eyo-breakpoint-tablet: 48rem;
  --eyo-breakpoint-desktop: 64rem;
  --eyo-breakpoint-wide: 90rem;
  --eyo-z-header: 100;
  --eyo-z-dropdown: 200;
  --eyo-z-drawer: 300;
  --eyo-z-modal: 400;

  --eyo-duration-fast: 120ms;
  --eyo-duration-base: 200ms;
  --eyo-duration-slow: 320ms;
  --eyo-ease-standard: cubic-bezier(0.2, 0, 0, 1);
  --eyo-ease-emphasized: cubic-bezier(0.2, 0.8, 0.2, 1);

  /* General */
  --border-radius: var(--eyo-radius-md);
  --gutter-x: var(--eyo-space-2);
  --gutter-y: var(--eyo-space-4);
  --link-text-color: var(--eyo-color-text);
  --shadow-color: rgba(23, 25, 28, 0.3);
  --whitespace-color: var(--eyo-color-surface);
  --site-background-color: var(--eyo-color-page);
  --sidebar-width: 300px;
  /* Important Notice */
  --important-notice-background-color: #222;
  --important-notice-text-color: #fff;
  --header-background-color: transparent;
  --header-text-color: var(--default-text-color);
  /* Cookie Notice */
  --cookie-notice-background-color: rgba(45, 45, 56, 0.75);
  --cookie-notice-text-color: #fff;
  /* Navigation */
  --navigation-background-color: #d7dae3;
  --navigation-background-color-hover: rgba(0, 0, 0, 0.05);
  --navigation-background-color-active: rgba(0, 0, 0, 0.15);
  --navigation-text-color: #222;
  --navigation-text-color-hover: var(--navigation-text-color);
  --navigation-text-color-active: var(--navigation-text-color);
  /* Navigation */
  --offcanvas-background-color: var(--navigation-background-color);
  --offcanvas-text-color: var(--navigation-text-color);
  /* Defaults */
  --default-background-color: var(--eyo-color-surface-alt);
  --default-border-color: var(--eyo-color-border);
  --default-line-height: var(--eyo-line-height-normal);
  --default-text-font: var(--eyo-font-sans);
  --default-text-color: var(--eyo-color-text);
  --default-text-size: 16px;
  /* Buttons */
  --default-button-background-color: #f9f9f9;
  --default-button-background-color-hover: #f3f3f3;
  --default-button-background-color-active: #f3f3f3;
  --default-button-border-color: rgba(0, 0, 0, 0.075);
  --default-button-text-color: #333;
  --primary-button-background-color: var(--eyo-color-primary);
  --primary-button-background-color-hover: var(--eyo-color-primary-hover);
  --primary-button-background-color-active: var(--eyo-color-primary-active);
  --primary-button-border-color: rgba(0, 0, 0, 0.075);
  --primary-button-text-color: #fff;
  --success-button-background-color: var(--eyo-color-success);
  --success-button-background-color-hover: #11643d;
  --success-button-background-color-active: #0d4f30;
  --success-button-border-color: rgba(0, 0, 0, 0.075);
  --success-button-text-color: #fff;
  --warning-button-background-color: var(--eyo-color-warning);
  --warning-button-background-color-hover: #814900;
  --warning-button-background-color-active: #693c00;
  --warning-button-border-color: rgba(0, 0, 0, 0.1);
  --warning-button-text-color: #fff;
  --danger-button-background-color: var(--eyo-color-danger);
  --danger-button-background-color-hover: #aa2020;
  --danger-button-background-color-active: #8e1b1b;
  --danger-button-border-color: rgba(0, 0, 0, 0.1);
  --danger-button-text-color: #fff;
  /* Notices */
  --default-notice-background-color: #e6e8ed;
  --default-notice-text-color: #000;
  --default-notice-border-color: #e6e8ed;
  --primary-notice-background-color: #3ba5c6;
  --primary-notice-text-color: #fff;
  --primary-notice-border-color: #3ba5c6;
  --success-notice-background-color: #98cc34;
  --success-notice-text-color: #fff;
  --success-notice-border-color: #98cc34;
  --warning-notice-background-color: #ffcc66;
  --warning-notice-text-color: #aa0000;
  --warning-notice-border-color: #ffcc66;
  --danger-notice-background-color: #d9534f;
  --danger-notice-text-color: #fff;
  --danger-notice-border-color: #d9534f;
  /* Breadcrumbs */
  --breadcrumbs-background-color: #ededf1;
  --breadcrumbs-text-color: #555;
  --breadcrumbs-border-color: transparent;
  /* Cards */
  --card-background-color: #fff;
  --card-text-color: var(--default-text-color);
  --card-border-color: var(--default-border-color);
  --card-header-background-color: transparent;
  --card-header-text-color: var(--card-text-color);
  --card-body-background-color: transparent;
  --card-footer-background-color: #fbfbfd;
  /* Input */
  --input-background-color: #fafafc;
  --input-padding-x: 1.5em;
  --input-padding-y: 0.5em;
  --input-text-color: #000;
  --input-border-radius: 1em;
  /* Pills */
  --pills-background-color: transparent;
  --pills-background-color-active: #d7dae3;
  --pills-background-color-hover: #f1f3f7;
  --pills-text-color: var(--default-text-color);
  --pills-text-color-active: #222;
  /* Tabs */
  --tabs-pane-background-color: #eff2f5;
  --tabs-pane-border-color: var(--tabs-pane-background-color);
  --tabs-background-color: #e8e8eb;
  --tabs-background-color-active: #fff;
  --tabs-text-color: #333;
  --tabs-text-color-active: var(--tabs-text-color);
  --tabs-border-color: var(--tabs-background-color);
  --tabs-border-color-active: var(--tabs-background-color-active);
  --tabs-content-background-color: #fff;
  /* Dropdowns */
  --dropdown-menu-background-color: #fff;
  --dropdown-menu-item-background-color: var(--dropdown-menu-background-color);
  --dropdown-menu-item-text-color: var(--default-text-color);
  /* Tables */
  --table-striped-row-background-odd: #f5f6f9;
  --table-striped-row-background-even: #fff;
  --table-row-hover-background: #ececec;
  /* Pagination */
  --pagination-background-color: var(--default-background-color);
  --pagination-background-color-active: #d7dae3;
  --pagination-background-color-hover: #e7e8ed;
  --pagination-text-color: var(--default-text-color);
  --pagination-text-color-active: var(--default-text-color);
  --pagination-text-color-hover: var(--default-text-color);
  --pagination-border-color: var(--default-border-color);
  /* Footer */
  --footer-background-color: #ededf1;
  --footer-title-color: var(--default-text-color);
  --footer-text-color: var(--default-text-color);
  /* Copyright */
  --copyright-background-color: #e2e2e7;
  --copyright-text-color: var(--default-text-color);
}
@media (min-width: 768px) {
  :root {
    --gutter-x: 1rem;
    --gutter-y: 1rem;
  }
}
@media (min-width: 992px) {
  :root {
    --gutter-x: 1.5rem;
    --gutter-y: 1.5rem;
  }
}
@media (min-width: 1200px) {
  :root {
    --gutter-x: 2rem;
    --gutter-y: 2rem;
  }
}