@font-face {
  font-family: "Open Sans";
  src: url("/assets/fonts/ingeus-uk-sg/open-sans-400.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Open Sans";
  src: url("/assets/fonts/ingeus-uk-sg/open-sans-600.woff2") format("woff2");
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Open Sans";
  src: url("/assets/fonts/ingeus-uk-sg/open-sans-700.woff2") format("woff2");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

:root {
  --color-text: #212529;
  --color-accent: #fbba00;
  --color-subtle: #f5f5f5;
  --color-inverse: #212529;

  --color-primary: var(--color-text);
  --color-secondary: var(--color-inverse);
  --color-on-secondary: #ffffff;

  --font-sans: "Open Sans", system-ui, -apple-system, sans-serif;
  --font-heading: "Open Sans", system-ui, -apple-system, sans-serif;
  --font-heading-weight: 700;

  --color-footer-divider: #ebebeb;

  /* Button tokens — inverted from default: yellow bg with dark text */
  --color-btn-bg: var(--color-accent);
  --color-btn-text: var(--color-text);
  --color-btn-hover-text: #ffffff;
  --color-btn-active-bg: var(--color-primary);
  --color-btn-active-text: #ffffff;
  --color-btn-dark-bg: var(--color-accent);
  --color-btn-outline-border: var(--color-accent);
  --color-btn-outline-hover-bg: var(--color-accent);
  --color-btn-outline-hover-text: var(--color-text);
  --color-btn-outline-hover-border: var(--color-accent);
  --color-btn-outline-border-dark: var(--color-accent);
  --color-btn-outline-hover-bg-dark: var(--color-accent);
  --color-accent-on-dark: var(--color-accent);
}

body {
  font-family: var(--font-sans, Arial, Helvetica, sans-serif);
}

/* Footer headings and disclaimer in accent color for Ingeus brands */
footer h3 {
  color: var(--color-accent);
}

footer .prose p {
  color: var(--color-accent);
}

/* Exception: global content section keeps on-secondary text color */
footer [data-testid="footer-global-content"] p {
  color: var(--color-on-secondary);
}

/* HeroBanner text styling for ingeus-sg */

[data-slot="hero-banner"][data-variant="advance"] .prose {
  color: var(--color-secondary);
}

[data-slot="hero-banner"][data-variant="advance"] .prose p {
  color: var(--color-secondary);
}

[data-slot="hero-banner"][data-variant="advance"],
[data-slot="hero-banner"][data-variant="advance"] .bg-brand-primary {
  background-color: var(--color-accent);
}

[data-slot="hero-banner"][data-variant="advance"] a[data-variant="secondary"] {
  border-color: var(--color-secondary);
}

[data-slot="hero-banner"][data-variant="advance"]
  a[data-variant="secondary"]
  svg {
  color: var(--color-secondary);
}

/* Hero banner: button tokens override — dark bg + white text, white bg + dark text on hover */
[data-slot="hero-banner"] {
  --color-btn-bg: var(--color-primary);
  --color-btn-text: #ffffff;
  --color-btn-hover-bg: #ffffff;
  --color-btn-hover-text: var(--color-text);
  --color-btn-active-bg: var(--color-accent);
  --color-btn-active-text: var(--color-primary);
}

/* Dark card: yellow title and divider */
[data-slot="card"][data-theme="dark"] [data-slot="card-title"] {
  color: var(--color-accent);
}
[data-slot="card"][data-theme="dark"] [data-slot="card-divider"] {
  background-color: var(--color-accent);
}

/* Accordion: yellow title text when expanded */
[data-slot="accordion-trigger"][aria-expanded="true"] {
  color: var(--color-accent);
}

/* Pagination: yellow border on numbered page links only (skip Back/Next),
   and yellow background on the active page. */
[data-slot="pagination"]
  [data-slot="pagination-link"]:not([aria-label^="Go to"]) {
  border-color: var(--color-accent);
}

[data-slot="pagination"] [data-slot="pagination-link"][data-active="true"] {
  background-color: var(--color-accent);
}

header [data-testid="header-search-submit"] {
  color: var(--color-text);
  background-color: var(--color-accent);
}

[data-paragraph="new_multi_column_info"]
  [data-multi-col-info-type="multicardsimple"]
  [data-slot="card-footer"]
  a
  svg {
  color: var(--color-accent);
}

[data-paragraph="new_explore_our_services"] [data-slot="card"] a svg {
  color: var(--color-accent);
}

[data-paragraph="new_carousel"]
  [data-carousel-type="card"]
  [data-slot="card"]
  a[data-variant="link"]
  svg {
  color: var(--color-accent);
}