/* Auto-generated - do not edit */
/* BASE */
html {
  /* No font-size here: vendor.css owns the root ladder
     (14px <1000, 15px 1000-1199, 16px 1200-1599, 17px 1600-1999,
     18px 2000-2399, 20px 2400+), same as the deployed McHire bundle. */
  overflow-x: hidden !important;
  -webkit-text-size-adjust: none;
  -webkit-font-smoothing: subpixel-antialiased;
  -webkit-font-smoothing: antialiased;
  scroll-padding-top: 10rem;
}

*,
*:before,
*:after {
  box-sizing: inherit;
}

body {
  box-sizing: border-box;
  margin: 0px;
  font-size: 1rem;
}

::selection {
  background: black;
  color: white;
}

::-moz-selection {
  background: black;
  color: white;
}

::-webkit-selection {
  background: black;
  color: white;
}

h1,
h2,
h3,
h4,
h5,
h6,
p,
figure {
  margin: 0;
}

q::before,
q::after {
  display: none;
}

button {
  display: inline-block;
  overflow: visible;
  margin: 0;
  padding: 0;
  outline: 0;
  border: 0;
  background: none transparent;
  color: inherit;
  vertical-align: middle;
  text-align: center;
  text-decoration: none;
  text-transform: none;
  font: inherit;
  line-height: normal;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

blockquote {
  margin-block-start: 0;
  margin-block-end: 0;
  margin-inline-start: 0;
  margin-inline-end: 0;
}

#svg-- {
  display: none;
}

/* fixed talent community window */
.mfp-wrap {
  overflow-y: auto;
  overflow-x: hidden;
  position: fixed !important;
  top: 0 !important;
}

/* Synced from Paradox platform — do not edit manually */
body:not(#company-profile-main) .o-loader {
  display: none
}

body.page-jobs {
  background: var(--color-bg-grey)
}

@media (min-width: 1000px) {
  footer .c-footer__copy-right--reserved {
    /* margin-top: 2rem !important; */
  }
}

html:not(.has-scrolled) .c-header-navigation.-dark {
  background-color: var(--color-white);
}

*,
:after,
:before,
::backdrop {
  box-sizing: border-box;
  border: 0 solid;
  margin: 0;
  padding: 0;
}

html,
:host {
  -webkit-text-size-adjust: 100%;
  tab-size: 4;
  line-height: 1.5;
  font-family: var(--default-font-family, ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji");
  font-feature-settings: var(--default-font-feature-settings, normal);
  font-variation-settings: var(--default-font-variation-settings, normal);
  -webkit-tap-highlight-color: transparent;
}

hr {
  height: 0;
  color: inherit;
  border-top-width: 1px;
}

abbr:where([title]) {
  -webkit-text-decoration: underline dotted;
  text-decoration: underline dotted;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-size: inherit;
  font-weight: inherit;
}

a {
  color: inherit;
  -webkit-text-decoration: inherit;
  -webkit-text-decoration: inherit;
  -webkit-text-decoration: inherit;
  text-decoration: inherit;
}

b,
strong {
  font-weight: bolder;
}

code,
kbd,
samp,
pre {
  font-family: var(--default-mono-font-family, ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace);
  font-feature-settings: var(--default-mono-font-feature-settings, normal);
  font-variation-settings: var(--default-mono-font-variation-settings, normal);
  font-size: 1em;
}

small {
  font-size: 80%;
}

sub,
sup {
  vertical-align: baseline;
  font-size: 75%;
  line-height: 0;
  position: relative;
}

sub {
  bottom: -.25em;
}

sup {
  top: -.5em;
}

table {
  text-indent: 0;
  border-color: inherit;
  border-collapse: collapse;
}

progress {
  vertical-align: baseline;
}

summary {
  display: list-item;
}

ol,
ul,
menu {
  list-style: none;
}

img,
svg,
video,
canvas,
audio,
iframe,
embed,
object {
  vertical-align: middle;
  display: block;
}

img,
video {
  max-width: 100%;
  height: auto;
}

button,
input,
select,
optgroup,
textarea {
  font: inherit;
  font-feature-settings: inherit;
  font-variation-settings: inherit;
  letter-spacing: inherit;
  color: inherit;
  opacity: 1;
  background-color: #0000;
  border-radius: 0;
}

textarea {
  resize: vertical;
}

::-webkit-search-decoration {
  -webkit-appearance: none;
}

::-webkit-date-and-time-value {
  min-height: 1lh;
  text-align: inherit;
}

::-webkit-datetime-edit {
  display: inline-flex;
}

::-webkit-datetime-edit-fields-wrapper {
  padding: 0;
}

::-webkit-datetime-edit {
  padding-block: 0;
}

::-webkit-datetime-edit-year-field {
  padding-block: 0;
}

::-webkit-datetime-edit-month-field {
  padding-block: 0;
}

::-webkit-datetime-edit-day-field {
  padding-block: 0;
}

::-webkit-datetime-edit-hour-field {
  padding-block: 0;
}

::-webkit-datetime-edit-minute-field {
  padding-block: 0;
}

::-webkit-datetime-edit-second-field {
  padding-block: 0;
}

::-webkit-datetime-edit-millisecond-field {
  padding-block: 0;
}

::-webkit-datetime-edit-meridiem-field {
  padding-block: 0;
}

::-webkit-calendar-picker-indicator {
  line-height: 1;
}

button,
input:where([type="button"], [type="reset"], [type="submit"]) {
  appearance: button;
}

::-webkit-inner-spin-button {
  height: auto;
}

::-webkit-outer-spin-button {
  height: auto;
}

/* ==========================================================================
   Design tokens — McDonald's Austria
   Figma YgS3E3qT81WiC2pL6gWDS4
     mobile  frame 8335:952  (375px)
     desktop frame 8306:1296 (1440px)

   Below 1000px every value rides one ramp: it is the Figma mobile value at
   375px and lands exactly on the desktop value at 1000px (where the root is
   15px), so tablet widths sit between the two frames and nothing jumps as
   the breakpoint is crossed.
   From 1000px up the values are rem, so the platform root ladder in
   vendor.css (15px 1000-1199, 16px 1200-1599, 17px 1600-1999, 18px
   2000-2399, 20px 2400+) keeps scaling them on big screens.
   ========================================================================== */
:root {
  /* 0px at a 375px viewport, 1px at 1000px — the mobile/tablet ramp.
     Multiply by the px delta to interpolate: 32px + 13 * var(--ramp). */
  --ramp: clamp(0px, (100vw - 375px) / 625, 1px);

  /* Type — Speedee. Figma mobile → desktop edge */
  --fs-hero-title: calc(32px + 11.125 * var(--ramp));
  /* 32 → 43.125 */
  --fs-hero-subtitle: calc(18px + 4.5 * var(--ramp));
  /* 18 → 22.5 */
  --fs-h2: calc(32px + 15.8125 * var(--ramp));
  /* 32 → 47.8125 */
  --fs-h3: calc(24px - 1.5 * var(--ramp));
  /* 24 → 22.5 */
  /* Figma keeps a separate tablet H2 (BE/H2-T, 35px) for the yellow banners */
  --fs-h2-alt: calc(35px + 12.8125 * var(--ramp));
  /* 35 → 47.8125 */
  --fs-body: calc(16px - 1 * var(--ramp));
  /* 16 → 15 */
  --lh-body: calc(32px - 2 * var(--ramp));
  /* 32 → 30 */
  --fs-button: calc(18px - 1.125 * var(--ramp));
  /* 18 → 16.875 */
  --lh-button: var(--fs-button);
  --ls-title: 1px;

  /* Spacing */
  --gutter: calc(26px + 109 * var(--ramp));
  /* 26 → 135 */
  --section-py: calc(64px + 11 * var(--ramp));
  /* 64 → 75 */
  --section-gap: calc(48px - 14.25 * var(--ramp));
  /* 48 → 33.75, title block to content */
  --stack-gap: 24px;
  /* title to body copy */
  --card-gap: 24px;
  /* row gap between cards */
  --card-gap-x: 24px;
  /* column gap, single column on mobile */
  --card-pad: 24px;
  --card-radius: 5px;
  --card-border: 2px;
}

@media (min-width: 1000px) {
  :root {
    --fs-hero-title: 2.875rem;
    /* 46px */
    --fs-hero-subtitle: 1.5rem;
    /* 24px */
    --fs-h2: 3.1875rem;
    /* 51px */
    --fs-h2-alt: 3.1875rem;
    /* 51px */
    --fs-h3: 1.5rem;
    /* 24px */
    --fs-body: 1rem;
    /* 16px */
    --lh-body: 2rem;
    /* 32px */
    --fs-button: 1.125rem;
    /* 18px */
    --lh-button: 1.125rem;

    --gutter: 9rem;
    /* 144px — same as .o-container in vendor.css */
    --section-py: 5rem;
    /* 80px */
    --section-gap: 2.25rem;
    /* 36px */
    --stack-gap: 1.5rem;
    --card-gap: 1.5rem;
    /* 24px row */
    --card-gap-x: 3rem;
    /* 48px column */
    --card-pad: 1.5rem;
  }
}

/* --------------------------------------------------------------------------
   Site-wide application of the tokens.
   Only below 1000px: from 1000px up the platform values already equal the
   desktop frame (.o-container is 9rem, the type is rem on the root ladder),
   so these rules would be a no-op there.
   -------------------------------------------------------------------------- */
@media (max-width: 999px) {

  /* Figma container: 375 - 2x26 = 323 wide, ramping to the desktop gutter */
  .o-container {
    padding-right: var(--gutter);
    padding-left: var(--gutter);
  }

  /* Section heading + body copy (BE/H2-M 32/normal, Paragraph 16/32) */
  .l-layout__content-title {
    font-size: var(--fs-h2);
    letter-spacing: var(--ls-title);
    line-height: normal;
  }

  .l-layout__content-text {
    font-size: var(--fs-body);
    line-height: var(--lh-body);
  }
}

html {
  font-family: var(--font-speedee, "Speedee", sans-serif);
}

body {
  font-family: inherit;
}

/* Auto-generated - do not edit */
/* CORPORATE CAREERS — overrides on top of vendor classes to match Figma (Austria, mobile 8335:1521) */
@media (max-width: 999px) {
  [data-page="corporate"] .o-container {
    padding-right: var(--gutter);
    padding-left: var(--gutter);
  }

  [data-page="corporate"] .l-layout__content-title {
    margin-bottom: 0;
    color: var(--color-text-black);
    font-size: var(--fs-h2);
    letter-spacing: 1px;
    line-height: normal;
  }

  [data-page="corporate"] .l-layout__content-text {
    margin-bottom: 0;
    color: var(--color-text-black);
    font-size: var(--fs-body);
    letter-spacing: 1px;
    line-height: var(--lh-body);
  }

  /* Hero: title block + golden arches image, red rule below */
  [data-page="corporate"] [data-component="main-hero"] .c-main-hero {
    height: auto;
    min-height: 0;
    margin-bottom: 0;
    padding-bottom: 0;
  }

  /* 96px fixed header + 64px section spacing */
  [data-page="corporate"] .c-main-hero__inner {
    height: auto;
    padding-top: 160px;
  }

  [data-page="corporate"] .c-main-hero__layout,
  [data-page="corporate"] .c-main-hero__layout-item {
    height: auto;
    margin: 0;
  }

  [data-page="corporate"] .c-main-hero__content {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 24px;
    margin: 0 auto;
  }

  [data-page="corporate"] .c-main-hero__title {
    font-size: var(--fs-hero-title);
    letter-spacing: 1px;
    line-height: normal;
    text-align: left;
    text-transform: capitalize;
  }

  [data-page="corporate"] .c-main-hero__arches {
    height: 257px;
    margin-top: 64px;
    overflow: hidden;
  }

  [data-page="corporate"] .c-main-hero__arches img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center bottom;
  }

  /* Photo band */
  /* Sits above the intro bubbles so only their lower half shows */
  [data-page="corporate"] .c-hero-big {
    position: relative;
    z-index: 2;
    margin-top: 64px;
  }

  [data-page="corporate"] .c-hero-big__background-image {
    height: 344px;
  }

  /* Intro */
  [data-page="corporate"] .c-mission {
    margin: 0;
    padding: 64px 0;
  }

  [data-page="corporate"] .c-mission .c-bubbles {
    top: -133px;
    right: 0;
    width: 300px;
    height: 166px;
    z-index: 1;
    visibility: visible;
    /* vendor hides interior bubbles below 700px */
    pointer-events: none;
  }

  [data-page="corporate"] .c-mission__layout {
    display: flex;
    flex-direction: column;
    gap: 24px;
    margin-left: 0;
  }

  [data-page="corporate"] .c-mission .l-layout__content-title--wrap {
    margin-bottom: 0;
  }

  [data-page="corporate"] .c-mission__layout.-gutter>.c-mission__layout-item {
    padding-left: 0;
  }

  [data-page="corporate"] .c-mission__layout-item .l-layout__content {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 24px;
  }

  [data-page="corporate"] .c-main-hero__subtitle {
    width: 225px;
    margin-top: 0;
  }

  /* Figma 8315:277 / 8338:219: the plate's block is 58 — 36 + the drip's 22
     overhang — and the section's bottom padding is measured from the drip */
  [data-page="corporate"] .c-mission .c-main-hero__subtitle {
    margin-bottom: 22px;
  }

  [data-page="corporate"] .c-main-hero__subtitle::after {
    right: 0;
    bottom: -22px;
    width: 212px;
    height: 30px;
    background-image: url("https://cdn.sites.stg.mchire.com/media-public/8641/61d3f1bb-b6dd-4d96-a195-8baa2aaaf313/image/17902381677657735corporate-tagline-drip.svg");
    background-position: right top;
    z-index: -1;
  }

  [data-page="corporate"] .c-main-hero__subtitle-content {
    padding: 10px 16px;
    font-size: var(--fs-body);
    text-align: center;
  }

  [data-page="corporate"] .c-main-hero__subtitle-content .c-main-hero__subtitle-message {
    margin: 0;
    letter-spacing: 1px;
    line-height: 16px;
    text-transform: none;
  }

  /* Milestones: yellow band, timeline slider bleeds off the right edge */
  [data-page="corporate"] .c-milestones {
    padding: 64px 0;
    overflow: hidden;
    background-color: var(--color-yellow);
  }

  [data-page="corporate"] .c-milestones .o-container {
    padding-right: 0;
  }

  [data-page="corporate"] .c-milestones .l-layout__content-title {
    color: var(--color-black);
  }

  [data-page="corporate"] .c-milestones__slider {
    margin-top: 48px;
    border-top: 3px solid var(--color-red);
  }

  [data-page="corporate"] .c-milestones__slider .c-blurb-slider__item {
    padding: 16px 0;
  }

  [data-page="corporate"] .c-milestones__slider .c-blurb-slider__content {
    gap: 24px;
    max-width: 300px;
    padding: 0;
    background-color: transparent;
  }

  .c-milestones__year {
    padding: 8px 32px;
    border-radius: 600px;
    background-color: var(--color-white);
    color: var(--color-text-black);
    font-size: var(--fs-h3);
    font-weight: 700;
    letter-spacing: 1px;
    line-height: normal;
  }

  .c-milestones__title {
    margin: 0;
    font-weight: 700;
    color: var(--color-text-black);
    font-size: var(--fs-h3);
    letter-spacing: 1px;
    line-height: normal;
    text-align: center;
    text-transform: capitalize;
  }

  /* Values + Empowerment: dark cards (c-commitments) */
  [data-page="corporate"] .c-commitments {
    padding: 64px 0;
    background-color: var(--color-white);
  }

  [data-page="corporate"] .c-commitments__intro {
    display: flex;
    flex-direction: column;
    gap: 24px;
    margin-bottom: 0;
  }

  [data-page="corporate"] .c-commitments__grid {
    grid-template-columns: minmax(0, 1fr);
    gap: 24px;
    margin-top: 24px;
  }

  [data-page="corporate"] .c-commitments__card {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    padding: 30px;
    border-radius: 8px;
    background-color: var(--color-header-black);
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
  }

  [data-page="corporate"] .c-commitments__card-icon {
    justify-content: flex-start;
    margin-bottom: 32px;
  }

  [data-page="corporate"] [data-component="more-than-job-cards"] .c-commitments__card-icon img {
    width: auto;
    height: 80px;
  }

  [data-page="corporate"] .c-commitments__card-title {
    margin: 0;
    color: var(--color-white);
    font-size: var(--fs-h2);
    letter-spacing: 1px;
    text-align: left;
    text-transform: capitalize;
  }

  [data-page="corporate"] .c-commitments__card-text {
    margin-top: 8px;
    color: var(--color-white);
    font-weight: 700;
  }

  [data-page="corporate"] .c-empowerment {
    background-color: var(--color-bg-grey);
  }

  [data-page="corporate"] .c-empowerment .l-layout__content-text strong {
    font-weight: 700;
  }

  /* Cards bleed to the right viewport edge */
  [data-page="corporate"] .c-empowerment__grid {
    gap: 48px;
    margin-top: 48px;
    margin-right: -var(--gutter);
  }

  .c-empowerment__item {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 24px;
  }

  [data-page="corporate"] .c-empowerment__item .c-commitments__card-icon {
    margin-bottom: 0;
  }

  [data-page="corporate"] .c-empowerment__item .c-commitments__card-icon img {
    width: 130px;
    height: auto;
  }

  [data-page="corporate"] .c-empowerment__item .c-commitments__card {
    gap: 24px;
    width: 100%;
    padding: 32px var(--gutter);
    border-radius: 8px 0 0 8px;
  }

  [data-page="corporate"] .c-empowerment__item .c-commitments__card-title {
    font-size: var(--fs-h3);
  }

  [data-page="corporate"] .c-empowerment__item .c-commitments__card-text {
    margin-top: 0;
    font-weight: 400;
  }

  [data-page="corporate"] .c-empowerment__item .c-commitments__card-text strong {
    font-weight: 700;
  }

  /* FAQ accordion */
  [data-page="corporate"] [data-component="faq"] .c-accordion {
    margin-top: 0;
    padding: 64px 0;
  }

  [data-page="corporate"] [data-component="faq"] .c-accordion__header .l-layout__content-title {
    margin-bottom: 24px;
    text-align: center;
  }

  /* Single column list */
  [data-page="corporate"] [data-component="faq"] [data-module-accordion]>.c-accordion__layout {
    display: flex;
    flex-direction: column;
    gap: 24px;
    margin: 0;
  }

  [data-page="corporate"] [data-component="faq"] .c-accordion__layout-item {
    display: contents;
  }

  [data-page="corporate"] [data-component="faq"] .c-faq-min__item {
    margin-bottom: 0;
    padding: 22px;
    border: 2px solid var(--color-header-black);
    border-radius: 5px;
  }

  [data-page="corporate"] [data-component="faq"] .c-faq-min__summary,
  [data-page="corporate"] [data-component="faq"] .c-faq-min__item_click__JS {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 24px;
    min-width: 24px;
    min-height: 24px;
    padding: 0;
    border: 0;
    background: transparent;
    color: inherit;
    font: inherit;
    text-align: left;
    cursor: pointer;
  }

  [data-page="corporate"] [data-component="faq"] .c-faq-min__summary::marker,
  [data-page="corporate"] [data-component="faq"] .c-faq-min__summary::-webkit-details-marker {
    display: none;
  }

  [data-page="corporate"] [data-component="faq"] .c-faq-min__summary:focus-visible {
    outline: 3px solid var(--color-yellow);
    outline-offset: 4px;
  }

  [data-page="corporate"] [data-component="faq"] .c-faq-min__title {
    width: auto;
    font-size: var(--fs-body);
    letter-spacing: 1px;
    line-height: var(--lh-body);
  }

  [data-page="corporate"] [data-component="faq"] .c-faq-min__btn {
    flex-basis: 36px;
    width: 36px;
    min-width: 36px;
    height: 36px;
  }

  [data-page="corporate"] [data-component="faq"] .c-faq-min__btn svg {
    width: 8px;
    height: 13px;
    fill: var(--color-header-black);
  }

  [data-page="corporate"] [data-component="faq"] .c-faq-min__bottom-ov {
    margin-top: 24px;
    padding: 0;
  }

  [data-page="corporate"] [data-component="faq"] .c-faq-min__bottom-ov .l-layout__content-text {
    color: var(--color-white);
  }
}

/* Photo strip is the desktop replacement for the single mobile photo */
@media (max-width: 999px) {
  [data-page="corporate"] .c-mission__grid {
    display: none;
  }
}

/* DESKTOP — Figma 8306:1713 (shared sections + FAQ 8316:574); Empowerment follows its Career Path rows */
@media (min-width: 1000px) {
  [data-page="corporate"] .l-layout__content-title {
    margin-bottom: 0;
    color: var(--color-text-black);
    font-size: var(--fs-h2);
    letter-spacing: 1px;
    line-height: normal;
  }

  [data-page="corporate"] .l-layout__content-text {
    margin-bottom: 0;
    color: var(--color-text-black);
    font-size: var(--fs-body);
    letter-spacing: 1px;
    line-height: var(--lh-body);
  }

  /* Hero: title left, arches image right, red rule below */
  [data-page="corporate"] [data-component="main-hero"] .c-main-hero {
    height: auto;
    min-height: 0;
    margin-bottom: 0;
    padding-bottom: 0;
  }

  /* Figma 8306:1715: 541 hero under the fixed header. The header is a 32px
     top bar + a 6rem nav (122 / 128 / 140 at 1000 / 1440 / 2000), so the
     offset follows it; a flat 96 left the hero's top 32px under the top bar. */
  [data-page="corporate"] .c-main-hero__inner {
    display: flex;
    align-items: center;
    /* 536 + the 5px red rule = the frame's 541. Past 1440 it keeps the frame's
       ratio (536 / 1440 = 37.222vw) so the rainbow image, which widens with
       the viewport, keeps its crop instead of zooming into the arch. */
    height: calc(32px + 6rem + max(536px, 37.2222vw));
    padding-top: calc(32px + 6rem);
    overflow: hidden;
  }

  [data-page="corporate"] .c-main-hero__container {
    position: relative;
    z-index: 1;
    width: 100%;
  }

  /* Vendor still stacks .o-layout.-flex at exactly 1000px */
  [data-page="corporate"] .c-main-hero__layout {
    flex-direction: row;
  }

  /* flex-basis, not width: the u-2/4@medium utility forces width */
  [data-page="corporate"] .c-main-hero__layout-item {
    flex: 0 0 100%;
  }

  /* Stay clear of the arches (left edge 45.5556%) */
  [data-page="corporate"] .c-main-hero__content {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 24px;
    max-width: calc(45.5556vw - 9rem - 24px);
  }

  /* Figma 8306:1721: two set lines ("McDonald's" / "Mission and Values",
     broken in the markup). nowrap keeps the second line whole where the
     column runs a few px short of it (415 at 1280). */
  [data-page="corporate"] .c-main-hero__title {
    font-size: var(--fs-hero-title);
    letter-spacing: 1px;
    line-height: normal;
    text-align: left;
    text-transform: capitalize;
  }

  [data-page="corporate"] .c-main-hero__arches {
    position: absolute;
    top: calc(32px + 6rem + 1px);
    /* Figma: 1 below the hero top */
    bottom: 0;
    left: 45.5556%;
    /* 656 / 1440 */
    width: 54.7917%;
    /* 789 / 1440 */
  }

  [data-page="corporate"] .c-main-hero__arches img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: left bottom;
  }

  /* Scroll hint — Figma 8306:1728: a 36 x 198 column at left 30 / top 168 of
     the hero, reading downwards: 135 of rotated text, 24, then the 36 disc. */
  [data-page="corporate"] [data-component="main-hero"] .__scroll {
    top: calc(32px + 6rem + 168px);
    right: auto;
    bottom: auto;
    left: 30px;
    width: 36px;
    height: 198px;
  }

  [data-page="corporate"] [data-component="main-hero"] .__scroll .scroll-wrap {
    position: absolute;
    top: 50%;
    left: 50%;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    width: 198px;
    height: 36px;
    gap: 24px;
    transform: translate(-50%, -50%) rotate(90deg);
  }

  [data-page="corporate"] [data-component="main-hero"] .__scroll .scroll-text {
    width: 135px;
    margin: 0;
    color: var(--color-black);
    font-size: 16px;
    letter-spacing: 1px;
    line-height: 32px;
    text-align: left;
    white-space: nowrap;
  }

  [data-page="corporate"] [data-component="main-hero"] .__scroll .scroll-arrow,
  [data-page="corporate"] [data-component="main-hero"] .__scroll .scroll-arrow::before {
    flex: 0 0 36px;
    justify-content: center;
    width: 36px;
    min-width: 36px;
    height: 36px;
  }

  [data-page="corporate"] [data-component="main-hero"] .__scroll .scroll-arrow::before {
    top: 0;
  }

  /* Photo strip */
  [data-page="corporate"] .c-hero-big {
    display: none;
  }

  [data-page="corporate"] .c-mission__grid {
    padding: 48px 0;
  }

  [data-page="corporate"] .c-mission__grid-list {
    justify-content: space-between;
  }

  [data-page="corporate"] .c-mission__grid-item,
  [data-page="corporate"] .c-mission__grid-item:nth-child(2) {
    flex: 0 0 29.5139%;
    /* 425 / 1440 */
    width: auto;
    margin: 0;
  }

  /* Figma 8306:1772: 425 x 250 at 1440. The vendor interior rule caps the
     image at max-height 250, which pinned it there past 1440 while the width
     kept growing (590 x 250 at 2000) — lifted so the ratio holds. */
  [data-page="corporate"] .c-mission__grid-image {
    height: auto;
    max-height: none;
    aspect-ratio: 425 / 250;
    border-radius: 5px;
  }

  [data-page="corporate"] .c-mission__grid-item:first-of-type .c-mission__grid-image {
    border-radius: 0 5px 5px 0;
  }

  [data-page="corporate"] .c-mission__grid-item:last-of-type .c-mission__grid-image {
    border-radius: 5px 0 0 5px;
  }

  /* Red squares — Figma 8306:1767 / 1769 / 1771: 150 squares against the 425
     photos. Sized and offset as shares of the photo (150 / 425 = 35.294%) so
     they keep the frame's proportion as the photos grow past 1440; % insets
     resolve against the item's width, the photo's width. Floored at the 1440
     values (150 / 16 / 13 / 17 / 20 px) so smaller desktops are unchanged. */
  [data-page="corporate"] .c-mission__grid-item::before,
  [data-page="corporate"] .c-mission__grid-item:first-of-type::before,
  [data-page="corporate"] .c-mission__grid-item:last-of-type::before {
    width: max(150px, 35.294%);
    height: auto;
    aspect-ratio: 1;
    border-radius: 5px;
  }

  [data-page="corporate"] .c-mission__grid-item:first-of-type::before {
    right: min(-16px, -3.765%);
    bottom: calc(-13 / 425 * var(--grid-photo-w, 425px));
  }

  [data-page="corporate"] .c-mission__grid-item:nth-child(2)::before {
    top: calc(-17 / 425 * var(--grid-photo-w, 425px));
    right: min(-20px, -4.706%);
  }

  [data-page="corporate"] .c-mission__grid-item:last-of-type::before {
    right: 0;
    bottom: calc(-13 / 425 * var(--grid-photo-w, 425px));
  }

  /* the photo's width, for the vertical insets above (% top/bottom would
     resolve against the item's height, not its width) */
  [data-page="corporate"] .c-mission__grid-list {
    --grid-photo-w: max(425px, 29.5139vw);
  }

  /* Intro */
  [data-page="corporate"] .c-mission {
    margin: 0;
    padding: 88px 0;
  }

  [data-page="corporate"] .c-mission .c-bubbles {
    top: -141px;
    right: 0;
    width: 400px;
    height: 221px;
    z-index: 1;
    pointer-events: none;
  }

  /* Weighted past the vendor `.o-layout.-flex.-middle` centring, which
     dropped the shorter title column 12px below the copy (Figma: both at 88) */
  [data-page="corporate"] .c-mission__layout.o-layout.-flex {
    display: flex;
    flex-wrap: nowrap;
    align-items: flex-start;
    gap: 88px;
    margin-left: 0;
  }

  [data-page="corporate"] .c-mission__layout.-gutter>.c-mission__layout-item {
    width: auto;
    padding-left: 0;
  }

  /* 471 : 593 at 1440, scales down proportionally */
  [data-page="corporate"] .c-mission__layout.-gutter>.c-mission__layout-item:first-child {
    flex: 471 1 0;
    min-width: 0;
  }

  [data-page="corporate"] .c-mission__layout.-gutter>.c-mission__layout-item:last-child {
    flex: 593 1 0;
    min-width: 0;
  }

  [data-page="corporate"] .c-mission .l-layout__content-title--wrap {
    margin-bottom: 0;
  }

  [data-page="corporate"] .c-mission__layout-item .l-layout__content {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 24px;
  }

  [data-page="corporate"] .c-main-hero__subtitle {
    width: 225px;
    margin-top: 0;
  }

  /* Figma 8315:277 / 8338:219: the plate's block is 58 — 36 + the drip's 22
     overhang — and the section's bottom padding is measured from the drip */
  [data-page="corporate"] .c-mission .c-main-hero__subtitle {
    margin-bottom: 22px;
  }

  [data-page="corporate"] .c-main-hero__subtitle::after {
    right: 0;
    bottom: -22px;
    width: 212px;
    height: 30px;
    background-image: url("https://cdn.sites.stg.mchire.com/media-public/8641/61d3f1bb-b6dd-4d96-a195-8baa2aaaf313/image/17902381677657735corporate-tagline-drip.svg");
    background-position: right top;
    z-index: -1;
  }

  [data-page="corporate"] .c-main-hero__subtitle-content {
    padding: 10px 16px;
    font-size: var(--fs-body);
    text-align: center;
  }

  [data-page="corporate"] .c-main-hero__subtitle-content .c-main-hero__subtitle-message {
    margin: 0;
    letter-spacing: 1px;
    line-height: 1rem;
    text-transform: none;
  }

  /* Milestones */
  [data-page="corporate"] .c-milestones {
    padding: 80px 0;
    overflow: hidden;
    background-color: var(--color-yellow);
  }

  [data-page="corporate"] .c-milestones .o-container {
    padding-right: 0;
  }

  [data-page="corporate"] .c-milestones .l-layout__content-title {
    color: var(--color-black);
  }

  [data-page="corporate"] .c-milestones__slider {
    margin-top: 48px;
    border-top: 3px solid var(--color-red);
  }

  [data-page="corporate"] .c-milestones__slider .c-blurb-slider__main {
    overflow: hidden;
  }

  /* slidesPerView: auto (page script) — width comes from CSS */
  [data-page="corporate"] .c-milestones__slider .c-blurb-slider__item {
    width: 300px;
    padding: 16px 0;
  }

  [data-page="corporate"] .c-milestones__slider .c-blurb-slider__content {
    flex-flow: column;
    gap: 24px;
    padding: 0;
    text-align: center;
    background-color: transparent;
    box-shadow: none;
  }

  .c-milestones__year {
    padding: 8px 32px;
    border-radius: 600px;
    background-color: var(--color-white);
    color: var(--color-text-black);
    font-size: var(--fs-h3);
    font-weight: 700;
    letter-spacing: 1px;
    line-height: normal;
  }

  .c-milestones__title {
    margin: 0;
    color: var(--color-text-black);
    font-size: var(--fs-h3);
    font-weight: 700;
    letter-spacing: 1px;
    line-height: normal;
    text-align: center;
    text-transform: capitalize;
  }

  /* Values: intro + 5 cards on a 3-column grid */
  [data-page="corporate"] .c-commitments {
    padding: 80px 0;
    background-color: var(--color-white);
  }

  [data-page="corporate"] [data-component="more-than-job-cards"] .o-container {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 48px 64px;
    max-width: none;
  }

  [data-page="corporate"] [data-component="more-than-job-cards"] .c-commitments__grid {
    display: contents;
  }

  [data-page="corporate"] .c-commitments__intro {
    display: flex;
    flex-direction: column;
    gap: 24px;
    margin-bottom: 0;
  }

  [data-page="corporate"] [data-component="more-than-job-cards"] .c-commitments__intro {
    padding-top: 40px;
  }

  [data-page="corporate"] .c-commitments__card {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    padding: 30px;
    border-radius: 8px;
    background-color: var(--color-header-black);
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
  }

  [data-page="corporate"] .c-commitments__card-icon {
    justify-content: flex-start;
    margin-bottom: 32px;
  }

  [data-page="corporate"] [data-component="more-than-job-cards"] .c-commitments__card-icon img {
    width: auto;
    height: 80px;
  }

  [data-page="corporate"] .c-commitments__card-title {
    margin: 0;
    color: var(--color-white);
    font-size: var(--fs-h2);
    letter-spacing: 1px;
    text-align: left;
    text-transform: capitalize;
  }

  [data-page="corporate"] .c-commitments__card-text {
    margin-top: 8px;
    color: var(--color-white);
    font-weight: 700;
  }

  /* Empowerment: header row + icon/card rows bleeding right */
  [data-page="corporate"] .c-empowerment {
    padding: 88px 0;
    background-color: var(--color-bg-grey);
  }

  [data-page="corporate"] .c-empowerment .c-commitments__intro {
    display: grid;
    grid-template-columns: minmax(0, 576fr) minmax(0, 488fr);
    /* 576 / 488 at 1440 */
    align-items: start;
    gap: 24px 88px;
  }

  [data-page="corporate"] .c-empowerment .c-commitments__intro .l-layout__content-title {
    grid-row: 1 / span 2;
  }

  [data-page="corporate"] .c-empowerment .l-layout__content-text strong {
    font-weight: 700;
  }

  [data-page="corporate"] .c-empowerment__grid {
    grid-template-columns: minmax(0, 1fr);
    gap: 48px;
    margin-top: 64px;
    margin-right: -9rem;
    /* o-container side padding */
  }

  .c-empowerment__item {
    display: flex;
    align-items: center;
    gap: 88px;
  }

  [data-page="corporate"] .c-empowerment__item .c-commitments__card-icon {
    flex: 0 0 130px;
    justify-content: center;
    margin-bottom: 0;
  }

  [data-page="corporate"] .c-empowerment__item .c-commitments__card-icon img {
    width: 130px;
    height: auto;
  }

  [data-page="corporate"] .c-empowerment__item .c-commitments__card {
    flex: 1 1 0;
    gap: 24px;
    padding: 32px 144px 32px 64px;
    border-radius: 8px 0 0 8px;
  }

  [data-page="corporate"] .c-empowerment__item .c-commitments__card-title {
    font-size: var(--fs-h3);
  }

  [data-page="corporate"] .c-empowerment__item .c-commitments__card-text {
    margin-top: 0;
    font-weight: 400;
  }

  [data-page="corporate"] .c-empowerment__item .c-commitments__card-text strong {
    font-weight: 700;
  }

  /* FAQ: single full-width column of rows */
  [data-page="corporate"] [data-component="faq"] .c-accordion {
    margin-top: 0;
    padding: 80px 0;
  }

  [data-page="corporate"] [data-component="faq"] .c-accordion__header .l-layout__content-title {
    margin-bottom: 24px;
    text-align: center;
  }

  [data-page="corporate"] [data-component="faq"] [data-module-accordion]>.c-accordion__layout {
    display: flex;
    flex-direction: column;
    gap: 24px;
    margin: 0;
  }

  [data-page="corporate"] [data-component="faq"] .c-accordion__layout-item {
    display: contents;
  }

  [data-page="corporate"] [data-component="faq"] .c-faq-min__item {
    margin-bottom: 0;
    padding: 22px 46px;
    /* 24/48 in design, 2px stroke inside */
    border: 2px solid var(--color-header-black);
    border-radius: 5px;
  }

  [data-page="corporate"] [data-component="faq"] .c-faq-min__summary,
  [data-page="corporate"] [data-component="faq"] .c-faq-min__item_click__JS {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 24px;
    min-width: 24px;
    min-height: 24px;
    padding: 0;
    border: 0;
    background: transparent;
    color: inherit;
    font: inherit;
    text-align: left;
    cursor: pointer;
  }

  [data-page="corporate"] [data-component="faq"] .c-faq-min__summary::marker,
  [data-page="corporate"] [data-component="faq"] .c-faq-min__summary::-webkit-details-marker {
    display: none;
  }

  [data-page="corporate"] [data-component="faq"] .c-faq-min__summary:focus-visible {
    outline: 3px solid var(--color-yellow);
    outline-offset: 4px;
  }

  [data-page="corporate"] [data-component="faq"] .c-faq-min__title {
    width: auto;
    font-size: var(--fs-h3);
    letter-spacing: 1px;
    line-height: normal;
    text-transform: capitalize;
  }

  [data-page="corporate"] [data-component="faq"] .c-faq-min__btn {
    flex-basis: 36px;
    width: 36px;
    min-width: 36px;
    height: 36px;
  }

  [data-page="corporate"] [data-component="faq"] .c-faq-min__bottom-ov {
    margin-top: 24px;
    padding: 0;
  }

  [data-page="corporate"] [data-component="faq"] .c-faq-min__bottom-ov .l-layout__content-text {
    color: var(--color-white);
  }
}

/* Small desktop: keep desktop padding (9rem) and type, stack side-by-side blocks so text isn't squeezed */
@media (min-width: 1000px) and (max-width: 1199px) {

  /* Intro: title above text */
  /* Wrap instead of column: flex-basis beats the u-1/2@medium width utility */
  [data-page="corporate"] .c-mission__layout.o-layout.-flex {
    flex-wrap: wrap;
    gap: 24px;
  }

  [data-page="corporate"] .c-mission__layout.-gutter>.c-mission__layout-item:first-child,
  [data-page="corporate"] .c-mission__layout.-gutter>.c-mission__layout-item:last-child {
    flex: 0 0 100%;
  }

  /* Empowerment intro: title above paragraphs */
  [data-page="corporate"] .c-empowerment .c-commitments__intro {
    grid-template-columns: minmax(0, 1fr);
  }

  [data-page="corporate"] .c-empowerment .c-commitments__intro .l-layout__content-title {
    grid-row: auto;
  }

  [data-page="corporate"] .c-empowerment__item {
    gap: 48px;
  }

  [data-page="corporate"] .c-empowerment__item .c-commitments__card {
    padding-right: 9rem;
  }
}

/* Values: 3 columns only fit the 51px card titles from 1440 (design width); 2 columns below */
@media (min-width: 1000px) and (max-width: 1439px) {
  [data-page="corporate"] [data-component="more-than-job-cards"] .o-container {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 24px 48px;
  }
}

/* Hero: below 1280 the title needs more room than 45% — narrower arches keep it on two lines */
@media (min-width: 1000px) and (max-width: 1279px) {
  [data-page="corporate"] .c-main-hero__content {
    max-width: calc(57vw - 9rem - 24px);
  }

  [data-page="corporate"] .c-main-hero__arches {
    left: 57%;
    width: 43%;
  }
}

/* FAQ chevron points down when closed, up when open (all breakpoints) */
[data-page="corporate"] [data-component="faq"] .c-faq-min__btn svg {
  transform: rotate(90deg);
}

[data-page="corporate"] [data-component="faq"] .c-faq-min__item.is-active .c-faq-min__btn svg {
  transform: rotate(-90deg);
}

[data-page="corporate"] [data-component="faq"] .c-faq-min__item[open] .c-faq-min__btn svg {
  transform: rotate(-90deg);
}

@media (min-width: 1000px) {
  [data-page="corporate"] [data-component="faq"] .c-faq-min__btn svg {
    fill: var(--color-red);
  }
}

[data-page="corporate"] [data-component="faq"] .c-faq-min__bottom-ov a {
  color: var(--color-white);
  text-decoration: underline;
}

/* Behind the scenes: YouTube embeds, 1 column on mobile, 2 on desktop */
[data-page="corporate"] .c-behind-scenes {
  padding: 64px 0;
}

[data-page="corporate"] .c-behind-scenes__grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 24px;
  margin-top: 48px;
}

[data-page="corporate"] .c-behind-scenes__video {
  position: relative;
  overflow: hidden;
  border-radius: 6px;
  aspect-ratio: 16 / 9;
  background-color: var(--color-header-black);
}

[data-page="corporate"] .c-behind-scenes__video iframe {
  display: block;
  width: 100%;
  height: 100%;
  border: 0;
}

@media (min-width: 700px) {
  [data-page="corporate"] .c-behind-scenes__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (min-width: 1000px) {
  [data-page="corporate"] .c-behind-scenes {
    padding: 88px 0;
  }

  [data-page="corporate"] .c-behind-scenes__grid {
    gap: 48px;
    margin-top: 64px;
  }
}

/* Our Teams Make the Difference — Figma 8315:547 (desktop, 1440 x 606).
   Its own block now: it used to borrow the intro's .c-mission layout (title |
   copy, no photo). Copy column left, a 472 x 470 team photo flush with the
   right edge, vertically centred against it. */
[data-page="corporate"] .c-inclusion__inner {
  display: flex;
  flex-direction: column;
  gap: 24px;
}

[data-page="corporate"] .c-inclusion__content {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 24px;
}

[data-page="corporate"] .c-inclusion .l-layout__content-title--wrap {
  margin-bottom: 0;
}

[data-page="corporate"] .c-inclusion .l-layout__content-title {
  font-size: var(--fs-hero-title);
  /* 32 mobile -> 46 desktop, Figma 8315:550 */
}

[data-page="corporate"] .c-inclusion .l-layout__content-text {
  margin-bottom: 0;
}

/* Figma 8316:616: a 1401 x 930 photo cropped to the frame, centred */
[data-page="corporate"] .c-inclusion__media {
  aspect-ratio: 472 / 470;
  overflow: hidden;
}

[data-page="corporate"] .c-inclusion__media img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

@media (max-width: 999px) {
  [data-page="corporate"] .c-inclusion {
    padding: 64px var(--gutter);
  }
}

@media (min-width: 1000px) {

  /* 60 top / 80 bottom, 144 gutter on the left only — the photo runs to the
     right edge */
  [data-page="corporate"] .c-inclusion {
    padding: 60px 0 80px 144px;
  }

  [data-page="corporate"] .c-inclusion__inner {
    flex-direction: row;
    align-items: center;
    gap: 13.889vw;
    /* 200 at 1440 */
  }

  [data-page="corporate"] .c-inclusion__content {
    flex: 1 1 0;
    min-width: 0;
  }

  /* 472 x 470 at 1440; scales with the viewport so the copy column keeps its
     624 : 472 share on narrower desktops */
  [data-page="corporate"] .c-inclusion__media {
    flex: 0 0 32.778vw;
    width: 32.778vw;
    margin: -2px 0;
    /* Figma: the 470 photo overhangs the 466 row by 2 each side */
  }
}

/* Career path bubbles — Figma 8317:800 (Group 1418 / 1419): outline circles in
   the icon column, drifting a little way under the cards. Drawn on a canvas by
   initBubbleOverlay() (src/scripts/index.js); the section's content sits above
   it, so the opaque cards cover what drifts beneath them. */
[data-page="corporate"] .c-empowerment {
  position: relative;
}

[data-page="corporate"] .c-empowerment>.o-container {
  position: relative;
  z-index: 1;
}

[data-page="corporate"] .c-empowerment__bubbles {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
}

/* Desktop: the icon column (144 gutter + 130 icon + 88 gap = the cards' 362
   left edge at 1440) plus 20% run under the cards, as in the frame */
@media (min-width: 1000px) {
  [data-page="corporate"] .c-empowerment__bubbles {
    width: calc(var(--gutter) + 130px + 88px + 20%);
  }
}

/* CTA banner (vendor .c-cta-banner): dark band, light text, spaced content */
[data-component="cta-banner"] .c-cta-banner__inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 24px;
  padding: 64px 0;
}

[data-component="cta-banner"] .c-cta-banner .l-layout__content {
  display: flex;
  flex-direction: column;
  gap: 24px;
  margin: 0;
}

[data-component="cta-banner"] .c-cta-banner .l-layout__content-title,
[data-component="cta-banner"] .c-cta-banner .l-layout__content-text {
  margin: 0;
  color: var(--color-white);
}

@media (min-width: 1000px) {
  [data-component="cta-banner"] .c-cta-banner__inner {
    padding: 88px 0;
  }
}

/* .flip-card-wrapper { */
/* } */
.flip-card {
  transform-style: preserve-3d;
  transition: transform 1s;
}

.flip-card-front,
.flip-card-back {
  backface-visibility: hidden;
}

.flip-card-back,
.flip-card-wrapper:hover .flip-card {
  transform: rotateY(180deg);
}

/* FOOTER — overrides on top of vendor .c-footer__* to match Figma (Austria global footer) */
.c-footer .c-footer__copy-right button.ot-sdk-show-settings {
  display: inline;
  border: 0;
  padding: 0;
  background: transparent;
  color: inherit;
  font: inherit;
  text-align: inherit;
  cursor: pointer;
}

/* Mobile/tablet: vendor .o-layout__item sizes assume a 14px root; local root is 16px */
@media (max-width: 999px) {

  /* Vendor uses 9rem side padding on tablet; align with page sections (26px) */
  .c-footer .c-footer__info .o-container-fluid {
    padding: 0 var(--gutter);
  }

  .c-footer .c-footer__info-layout,
  .c-footer .c-footer__copy-right-layout {
    padding-right: 0;
    padding-left: 0;
  }

  .c-footer .c-footer__link-info {
    font-size: 14px;
    line-height: 21px;
  }

  .c-footer .c-footer__link-info span,
  .c-footer .c-footer__link-info strong {
    font-size: 13px;
  }

  .c-footer .c-footer__link-info>div {
    padding: 18px 0;
  }

  .c-footer .c-footer__social__item {
    margin-left: 14px;
  }

  .c-footer .c-footer__social__item:first-of-type {
    margin-left: 0;
  }

  .c-footer .c-footer__social-link {
    width: 42px;
    height: 42px;
  }

  .c-footer .c-footer__copy-right ul li {
    max-width: none;
  }
}

/* Tablet: vendor has no .double rule between 700–999, so badges stack */
@media (min-width: 700px) and (max-width: 999px) {
  .c-footer .c-footer__link-info {
    column-gap: 24px;
  }

  .c-footer .c-footer__external-links {
    align-items: center;
  }

  .c-footer .c-footer__external-links .double {
    display: flex;
  }
}

@media (min-width: 1000px) {

  /* Three link columns spread across the 80% item (synced.css) */
  .c-footer .c-footer__link-info {
    justify-content: space-between;
    gap: 0;
  }

  /* Legal links: four equal columns */
  .c-footer .c-footer__copy-right ul li {
    width: 25%;
    max-width: none;
  }

  .c-footer .c-footer__copy-right--reserved {
    margin-top: 2rem;
  }

  .c-footer .c-footer__external-links .o-button__label {
    white-space: nowrap;
  }
}

.c-footer .c-footer__external-links .o-button,
.c-footer .c-footer__external-links .o-button:hover,
.c-footer .c-footer__external-links .o-button:focus {
  color: var(--color-text-black);
}

.c-footer .c-footer__external-links .o-button:hover .o-button__label,
.c-footer .c-footer__external-links .o-button:focus .o-button__label {
  color: var(--color-text-black);
}

.c-footer .c-footer__external-links .o-button__icon svg {
  display: block;
  width: 0.9375rem;
  height: 0.9375rem;
  fill: #fff;
  overflow: visible;
}

/* Small desktop: social row + external links overflow the container */
@media (min-width: 1000px) and (max-width: 1199px) {
  .c-footer .c-footer__social__item {
    margin-left: 0;
  }
}

.hamburger {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  z-index: 999;
  position: relative;
  width: 3rem;
  height: 2rem;
  gap: 0.5rem;
}

.hamburger.active .hamburger-bar:nth-child(1) {
  transform: rotate(-45deg);
}

.hamburger.active .hamburger-bar:nth-child(2) {
  opacity: 0;
}

.hamburger.active .hamburger-bar:nth-child(3) {
  transform: rotate(45deg);
}

.hamburger-bar {
  display: block;
  width: 3rem;
  height: 0.35rem;
  margin: 0 auto;
  transition: all 0.3s ease;
  position: absolute;
  background-color: var(--color-primary-orange);
}

.hamburger-bar:nth-of-type(1) {
  top: calc(50%);
  transform: translateY(calc(-150% - 0.5rem));
  /* 0.5rem is gap */
}

.hamburger-bar:nth-of-type(2) {
  top: calc(50%);
  transform: translateY(-50%);
}

.hamburger-bar:nth-of-type(3) {
  top: calc(50%);
  transform: translateY(calc(+50% + 0.5rem));
  /* 0.5rem is gap */
}

/* HEADER — overrides on top of vendor .c-header-navigation to match Figma (Austria) */
@media (max-width: 999px) {

  /* Header pill is desktop-only; mobile switches language from the menu */
  .c-header-navigation__search-btn .language_selector {
    display: none;
  }

  .c-header-navigation__topbar {
    display: none;
  }

  /* Top two lines dark, short third line yellow */
  .c-header-navigation.-dark .c-header-navigation__button-line:first-of-type {
    background-color: var(--color-header-black);
  }
}

/* Vendor only draws the divider from 500px; design shows a 2px divider on mobile */
@media (max-width: 499px) {
  .c-header-navigation__content::before {
    content: "";
    position: absolute;
    right: 0;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 2px;
    background-color: rgba(182, 184, 185, 0.29);
  }

  .is-loaded.has-scrolled .c-header-navigation__content::before {
    opacity: 0;
  }
}

@media (min-width: 1000px) {

  .c-header-navigation__nav .c-header-navigation__link,
  .c-header-navigation__link.-cta-btn {
    letter-spacing: 1px;
  }

  /* Design: 2px divider at full opacity */
  .c-header-navigation__content::before {
    height: 2px;
    opacity: 1;
  }

  .c-header-navigation .language_selector.-cta-btn {
    padding: 0 16px;
  }
}

@media (min-width: 1400px) {

  /* Vendor fixes links at 12rem up to 1500px; design sizes them to content */
  .c-header-navigation__nav .c-header-navigation__list .c-header-navigation__item .c-header-navigation__link {
    width: auto;
    padding: 0 17.28px;
    white-space: nowrap;
  }
}

/* Top bar (desktop): Become a franchisee / FAQs */
.c-header-navigation__topbar-list {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  gap: 40px;
  padding: 8px 30px;
  background-color: var(--color-bg-grey, #f9f9f9);
}

.c-header-navigation__topbar-link {
  display: block;
  color: var(--color-header-black);
  font-size: 14px;
  line-height: 16px;
  letter-spacing: 1px;
  text-transform: capitalize;
  white-space: nowrap;
  transition: color 0.3s ease-in-out;
}

.c-header-navigation__topbar-link:hover,
.c-header-navigation__topbar-link:focus-visible {
  color: var(--color-red);
}

@media (min-width: 1000px) {

  /* Top bar collapses on scroll so the yellow menu button docks at the top edge */
  .c-header-navigation__topbar {
    max-height: 32px;
    overflow: hidden;
    transition: max-height 0.5s ease-in-out, opacity 0.5s ease-in-out;
  }

  .is-loaded.has-scrolled .c-header-navigation__topbar {
    max-height: 0;
    opacity: 0;
    pointer-events: none;
  }

  .c-header-navigation__nav .c-header-navigation__link,
  .c-header-navigation__link.-cta-btn {
    text-transform: capitalize;
  }

  .c-header-navigation__content {
    background-color: var(--color-white);
  }

  .c-header-navigation__search-btn .language-wrapper {
    gap: 16px;
  }

  .c-header-navigation__search-btn .language_selector.-cta-btn {
    margin-left: 0;
    gap: 16px;
  }

  .c-header-navigation__search-btn .language_selector .selected-lang {
    gap: 16px;
  }

  /* Vendor forces height:auto !important; match the 40px search pill */
  .c-header-navigation__search-btn .language_selector.-cta-btn {
    min-height: 40px;
  }




  .c-header-navigation__search-btn .language_selector .language_selector-dropdown {
    right: 0;
  }

  .c-header-navigation__search-btn .language_selector .lang_sel-list {
    min-width: 140px;
  }
}

/* Vendor shows the inline nav from 1120px; below that the burger stays the way to navigate */
@media (min-width: 1120px) {

  /* Design: no burger while the full nav is visible; fades/slides in on scroll (animatable, not display) */
  .is-loaded .c-header-navigation__menu {
    transition: background-color 0.6s linear, opacity 0.6s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0.3s, transform 0.6s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0.3s, visibility 0s linear 0.9s;
  }

  html:not(.has-scrolled) .c-header-navigation__menu {
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transform: translateY(-30px);
    transition: background-color 0.3s linear, opacity 0.3s ease-in, transform 0.3s ease-in, visibility 0s linear 0.3s;
  }

  .is-loaded.has-scrolled .c-header-navigation__menu {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
    transition: background-color 0.6s linear, opacity 0.6s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0.3s, transform 0.6s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0.3s, visibility 0s;
  }

  .c-header-navigation__search-btn {
    right: 24px;
  }
}

/* Language chevron (Figma asset points right; rotate to point down) */
.language_selector-chevron {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 13px;
  height: 13px;
  flex: 0 0 13px;
  transition: transform 0.3s ease-in-out;
}

.language_selector-chevron img {
  display: block;
  width: 7px;
  height: 12px;
  transform: rotate(90deg);
}

.language_selector .selected-lang {
  border: 0;
  padding: 0;
  background: transparent;
  color: inherit;
  font: inherit;
  cursor: pointer;
}

.language_selector.is-open .language_selector-chevron {
  transform: rotate(180deg);
}

/* Dropdown open animation: JS toggles display, so animate on appearance */
@keyframes language-dropdown-in {
  from {
    opacity: 0;
    transform: translateY(-8px);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.language_selector .language_selector-dropdown {
  animation: language-dropdown-in 0.25s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.language_selector .lang_sel-list {
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08);
}

/* Language options */
.language_selector .lang_sel-item {
  color: var(--color-header-black);
  font-weight: 700;
  letter-spacing: 1px;
  white-space: nowrap;
}

.language_selector .lang_sel-item.is-active {
  color: var(--color-red);
}

.language_selector .lang_sel-item:hover,
.language_selector .lang_sel-item:focus-visible {
  color: var(--color-header-black);
}

/* Mobile menu language switcher */
.c-header-navigation .global-menu__language {
  display: none;
}

@media (max-width: 999px) {
  .c-header-navigation .global-menu__language {
    position: relative;
    display: inline-flex;
    flex-direction: column;
    align-items: flex-start;
    width: auto;
    height: auto;
    margin: 0 0 32px;
    padding: 0;
    border: 0;
    background: transparent;
  }

  .global-menu__language .selected-lang {
    display: inline-flex;
    align-items: center;
    gap: 16px;
    padding: 8px 16px;
    border: 2px solid rgba(182, 184, 185, 0.29);
    border-radius: 32px;
    background-color: var(--color-white);
  }

  .global-menu__language .selected-lang-text {
    font-size: 16px;
    line-height: 16px;
    letter-spacing: 1px;
  }

  /* Sits above the links; list overlays them instead of pushing them down */
  .c-header-navigation .global-menu__language {
    z-index: 5;
  }

  .c-header-navigation .global-menu__language .language_selector-dropdown {
    position: absolute;
    top: 100%;
    left: 0;
    z-index: 10;
  }

  .global-menu__language .lang_sel-list {
    min-width: 160px;
  }

  .global-menu__language .lang_sel-item {
    font-size: 16px;
    padding: 12px 16px;
  }
}

/* Mobile menu: reveal content after the yellow shape overlay has covered the page */
@media (max-width: 999px) {
  .global-menu__wrap {
    opacity: 0;
    transform: translateY(16px);
    transition: opacity 0.2s ease-in, transform 0.2s ease-in;
  }

  .has-nav-open .global-menu__wrap {
    opacity: 1;
    transform: translateY(0);
    transition: opacity 0.4s ease-out 0.45s, transform 0.4s ease-out 0.45s;
  }
}

/* ==========================================================================
Hero Search Box
========================================================================== */
.c-main-hero-search__wrapper {
  width: 100%;
}

[data-react-component="search-box"] {
  position: relative;
  display: block;
  background-color: #FFBC0D;
  border-radius: 5px;
  padding: 3rem 2rem;
  width: 100%;
}

[data-react-component="search-box"][data-react-prop-horizontal="false"]:after {
  width: 35%;
}

[data-react-component="search-box"]:after {
  content: '';
  display: block;
  position: absolute;
  bottom: -2.375rem;
  z-index: 1;
  width: 10%;
  right: 5%;
  height: 2.5rem;
  background-image: url(https://d21jvwj1c73d2e.cloudfront.net/oms/1149/image/2025/7/PG8IP_gooe/gooe.svg);
  background-repeat: no-repeat;
  background-size: contain;
  -webkit-transition: all 0.4s ease;
  transition: all 0.4s ease;
}

@media(max-width: 1000px) {
  [data-react-component="search-box"][data-react-prop-horizontal="true"]:after {
    width: 40%;
  }
}

.c-main-hero-search>div:not(.location-permission-modal) {
  display: flex;
  flex-direction: column;
  position: relative;
  padding-bottom: 1.5rem;
}

/* 
.c-main-hero-search >div:last-child:not(.location-permission-modal) {
  padding-bottom: 0;
} */
/* The widget renders the field labels as spans, not <label> elements, so the
   platform's `.c-main-hero-search label` rule never applied. */
.c-main-hero-search label,
.c-main-hero-search__keyword-label,
.c-main-hero-search__location-label {
  display: block;
  /* Figma 8335:962 — Speedee Bold 16/24, letter-spacing 0.5, 8px above field */
  margin-bottom: 0.5rem;
  color: var(--color-text-black);
  font-size: var(--sb-fs-label);
  font-weight: 700;
  letter-spacing: 0.5px;
  line-height: var(--sb-lh-label);
}

.c-main-hero-search input {
  background-color: #FFDE86;
  border-radius: 5px;
  /* Figma: 16px 40px, icon 24px at 12px in */
  padding: var(--sb-pad-field-y) var(--sb-pad-field-x);
  color: #292929;
  text-overflow: ellipsis;
}

.c-main-hero-search .location-search--has-value input[aria-expanded="true"] {
  border-radius: 5px 5px 0 0;
}

.keyword-search__input-icon--search,
.location-search__input-icon--pin {
  position: absolute;
  left: 0.9375rem;
  color: #8F92A1;
  z-index: 1;
}

.c-main-hero-search .c-main-hero-search__button-search {
  background-color: #fff;
  padding: 1rem;
  font-weight: bold;
  border-radius: 5px;
  margin-top: 1rem;
  transition: 0.3s all ease-in-out;
}

.c-main-hero-search .c-main-hero-search__button-search:hover {
  background-color: #db0006;
  color: #fff;
}

.c-main-hero-search .c-main-hero-search__button-search:active {
  transition: 0s all ease-in-out;
}

[data-react-prop-horizontal="false"] .c-main-hero-search .location-search--has-value div[aria-expanded="true"] .menu {
  top: initial;
}

.c-main-hero-search .location-search--has-value div[aria-expanded="true"] .menu {
  border-radius: 0 0 10px 10px;
  background: rgb(255 222 134);
  padding: 20px;
  position: absolute;
  overflow: auto;
  max-height: 15rem;
  height: auto;
  z-index: 2;
  top: 100%;
  border-top: 1px solid rgb(41 41 41 / 15%);
  width: 100%;
}

input[aria-expanded="true"]+.menu {
  border-radius: 0 0 10px 10px;
  background: rgb(255 222 134);
  padding: 20px;
  position: absolute;
  overflow: auto;
  max-height: 15rem;
  height: auto;
  z-index: 2;
  top: 100%;
  border-top: 1px solid rgb(41 41 41 / 15%);
  width: 100%;
}

@media(max-width: 768px) {
  .c-main-hero-search .location-search--has-value div[aria-expanded="true"] .menu {
    max-height: 12.5rem;
  }
}

.custom-search-box .location-search .location-item {
  padding: 6px;
  text-align: left;
}

.custom-search-box .location-search .location-item {
  margin: 5px;
  transition: 0.3s all ease-in-out;
}

.custom-search-box .location-search .location-item.location-item--hightlight {
  background-color: #fff;
  border-radius: 5px;
}

.custom-search-box .location-search .location-item label {
  margin: 0 auto;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: space-between;


}

.custom-search-box .location-search .jl .location-item__icon {
  position: relative;
  margin-left: 15px;
}

.custom-search-box .location-search .jl .location-item__icon::before {
  content: '';
  display: block;
  background-image: url('https://d21jvwj1c73d2e.cloudfront.net/oms/1149/image/2025/7/JHSUH_is-mcd/is-mcd.png');
  position: relative;
  width: 30px;
  height: 30px;
}

.location-item__text {
  display: flex;
  width: 100%;
  align-items: center;
  flex-flow: row-reverse;
  justify-content: flex-end;

}

.location-item__zip:after {
  content: '-';
  margin: 0 3px;
}

[data-react-component="location-permission-request"] {
  display: none;
}

@media(min-width: 1000px) {
  [data-react-component="location-permission-request"] {
    position: absolute;
    bottom: 0;
    z-index: 999;
    max-width: 100%;
    width: 50%;
    display: block;
  }
}

.location-permission-modal {
  padding: 1.8rem;
  background-color: #db0007;
  border-radius: 10px;
  margin: 0;
  width: 100%;
  position: relative;
  z-index: 999;
  display: flex;
  margin-top: 2rem;
  align-items: center;
  justify-content: space-between;
}

.location-permission__description {
  color: #fff;
  width: 100%;
}

.location-permission__description h1 {
  font-size: 21px;
}

.location-permission__close-button {
  position: absolute;
  top: -10px;
  right: -10px;
  background-color: #fff;
  border-radius: 50%;
  width: 30px;
  height: 30px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.location-permission__localte-me-button {
  background-color: #fff;
  border-radius: 5px;
  padding: 9px;
  font-weight: normal;
  font-size: 14px;
}

.location-permission__description>p:first-child {
  margin-bottom: 10px;
}

/* ==========================================================================
Project overrides (not in the platform block)
========================================================================== */
/* Search widget type — Figma hero search container 8335:962 (mobile) and
   8306:1337 (desktop) specify the same sizes, so these are the Figma px at
   375 and the same value in rem from 1000px up, where the root ladder in
   vendor.css takes over. Deltas land on the 1000px value so nothing jumps. */
:root {
  --sb-fs-label: calc(16px - 1 * var(--ramp));
  /* 16 → 15 */
  --sb-lh-label: calc(24px - 1.5 * var(--ramp));
  /* 24 → 22.5 */
  --sb-fs-input: calc(18px - 1.125 * var(--ramp));
  /* 18 → 16.875 */
  --sb-fs-button: calc(16px - 1 * var(--ramp));
  /* 16 → 15 */
  --sb-lh-button: calc(32px - 2 * var(--ramp));
  /* 32 → 30 */
  /* Figma: card 48/32, field 16/40 */
  --sb-pad-card-y: calc(48px - 3 * var(--ramp));
  --sb-pad-card-x: calc(32px - 2 * var(--ramp));
  --sb-pad-field-y: calc(16px - 1 * var(--ramp));
  --sb-pad-field-x: calc(40px - 2.5 * var(--ramp));
}

@media (min-width: 1000px) {
  :root {
    --sb-fs-label: 1rem;
    --sb-lh-label: 1.5rem;
    --sb-fs-input: 1.125rem;
    --sb-fs-button: 1rem;
    --sb-lh-button: 2rem;
    --sb-pad-card-y: 3rem;
    --sb-pad-card-x: 2rem;
    --sb-pad-field-y: 1rem;
    --sb-pad-field-x: 2.5rem;
  }
}

/* Platform theme styles inputs globally; this project does not, so the fields
   need their own box. 3rem left clears the magnifier (0.9375rem in, ~1.25rem wide).
   All sizes in rem so they follow the root ladder in vendor.css. */
/* components/synced.css carries the same platform rule and sorts after this
   file in components/+.css, so the Figma padding needs one extra attribute to
   win on specificity rather than order. */
[data-react-component="search-box"][data-react-component] {
  padding: var(--sb-pad-card-y) var(--sb-pad-card-x);
}

.c-main-hero-search .autocomplete {
  flex: 1 1 auto;
  width: 100%;
  min-width: 0;
}

.c-main-hero-search input {
  width: 100%;
  border: 0;
  font-size: var(--sb-fs-input);
  line-height: 1.6;
}

/* Same synced.css collision as the card padding: bump specificity so the
   Figma 12px icon inset wins over the platform's 15px. */
.c-main-hero-search .keyword-search__input-icon--search,
.c-main-hero-search .location-search__input-icon--pin {
  left: 0.75rem;
}

/* Widget renders no keyword icon, so the magnifier comes from the field */
.c-main-hero-search .keyword-search__input,
.c-main-hero-search .c-main-hero-search__location-content {
  position: relative;
  display: flex;
  align-items: center;
}

.c-main-hero-search .keyword-search__input::before {
  content: "\f002";
  position: absolute;
  z-index: 1;
  color: #8f92a1;
  font-family: FontAwesome;
  font-size: var(--sb-fs-input);
}

/* Austria design: red button instead of the platform white */
.c-main-hero-search .c-main-hero-search__button-search {
  width: 100%;
  padding: var(--sb-pad-field-y);
  background-color: var(--color-red);
  color: var(--color-white);
  /* Figma: Speedee Bold 16/32 */
  font-size: var(--sb-fs-button);
  font-weight: 700;
  line-height: var(--sb-lh-button);
}

.c-main-hero-search .c-main-hero-search__button-search:hover {
  background-color: var(--color-red);
  color: var(--color-white);
  filter: brightness(0.92);
}

.c-main-hero-search input:focus-visible,
.c-main-hero-search .c-main-hero-search__button-search:focus-visible {
  outline: 2px solid var(--color-text-black);
  outline-offset: 4px;
}

/* Field icons — Figma "Most Used / Search" + map-marker-alt (8306:1337),
   replacing the grey FontAwesome glyphs */
.c-main-hero-search .keyword-search__input::before {
  content: "";
  left: 12px;
  width: 24px;
  height: 24px;
  margin-left: 0;
  background: url("https://cdn.sites.stg.mchire.com/media-public/8641/61d3f1bb-b6dd-4d96-a195-8baa2aaaf313/image/1790238168116236hero-search-magnifier.svg") no-repeat center / contain;
}

.c-main-hero-search .location-search__input-icon--pin {
  left: 18px;
  width: 12px;
  height: 16px;
  background: url("https://cdn.sites.stg.mchire.com/media-public/8641/61d3f1bb-b6dd-4d96-a195-8baa2aaaf313/image/17902381681264696hero-search-map-marker.svg") no-repeat center / contain;
}

.c-main-hero-search .location-search__input-icon--pin::before {
  content: none;
}

.c-main-hero-search input::placeholder {
  color: var(--color-text-black);
  opacity: 1;
}

/* Location field with a value: the right slot is either the locate-me button
   (keep) or a second "Remove your selection" button duplicating the left one.
   synced.css only hides that svg as a direct child of the span, which it no
   longer is, so hide the duplicate clear button only. */
.c-main-hero-search .location-search__icon-left~.location-search__icon-right:has([data-testid$="_location_button_clear"]) {
  display: none;
}

.c-main-hero-search .location-search__icon {
  color: var(--color-text-black);
}

/* Reserve room for the icon buttons so text never runs under them */
.c-main-hero-search .location-search input {
  padding-right: 44px;
  text-overflow: ellipsis;
}

/* Clear + locate-me both visible */
.c-main-hero-search .location-search:has(.location-search__icon-left ~ .location-search__icon-right [data-testid$="_location_button-locate-me"]) input {
  padding-right: 76px;
}

/* Horizontal layout: size fields from 0 so input padding doesn't widen one */
.c-main-hero-search__horizontal .c-main-hero-search__keyword,
.c-main-hero-search__horizontal .location-search {
  flex-basis: 0;
  min-width: 0;
}

/* OUR SERVICE CENTER — overrides on top of vendor classes to match Figma (Austria, mobile 8335:1715) */
/* Fries animation stays inside the page until the desktop design is applied */
.c-main-hero__fries img {
  display: block;
  width: 100%;
  height: auto;
}

@media (max-width: 999px) {
  [data-page="service-center"] .o-container {
    padding-right: var(--gutter);
    padding-left: var(--gutter);
  }

  [data-page="service-center"] .l-layout__content-title {
    margin-bottom: 0;
    color: var(--color-text-black);
    font-size: var(--fs-h2);
    letter-spacing: 1px;
    line-height: normal;
    text-transform: capitalize;
  }

  [data-page="service-center"] .l-layout__content-text {
    margin-bottom: 0;
    color: var(--color-text-black);
    font-size: var(--fs-body);
    letter-spacing: 1px;
    line-height: var(--lh-body);
  }

  /* Hero: title + dripping tagline, fries animation, red rule below */
  /* Red rule sits under the fries on mobile */
  [data-page="service-center"] [data-component="main-hero"] {
    border-bottom: 5px solid var(--color-red);
  }

  [data-page="service-center"] [data-component="main-hero"] .c-main-hero {
    height: auto;
    min-height: 0;
    margin-bottom: 0;
    padding-bottom: 0;
    border-bottom: 0;
    /* vendor interior hero rule */
  }

  /* Desktop only */
  [data-page="service-center"] .c-main-hero__arches,
  [data-page="service-center"] .c-benefits__arch {
    display: none;
  }

  /* 96px fixed header + 64px section spacing */
  [data-page="service-center"] .c-main-hero__inner {
    height: auto;
    padding-top: 160px;
  }

  [data-page="service-center"] .c-main-hero__layout,
  [data-page="service-center"] .c-main-hero__layout-item {
    height: auto;
    margin: 0;
  }

  [data-page="service-center"] .c-main-hero__content {
    display: flex;
    flex-direction: column;
    gap: 24px;
  }

  [data-page="service-center"] .c-main-hero__title {
    font-size: 46px;
    letter-spacing: 1px;
    line-height: normal;
    text-align: left;
    text-transform: capitalize;
  }

  [data-page="service-center"] .c-main-hero__subtitle {
    margin-top: 0;
  }

  [data-page="service-center"] .c-main-hero__subtitle::after {
    right: 50px;
    bottom: -22px;
    width: 212px;
    height: 30px;
    background-image: url("https://cdn.sites.stg.mchire.com/media-public/8641/61d3f1bb-b6dd-4d96-a195-8baa2aaaf313/image/17902381677657735corporate-tagline-drip.svg");
    background-position: right top;
    z-index: -1;
  }

  [data-page="service-center"] .c-main-hero__subtitle-content {
    padding: 16px;
    font-size: 24px;
    text-align: left;
  }

  [data-page="service-center"] .c-main-hero__subtitle-message {
    margin: 0;
    letter-spacing: 1px;
    line-height: normal;
  }

  [data-page="service-center"] .c-main-hero__fries {
    height: 400px;
    margin-top: 64px;
    overflow: hidden;
  }

  [data-page="service-center"] .c-main-hero__fries img {
    display: block;
    width: 713px;
    max-width: none;
    height: 401px;
    object-fit: cover;
  }

  /* Intro */
  [data-page="service-center"] .c-mission {
    margin: 0;
    padding: 64px 0;
  }

  [data-page="service-center"] .c-mission__layout {
    display: flex;
    flex-direction: column;
    gap: 24px;
    margin-left: 0;
  }

  [data-page="service-center"] .c-mission .l-layout__content-title--wrap {
    margin-bottom: 0;
  }

  [data-page="service-center"] .c-mission__layout.-gutter>.c-mission__layout-item {
    padding-left: 0;
  }

  /* Photo: vendor shows only the middle item below 1000px */
  [data-page="service-center"] .c-mission__grid {
    padding: 48px 0;
  }

  /* Height follows width (375 × 250 in design) so tablet shows the same crop */
  [data-page="service-center"] .c-mission__grid-image {
    height: auto;
    aspect-ratio: 375 / 250;
    border-radius: 5px;
  }

  /* Vendor adds 3.75rem side margins from 700px; design is full width */
  [data-page="service-center"] .c-mission__grid-item:nth-child(2) {
    margin: 0;
  }

  [data-page="service-center"] .c-mission__grid-item:nth-child(2)::before {
    top: -17px;
    right: 0;
  }

  /* Departments: dark accordion cards, closed by default */
  [data-page="service-center"] .c-departments {
    padding: 64px 0;
    background-color: var(--color-white);
  }

  [data-page="service-center"] .c-departments__intro {
    margin-bottom: 48px;
    text-align: center;
  }

  [data-page="service-center"] .c-departments [data-module-accordion]>.c-accordion__layout {
    margin: 0;
  }

  [data-page="service-center"] .c-departments .c-accordion__layout-item {
    display: flex;
    flex-direction: column;
    gap: 24px;
    padding-left: 0;
  }

  [data-page="service-center"] .c-departments .c-faq-min__item {
    margin-bottom: 0;
    padding: 30px;
    border: 2px solid var(--color-header-black);
    border-radius: 5px;
    background-color: var(--color-header-black);
  }

  [data-page="service-center"] .c-departments .c-faq-min__item_click__JS {
    align-items: center;
    gap: 16px;
    min-height: 0;
    padding: 0;
  }

  [data-page="service-center"] .c-departments .c-faq-min__title {
    width: auto;
    color: var(--color-white);
    font-size: var(--fs-h3);
    letter-spacing: 1px;
    line-height: normal;
    text-transform: capitalize;
  }

  [data-page="service-center"] .c-departments .c-faq-min__btn {
    flex-basis: 36px;
    width: 36px;
    min-width: 36px;
    height: 36px;
    border-radius: 50%;
    background-color: var(--color-white);
  }

  [data-page="service-center"] .c-departments .c-faq-min__btn svg {
    width: 8px;
    height: 13px;
    fill: var(--color-red);
    transform: rotate(90deg);
  }

  [data-page="service-center"] .c-departments .c-faq-min__item.is-active .c-faq-min__btn svg {
    transform: rotate(-90deg);
  }

  [data-page="service-center"] .c-departments .c-faq-min__bottom-ov {
    margin-top: 24px;
    padding: 0;
  }

  [data-page="service-center"] .c-departments .c-faq-min__bottom-ov .l-layout__content-text {
    color: var(--color-white);
  }

  [data-page="service-center"] .c-departments .wrapper-center {
    margin-top: 24px;
  }

  /* Figma 8306:2158: 24 below the grid — the vendor button's own 25px top
     margin was stacking on the wrapper's 24 */
  [data-page="service-center"] .c-departments .wrapper-center .l-layout-content__button {
    margin-top: 0;
  }

  /* Benefits: golden-arches benefits styles come from home-spacing.css */
  [data-page="service-center"] [data-component="golden-arches"] #benefits-scrollto .c-benefits-list-scroll__item-img img {
    width: 50px;
    height: 49px;
  }

  [data-page="service-center"] [data-component="golden-arches"] .c-benefits-list-scroll__inner {
    padding-bottom: 52px;
  }

  /* General application */
  [data-page="service-center"] .c-general-application {
    padding: 64px 0;
    background-color: var(--color-header-black);
  }

  [data-page="service-center"] .c-general-application .l-layout__content {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 24px;
  }

  [data-page="service-center"] .c-general-application .l-layout__content-title {
    align-self: stretch;
    margin-bottom: 24px;
    padding: 8px 0;
    color: var(--color-white);
  }

  [data-page="service-center"] .c-general-application .l-layout__content-text {
    color: var(--color-white);
  }

  /* More than a job: yellow band, illustration, overlapping white card */
  [data-page="service-center"] .c-more-than-job {
    padding-bottom: 24px;
    background-color: var(--color-yellow);
  }

  /* Full illustration at every width (image ratio 4096 × 3066) */
  [data-page="service-center"] .c-more-than-job .c-education-benefits__image {
    height: auto;
    aspect-ratio: 4096 / 3066;
  }

  [data-page="service-center"] .c-more-than-job .c-education-benefits__main-content {
    margin-top: -64px;
  }

  [data-page="service-center"] .c-more-than-job .c-education-benefits__main-inner {
    padding: 48px 15px;
    border-radius: 6px;
  }

  [data-page="service-center"] .c-more-than-job .c-education-benefits__main-inner .l-layout__content {
    align-items: center;
    text-align: center;
  }

  [data-page="service-center"] .c-more-than-job .c-education-benefits__main-inner .l-layout__content-text {
    font-weight: 400;
  }

  [data-page="service-center"] .c-more-than-job .l-layout-content__button {
    margin: 0;
  }
}

/* DESKTOP — Figma 8306:2072 */
@media (min-width: 1000px) {
  [data-page="service-center"] .l-layout__content-title {
    margin-bottom: 0;
    color: var(--color-text-black);
    font-size: var(--fs-h2);
    letter-spacing: 1px;
    line-height: normal;
    text-transform: capitalize;
  }

  [data-page="service-center"] .l-layout__content-text {
    margin-bottom: 0;
    color: var(--color-text-black);
    font-size: var(--fs-body);
    letter-spacing: 1px;
    line-height: var(--lh-body);
  }

  /* Hero: title + tagline left, golden arches right; fries band follows directly */
  [data-page="service-center"] [data-component="main-hero"] .c-main-hero {
    height: auto;
    min-height: 0;
    margin-bottom: 0;
    padding-bottom: 0;
    border-bottom: 0;
    /* vendor interior hero rule */
  }

  /* Figma 8306:2075: 541 hero at 1440 (37.5694vw) under the fixed header.
     The header is a 32px top bar + a 6rem nav (122 / 128 / 140 at 1000 / 1440
     / 2000); a flat 96 put the hero's top 32px under the top bar. */
  [data-page="service-center"] .c-main-hero__inner {
    display: flex;
    align-items: center;
    height: calc(32px + 6rem + 37.5694vw);
    padding-top: calc(32px + 6rem);
    overflow: hidden;
  }

  [data-page="service-center"] .c-main-hero__container {
    position: relative;
    z-index: 1;
    width: 100%;
  }

  /* Vendor still stacks .o-layout.-flex at exactly 1000px */
  [data-page="service-center"] .c-main-hero__layout {
    flex-direction: row;
  }

  /* flex-basis, not width: the u-2/4@medium utility forces width */
  [data-page="service-center"] .c-main-hero__layout-item {
    flex: 0 0 100%;
  }

  [data-page="service-center"] .c-main-hero__content {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 24px;
    max-width: 697px;
  }

  /* Figma 8306:2080: two set lines, "Shape the Future of" / "McDonald's
     Austria" (broken in the markup); nowrap keeps each line whole */
  [data-page="service-center"] .c-main-hero__title {
    font-size: var(--fs-hero-title);
    letter-spacing: 1px;
    line-height: normal;
    text-align: left;
    text-transform: capitalize;
    white-space: nowrap;
  }

  /* Figma 8306:2081: the plate's block is 84 — 62 + the drip's 22 overhang —
     so the title/plate stack centres as 224 tall (title at y 158.5) */
  /* 473 at 16px, in rem so the plate grows with its 24 -> 27px label past
     1440 — at a fixed 473 the label wrapped to two lines at 2000 */
  [data-page="service-center"] .c-main-hero__subtitle {
    width: 29.5625rem;
    max-width: 100%;
    margin-top: 0;
    margin-bottom: 22px;
  }

  [data-page="service-center"] .c-main-hero__subtitle::after {
    right: 0;
    bottom: -22px;
    width: 29.5625rem;
    max-width: 100%;
    height: 30px;
    background-image: url("https://cdn.sites.stg.mchire.com/media-public/8641/61d3f1bb-b6dd-4d96-a195-8baa2aaaf313/image/1790238219664335service-center-tagline-drip.svg");
    background-position: right top;
    background-size: auto;
    z-index: -1;
  }

  [data-page="service-center"] .c-main-hero__subtitle-content {
    padding: 16px;
    font-size: var(--fs-hero-subtitle);
    text-align: center;
  }

  [data-page="service-center"] .c-main-hero__subtitle-message {
    margin: 0;
    letter-spacing: 1px;
    line-height: normal;
    white-space: nowrap;
    /* Figma 8306:2082: one line */
  }

  /* 753 / 1440 from the left, mirrored; bottom runs 33px past the hero (clipped) so it meets the fries at every width */
  [data-page="service-center"] .c-main-hero__arches {
    position: absolute;
    bottom: -2.2917vw;
    left: 52.2917%;
    width: 49.5139%;
    /* 713 / 1440 */
    transform: scaleX(-1);
    pointer-events: none;
  }

  [data-page="service-center"] .c-main-hero__arches img {
    display: block;
    width: 100%;
    height: auto;
  }

  /* Scroll hint — Figma 8306:2087: a 36 x 198 column at left 30 / top 168 of
     the hero, reading downwards: 135 of rotated text, 24, then the 36 disc. */
  [data-page="service-center"] [data-component="main-hero"] .__scroll {
    top: calc(32px + 6rem + 168px);
    right: auto;
    bottom: auto;
    left: 30px;
    width: 36px;
    height: 198px;
  }

  [data-page="service-center"] [data-component="main-hero"] .__scroll .scroll-wrap {
    position: absolute;
    top: 50%;
    left: 50%;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    width: 198px;
    height: 36px;
    gap: 24px;
    transform: translate(-50%, -50%) rotate(90deg);
  }

  [data-page="service-center"] [data-component="main-hero"] .__scroll .scroll-text {
    width: 135px;
    margin: 0;
    color: var(--color-black);
    font-size: 16px;
    letter-spacing: 1px;
    line-height: 32px;
    text-align: left;
    white-space: nowrap;
  }

  [data-page="service-center"] [data-component="main-hero"] .__scroll .scroll-arrow,
  [data-page="service-center"] [data-component="main-hero"] .__scroll .scroll-arrow::before {
    flex: 0 0 36px;
    justify-content: center;
    width: 36px;
    min-width: 36px;
    height: 36px;
  }

  [data-page="service-center"] [data-component="main-hero"] .__scroll .scroll-arrow::before {
    top: 0;
  }

  /* Fries band: 1440 × 596, animation centred */
  [data-page="service-center"] .c-main-hero__fries {
    aspect-ratio: 1440 / 596;
    overflow: hidden;
  }

  [data-page="service-center"] .c-main-hero__fries img {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }

  /* Intro */
  [data-page="service-center"] .c-mission {
    margin: 0;
    padding: 88px 0;
  }

  [data-page="service-center"] .c-mission .c-bubbles {
    top: -141px;
    right: 0;
    width: 400px;
    height: 221px;
    z-index: 1;
    pointer-events: none;
  }

  [data-page="service-center"] .c-mission__layout {
    display: flex;
    flex-wrap: nowrap;
    align-items: flex-start;
    gap: 88px;
    margin-left: 0;
  }

  [data-page="service-center"] .c-mission__layout.-gutter>.c-mission__layout-item {
    width: auto;
    padding-left: 0;
  }

  /* 471 : 593 at 1440 */
  [data-page="service-center"] .c-mission__layout.-gutter>.c-mission__layout-item:first-child {
    flex: 471 1 0;
    min-width: 0;
  }

  [data-page="service-center"] .c-mission__layout.-gutter>.c-mission__layout-item:last-child {
    flex: 593 1 0;
    min-width: 0;
  }

  [data-page="service-center"] .c-mission .l-layout__content-title--wrap {
    margin-bottom: 0;
  }

  /* Figma 8306:2101: the title box (557) is wider than its 471 column and
     centred on it (x -43), so "Recognized Worldwide" holds one line. Widening
     the h2 alone was clipped by the reveal wrapper (overflow: hidden) — the
     wrapper itself is widened. 563 = the line as rendered here (6 wider than
     Figma), in rem so the breaks hold as the type grows past 1440; capped at
     the column + 92 so it never reaches the copy. */
  [data-page="service-center"] .c-mission__layout-item:first-child .l-layout__content-title--wrap {
    width: min(35.1875rem, calc(100% + 92px));
    margin-left: -2.875rem;
  }

  [data-page="service-center"] .c-mission__layout-item:first-child .l-layout__content-title {
    width: 100%;
  }

  [data-page="service-center"] .c-mission .l-layout__content-text+.l-layout__content-text {
    margin-top: 16px;
  }

  /* Photo strip */
  [data-page="service-center"] .c-mission__grid {
    padding: 48px 0;
  }

  [data-page="service-center"] .c-mission__grid-list {
    justify-content: space-between;
  }

  [data-page="service-center"] .c-mission__grid-item,
  [data-page="service-center"] .c-mission__grid-item:nth-child(2) {
    flex: 0 0 29.5139%;
    /* 425 / 1440 */
    width: auto;
    margin: 0;
  }

  /* Figma 8306:2131: 425 x 250 at 1440. The vendor interior rule caps the
     image at max-height 250, which pinned it there past 1440 while the width
     kept growing — lifted so the ratio holds. */
  [data-page="service-center"] .c-mission__grid-image {
    height: auto;
    max-height: none;
    aspect-ratio: 425 / 250;
    border-radius: 5px;
  }

  [data-page="service-center"] .c-mission__grid-item:first-of-type .c-mission__grid-image {
    border-radius: 0 5px 5px 0;
  }

  [data-page="service-center"] .c-mission__grid-item:last-of-type .c-mission__grid-image {
    border-radius: 5px 0 0 5px;
  }

  /* Red squares — Figma 8306:2126 / 2128 / 2130: 150 squares against the 425
     photos. Sized and offset as shares of the photo (150 / 425 = 35.294%) so
     they keep the frame's proportion as the photos grow past 1440; % insets
     resolve against the item's width, the photo's width. Floored at the 1440
     values (150 / 16 / 13 / 17 / 20 px) so smaller desktops are unchanged. */
  [data-page="service-center"] .c-mission__grid-item::before,
  [data-page="service-center"] .c-mission__grid-item:first-of-type::before,
  [data-page="service-center"] .c-mission__grid-item:last-of-type::before {
    width: max(150px, 35.294%);
    height: auto;
    aspect-ratio: 1;
    border-radius: 5px;
  }

  [data-page="service-center"] .c-mission__grid-item:first-of-type::before {
    right: min(-16px, -3.765%);
    bottom: calc(-13 / 425 * var(--grid-photo-w, 425px));
  }

  [data-page="service-center"] .c-mission__grid-item:nth-child(2)::before {
    top: calc(-17 / 425 * var(--grid-photo-w, 425px));
    right: min(-20px, -4.706%);
  }

  [data-page="service-center"] .c-mission__grid-item:last-of-type::before {
    right: 0;
    bottom: calc(-13 / 425 * var(--grid-photo-w, 425px));
  }

  /* the photo's width, for the vertical insets above (% top/bottom would
     resolve against the item's height, not its width) */
  [data-page="service-center"] .c-mission__grid-list {
    --grid-photo-w: max(425px, 29.5139vw);
  }

  /* Departments: two columns of accordion cards */
  /* Bottom keeps the 64px of the removed CTA row so the half "M" (106px above benefits) clears the cards */
  [data-page="service-center"] .c-departments {
    padding: 88px 0 152px;
    background-color: var(--color-white);
  }

  [data-page="service-center"] .c-departments__intro {
    margin-bottom: 48px;
    text-align: center;
  }

  [data-page="service-center"] .c-departments [data-module-accordion]>.c-accordion__layout {
    margin: 0;
  }

  [data-page="service-center"] .c-departments .c-accordion__layout-item {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    align-items: start;
    gap: 24px 48px;
    width: 100%;
    padding-left: 0;
  }

  [data-page="service-center"] .c-departments .c-faq-min__item {
    margin-bottom: 0;
    padding: 30px;
    /* 32px in design, 2px stroke inside */
    border: 2px solid var(--color-header-black);
    border-radius: 5px;
    background-color: var(--color-header-black);
  }

  [data-page="service-center"] .c-departments .c-faq-min__item_click__JS {
    align-items: center;
    gap: 16px;
    min-height: 0;
    padding: 0;
  }

  [data-page="service-center"] .c-departments .c-faq-min__title {
    width: auto;
    color: var(--color-white);
    font-size: var(--fs-h3);
    letter-spacing: 1px;
    line-height: normal;
    text-transform: capitalize;
  }

  [data-page="service-center"] .c-departments .c-faq-min__btn {
    flex-basis: 36px;
    width: 36px;
    min-width: 36px;
    height: 36px;
    border-radius: 50%;
    background-color: var(--color-white);
  }

  [data-page="service-center"] .c-departments .c-faq-min__btn svg {
    width: 8px;
    height: 13px;
    fill: var(--color-red);
    transform: rotate(90deg);
  }

  [data-page="service-center"] .c-departments .c-faq-min__item.is-active .c-faq-min__btn svg {
    transform: rotate(-90deg);
  }

  [data-page="service-center"] .c-departments .c-faq-min__bottom-ov {
    margin-top: 24px;
    padding: 0;
  }

  [data-page="service-center"] .c-departments .c-faq-min__bottom-ov .l-layout__content-text {
    color: var(--color-white);
  }

  [data-page="service-center"] .c-departments .wrapper-center {
    margin-top: 24px;
  }

  /* Figma 8306:2158: 24 below the grid — the vendor button's own 25px top
     margin was stacking on the wrapper's 24 */
  [data-page="service-center"] .c-departments .wrapper-center .l-layout-content__button {
    margin-top: 0;
  }

  /* Half "M" at the left edge, 106px above the benefits section */
  [data-page="service-center"] [data-component="golden-arches"] {
    position: relative;
  }

  [data-page="service-center"] .c-benefits__arch {
    position: absolute;
    top: -106px;
    left: 0;
    z-index: 1;
    width: 200px;
    height: 300px;
    pointer-events: none;
  }

  [data-page="service-center"] .c-benefits__arch img {
    display: block;
    width: 100%;
    height: 100%;
  }

  /* Benefits: home desktop styles (home-spacing.css), minus the home gallery overlap */
  [data-page="service-center"] [data-component="golden-arches"] .c-benefits__banner {
    margin-top: 0;
  }

  [data-page="service-center"] [data-component="golden-arches"] .c-benefits-list-scroll__inner {
    gap: 88px;
  }

  /* Two equal columns: list (with red scrollbar as divider) | active benefit */
  [data-page="service-center"] [data-component="golden-arches"] .c-benefits-list-scroll__nav {
    flex: 0 0 calc(50% - 44px);
    width: auto;
  }

  [data-page="service-center"] [data-component="golden-arches"] .c-benefits-list-scroll__nav-wrapper {
    box-sizing: border-box;
    height: 492px;
    overflow-y: auto;
  }

  [data-page="service-center"] [data-component="golden-arches"] .c-benefits-list-scroll__content {
    margin-left: calc((50% - 44px - 440px) / 2);
  }

  [data-page="service-center"] [data-component="golden-arches"] .c-benefits-list-scroll__item-img img {
    object-fit: contain;
  }

  [data-page="service-center"] [data-component="golden-arches"] .c-benefits-list-scroll__background img {
    width: 205px;
    height: 200px;
    object-fit: contain;
  }

  /* General application: title left, copy + button right */
  [data-page="service-center"] .c-general-application {
    padding: 88px 0;
    background-color: var(--color-header-black);
  }

  [data-page="service-center"] .c-general-application .l-layout__content {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    align-items: center;
    gap: 24px 88px;
  }

  [data-page="service-center"] .c-general-application .l-layout__content-title {
    grid-row: 1 / span 2;
    align-self: center;
    padding: 8px 0;
    color: var(--color-white);
  }

  [data-page="service-center"] .c-general-application .l-layout__content-text {
    align-self: end;
    color: var(--color-white);
  }

  [data-page="service-center"] .c-general-application .l-layout-content__button {
    align-self: start;
    justify-self: start;
    margin: 0;
  }

  /* More than a job: 600px illustration band, overlapping white card */
  [data-page="service-center"] .c-more-than-job {
    padding-bottom: 64px;
    background-color: var(--color-yellow);
  }

  [data-page="service-center"] .c-more-than-job .c-education-benefits__image {
    height: 600px;
  }

  [data-page="service-center"] .c-more-than-job .c-education-benefits__main-content {
    margin-top: -64px;
  }

  [data-page="service-center"] .c-more-than-job .c-education-benefits__main-inner {
    padding: 48px;
    border-radius: 6px;
  }

  [data-page="service-center"] .c-more-than-job .c-education-benefits__main-inner .l-layout__content {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 24px;
    text-align: center;
  }

  /* Figma 8306:2208 / 8306:2209: title on two lines ("More Than a Job. Your" /
     "Place on the Mäcci Team."), copy on two lines at 990. Measured in rem so
     the boxes grow with the type past 1440 (root 16 -> 18 -> 20px); in px the
     57px title and 18px copy at 2000 wrapped to three lines each. */
  [data-page="service-center"] .c-more-than-job .l-layout__content-title {
    max-width: 43.75rem;
    /* 700 at 16px */
    color: var(--color-black);
  }

  [data-page="service-center"] .c-more-than-job .l-layout__content-text {
    max-width: 61.875rem;
    /* 990 at 16px */
    color: var(--color-black);
    font-weight: 400;
  }

  [data-page="service-center"] .c-more-than-job .l-layout-content__button {
    margin: 0;
  }
}

/* Small desktop: stack side-by-side text blocks so copy isn't squeezed */
@media (min-width: 1000px) and (max-width: 1199px) {
  [data-page="service-center"] .c-mission__layout {
    flex-wrap: wrap;
    gap: 24px;
  }

  [data-page="service-center"] .c-mission__layout.-gutter>.c-mission__layout-item:first-child,
  [data-page="service-center"] .c-mission__layout.-gutter>.c-mission__layout-item:last-child {
    flex: 0 0 100%;
  }

  [data-page="service-center"] .c-mission__layout-item:first-child .l-layout__content-title--wrap {
    width: auto;
    margin-left: 0;
  }

  [data-page="service-center"] .c-mission__layout-item:first-child .l-layout__content-title {
    width: auto;
  }

  [data-page="service-center"] .c-general-application .l-layout__content {
    gap: 24px 48px;
  }
}

/* Hero: below 1280 the tagline needs more room — narrower arches move right */
@media (min-width: 1000px) and (max-width: 1279px) {
  [data-page="service-center"] .c-main-hero__content {
    max-width: calc(60vw - 9rem - 24px);
  }

  [data-page="service-center"] .c-main-hero__arches {
    left: 60%;
    width: 40%;
  }
}

/* General application bubbles — Figma 8323:1412 (svg-fiz 2): the static bubble
   cluster, 400 x 221 at x -67 / y 255 of the 384 band, so it hangs 92 past the
   band's bottom edge over the photo below. Desktop only (the frame has no
   mobile placement). */
[data-page="service-center"] .c-general-application__bubbles {
  display: none;
}

@media (min-width: 1000px) {
  [data-page="service-center"] .c-general-application {
    position: relative;
    z-index: 2;
    /* over the next section, which the cluster overhangs */
  }

  [data-page="service-center"] .c-general-application__bubbles {
    position: absolute;
    bottom: -92px;
    /* = y 255 in the 384 band; kept from the bottom as the band's height varies */
    left: -67px;
    display: block;
    width: 400px;
    height: 221px;
    pointer-events: none;
  }

  [data-page="service-center"] .c-general-application__bubbles svg {
    display: block;
    width: 100%;
    height: 100%;
  }
}

/* Synced from Paradox platform — do not edit manually */
.c-main-hero-search .autocomplete {
  flex: 1 1 auto;
  width: 100%;
  min-width: 0;
}

.custom-search-box .location-search .location-item {
  padding: 6px;
  text-align: left;
}

.custom-search-box .location-search .location-item {
  margin: 5px;
  transition: 0.3s all ease-in-out;
}

.custom-search-box .location-search .location-item.location-item--hightlight {
  background-color: var(--color-white);
  border-radius: 5px;
}

.custom-search-box .location-search .location-item label {
  margin: 0 auto;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: space-between;


}

.custom-search-box .location-search .location-item__icon {
  position: relative;
  margin-left: 15px;
}

.custom-search-box .location-search .jl .location-item__icon::before {
  content: '';
  display: block;
  background-image: url('https://d21jvwj1c73d2e.cloudfront.net/oms/1157/image/2025/4/8IKBA_is-mcd/is-mcd.png');
  position: relative;
  width: 30px;
  height: 30px;
}

.results-list__item-header,
.results-list__item-brand {

  margin-bottom: 15px;
}

@media (min-width: 600px) {
  .results-list__item-header {
    display: flex;
    justify-content: space-between;
    /* margin-bottom: 25px; */

  }
}

.results-container {
  position: relative;
}

.keyword-search__input .keyword-search__icon-container .keyword-search__icon svg {
  fill: #000;
  width: 24px;
  height: 24px;
}

.custom-search-box .location-search .icon-container {
  top: inherit !important;
  background: none;
}

.keyword-search__input:before {
  content: "\f002";
  position: absolute;
  width: 20px;
  height: 20px;
  font: normal normal normal 14px / 1 FontAwesome;
  padding: 0;
  z-index: 1;
  color: #8F92A1;
  margin-left: 10px;
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: center;
}

@media (min-width: 600px) {
  .results-list__item-header {
    flex-direction: unset !important;
  }
}

.custom-search-box .location-search .icon-container .location-search__icon-right>svg[aria-labelledby="removeSelectionTitle"] {
  display: none;
}

[data-react-component="jobs-sort-by"] .jobs-sort-by_select_display_icon,
[data-react-component="jobs-radius"] .jobs-radius_select_display_icon {
  border: none !important;
}

[data-react-component="jobs-sort-by"] .jobs-sort-by_select_display,
[data-react-component="jobs-radius"] .jobs-radius_select_display {
  width: 10rem;
  border: none !important;
}

#footerpowered,
#cc-expire-alert,
#not-found .o-line,
.application-instructions-header,
.custom-apply-text,
#company-follow {
  display: none;
}

.no-hov:hover {
  color: var(--color-text-black) !important;
  cursor: default !important;
}

[data-component="banner-image"] .l-layout__content-listing.-deaux {
  gap: 4rem
}

[data-component="banner-image"] .sub-list a {
  word-wrap: break-word;
}

#job-detail .primary-background-color-lighter:hover,
#job-detail .primary-background-color-lighter:focus {
  background-color: var(--color-red);
  color: var(--color-white);
}

#job-detail .secondary-color {
  color: var(--color-white);
}

#job-detail .primary-background-color {
  background-color: rgb(100 101 101);
}

#job-detail .ApplyButton:not(.CustomTop) {
  background-color: rgb(100 101 101)
}

#job-detail .ApplyButton:not(.CustomTop):hover {
  background-color: var(--color-red);

}

#job-detail .job-description .apply-with-jobing-component .jobing-icon {
  fill: var(--color-white);
}

#job-detail .job-addl-info .map-button:hover,
#job-detail .job-addl-info .job-share-button:hover {
  color: var(--color-white);
  background-color: var(--color-red);
}

.job-description-content p {
  margin: 17px 0;
}

.job-description-content ul,
.job-description-content ol {
  display: block;
  list-style: disc outside none;
  margin: 1em 0;
  padding: 0 0 0 40px;
}

.job-description-content ol {
  list-style-type: decimal;
  list-style-position: inside;
}

.job-description-content ul ul,
.job-description-content ol ul {
  list-style-type: circle;
  list-style-position: inside;
  margin-left: 15px;
}

.job-description-content ol ol,
.job-description-content ul ol {
  list-style-type: lower-latin;
  list-style-position: inside;
  margin-left: 15px;
}

#job-detail .c-header-navigation,
.expired-job .c-header-navigation {
  position: relative;
  background-color: var(--color-white);
}

[data-react-component="search-box"] {
  position: relative;
  display: block;
  background-color: var(--color-yellow);
  border-radius: 5px;
  padding: 3rem 2rem;
  width: 100%;
}

[data-react-component="search-box"][data-react-prop-horizontal="false"]:after {
  width: 35%;
}

[data-react-component="search-box"]:after {
  content: '';
  display: block;
  position: absolute;
  bottom: -2.375rem;
  z-index: 1;
  width: 10%;
  right: 5%;
  height: 2.5rem;
  background-image: url(https://d21jvwj1c73d2e.cloudfront.net/oms/1157/image/2025/4/XA918_gooe/gooe.svg);
  background-repeat: no-repeat;
  background-size: contain;
  -webkit-transition: all 0.4s ease;
  transition: all 0.4s ease;
}

@media (max-width: 1000px) {
  [data-react-component="search-box"][data-react-prop-horizontal="true"]:after {
    width: 40%;
  }
}

[data-react-component="location-permission-request"] {
  display: none;
}

@media (min-width: 1000px) {
  [data-react-component="location-permission-request"] {
    position: absolute;
    bottom: 0;
    z-index: 999;
    max-width: 100%;
    width: 50%;
    display: block;
  }
}

.location-permission__description h1 {
  font-size: 21px;
}

.location-permission__description>p:first-child {
  margin-bottom: 10px;
}

[data-react-prop-horizontal="true"] {
  width: calc(100% - 3rem);
  margin: 0 auto;
  margin-top: -3rem;
  padding: 1rem;
  margin-bottom: 5rem;
}

@media (min-width: 1000px) {
  [data-react-prop-horizontal="true"] {
    width: calc(100% - 9rem);
    max-width: 1440px;
  }

  [data-react-prop-horizontal="true"] .location-permission__description {
    text-align: center;

  }
}

[data-react-prop-classname="c-jobs-list-only"] {
  width: 100%;
}

.c-jobs-list-only .result-item {
  display: flex;
  margin-bottom: 1rem;
  border-bottom: rgb(143 146 161 / 25%) 1px solid;
  position: relative;
  justify-content: space-between;
  align-items: center;
  padding: 1rem;
}

.c-jobs-list-only .result-item:last-child {
  border-bottom: none;
}

.c-jobs-list-only .result-item>.item-title {
  display: flex;
  flex-flow: column;
  margin-bottom: 1rem;
  position: relative;
}

.c-jobs-list-only .result-item:after {
  content: 'Apply Now' '\00a0\00a0' '\f105';
  font: normal normal normal 14px/1 FontAwesome, "Speedee", sans-serif;
  border: 1px solid rgba(255, 255, 255, 0.2);
  display: inline-block;
  font-size: 16px;

  line-height: 1.2em;
  background-color: var(--color-yellow);
  padding: 1.025em 2.5em;
  position: relative;
  border-radius: 0.5rem;
  -webkit-transition: all .45s ease;
  transition: all .45s ease;
}

.c-jobs-list-only a.item-title {
  color: var(--color-header-black);
  font-weight: bold;
  width: 500px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.expired-job-message-container .expired-job-message {
  border-top: 0px;
  border-bottom: 4px solid var(--color-red);
  color: var(--color-header-black);
  background: var(--color-white);
  padding: 3.2em 1.2em;
  text-align: center;
}

.expired-job-message__button,
.expired-job-joblist__button {
  border: 1px solid rgba(255, 255, 255, 0.2);
  margin-top: 30px;
  display: inline-block;
  font-size: 16px;
  align-items: center;
  justify-content: center;
  line-height: 1.2em;
  background-color: var(--color-red);
  padding: 15px 45px;
  position: relative;
  border-radius: 0.5rem;
  -webkit-transition: all .45s ease;
  transition: all .45s ease;
}

.expired-job-message__button--label,
.expired-job-joblist__button--label {
  font-weight: bold;
  color: var(--color-white);
}

.expired-job-joblist__button:hover,
.expired-job-message__button:hover {
  background-color: var(--color-header-black);
}

#location-list .c-header-navigation,
#PFoot,
#location-description #CompHTMLTop {
  display: none;

}

#location-description {
  background: url(https://d21jvwj1c73d2e.cloudfront.net/oms/1157/image/2025/4/62KJA_texture-slate/texture-slate.png) 0 0 repeat #262524;

}

#location-description #PContentContainer {
  max-width: none;
  padding: 5rem 2rem;
}

#location-description #PTitle h1,
#location-description #PContent h4,
#location-description #PContent p,
#location-description #PContent span {
  color: var(--color-white);
  display: block !important;
}

#location-description #PTitle h1 {
  margin-bottom: 1.5rem;
}

#location-description .open-jobs li {
  padding: 1rem;
  padding-left: 0;
  margin: 0.5rem 0;
  border-bottom: solid 0.2rem var(--color-white);
}

#location-description .open-jobs li:hover {
  border-color: var(--color-yellow);
}

#location-description .open-jobs li a:hover {
  color: var(--color-white);
  text-decoration: none;
}

#location-description .title {
  font-size: 1.2rem;
  font-weight: 900;
  display: block;
}

#open-jobs h2 {
  color: var(--color-yellow);
}

.container-map a>path.available {
  fill: var(--color-red);
  stroke-width: 0.5px;
  transition: 0.3s all ease-in-out;
  stroke: var(--color-yellow);
}

.container-map a:hover>path.available {
  fill: var(--color-yellow)
}

.list-states .list-locations li a {
  color: #333;
  font-weight: bold;
}

.list-states .list-locations li {
  padding: 1rem 0;
}

.container-state span {
  font-size: 1.5rem;
  font-weight: bold;
}

#location-list .inner {
  padding: 2rem 0;
}

.container-locations-united-states h3 {
  font-size: 2rem;
  margin-bottom: 2rem;
  color: var(--color-black);
  background: var(--color-yellow);
  padding: 1rem;
  text-align: center;
}

.results-list__custom-location--name--label:before {
  content: '';
  background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="16" height="19"><path fill="%23D6D6D6" fill-rule="nonzero" d="M4.572 5.492V4.008c0-.245.193-.446.428-.446H6.43c.235 0 .428.201.428.446v1.484a.438.438 0 0 1-.428.446H5a.438.438 0 0 1-.428-.446Zm5 .446h1.427c.237-.001.429-.2.429-.446V4.008A.438.438 0 0 0 11 3.562H9.572c-.237.001-.429.2-.429.446v1.484c0 .245.193.446.43.446H9.57ZM4.998 9.5h1.429a.438.438 0 0 0 .428-.445V7.57a.438.438 0 0 0-.427-.445H5a.438.438 0 0 0-.428.445v1.485c0 .244.193.445.428.445H5Zm4.572 0H11c.237 0 .429-.2.429-.445V7.57A.438.438 0 0 0 11 7.125H9.572c-.237 0-.429.2-.429.445v1.485c0 .244.193.445.43.445H9.57Zm-2.715 3.117v-1.484a.438.438 0 0 0-.427-.445H5a.438.438 0 0 0-.428.445v1.484c0 .245.193.445.428.445H6.43a.438.438 0 0 0 .428-.445h-.001Zm2.715.445H11c.237 0 .429-.2.429-.445v-1.484a.438.438 0 0 0-.43-.445H9.572c-.237 0-.43.2-.43.445v1.484c0 .245.194.445.43.445ZM16 17.665V19H0v-1.336c0-.245.193-.445.428-.445h.697V.89c0-.494.382-.891.857-.891h12.036c.475 0 .857.397.857.89V17.22h.697c.235 0 .428.2.428.445h-.001Zm-13.16-.482h4.017v-2.487c0-.244.193-.445.43-.445h1.428c.235 0 .428.2.428.445v2.487h4.018V1.817L2.858 1.78l-.019 15.4Z"></path></svg>');
  width: 16px;
  height: 19px;
  display: block;
  margin-right: 10px;
}

.c-footer__copy-right ul li {
  width: 100%;
  max-width: 250px;
  /* width: 150px; */
}

.c-footer__copy-right ul li:last-of-type {
  max-width: none;
}

@media (min-width: 1000px) {
  .c-footer__info-layout .o-layout__item {
    width: 80%;
  }
}

@media (min-width: 1000px) {
  .c-footer__copy-right-layout.o-layout {
    display: flex;
    flex-direction: column !important;
  }
}

.c-footer-custom-list-item li {
  margin-bottom: .3rem;
}

.o-button.-fill:hover {
  color: var(--color-text-black);
}

.o-button.-fill:hover .o-button__icon {
  background-color: var(--color-red);
}

#benefits-scrollto .c-benefits-list-scroll__item-content h3 {
  font-family: var(--font-speedee, "Speedee", sans-serif);
  font-size: 24px;
  font-weight: 700;
  line-height: 1;
  letter-spacing: 1px;
  text-transform: capitalize;
  color: var(--color-header-black);
}

#benefits-scrollto .c-benefits-list-scroll__item-wall .l-layout__content-text,
#benefits-scrollto .c-benefits-list-scroll__item-content p {
  font-size: 16px;
  font-weight: 700;
  line-height: 32px;
  letter-spacing: 1px;
}

#benefits-scrollto .c-benefits-list-scroll__item-img {
  margin-right: 24px;
  flex-shrink: 0;
}

#benefits-scrollto .c-benefits-list-scroll__item-wall .l-layout__content-title {
  display: none;
}

#benefits-scrollto .c-benefits-list-scroll__item-wall .l-layout__content {
  text-align: left;
}

@media (max-width: 999px) {
  #mission-vision-scrollto {
    margin-bottom: 0;
  }

  [data-page="overview"] #ctu .c-image-info {
    margin-bottom: 0;
  }

  .c-benefits__mobile-banner .l-layout__content-title {
    font-size: clamp(2rem, 8vw, 3rem);
    line-height: 1.14;
    margin: 0;
    text-wrap: balance;
  }

  #benefits-scrollto .c-benefits__inner>.o-container:first-child {
    display: none;
  }

  .c-golden-arches__gallery::before {
    left: 0;
    width: 9rem;
    height: 4.5rem;
  }
}

@media (min-width: 1000px) {
  #benefits-scrollto .c-benefits-list-scroll__inner::before {
    content: "";
    position: absolute;
    left: 50%;
    top: 90px;
    width: 2px;
    height: 288px;
    /* background-color: var(--color-red); */
    transform: translateX(-50%);
  }

  #benefits-scrollto .c-benefits-list-scroll__nav-wrapper {
    height: 500px;
    overflow-x: hidden;
    overflow-y: auto;
  }
}

.c-faq-min__bottom-ov .c-faq-min__list {
  list-style: disc outside;
  margin: 0;
  padding-left: 1.5rem;
}

.c-faq-min__bottom-ov .c-faq-min__list>li {
  display: list-item;
}

.c-faq-min__bottom-ov .c-faq-min__list>li:last-child {
  margin-bottom: 0;
}

[data-page="mission-values"] #mission-wrapper {
  background: var(--color-white);
  color: var(--color-text-black);
}

[data-page="mission-values"] #mission-wrapper .l-layout__content-title {
  color: var(--color-header-black);
}

[data-page="mission-values"] #mission-wrapper .l-layout__content-text {
  color: var(--color-text-black);
}

#food-quality-scrollto .c-image-box-main__content {
  left: 0;
  width: 100%;
  top: auto;
  margin-top: -4rem;
}

@media (min-width: 1000px) {
  #food-quality-scrollto .c-image-box-main__background {
    width: calc(100% + 18rem);
  }
}

#food-quality-scrollto .o-button.-fill {
  background-color: var(--color-white);
}

#food-quality-scrollto .o-button.-fill:hover {
  color: var(--color-text-black);
}

.c-development__intro .o-button.-yellow {
  margin-left: auto;
  margin-right: auto;
}

.c-development__intro .o-button.-yellow:hover {
  color: var(--color-text-black);
}

.c-development__intro .o-button.-yellow:hover .o-button__icon {
  background-color: var(--color-red);
}

.c-development__card-icon svg {
  fill: var(--color-text-black);
}

.c-commitments .o-container {
  position: relative;
  z-index: 1;
}

.c-commitments__card-icon svg {
  width: 6.4rem;
  height: 6.4rem;
  fill: var(--color-text-black);
}

@media (min-width: 1000px) {
  .c-commitments__bubbles svg {
    width: 100%;
    height: 100%;
  }
}

#mission-vision-scrollto {
  margin-top: 2.857rem;
  /* mobile: 40px @ 14px root */
}

@media (min-width: 700px) {
  #mission-vision-scrollto {
    margin-top: 5.714rem;
    /* tablet: 80px @ 14px root */
  }
}

#mission-vision-scrollto .c-image-box-main__content {
  background: var(--color-bg-grey);
  color: var(--color-text-black);
  /* The image's .o-background also uses z-index:1 and sits later in the DOM,
       so lift the card above it to keep the overlap (card on top of photo). */
  z-index: 2;
}

#mission-vision-scrollto .l-layout__content-title {
  color: var(--color-text-black);
}

#mission-vision-scrollto .o-button.-yellow:hover {
  color: var(--color-text-black);
}

#mission-vision-scrollto .o-button.-yellow:hover .o-button__icon {
  background-color: var(--color-red);
}

@media (min-width: 1000px) {
  #mission-vision-scrollto {
    margin-top: 5rem;
  }

  #mission-vision-scrollto .c-image-box-main__content {
    border-radius: 0 5px 5px 0;
  }

  #mission-vision-scrollto .c-image-box-main__background {
    left: 0;
    border-radius: 10px 0 0 0;
  }
}

#caring-for-people-scrollto .c-image-box-main__content {
  background: var(--color-bg-grey);
  color: var(--color-text-black);
  /* The image's .o-background also uses z-index:1 and sits earlier in the DOM,
       so lift the card above it to keep the overlap (card on top of photo). */
  z-index: 2;
}

#caring-for-people-scrollto .l-layout__content-title {
  color: var(--color-text-black);
}

#caring-for-people-scrollto .o-button.-yellow:hover {
  color: var(--color-text-black);
}

#caring-for-people-scrollto .o-button.-yellow:hover .o-button__icon {
  background-color: var(--color-red);
}

@media (max-width: 999px) {
  #caring-for-people-scrollto .c-image-box-main__layout {
    display: flex;
    flex-direction: column;
  }

  #caring-for-people-scrollto .c-image-box-main__layout-item:first-child {
    order: 2;
  }

  #caring-for-people-scrollto .c-image-box-main__layout-item:last-child {
    order: 1;
  }
}

@media (min-width: 700px) {
  #caring-for-people-scrollto .c-image-box {
    margin-top: 10rem;
  }
}

:root,
:host {
  --font-sans: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
  --font-serif: ui-serif, Georgia, Cambria, "Times New Roman", Times, serif;
  --font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
  --color-orange-500: oklch(70.5% .213 47.604);
  --color-blue-500: oklch(62.3% .214 259.815);
  --color-gray-50: oklch(98.5% .002 247.839);
  --color-gray-100: oklch(96.7% .003 264.542);
  --color-gray-200: oklch(92.8% .006 264.531);
  --color-gray-300: oklch(87.2% .01 258.338);
  --color-gray-400: oklch(70.7% .022 261.325);
  --color-gray-500: oklch(55.1% .027 264.364);
  --color-gray-600: oklch(44.6% .03 256.802);
  --color-gray-800: oklch(27.8% .033 256.848);
  --color-gray-900: oklch(21% .034 264.665);
  --color-black: #000;
  --color-white: #fff;
  --spacing: 1rem;
  --container-lg: 32rem;
  --container-2xl: 42rem;
  --text-xs: .75rem;
  --text-xs--line-height: calc(1 / .75);
  --text-sm: .875rem;
  --text-sm--line-height: calc(1.25 / .875);
  --text-base: 1rem;
  --text-base--line-height: calc(1.5 / 1);
  --text-lg: 1.125rem;
  --text-lg--line-height: calc(1.75 / 1.125);
  --text-4xl: 2.25rem;
  --text-4xl--line-height: calc(2.5 / 2.25);
  --font-weight-light: 300;
  --font-weight-medium: 500;
  --font-weight-semibold: 600;
  --font-weight-bold: 700;
  --font-weight-extrabold: 800;
  --leading-normal: 1.5;
  --leading-relaxed: 1.625;
  --radius-md: .375rem;
  --radius-lg: .5rem;
  --radius-xl: .75rem;
  --radius-2xl: 1rem;
  --radius-4xl: 2rem;
  --drop-shadow-lg: 0 4px 4px #00000026;
  --ease-in: cubic-bezier(.4, 0, 1, 1);
  --ease-out: cubic-bezier(0, 0, .2, 1);
  --ease-in-out: cubic-bezier(.4, 0, .2, 1);
  --animate-spin: spin 1s linear infinite;
  --animate-ping: ping 1s cubic-bezier(0, 0, .2, 1) infinite;
  --animate-pulse: pulse 2s cubic-bezier(.4, 0, .6, 1) infinite;
  --animate-bounce: bounce 1s infinite;
  --blur-sm: 8px;
  --blur-lg: 16px;
  --default-transition-duration: .15s;
  --default-transition-timing-function: cubic-bezier(.4, 0, .2, 1);
  --default-font-family: var(--font-sans);
  --default-mono-font-family: var(--font-mono);
  --color-red: #db0007;
  --color-yellow: #ffbc0d;
  --color-light-yellow: #ffde86;
  --color-header-black: #292929;
  --color-text-black: #222;
  --color-charcoal: #555;
  --color-earl-grey: #a9a9a9;
  --color-glitter-grey: #ededed;
  --color-bg-grey: #f9f9f9;
  --color-mist-grey: #fcfcfc;
  --font-speedee: "Speedee", sans-serif;
}

::file-selector-button {
  box-sizing: border-box;
  border: 0 solid;
  margin: 0;
  padding: 0;
}

:-moz-focusring {
  outline: auto;
}

::file-selector-button {
  font: inherit;
  font-feature-settings: inherit;
  font-variation-settings: inherit;
  letter-spacing: inherit;
  color: inherit;
  opacity: 1;
  background-color: #0000;
  border-radius: 0;
}

:where(select:is([multiple], [size])) optgroup {
  font-weight: bolder;
}

:where(select:is([multiple], [size])) optgroup option {
  padding-inline-start: 20px;
}

::file-selector-button {
  margin-inline-end: 4px;
}

::placeholder {
  opacity: 1;
}

:-moz-ui-invalid {
  box-shadow: none;
}

::file-selector-button {
  appearance: button;
}

[hidden]:where(:not([hidden="until-found"])) {
  display: none !important;
}

.border-black {
  border-color: var(--color-black);
}

.border-white {
  border-color: var(--color-white);
}

.bg-black {
  background-color: var(--color-black);
}

.bg-charcoal {
  background-color: var(--color-charcoal);
}

.bg-gray-800 {
  background-color: var(--color-gray-800);
}

.bg-white {
  background-color: var(--color-white);
}

.text-charcoal {
  color: var(--color-charcoal);
}

@media (max-width: 999px) {
  [data-namespace="home-video"] {
    padding-top: 96px;
  }

  [data-page="overview"] .o-container {
    padding-right: var(--gutter);
    padding-left: var(--gutter);
  }

  [data-namespace="home-video"] [data-component="main-hero-video"] .c-main-hero {
    height: auto;
    min-height: 0;
  }

  [data-namespace="home-video"] .c-main-hero__inner {
    height: auto;
    padding-top: 24px;
    padding-bottom: 64px;
  }

  [data-namespace="home-video"] .c-main-hero__container,
  [data-namespace="home-video"] .c-main-hero__layout {
    height: auto;
    margin: 0;
  }

  [data-namespace="home-video"] .c-main-hero__layout {
    gap: 24px;
  }

  [data-namespace="home-video"] .c-main-hero__layout-item {
    height: auto;
  }

  [data-namespace="home-video"] .c-main-hero__content {
    padding-bottom: 8px;
  }

  [data-namespace="home-video"] .c-main-hero__title {
    color: var(--color-text-black);
    font-size: var(--fs-hero-title);
    letter-spacing: 1px;
  }

  [data-namespace="home-video"] .c-main-hero__subtitle-content,
  [data-namespace="home-video"] .c-main-hero__subtitle-message {
    color: var(--color-text-black);
    font-size: var(--fs-hero-subtitle);
    line-height: 1.6;
  }

  [data-namespace="home-video"] .c-main-hero__subtitle-message {
    margin: 0;
    font-weight: 700;
  }

  [data-namespace="home-video"] .c-main-hero-video__wrapper,
  [data-namespace="home-video"] .c-main-hero-video,
  [data-namespace="home-video"] .c-main-hero__background-main {
    aspect-ratio: 16 / 9;
    height: auto;
    overflow: hidden;
    width: 100%;
  }

  [data-namespace="home-video"] .c-main-hero__background,
  [data-namespace="home-video"] .c-main-hero__video {
    height: 100%;
    width: 100%;
  }

  [data-namespace="home-video"] .c-main-hero__video {
    display: block;
    object-fit: cover;
    object-position: center top !important;
    transform: none;
  }

  [data-component="olivia-cta"]>.o-container {
    padding: var(--section-py) var(--gutter);
  }

  [data-component="olivia-cta"] .c-olivia-cta__inner {
    padding: 0;
  }

  [data-component="olivia-cta"] .c-olivia-cta__layout-item .l-layout__content {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    /* button keeps its natural width */
    gap: 24px;
  }

  [data-component="olivia-cta"] .l-layout__content-title,
  [data-component="olivia-cta"] .l-layout__content-text {
    align-self: stretch;
    margin-bottom: 0;
  }

  [data-component="olivia-cta"] .c-olivia-cta.-light {
    box-shadow: none;
  }

  [data-component="olivia-cta"] .l-layout__content-title {
    padding: 12px;
    background-color: var(--color-yellow);
    color: var(--color-black);
    font-size: var(--fs-h3);
    letter-spacing: 1px;
    line-height: normal;
    text-transform: capitalize;
  }

  [data-component="olivia-cta"] .l-layout__content-title .-period {
    display: none;
  }

  [data-component="olivia-cta"] .l-layout__content-text {
    color: var(--color-black);
    font-size: var(--fs-body);
    letter-spacing: 1px;
    line-height: var(--lh-body);
  }

  [data-component="job-combo"] .c-job-combo {
    padding-right: 0;
    padding-left: 0;
  }

  [data-component="job-combo"] .c-job-combo-slider {
    margin-top: 0;
    margin-bottom: 78px;
    /* room for the wave below (86px in design, overlapping the card by 8px) */
    border-radius: 5px;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
  }

  [data-component="job-combo"] .c-job-combo-slider::after {
    right: auto;
    left: 20px;
    width: 247px;
    height: 60px;
    margin-top: -8px;
  }

  [data-component="job-combo"] .c-job-combo-slider__main {
    position: relative;
  }

  [data-component="job-combo"] .c-job-combo-slider__content {
    padding: 52px var(--gutter) 84px;
    text-align: left;
  }

  [data-component="job-combo"] .c-job-combo-slider__content h3 {
    color: var(--color-black);
    font-size: var(--fs-h2-alt);
    letter-spacing: 1px;
    line-height: normal;
    text-transform: capitalize;
  }

  [data-component="job-combo"] .c-job-combo-slider__content h3 .-italic,
  [data-component="job-combo"] .c-job-combo-slider__content h3 .-italic em {
    color: var(--color-black);
    font-size: var(--fs-h2-alt);
    font-style: italic;
    letter-spacing: 1px;
    line-height: normal;
  }

  [data-component="job-combo"] .swiper-control {
    position: absolute;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 12;
    pointer-events: none;
  }

  [data-component="job-combo"] .swiper-control-options {
    border-radius: 5px 0 5px;
    pointer-events: auto;
  }

  [data-component="job-combo"] .swiper-control-options button {
    min-width: 24px;
    min-height: 36px;
    padding: 2px 8px;
    gap: 8px;
    font-size: var(--fs-body);
    line-height: var(--lh-body);
    letter-spacing: 1px;
  }

  [data-component="job-combo"] .swiper-control-options svg {
    width: 15px;
    height: 16.5px;
    margin-left: 0;
  }

  [data-component="job-combo"] .swiper-horizontal>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic,
  [data-component="job-combo"] .swiper-pagination-horizontal.swiper-pagination-bullets.swiper-pagination-bullets-dynamic {
    bottom: 52px;
    left: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    width: auto !important;
    gap: 4px;
    overflow: visible;
    pointer-events: auto;
    transform: translateX(-50%);
  }

  [data-component="job-combo"] .swiper-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet,
  [data-component="job-combo"] .swiper-pagination-horizontal.swiper-pagination-bullets .swiper-pagination-bullet {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    width: 24px;
    height: 24px;
    margin: -8px -6px;
    background: transparent;
    opacity: 1;
    transform: none;
  }

  [data-component="job-combo"] .swiper-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet::before,
  [data-component="job-combo"] .swiper-pagination-horizontal.swiper-pagination-bullets .swiper-pagination-bullet::before {
    display: block;
    width: 4px;
    height: 4px;
    border-radius: 50%;
    background: var(--color-text-black);
    content: "";
    opacity: 0.3;
  }

  [data-component="job-combo"] .swiper-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet:focus-visible,
  [data-component="job-combo"] .swiper-pagination-horizontal.swiper-pagination-bullets .swiper-pagination-bullet:focus-visible {
    outline: 2px solid var(--color-text-black);
    outline-offset: -2px;
  }

  [data-component="job-combo"] .swiper-horizontal>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev,
  [data-component="job-combo"] .swiper-horizontal>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next,
  [data-component="job-combo"] .swiper-pagination-horizontal.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev,
  [data-component="job-combo"] .swiper-pagination-horizontal.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next {
    width: 24px;
    height: 24px;
    opacity: 1;
    transform: none;
  }

  [data-component="job-combo"] .swiper-horizontal>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev::before,
  [data-component="job-combo"] .swiper-horizontal>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next::before,
  [data-component="job-combo"] .swiper-pagination-horizontal.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev::before,
  [data-component="job-combo"] .swiper-pagination-horizontal.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next::before {
    width: 6px;
    height: 6px;
    opacity: 0.6;
  }

  [data-component="job-combo"] .swiper-horizontal>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active,
  [data-component="job-combo"] .swiper-horizontal>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-main,
  [data-component="job-combo"] .swiper-pagination-horizontal.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active,
  [data-component="job-combo"] .swiper-pagination-horizontal.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-main {
    width: 24px;
    height: 24px;
    background: transparent;
    opacity: 1;
    transform: none;
  }

  [data-component="job-combo"] .swiper-horizontal>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active::before,
  [data-component="job-combo"] .swiper-horizontal>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-main::before,
  [data-component="job-combo"] .swiper-pagination-horizontal.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active::before,
  [data-component="job-combo"] .swiper-pagination-horizontal.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-main::before {
    width: 8px;
    height: 8px;
    opacity: 1;
  }

  #maccas-scrollto .c-accordion {
    margin-top: 0;
    padding: var(--section-py) 0;
  }

  #maccas-scrollto .c-accordion>div:first-child {
    display: flex;
    flex-direction: column;
    gap: 24px;
    margin-bottom: 48px;
  }

  #maccas-scrollto .c-accordion>div:first-child .l-layout__content-title,
  #maccas-scrollto .c-accordion>div:first-child .l-layout__content-text {
    margin-bottom: 0;
    color: var(--color-text-black);
    letter-spacing: 1px;
    text-align: left;
  }

  #maccas-scrollto .c-accordion>div:first-child .l-layout__content-title {
    font-size: var(--fs-h2);
    line-height: normal;
    text-transform: capitalize;
  }

  #maccas-scrollto .c-accordion>div:first-child .l-layout__content-text {
    font-size: var(--fs-body);
    line-height: var(--lh-body);
  }

  #maccas-scrollto .c-accordion__layout.o-layout.-gutter {
    display: flex;
    gap: 24px;
    margin-left: 0;
    margin-bottom: 24px;
  }

  #maccas-scrollto .c-accordion__layout.o-layout.-gutter>.o-layout__item {
    padding-left: 0;
  }

  /* Mobile design order: Apprenticeship, Cleaning, Internship (desktop keeps DOM order) */
  #maccas-scrollto [data-module-accordion] {
    display: flex;
    flex-direction: column;
    gap: 24px;
    margin-bottom: 24px;
  }

  #maccas-scrollto [data-module-accordion]>.c-accordion__layout.o-layout.-gutter {
    display: contents;
  }

  #maccas-scrollto [data-module-accordion]>.c-accordion__layout:nth-child(3)>.c-accordion__layout-item:nth-child(2) {
    order: 1;
  }

  #maccas-scrollto [data-module-accordion]>.c-accordion__layout:nth-child(3)>.c-accordion__layout-item:nth-child(1) {
    order: 2;
  }

  #maccas-scrollto .wrapper-center {
    justify-content: flex-start;
  }

  [data-component="golden-arches"] {
    padding-top: 0;
  }

  /* Not in the mobile design: section title banner, arches graphic, bubbles canvas */
  [data-component="golden-arches"] .c-benefits__mobile-banner,
  [data-component="golden-arches"] canvas {
    display: none;
  }

  [data-component="golden-arches"] .c-golden-arches__content::before {
    content: none;
  }

  [data-component="golden-arches"] .c-golden-arches__gallery {
    height: 311px;
    margin-bottom: -100px;
  }

  [data-component="golden-arches"] .c-golden-arches__gallery::before {
    left: 20px;
  }

  /* Benefits card: synced.css hides it below 1000px */
  [data-component="golden-arches"] #benefits-scrollto .c-benefits__inner>.o-container:first-child {
    display: block;
    padding: 0 var(--gutter) 48px;
  }

  [data-component="golden-arches"] .c-benefits__inner .o-container .c-benefits__banner {
    margin-top: 0;
    padding: 42px;
    border-radius: 5px;
    box-shadow: 0 4px 2px rgba(0, 0, 0, 0.25);
  }

  /* Same sesame GIF as desktop (vendor only adds it from 1000px) */
  [data-component="golden-arches"] .c-benefits__banner::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    z-index: -1;
    display: block;
    width: 100%;
    height: 100%;
    border-radius: 5px;
    background-image: url(https://d21jvwj1c73d2e.cloudfront.net/oms/1149/image/2025/7/YFZD4_McDSesameSeeds-final/McDSesameSeeds-final.gif);
    background-position: left center;
    background-repeat: no-repeat;
    background-size: contain;
  }

  [data-component="golden-arches"] .c-benefits__banner .c-benefits-content-container {
    padding: 0;
  }

  [data-component="golden-arches"] .c-benefits__banner .l-layout__content-title {
    margin-bottom: 24px;
    color: var(--color-text-black);
    font-size: var(--fs-h2-alt);
    letter-spacing: 1px;
    line-height: normal;
    text-transform: capitalize;
  }

  [data-component="golden-arches"] .c-benefits__banner .l-layout__content-text {
    margin-bottom: 0;
    color: var(--color-text-black);
    font-size: var(--fs-body);
    letter-spacing: 1px;
    line-height: var(--lh-body);
  }

  [data-component="golden-arches"] .c-benefits-list-scroll>.o-container {
    padding-right: 0;
    padding-left: 0;
  }

  [data-component="golden-arches"] .c-benefits-list-scroll__inner {
    padding: 0 var(--gutter) 104px;
  }

  /* Vendor switches slides to a row from 700px; design keeps icon above text */
  [data-component="golden-arches"] .c-benefits-list-scroll__item {
    flex-direction: column;
    align-items: center;
    margin-bottom: 24px;
  }

  [data-component="golden-arches"] #benefits-scrollto .c-benefits-list-scroll__item-img {
    display: flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    width: 75px;
    height: 75px;
    margin-right: 0;
    padding: 10px;
    border-width: 2px;
    border-radius: 4px;
  }

  [data-component="golden-arches"] .c-benefits-list-scroll__item-content {
    width: 100%;
    margin-top: 24px;
  }

  [data-component="golden-arches"] #benefits-scrollto .c-benefits-list-scroll__item-content h3 {
    margin-bottom: 10px;
    color: var(--color-black);
    font-size: var(--fs-body);
    line-height: var(--lh-body);
  }

  [data-component="golden-arches"] #benefits-scrollto .c-benefits-list-scroll__item-content p {
    color: var(--color-black);
    font-weight: 400;
  }

  [data-component="golden-arches"] .c-benefits-list-scroll__nav-pagination {
    display: flex;
    justify-content: center;
    gap: 8px;
  }

  [data-component="golden-arches"] .c-benefits-list-scroll__nav-pagination .swiper-pagination-bullet {
    width: 8px;
    height: 8px;
    margin: 0 !important;
    background-color: rgba(34, 34, 34, 0.3);
    opacity: 1;
  }

  [data-component="golden-arches"] .c-benefits-list-scroll__nav-pagination .swiper-pagination-bullet-active {
    background-color: var(--color-red);
  }

  [data-component="education-benefits"] .c-education-benefits__image {
    height: 336px;
  }

  [data-component="education-benefits"] .c-education-benefits__main-content {
    margin-top: 0;
  }

  [data-component="education-benefits"] .c-education-benefits__main-inner {
    padding: var(--section-py) 0;
  }

  [data-component="education-benefits"] .c-education-benefits__main-inner .l-layout__content {
    display: flex;
    flex-direction: column;
    gap: 24px;
  }

  [data-component="education-benefits"] .c-education-benefits__main-inner .l-layout__content-title,
  [data-component="education-benefits"] .c-education-benefits__main-inner .l-layout__content-text {
    margin-bottom: 0;
    color: var(--color-black);
    letter-spacing: 1px;
  }

  [data-component="education-benefits"] .c-education-benefits__main-inner .l-layout__content-title {
    font-size: var(--fs-h2);
    line-height: normal;
    text-transform: capitalize;
  }

  [data-component="education-benefits"] .c-education-benefits__main-inner .l-layout__content-text {
    font-size: var(--fs-body);
    font-weight: 700;
    line-height: var(--lh-body);
  }

  [data-component="education-benefits"] .c-education-benefits__list {
    gap: 16px;
    margin: 24px 0;
  }

  [data-component="education-benefits"] .c-education-benefits__list-item {
    width: 100%;
    margin: 0;
  }

  [data-component="education-benefits"] .c-education-benefits__list-item:first-child .c-education-benefits__list-icon,
  [data-component="education-benefits"] .c-education-benefits__list-item:first-child .c-education-benefits__list-icon--container {
    height: auto;
    min-height: 0;
  }

  [data-component="education-benefits"] .c-education-benefits__list-content {
    width: 100%;
    min-height: 0;
    padding: 16px;
    background-color: transparent;
    color: var(--color-text-black);
    font-size: var(--fs-body);
    letter-spacing: 1px;
    line-height: var(--lh-body);
  }
}

/* Job cards (all breakpoints) */
#maccas-scrollto .c-faq-min__item {
  margin-bottom: 0;
  padding: 22px;
  /* 24px in design, stroke drawn inside */
  border: 2px solid var(--color-black);
  border-radius: 5px;
}

#maccas-scrollto .c-faq-min__item_click__JS {
  align-items: flex-start;
  gap: 24px;
  padding: 0;
}

#maccas-scrollto .c-faq-min__title {
  width: auto;
  font-size: var(--fs-h3);
  letter-spacing: 1px;
  line-height: normal;
  text-transform: capitalize;
}

#maccas-scrollto .c-faq-min__btn {
  flex-basis: 36px;
  width: 36px;
  min-width: 36px;
  height: 36px;
}

#maccas-scrollto .c-faq-min__btn svg {
  width: 8px;
  height: 13px;
}

#maccas-scrollto .c-faq-min__bottom-ov {
  padding: 0;
  margin-top: 24px;
}

#maccas-scrollto .c-faq-min__bottom-ov .l-layout__content-text {
  margin-bottom: 0;
  font-size: var(--fs-body);
  letter-spacing: 1px;
  line-height: var(--lh-body);
}

[data-component="education-benefits"] .c-education-benefits__list-icon--container img {
  display: block;
  max-width: none;
  object-fit: contain;
}

[data-component="education-benefits"] .c-education-benefits__list-item:nth-child(1) .c-education-benefits__list-icon--container img {
  width: 110px;
  height: 98px;
  object-fit: cover;
}

[data-component="education-benefits"] .c-education-benefits__list-item:nth-child(2) .c-education-benefits__list-icon--container img {
  width: 130px;
  height: 95px;
}

[data-component="education-benefits"] .c-education-benefits__list-item:nth-child(3) .c-education-benefits__list-icon--container img,
[data-component="education-benefits"] .c-education-benefits__list-item:nth-child(4) .c-education-benefits__list-icon--container img {
  width: 90px;
  height: 95px;
}

@media (min-width: 1000px) {

  /* 128px fixed header (32px top bar + 96px nav) */
  [data-namespace="home-video"] {
    padding-top: 128px;
  }

  [data-namespace="home-video"] .c-main-hero__title {
    color: var(--color-text-black);
    letter-spacing: 1px;
  }

  [data-namespace="home-video"] .c-main-hero__subtitle-message {
    margin: 24px 0 0;
    color: var(--color-text-black);
    font-size: var(--fs-hero-subtitle);
    font-weight: 400;
    line-height: normal;
  }

  [data-namespace="home-video"] [data-component="main-hero-video"] .c-main-hero {
    /* 41rem = 656px at the 1440 root; grows with the root ladder like the reference site */
    height: 41rem;
    min-height: 41rem;
  }

  [data-namespace="home-video"] .c-main-hero__inner {
    padding-top: 0;
  }

  [data-namespace="home-video"] .c-main-hero__container {
    height: 100%;
    margin: 0;
    padding-top: 128px;
    padding-bottom: 8px;
  }

  [data-namespace="home-video"] .c-main-hero__layout {
    flex-wrap: nowrap;
    gap: 5.5rem;
  }

  /* Design: 636px text column + 428px search widget at 1440.
     The widget column is a share of the row (428/1152) so it grows on wide
     screens like the reference site instead of staying 428px. */
  [data-namespace="home-video"] .c-main-hero__layout-item:first-child {
    flex: 1 1 auto;
    width: auto;
  }

  [data-namespace="home-video"] .c-main-hero__layout-item:last-child {
    flex: 0 0 37.153%;
    width: 37.153%;
  }

  /* Arches — Figma 8306:1333: 844x463, top 316 in the 656 hero (48.171%),
     running under the photo.
     Anchored from the TOP as a share of the hero's height, so the arch keeps
     the frame's position however tall the hero is. Size: vw up to 1440, then
     capped in rem — past 1440 the hero grows with the root font (16 -> 18 ->
     20px), not the viewport, and uncapped vw (1172x643 at 2000) climbed into
     the title. `max(…, 100% - h)` keeps a narrow (short) arch reaching the
     hero's bottom edge instead of floating above the photo. */
  [data-namespace="home-video"] .c-main-hero::before {
    --arch-w: min(58.611vw, 52.75rem);
    --arch-h: min(32.153vw, 28.9375rem);
    top: max(48.171%, calc(100% - var(--arch-h)));
    bottom: auto;
    width: var(--arch-w);
    height: var(--arch-h);
    background-size: 100% 100%;
    background-position: left top;
  }

  /* Scroll hint sits beside the top of the search widget */
  [data-namespace="home-video"] .__scroll {
    top: 188px;
    right: -40px;
    bottom: auto;
  }

  [data-namespace="home-video"] .c-main-hero-video__wrapper,
  [data-namespace="home-video"] .c-main-hero-video,
  [data-namespace="home-video"] .c-main-hero__background-main {
    aspect-ratio: 16 / 9;
    /* 43.75vw = 630px at 1440; keeps the same crop of the 16:9 frame at every
       width instead of cutting more and more off a fixed 630px box */
    height: 43.75vw;
    overflow: hidden;
    width: 100%;
  }

  [data-namespace="home-video"] .c-main-hero__background,
  [data-namespace="home-video"] .c-main-hero__video {
    height: 100%;
    width: 100%;
  }

  [data-namespace="home-video"] .c-main-hero__video {
    display: block;
    object-fit: cover;
    object-position: center top !important;
    transform: none;
  }

  /* Card stays in flow so a taller card (narrow desktop) pushes the slider down instead of overlapping it */
  /* 967 of the 1152 row at 1440 (Figma: the card's left edge on the job-combo
     banner's, 83.941% of its width). A share, not 967px: the banner stretches
     with the row, and a fixed card shrank to 44% of it at 2000. */
  [data-component="olivia-cta"] .c-olivia-cta {
    position: relative;
    width: 83.941%;
    max-width: 100%;
    margin-top: -182px;
    border-radius: 40px;
  }

  [data-component="olivia-cta"] .c-olivia-cta.-light {
    box-shadow: 0 4px 2px rgba(0, 0, 0, 0.25);
  }

  [data-component="olivia-cta"] .c-olivia-cta__layout-item {
    align-items: flex-start;
  }

  [data-component="olivia-cta"] .c-olivia-cta__layout-item .l-layout__content {
    flex: 1 1 auto;
    width: auto;
  }

  [data-component="olivia-cta"] .l-layout__content-title,
  [data-component="olivia-cta"] .l-layout__content-text {
    margin-bottom: 24px;
    color: var(--color-black);
    letter-spacing: 1px;
  }

  [data-component="olivia-cta"] .l-layout__content-title {
    line-height: normal;
  }

  [data-component="olivia-cta"] .l-layout-content__button,
  #maccas-scrollto .wrapper-center .l-layout-content__button,
  [data-component="education-benefits"] .l-layout-content__button {
    margin-top: 0;
  }

  /* 202 photo + 48 gap in the 847 content box at 1440. Below that they shrink
     with the card (the card is a share of the row now) so the copy column
     keeps its room; capped at the frame's 202 / 48 above. */
  [data-component="olivia-cta"] .c-olivia-cta__layout-item .c-olivia-cta__image {
    flex: 0 0 min(202px, 23.849%);
    width: min(202px, 23.849%);
    height: auto;
    aspect-ratio: 1;
    margin-left: min(48px, 5.667%);
    border: 0;
    overflow: hidden;
  }

  [data-component="job-combo"] .c-job-combo {
    min-height: 0;
    padding-bottom: 84px;
  }

  [data-component="job-combo"] .c-job-combo-slider {
    margin-top: 133px;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
  }

  [data-component="job-combo"] .c-job-combo-slider__content h3,
  [data-component="job-combo"] .c-job-combo-slider__content h3 .-italic,
  [data-component="job-combo"] .c-job-combo-slider__content h3 .-italic em {
    color: var(--color-black);
    letter-spacing: 1px;
  }

  [data-component="job-combo"] .c-job-combo-slider__content h3 {
    text-transform: capitalize;
  }

  /* Design wave: 287x70 on the right */
  [data-component="job-combo"] .c-job-combo-slider::after {
    right: 166px;
    width: 287px;
    height: 70px;
    margin-top: -2px;
  }

  [data-component="job-combo"] .c-job-combo-slider__content {
    padding: 60px 32px 92px;
  }

  [data-component="job-combo"] .c-job-combo-slider__main {
    position: relative;
  }

  [data-component="job-combo"] .c-job-combo-slider__content .l-layout__content-title {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0;
  }

  [data-component="job-combo"] .c-job-combo-slider__content .-italic,
  [data-component="job-combo"] .c-job-combo-slider__content .-italic em {
    font-size: var(--fs-body);
    font-style: normal !important;
    line-height: var(--lh-body);
  }

  [data-component="job-combo"] .swiper-control {
    position: absolute;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 12;
    pointer-events: none;
  }

  [data-component="job-combo"] .swiper-control-options {
    border-radius: 5px 0 5px;
    pointer-events: auto;
  }

  [data-component="job-combo"] .swiper-control-options button {
    min-width: 24px;
    min-height: 36px;
    padding: 2px 8px;
    gap: 8px;
    font-size: var(--fs-body);
    line-height: var(--lh-body);
    letter-spacing: 1px;
  }

  [data-component="job-combo"] .swiper-control-options svg {
    width: 15px;
    height: 16.5px;
    margin-left: 0;
  }

  [data-component="job-combo"] .swiper-horizontal>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic,
  [data-component="job-combo"] .swiper-pagination-horizontal.swiper-pagination-bullets.swiper-pagination-bullets-dynamic {
    bottom: 60px;
    left: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    width: auto !important;
    gap: 4px;
    overflow: visible;
    pointer-events: auto;
    transform: translateX(-50%);
  }

  [data-component="job-combo"] .swiper-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet,
  [data-component="job-combo"] .swiper-pagination-horizontal.swiper-pagination-bullets .swiper-pagination-bullet {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    width: 24px;
    height: 24px;
    margin: -8px -6px;
    background: transparent;
    opacity: 1;
    transform: none;
  }

  [data-component="job-combo"] .swiper-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet::before,
  [data-component="job-combo"] .swiper-pagination-horizontal.swiper-pagination-bullets .swiper-pagination-bullet::before {
    display: block;
    width: 4px;
    height: 4px;
    border-radius: 50%;
    background: var(--color-text-black);
    content: "";
    opacity: 0.3;
  }

  [data-component="job-combo"] .swiper-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet:focus-visible,
  [data-component="job-combo"] .swiper-pagination-horizontal.swiper-pagination-bullets .swiper-pagination-bullet:focus-visible {
    outline: 2px solid var(--color-text-black);
    outline-offset: -2px;
  }

  [data-component="job-combo"] .swiper-horizontal>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev,
  [data-component="job-combo"] .swiper-horizontal>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next,
  [data-component="job-combo"] .swiper-pagination-horizontal.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev,
  [data-component="job-combo"] .swiper-pagination-horizontal.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next {
    width: 24px;
    height: 24px;
    opacity: 1;
    transform: none;
  }

  [data-component="job-combo"] .swiper-horizontal>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev::before,
  [data-component="job-combo"] .swiper-horizontal>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next::before,
  [data-component="job-combo"] .swiper-pagination-horizontal.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev::before,
  [data-component="job-combo"] .swiper-pagination-horizontal.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next::before {
    width: 6px;
    height: 6px;
    opacity: 0.6;
  }

  [data-component="job-combo"] .swiper-horizontal>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active,
  [data-component="job-combo"] .swiper-horizontal>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-main,
  [data-component="job-combo"] .swiper-pagination-horizontal.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active,
  [data-component="job-combo"] .swiper-pagination-horizontal.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-main {
    width: 24px;
    height: 24px;
    background: transparent;
    opacity: 1;
    transform: none;
  }

  [data-component="job-combo"] .swiper-horizontal>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active::before,
  [data-component="job-combo"] .swiper-horizontal>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-main::before,
  [data-component="job-combo"] .swiper-pagination-horizontal.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active::before,
  [data-component="job-combo"] .swiper-pagination-horizontal.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-main::before {
    width: 8px;
    height: 8px;
    opacity: 1;
  }

  #maccas-scrollto .c-accordion {
    margin-top: 0;
    padding: 80px 0 0;
  }

  #maccas-scrollto .c-accordion>div:first-child {
    margin-bottom: 36px;
  }

  #maccas-scrollto .c-accordion>div:first-child .l-layout__content-title {
    margin-bottom: 0;
    color: var(--color-black);
    letter-spacing: 1px;
    text-transform: capitalize;
  }

  #maccas-scrollto .c-accordion>div:first-child .l-layout__content-text {
    margin-bottom: 0;
    letter-spacing: 1px;
  }

  #maccas-scrollto .c-accordion__layout.o-layout.-gutter {
    gap: 24px 48px;
    margin-left: 0;
    margin-bottom: 24px;
  }

  #maccas-scrollto .c-accordion__layout.o-layout.-gutter>.o-layout__item {
    padding-left: 0;
  }

  /* Cards keep their own height; a closed card must not stretch next to an open one */
  #maccas-scrollto .c-accordion__layout.o-layout.-gutter {
    align-items: flex-start;
  }

  #maccas-scrollto .c-faq-min__item_click__JS {
    min-height: 0;
  }

  [data-component="golden-arches"] {
    margin: 0;
    padding-top: 80px;
  }

  [data-component="golden-arches"] .c-golden-arches {
    margin-top: 0;
    padding-top: 0;
  }

  [data-component="golden-arches"] .c-golden-arches__horizontal h3 {
    margin: 0;
  }

  /* Figma 8306:1465: a 1440 x 588 photo band. Past 1440 it keeps that ratio
     (40.833vw) so the cover-fitted photo shows the frame's crop — at a flat
     588 a 2000-wide band cropped the faces off top and bottom. */
  [data-component="golden-arches"] .c-golden-arches__gallery {
    height: max(588px, 40.8333vw);
  }

  [data-component="golden-arches"] .c-benefits__banner {
    margin-top: -100px;
    padding: 60px;
    box-shadow: 0 4px 2px rgba(0, 0, 0, 0.25);
  }

  [data-component="golden-arches"] .c-benefits__banner .c-benefits-content-container {
    padding: 0;
  }

  [data-component="golden-arches"] .c-benefits__banner .l-layout__content-title {
    margin-bottom: 24px;
    color: var(--color-text-black);
    letter-spacing: 1px;
  }

  [data-component="golden-arches"] .c-benefits__banner .l-layout__content-text {
    margin-bottom: 0;
    color: var(--color-black);
    letter-spacing: 1px;
  }

  [data-component="golden-arches"] .c-golden-arches__horizontal h3 {
    color: var(--color-black);
    font-size: 5rem;
    letter-spacing: 1px;
  }

  /* Photo starts 80px below the top of the 80px heading */
  [data-component="golden-arches"] .c-golden-arches__gallery {
    margin-top: -21px;
  }

  /* Half "M" (design Fill-1: 50% yellow, 200x300) sits 106px above the heading, behind heading and photo */
  [data-component="golden-arches"] .c-golden-arches__content::before {
    top: -106px;
    bottom: auto;
    width: 200px;
    height: 300px;
    background-image: url("https://cdn.sites.stg.mchire.com/media-public/8641/61d3f1bb-b6dd-4d96-a195-8baa2aaaf313/image/17902381678934214fill1.svg");
    background-size: 100% 100%;
  }

  [data-component="golden-arches"] .c-golden-arches__gallery::before {
    left: 268px;
    width: 144px;
  }

  [data-component="golden-arches"] #benefits-scrollto .c-benefits-list-scroll__item-content h3 {
    color: var(--color-black);
  }

  [data-component="golden-arches"] .active .c-benefits-list-scroll__item-img::before {
    top: -7px;
    right: -8px;
    width: 20px;
    height: 20px;
  }

  [data-component="golden-arches"] .c-benefits-list-scroll__inner {
    align-items: flex-start;
    gap: 88px;
    justify-content: flex-start;
    margin-top: 48px;
    padding: 0 0 80px;
  }

  /* Nav column is 540px tall; the panel centres against it */
  [data-component="golden-arches"] #benefits-scrollto .c-benefits-list-scroll__nav-wrapper {
    height: 492px;
  }

  [data-component="golden-arches"] .c-benefits-list-scroll__content {
    align-self: center;
  }

  [data-component="golden-arches"] .c-benefits-list-scroll__nav {
    margin-right: 0;
    margin-left: 0;
  }

  [data-component="golden-arches"] .c-benefits-list-scroll__nav-wrapper {
    padding-top: 48px;
  }

  [data-component="golden-arches"] .c-benefits-list-scroll__item {
    align-items: center;
    margin-bottom: 48px;
  }

  [data-component="golden-arches"] .c-benefits-list-scroll__item-img {
    box-sizing: border-box;
    width: 75px;
    height: 75px;
    margin-right: 24px;
    padding: 10px;
    border-width: 2px;
    border-radius: 4px;
  }

  [data-component="golden-arches"] .c-benefits-list-scroll__item-img::before {
    top: -7px;
    right: -8px;
    width: 14px;
    height: 14px;
  }

  [data-component="golden-arches"] .c-benefits-list-scroll__item-img svg,
  [data-component="golden-arches"] .c-benefits-list-scroll__item-img img {
    width: 50px;
    height: 50px;
  }

  [data-component="golden-arches"] .c-benefits-list-scroll__item-content h3 {
    margin-bottom: 0;
    font-size: var(--fs-body);
    line-height: var(--lh-body);
    letter-spacing: 1px;
    text-transform: none;
  }

  [data-component="golden-arches"] .c-benefits-list-scroll__item-content p {
    margin-bottom: 0;
  }

  [data-component="golden-arches"] .c-benefits-list-scroll__content {
    flex: 0 0 440px;
    width: 440px;
    right: 0;
  }

  [data-component="golden-arches"] .c-benefits-list-scroll__item-wall.push {
    padding-right: 0;
  }

  [data-component="golden-arches"] .c-benefits-list-scroll__item-wall.active {
    display: flex;
    min-height: 439px;
    flex-direction: column;
    align-items: center;
    justify-content: center;
  }

  [data-component="golden-arches"] .c-benefits-list-scroll__background.no-bg {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 440px;
    height: 258px;
    margin-bottom: 30px;
  }

  [data-component="golden-arches"] .c-benefits-list-scroll__background svg {
    width: 350px;
    height: 258px;
    max-width: none;
  }

  [data-component="golden-arches"] .c-benefits-list-scroll__item-wall .l-layout__content {
    text-align: center;
  }

  [data-component="golden-arches"] .c-benefits-list-scroll__item-wall .l-layout__content-text {
    margin-bottom: 0;
    font-size: var(--fs-h3);
    line-height: normal;
    letter-spacing: 1px;
    text-transform: capitalize;
  }

  [data-component="golden-arches"] #benefits-scrollto .c-benefits-list-scroll__item-content h3 {
    font-size: var(--fs-body);
    line-height: var(--lh-body);
    text-transform: none;
  }

  [data-component="golden-arches"] #benefits-scrollto .c-benefits-list-scroll__item-wall .l-layout__content {
    text-align: center;
  }

  [data-component="golden-arches"] #benefits-scrollto .c-benefits-list-scroll__item-wall .l-layout__content-text {
    font-size: var(--fs-h3);
    line-height: normal;
    text-align: center;
    text-transform: capitalize;
  }

  /* Figma 8306:1592: a 1440 x 600 photo band (the image anchored top). Past
     1440 it keeps that ratio (41.667vw) so the cover-fitted photo shows the
     frame's crop instead of losing more of it as the band only widens. */
  [data-component="education-benefits"] .c-education-benefits__image {
    height: max(600px, 41.6667vw);
  }

  [data-component="education-benefits"] .c-education-benefits__main-content {
    margin-top: -64px;
  }

  [data-component="education-benefits"] {
    padding-bottom: 40px;
    /* with footer spacing: 125px from CTA to footer links, as designed */
  }

  [data-component="education-benefits"] .c-education-benefits__main-inner {
    padding: 48px 48px 0;
    border-radius: 5px;
  }

  [data-component="education-benefits"] .c-education-benefits__main-inner .l-layout__content-title,
  [data-component="education-benefits"] .c-education-benefits__main-inner .l-layout__content-text {
    color: var(--color-black);
    letter-spacing: 1px;
  }

  [data-component="education-benefits"] .c-education-benefits__main-inner .l-layout__content-title {
    margin-bottom: 24px;
  }

  [data-component="education-benefits"] .c-education-benefits__main-inner .l-layout__content-text {
    margin-bottom: 0;
  }

  /* Steps span the full 1152px container (outside the card's 48px padding) */
  [data-component="education-benefits"] .c-education-benefits__list {
    flex-wrap: nowrap;
    align-items: flex-start;
    gap: 64px;
    max-width: none;
    margin: 48px -48px;
  }

  [data-component="education-benefits"] .c-education-benefits__list-item {
    flex: 1 1 0;
    width: auto;
    margin: 0;
    gap: 24px;
  }

  [data-component="education-benefits"] .c-education-benefits__list-icon,
  [data-component="education-benefits"] .c-education-benefits__list-icon--container {
    width: auto;
    height: auto;
    min-height: 0;
  }

  [data-component="education-benefits"] .c-education-benefits__list-content {
    max-width: 168px;
    color: var(--color-text-black);
    letter-spacing: 1px;
    line-height: 1.5;
  }
}

@media (min-width: 1000px) and (max-width: 1199px) {

  /* The search widget is a fixed 340px here (below), so it sits further left as
     a share of the viewport than the 37.153% column does at 1440 — the 58.611vw
     arches ran under it and got clipped. Narrow the arches to clear the card,
     same 844:463 aspect ratio. */
  :root {
    /* 0px at 1000, 1px at 1200 — ramps the arches back up to the 58.611vw the
       wider block uses, so nothing jumps at the 1200px breakpoint */
    --arch-ramp: clamp(0px, (100vw - 1000px) / 200, 1px);
  }

  [data-namespace="home-video"] .c-main-hero::before {
    --arch-w: calc(52vw + 79.3 * var(--arch-ramp));
    --arch-h: calc(28.526vw + 43.5 * var(--arch-ramp));
  }

  /* Fixed 428px widget + 88px gap squeezed the title column to ~220px */
  [data-namespace="home-video"] .c-main-hero__layout {
    gap: 48px;
  }

  [data-namespace="home-video"] .c-main-hero__layout-item:last-child {
    flex-basis: 340px;
    width: 340px;
  }

  /* Benefits: fixed 440px panel + 88px gap left the list ~200px wide */
  [data-component="golden-arches"] .c-benefits-list-scroll__inner {
    gap: 48px;
  }

  [data-component="golden-arches"] .c-benefits-list-scroll__nav {
    flex: 1 1 0;
    width: auto;
    min-width: 0;
  }

  [data-component="golden-arches"] .c-benefits-list-scroll__content {
    flex: 0 0 340px;
    width: 340px;
  }

  [data-component="golden-arches"] .c-benefits-list-scroll__background.no-bg,
  [data-component="golden-arches"] .c-benefits-list-scroll__background svg {
    width: 100%;
  }
}

/* Auto-generated - do not edit */
.autocomplete {
  width: 100%;
  position: relative;
}

.autocomplete .autocomplete__suggestion {
  position: absolute;
  width: 100%;
  height: -moz-fit-content;
  height: fit-content;
  top: 100%;
  right: 0;
  max-height: 300px;
}

.modal__overlay {
  background-color: rgba(0, 0, 0, 0.2);
  width: 100vw;
  height: 100%;
  z-index: 99;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  position: fixed;
}

.modal__container {
  position: fixed;
  z-index: 1001;
  left: calc((100% - 760px) / 2);
  top: 100px;
  width: 760px;
}

.modal__header {
  background: #efefef;
  border-bottom: 1px solid #ccc;
  padding: 10px 16px;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.modal__header i {
  cursor: pointer;
}

.modal__body {
  padding: 10px 16px;
  background-color: white;
}

.modal__body .social-icons {
  display: flex;
  justify-content: center;
}

.share-logo {
  background: url("https://dy5f5j6i37p1a.cloudfront.net/jobing/2014/share-modal-social-sprite.png") no-repeat;
  width: 114px;
  height: 43px;
  margin-left: 5px;
  margin-right: 5px;
  margin-bottom: 40px;
}

.share-logo a {
  width: 100%;
  height: 100%;
  display: block;
}

.share-logo.facebook {
  background-position: 0 0;
}

.share-logo.twitter {
  background-position: -114px 0;
}

.share-logo.google {
  background-position: -228px 0;
}

.share-logo.linkedin {
  background-position: -342px 0;
}

.share-link {
  background-color: #ddd;
  padding: 16px 10px;
  display: flex;
  margin-bottom: 40px;
}

.share-link .share-link__description {
  width: 230;
}

.share-link .share-link__url {
  flex: 1;
  padding-left: 15px;
  padding-right: 15px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.input-group {
  padding: 15px 0px;
}

.input-group input,
.input-group textarea {
  border-bottom: 1px solid #ddd;
}

.submit-button-container {
  width: 100%;
  display: flex;
  justify-content: center;
}

.submit-button-container .send-button {
  background-color: #8dbf02;
  padding: 5px;
  color: white;
  min-width: 100px;
}

.notify-message {
  border: 1px solid #97d397;
  background-color: #bbe2bb;
  color: #2b652b;
  position: fixed;
  left: 0;
  top: 0;
  right: 0;
  z-index: 5002;
  padding: 10px;
}

/**
 * Simaple Loader: <span class="loader-circle"></span>
 */
.loader-circle {
  width: 16px;
  height: 16px;
  border: 3px solid #a3a3a3;
  border-bottom-color: transparent;
  border-radius: 50%;
  display: inline-block;
  box-sizing: border-box;
  animation: loader-rotation 1s linear infinite;
}

@keyframes loader-rotation {
  0% {
    transform: rotate(0deg);
  }

  100% {
    transform: rotate(360deg);
  }
}

.commute-time-modal {
  background-color: #fff;
  color: rgb(34, 34, 34);
}

.commute-time-modal__header {
  border-bottom: 1px solid rgba(182, 184, 185, 0.29);
  display: flex;
  flex-direction: row;
  gap: 8px;
  justify-content: space-between;
  align-items: center;
  padding: 16px 16px;
}

.commute-time-modal__footer {
  border-top: 1px solid rgba(182, 184, 185, 0.29);
  display: flex;
  flex-direction: row;
  justify-content: flex-end;
  align-items: center;
  padding: 8px 25px;
  gap: 10px;
}

.commute-time-modal__button {
  padding: 11px 25px;
  border-radius: 4px;
  border: 1px solid rgba(182, 184, 185, 0.29);
  background-color: #fff;
  font-size: 14px;
  font-weight: 700;
  line-height: 21px;
  cursor: pointer;
}

.commute-time-modal__button.btn-brand {
  background-color: #8dc63f;
  border-color: #8dc63f;
  color: #fff;
}

.commute-time-modal__button.disabled {
  opacity: 0.6;
  cursor: not-allowed;
}

.commute-time-modal__button:hover {
  opacity: 0.8;
}

.commute-time-modal__title {
  display: flex;
  flex-direction: row;
  gap: 8px;
  align-items: center;
  font-weight: 700;
  font-size: 16px;
  line-height: 24px;
  color: rgb(34, 34, 34);
}

.commute-time-modal__title__icon {
  margin-top: 5px;
}

.commute-time-modal__form-group {
  margin: 25px;
  display: flex;
  flex-direction: column;
}

.commute-time-modal__form-group__label {
  font-size: 14px;
  margin-bottom: 12px;
}

.commute-time-modal__form-group.inline {
  flex-direction: row;
  gap: 10px;
  align-items: center;
  justify-content: space-between;
}

.commute-time-modal__close {
  border: 0;
  background: transparent;
  color: #666;
}

.commute-time-modal__icon.icon-brand {
  color: #8dc63f;
}

.commute-time-modal__location {
  border: 1px solid rgba(182, 184, 185, 0.5);
  border-radius: 4px;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  gap: 4px;
  padding: 0 16px;
}

.commute-time-modal__location.has-error {
  border-color: red;
}

.commute-time-modal__location__input {
  border: 0 !important;
  padding: 0px 10px !important;
  margin: 0px 4px !important;
  font-size: 16px !important;
  flex: 1;
}

.commute-time-modal__location__input input {
  border-top: 0 !important;
  border-bottom: 0 !important;
  border-right: 0;
}

.commute-time-modal__location-icon__right {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  gap: 8px;
}

.commute-time-modal__commute-method-options {
  padding: 0;
  margin: 0;
}

.commute-time-modal__commute-method-options ul {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: row;
  gap: 8px;
}

.commute-time-modal__commute-method-options ul li {
  padding: 8px 16px 8px 16px;
  margin: 0;
  display: inline-flex;
  align-items: center;
  border: 1px solid rgba(182, 184, 185, 0.29);
  border-radius: 50px;
  font-size: 24px;
  line-height: 24px;
  font-weight: 700;
}

.commute-time-modal__commute-method-options ul li:hover,
.commute-time-modal__commute-method-options ul li.active {
  background-color: #8dc63f;
  color: #ffffff;
  cursor: pointer;
}

.commute-time-modal__transportation-options {
  padding: 0;
  margin: 0;
}

.commute-time-modal__transportation-options ul {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: row;
  gap: 8px;
}

.commute-time-modal__transportation-options ul li {
  padding: 8px 16px;
  margin: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 8px;
  border: 1px solid rgba(182, 184, 185, 0.29);
  border-radius: 50px;
  font-size: 14px;
  line-height: 21px;
  font-weight: 700;
}

.commute-time-modal__transportation-options ul li:hover,
.commute-time-modal__transportation-options ul li.active {
  background-color: #8dc63f;
  color: #ffffff;
  cursor: pointer;
}

.commute-time-modal__transportation-options ul li:hover .icon-brand,
.commute-time-modal__transportation-options ul li.active .icon-brand {
  color: #ffffff !important;
}

.commute-time-modal__transportation-options__icon {
  display: flex;
}

.commute-time-modal__transportation-options__label {
  padding: 0 4px;
}

.commute-time-modal__estimation__switch {
  position: relative;
  display: inline-block;
  width: 38px;
  height: 20px;
}

.commute-time-modal__estimation__input {
  opacity: 0;
  width: 0;
  height: 0;
}

.commute-time-modal__estimation__slider {
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: #ccc;
  transition: 0.4s;
  border-radius: 50px;
}

.commute-time-modal__estimation__slider:before {
  position: absolute;
  content: "";
  height: 16px;
  width: 16px;
  left: 2px;
  bottom: 2px;
  background-color: #fff;
  transition: 0.4s;
  border-radius: 50px;
}

input:checked+.commute-time-modal__estimation__slider {
  background-color: #8dc63f;
}

input:focus+.commute-time-modal__estimation__slider {
  box-shadow: 0 0 1px #8dc63f;
}

input:checked+.commute-time-modal__estimation__slider:before {
  transform: translateX(19px);
}

.commute-time-modal__error {
  color: red;
  height: 30px;
  align-items: center;
  display: flex;
  font-size: 12.5px;
}

.commute-time-modal {
  /** AutoComplete location */
}

.commute-time-modal .autocomplete input.autocomplete__input {
  margin: 0;
  height: 44px;
  padding: 10px;
  width: calc(100% - 20px);
}

.commute-time-modal .autocomplete .autocomplete__suggestion {
  background: #fff;
  max-height: 220px;
  bottom: -226px;
  left: -51px;
  right: -49px;
  border: 1px solid rgba(182, 184, 185, 0.5019607843);
  overflow: auto;
  width: auto;
  border-bottom-right-radius: 5px;
  border-bottom-left-radius: 5px;
}

.commute-time-modal .autocomplete .location-item.location-item {
  padding: 10px;
}

.commute-time-modal .autocomplete .location-item.location-item:hover {
  background: #eee;
  cursor: pointer;
}

/** Keyword Search */
.keyword-search__input {
  position: relative;
}

.keyword-search__input input {
  margin: 0 !important;
}

.keyword-search__input .autocomplete .autocomplete__suggestion {
  position: absolute;
  width: calc(100% - 2px);
  top: 100%;
  right: 0;
  height: -moz-fit-content;
  height: fit-content;
  max-height: 300px;
  background: #fff;
  border: 1px solid #ddd;
  overflow: auto;
  z-index: 1;
}

.keyword-search__input .autocomplete .autocomplete__suggestion .keyword__suggestion__item {
  padding: 6px;
  border-radius: 3px;
  margin: 5px 8px;
  display: flex;
  flex-direction: row;
}

.keyword-search__input .autocomplete .autocomplete__suggestion .keyword__suggestion__item:hover {
  background-color: #ddd;
  cursor: pointer;
}

.keyword-search__icon:hover {
  cursor: pointer;
}

.keyword-search__icon-container {
  background: none !important;
}

.keyword-search__icon-container .keyword-search__icon {
  color: #8dc63f;
  display: flex;
}

.keyword-search__icon-container .keyword-search__label {
  color: rgb(34, 34, 34);
  font-weight: 600;
  font-size: 12px;
}

/** Location Search */
.location-search input {
  margin: 0 !important;
}

.location-search .icon-container {
  background-color: #fff;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: 5px;
  padding: 0 4px;
  top: 0 !important;
}

.location-search .icon-container .location-search__commute-time {
  border: 1px solid rgba(182, 184, 185, 0.29);
  padding: 4px 8px 4px 8px;
  background-color: #fff;
  border-radius: 48px;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
}

.location-search .icon-container .location-search__commute-time:hover {
  background-color: rgba(182, 184, 185, 0.29);
  background-color: rgb(247, 247, 247);
  cursor: pointer;
}

.location-search .icon-container .location-search__commute-time::-moz-selection {
  background-color: transparent;
}

.location-search .icon-container .location-search__commute-time::selection {
  background-color: transparent;
}

.location-search .icon-container .location-search__commute-time-icon {
  color: #8dc63f;
  display: flex;
  margin-right: 5px;
}

.location-search .icon-container .location-search__commute-time-label {
  color: rgb(34, 34, 34);
  font-weight: 600;
  font-size: 12px;
}

.location-search__commute-time-location {
  position: absolute;
  left: 1px;
  right: 1px;
  top: 1px;
  bottom: 1px;
  background-color: #fff;
  z-index: 2 !important;
}

.location-search__commute-time-location:hover {
  cursor: pointer;
}

.location-search__commute-time-location-inner {
  display: flex;
  flex-direction: row;
  gap: 10px;
  height: 20px;
  padding: 0 10px;
  height: 100%;
  align-items: center;
}

.location-search__commute-time-location svg {
  color: #8dc63f;
  display: flex;
  align-self: center;
}

.location-search__commute-time-location-label {
  width: calc(100% - 50px);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.location-search__commute-time-location-label-hint {
  color: #666666;
}

.location-search__commute-time-location-clear {
  font-size: 18px;
  position: absolute;
  bottom: -30px;
  height: 30px;
  right: 0;
  text-transform: uppercase;
  text-decoration: underline;
}

/** Jobs List Only default style */
[data-react-component="jobs-list-only"] .results-container .results-list__item-header {
  display: flex;
  flex-direction: column;
}

[data-react-component="jobs-list-only"] .results-container .results-list__item-commute-time-inner {
  padding: 3px 5px;
  margin: 0;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  gap: 8px;
  border: 1px solid rgba(182, 184, 185, 0.29);
  border-radius: 50px;
  font-size: 14px;
}

[data-react-component="jobs-list-only"] .results-container .results-list__item-commute-time--icon {
  display: flex;
}

[data-react-component="jobs-list-only"] .results-container .results-list__item-title .remote {
  background: #f3f3f3;
  color: #808285;
  border-radius: 100px;
  padding: 6px 16px;
  text-transform: uppercase;
  font-size: 12px;
  font-weight: 700;
  line-height: 24px;
}

[data-react-component="jobs-list-only"] .results-container .results-list__item-title .remote--empty {
  display: none;
}

[data-react-component="jobs-sort-by"] .jobs-sort-by_container {
  display: flex;
  align-items: center;
  padding: 5px 20px;
  border: 1px solid #e1e2f6;
  border-radius: 5px;
}

[data-react-component="jobs-sort-by"] .jobs-sort-by_label {
  margin-right: 10px;
}

[data-react-component="jobs-sort-by"] .jobs-sort-by_select_wrapper {
  position: relative;
}

[data-react-component="jobs-sort-by"] .jobs-sort-by_select_display {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 3px 10px;
  border: 1px solid #e1e2f6;
  border-radius: 5px;
  font-size: 14px;
  line-height: 24px;
}

[data-react-component="jobs-sort-by"] .jobs-sort-by_select_display:hover {
  cursor: pointer;
}

[data-react-component="jobs-sort-by"] .jobs-sort-by_select_display_icon {
  width: 32px;
  height: 28px;
  border-left: 1px solid #eee;
  text-align: center;
  margin: 3px 0;
}

[data-react-component="jobs-sort-by"] .jobs-sort-by_select_display_icon svg {
  display: inline-block;
  fill: #cccccc;
  line-height: 1;
  stroke: currentColor;
  stroke-width: 0;
}

[data-react-component="jobs-sort-by"] .jobs-sort-by_select_options {
  display: none;
  position: absolute;
  top: 100%;
  left: 0;
  width: 100%;
  border-radius: 5px;
  border: 1px solid #ddd;
  background: #fff;
  list-style: none;
  padding: 0;
  margin: 5px 0 0 0;
  z-index: 100;
}

[data-react-component="jobs-sort-by"] .jobs-sort-by_select_options.open {
  display: block;
}

[data-react-component="jobs-sort-by"] .jobs-sort-by_select_options li {
  padding: 10px;
  cursor: pointer;
}

[data-react-component="jobs-sort-by"] .jobs-sort-by_select_options li:hover {
  background: #eeeeee;
}

[data-react-component="jobs-radius"] .jobs-radius_container {
  display: flex;
  align-items: center;
  padding: 5px 20px;
  border: 1px solid #e1e2f6;
  border-radius: 5px;
}

[data-react-component="jobs-radius"] .jobs-radius_label {
  margin-right: 10px;
}

[data-react-component="jobs-radius"] .jobs-radius_select_wrapper {
  position: relative;
}

[data-react-component="jobs-radius"] .jobs-radius_select_display.disabled {
  pointer-events: none;
  cursor: not-allowed;
  background-color: rgb(242, 242, 242);
  border-color: rgb(230, 230, 230);
  color: rgb(153, 153, 153);
}

[data-react-component="jobs-radius"] .jobs-radius_select_display {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 3px 10px;
  border: 1px solid #e1e2f6;
  border-radius: 5px;
  font-size: 14px;
  line-height: 24px;
}

[data-react-component="jobs-radius"] .jobs-radius_select_display:hover {
  cursor: pointer;
}

[data-react-component="jobs-radius"] .jobs-radius_select_display_icon {
  width: 32px;
  height: 28px;
  border-left: 1px solid #eee;
  text-align: center;
  margin: 3px 0;
}

[data-react-component="jobs-radius"] .jobs-radius_select_display_icon svg {
  display: inline-block;
  fill: #cccccc;
  line-height: 1;
  stroke: currentColor;
  stroke-width: 0;
}

[data-react-component="jobs-radius"] .jobs-radius_select_options {
  display: none;
  position: absolute;
  top: 100%;
  left: 0;
  width: 100%;
  border-radius: 5px;
  border: 1px solid #ddd;
  background: #fff;
  list-style: none;
  padding: 0;
  margin: 5px 0 0 0;
  z-index: 100;
}

[data-react-component="jobs-radius"] .jobs-radius_select_options.open {
  display: block;
}

[data-react-component="jobs-radius"] .jobs-radius_select_options li {
  padding: 10px;
  cursor: pointer;
}

[data-react-component="jobs-radius"] .jobs-radius_select_options li:hover {
  background: #eeeeee;
}

[data-react-component="similar-jobs"] .similar-jobs__content {
  display: flex;
  flex-direction: row;
  justify-content: center;
  gap: 30px;
}

[data-react-component="similar-jobs"] .similar-jobs-item {
  display: flex;
  flex-direction: column;
  gap: 15px;
  background-color: #f8f8f8;
  border-radius: 30px;
  padding: 24px 16px;
  position: relative;
  width: 300px;
}

[data-react-component="similar-jobs"] .similar-jobs-item__title {
  font-weight: 600;
  font-size: 20px;
  line-height: 24px;
}

[data-react-component="similar-jobs"] .similar-jobs-item__location {
  font-size: 14px;
  font-weight: 600;
  color: #a2a2a2;
}

[data-react-component="similar-jobs"] .similar-jobs-item__location>span:nth-child(-n + 3) {
  margin-left: 5px;
}

[data-react-component="similar-jobs"] .similar-jobs-item__location--empty {
  display: none;
}

[data-react-component="similar-jobs"] .similar-jobs-item__remote {
  position: absolute;
  padding: 4px 10px;
  background-color: #fff;
  color: #a2a2a2;
  font-size: 10px;
  line-height: 12px;
  position: absolute;
  right: 16px;
  border-radius: 12px;
  display: inline-block;
  box-shadow: 0px 1px 3px 0px rgba(0, 0, 0, 0.1019607843);
}

[data-react-component="similar-jobs"] .similar-jobs-item__remote--empty {
  display: none;
}

[data-react-component="similar-jobs"] .similar-jobs-item__apply {
  display: flex;
  gap: 10px;
  align-items: center;
  margin-top: 16px;
}

[data-react-component="similar-jobs"] .similar-jobs-item__apply__button {
  font-size: 14px;
  font-weight: 500;
  line-height: 16px;
  padding: 8px 15px;
  border: 1px solid #a1a1a1;
  border-radius: 10px;
}

#ada-visually-hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  border: 0;
  clip: rect(0, 0, 0, 0);
  overflow: hidden;
  white-space: nowrap;
}

.hiring-event-list-view__container .hiring-event-list-view__list {
  display: flex;
  flex-direction: column;
  gap: 16px;
  margin: 0;
  padding: 0;
}

.hiring-event-list-view__container .hiring-event-list-view__list .hiring-event-list-view__list-item {
  list-style: none;
}

.hiring-event-list-view__container .card {
  display: flex;
}

.hiring-event-list-view__container .card .card__content {
  flex: 1;
}

/*Synced from Paradox platform - review before editing manually
 */
[data-react-component="jobs-sort-by"] .jobs-sort-by_label,
[data-react-component="jobs-radius"] .jobs-radius_label {
  font-weight: bold;
}

[data-react-component="jobs-sort-by"] .jobs-sort-by_container,
[data-react-component="jobs-radius"] .jobs-radius_container {
  /* border-radius: 2rem !important; */
  border-color: transparent !important;
}

.jobs-sort-by_label {
  font-size: initial
}

#jobs-list,
#footerpowered {
  display: none;
}

.c-jobs {
  width: 100%;
  padding: 0 0 8.8rem;
  /* max-width: 114rem; */
  margin-left: auto;
  margin-right: auto;
  box-sizing: border-box;
  font-family: "Avenir Next", sans-serif !important;
}

.c-jobs * {}

.c-jobs .heading-2 {
  max-width: 114rem;
  margin-left: auto;
  margin-right: auto;
}

@media screen and (min-width: 768px) {
  .c-jobs {
    width: 100%;
    /* padding: 8.8rem 6rem; */
  }
}

@media screen and (min-width: 1024px) {
  .c-jobs {
    width: 100%;
  }
}

.c-jobs * {
  box-sizing: border-box;
}

.c-jobs .c-job-main {
  display: flex;
  flex-direction: column;
  gap: 5rem;
  position: relative;
  max-width: 144rem;
  margin-left: auto;
  margin-right: auto;
  padding: 4rem 2rem;
}

@media screen and (min-width: 768px) {
  .c-jobs .c-job-main {
    padding: 6rem 4rem
  }
}

@media screen and (min-width: 1024px) {
  .c-jobs .c-job-main {
    padding: 8rem;
  }
}

.c-jobs .c-job-main__left {
  background-color: #F5F5F5;
  color: #1D1D1D;
  padding: 6rem 2rem;
  border-radius: 2.4rem;
  height: -moz-fit-content;
  height: fit-content;
  /* box-shadow: inset 0 0 0 200rem #071B45DD; */
  /* background-image: linear-gradient(180deg, #4040FF 0%, #0303C7 100%); */
  background-color: rgba(0, 59, 156, 1)
}

@media screen and (min-width: 768px) {
  .c-jobs .c-job-main__left {
    padding: 6rem 4rem;
    min-width: 40rem;
  }
}

@media screen and (min-width: 1024px) {
  .c-jobs .c-job-main__left {
    padding: 9rem 4rem;
  }
}

.c-jobs .c-job-main__left h2 {
  max-width: 75rem;
}

.c-jobs .c-job-main__left-inner {
  display: flex;
  flex-direction: column;
  gap: 0;
  max-width: 114rem;
  margin-left: auto;
  margin-right: auto;
  position: relative;
}

.c-jobs .c-job-main__left-inner .c-jobs-current-searches {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  margin-top: 3.3rem;
}

.c-jobs .c-job-main__left-inner .c-jobs-current-searches .jobs-current-searches__title {
  font-size: 2rem;
  line-height: 2.8rem;
  font-style: normal;
  font-weight: 700;
  color: #FFFFFF;
  display: none;
}

.c-jobs .c-job-main__left-inner .c-jobs-current-searches .jobs-current-searches__tag-list {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: center;
  gap: 1rem;
  list-style: none;
  padding: 0;
  margin: 0;
  width: 100%;
  max-width: 75rem;
  margin-left: auto;
  margin-right: auto;
  /* overflow: auto; */
}

.c-jobs .c-job-main__left-inner .c-jobs-current-searches .jobs-current-searches__tag-list:empty {
  display: none;
}

.c-jobs .c-job-main__left-inner .c-jobs-current-searches .jobs-current-searches__tag-item {
  padding: 0.4rem 0.8rem 0.4rem 1.2rem;
  background-color: transparent;
  display: flex;
  flex-direction: row;
  gap: 0.5rem;
  justify-content: center;
  align-items: center;
  transition: 0.3s ease-out all;
  cursor: default;
  color: #FFFFFF;
  border-radius: 2.4rem;
  box-shadow: inset 0 0 10rem 0 #0000;
  white-space: nowrap;
  border: 0.1rem solid #FFFFFF;
}

.c-jobs .c-job-main__left-inner .c-jobs-current-searches .jobs-current-searches__tag-item:hover {
  box-shadow: inset 0 0 10rem 0 #00000033
}

.c-jobs .c-job-main__left-inner .c-jobs-current-searches .jobs-current-searches__tag-close {
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: transparent;
  border: 0;
  cursor: pointer;
  width: 1.7rem;
  height: 1.7rem;
  transition: 0.3s ease-out all;
  border-radius: 50%;
  overflow: hidden;
}

.c-jobs .c-job-main__left-inner .c-jobs-current-searches .jobs-current-searches__tag-close svg {
  width: 9rem;
  height: 9rem;
}

.c-jobs .c-job-main__left-inner .c-jobs-current-searches .jobs-current-searches__tag-close svg>path {
  fill: #FFFFFF;
}

.c-jobs .c-job-main__right {
  width: 100%;
  max-width: 118rem;
  margin-left: auto;
  margin-right: auto;
}

@media screen and (min-width: 1024px) {
  .c-jobs .c-job-main__right {
    max-width: 130rem;
  }
}

.c-jobs .c-job-main__right .c-jobs-current-location {
  margin-bottom: 2rem;
}

.c-jobs .c-job-main__right .share-jobs__no-results {
  font-size: 1.6rem;
  color: #1D1D1D;
}

.c-jobs .c-job-main__sorting {
  display: flex;
  width: 100%;
  flex-direction: column;
  align-items: start;
  gap: 3rem;
}

@media screen and (min-width: 768px) {
  .c-jobs .c-job-main__sorting {
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    gap: 0;
  }
}

.c-jobs .c-job-main__sorting-left .results-header {
  font-weight: 600;
  line-height: 120%;
  font-size: 2.4rem;
  font-style: normal;
  margin: 0;
  color: #231F20;
}

.c-jobs .c-job-main__sorting-left .results-header .results-header__showing,
.c-jobs .c-job-main__sorting-left .results-header .results-header__content-paging {
  /* display: none; */
}

.results-header__showing,
.results-header__content,
.results-header__content-paging,
.results-header__content-total {
  background-color: #ffffff;
}

.c-jobs .c-job-main__sorting-left .results-header .results-header__content {
  /* display: flex; */
  flex-direction: column;
}

@media screen and (min-width: 768px) {
  .c-jobs .c-job-main__sorting-left .results-header .results-header__content {
    gap: 2rem;
    align-items: center;
    flex-direction: row;
  }
}

/* .c-jobs .c-job-main__sorting-left .results-header__content-total {
  color: #1D1D1D;
  font-size: 5.6rem;
  line-height: 6.8rem;
  font-weight: 700;
} */
.c-jobs .c-job-main__sorting-right {
  display: flex;
  gap: 3rem;
  flex-direction: column;
}

@media screen and (max-width: 767px) {
  .c-jobs .c-job-main__sorting-right {
    width: 100%;
  }
}

@media screen and (min-width: 768px) {
  .c-jobs .c-job-main__sorting-right {
    flex-direction: row;
    justify-content: start;
    gap: 2rem;
  }
}

@media screen and (min-width: 1024px) {
  .c-jobs .c-job-main__sorting-right {
    gap: 2rem;
  }
}

.c-jobs .c-job-main__sorting-right .c-jobs-sortby,
.c-jobs .c-job-main__sorting-right .c-jobs-radius {
  font-weight: 400;
  font-size: 1.6rem;
  /* width: -moz-fit-content;
    width: fit-content; */
  background-color: transparent;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  gap: 0.8rem;
  padding: 1.5rem 2rem;
  /* border-bottom: 0.1rem solid #1D1D1D; */
  /* background-color: #F5F5F5; */
  border-radius: 2.4rem;
}

.c-jobs .c-job-main__sorting-right .c-jobs-sortby {
  min-width: 21rem;
}

.c-jobs .c-job-main__sorting-right .c-jobs-radius {
  min-width: 21rem;
}

.c-jobs .c-job-main__sorting-right .c-jobs-sortby .label,
.c-jobs .c-job-main__sorting-right .c-jobs-radius .label {
  flex-shrink: 0;
}

.c-jobs .c-job-main__sorting-right .c-jobs-sortby .react-select,
.c-jobs .c-job-main__sorting-right .c-jobs-radius .react-select {
  width: 100%;
}

.c-jobs .c-job-main__sorting-right .c-jobs-sortby .react-select_jobs-sort-by_item__control,
.c-jobs .c-job-main__sorting-right .c-jobs-sortby .react-select_jobs-radius_item__control,
.c-jobs .c-job-main__sorting-right .c-jobs-radius .react-select_jobs-sort-by_item__control,
.c-jobs .c-job-main__sorting-right .c-jobs-radius .react-select_jobs-radius_item__control {
  background-color: transparent;
  border: none;
  height: -moz-max-content;
  height: max-content;
  min-height: unset;
}

.c-jobs .c-job-main__sorting-right .c-jobs-sortby .react-select_jobs-sort-by_item__single-value,
.c-jobs .c-job-main__sorting-right .c-jobs-sortby .react-select_jobs-radius_item__single-value,
.c-jobs .c-job-main__sorting-right .c-jobs-radius .react-select_jobs-sort-by_item__single-value,
.c-jobs .c-job-main__sorting-right .c-jobs-radius .react-select_jobs-radius_item__single-value {
  font-size: 1.6rem;
  font-weight: 500;
}

.c-jobs .c-job-main__sorting-right .c-jobs-sortby .react-select_jobs-sort-by_item__indicator-separator,
.c-jobs .c-job-main__sorting-right .c-jobs-sortby .react-select_jobs-radius_item__indicator-separator,
.c-jobs .c-job-main__sorting-right .c-jobs-radius .react-select_jobs-sort-by_item__indicator-separator,
.c-jobs .c-job-main__sorting-right .c-jobs-radius .react-select_jobs-radius_item__indicator-separator {
  display: none;
}

.c-jobs .c-job-main__sorting-right .c-jobs-sortby .react-select_jobs-sort-by_item__indicator,
.c-jobs .c-job-main__sorting-right .c-jobs-sortby .react-select_jobs-radius_item__indicator,
.c-jobs .c-job-main__sorting-right .c-jobs-radius .react-select_jobs-sort-by_item__indicator,
.c-jobs .c-job-main__sorting-right .c-jobs-radius .react-select_jobs-radius_item__indicator {
  padding: 0 !important;
  color: #1D1D1D;
}

.c-jobs .c-job-main__sorting-right .c-jobs-sortby .react-select_jobs-sort-by_item__menu .react-select_jobs-sort-by_item__option--is-focused,
.c-jobs .c-job-main__sorting-right .c-jobs-sortby .react-select_jobs-sort-by_item__menu .react-select_jobs-radius_item__option--is-focused,
.c-jobs .c-job-main__sorting-right .c-jobs-sortby .react-select_jobs-radius_item__menu .react-select_jobs-sort-by_item__option--is-focused,
.c-jobs .c-job-main__sorting-right .c-jobs-sortby .react-select_jobs-radius_item__menu .react-select_jobs-radius_item__option--is-focused,
.c-jobs .c-job-main__sorting-right .c-jobs-radius .react-select_jobs-sort-by_item__menu .react-select_jobs-sort-by_item__option--is-focused,
.c-jobs .c-job-main__sorting-right .c-jobs-radius .react-select_jobs-sort-by_item__menu .react-select_jobs-radius_item__option--is-focused,
.c-jobs .c-job-main__sorting-right .c-jobs-radius .react-select_jobs-radius_item__menu .react-select_jobs-sort-by_item__option--is-focused,
.c-jobs .c-job-main__sorting-right .c-jobs-radius .react-select_jobs-radius_item__menu .react-select_jobs-radius_item__option--is-focused {
  background-color: #1D1D1D;
  color: #ffffff;
}

.c-jobs .c-job-main__sorting-right .c-jobs-sortby .react-select_jobs-sort-by_item__menu .react-select_jobs-sort-by_item__option--is-selected,
.c-jobs .c-job-main__sorting-right .c-jobs-sortby .react-select_jobs-sort-by_item__menu .react-select_jobs-radius_item__option--is-selected,
.c-jobs .c-job-main__sorting-right .c-jobs-sortby .react-select_jobs-radius_item__menu .react-select_jobs-sort-by_item__option--is-selected,
.c-jobs .c-job-main__sorting-right .c-jobs-sortby .react-select_jobs-radius_item__menu .react-select_jobs-radius_item__option--is-selected,
.c-jobs .c-job-main__sorting-right .c-jobs-radius .react-select_jobs-sort-by_item__menu .react-select_jobs-sort-by_item__option--is-selected,
.c-jobs .c-job-main__sorting-right .c-jobs-radius .react-select_jobs-sort-by_item__menu .react-select_jobs-radius_item__option--is-selected,
.c-jobs .c-job-main__sorting-right .c-jobs-radius .react-select_jobs-radius_item__menu .react-select_jobs-sort-by_item__option--is-selected,
.c-jobs .c-job-main__sorting-right .c-jobs-radius .react-select_jobs-radius_item__menu .react-select_jobs-radius_item__option--is-selected {
  background-color: #1D1D1D;
  color: #ffffff;
}

.c-jobs .c-job-main__sorting-right .c-jobs-sortby .react-select__control,
.c-jobs .c-job-main__sorting-right .c-jobs-radius .react-select__control {
  line-height: 1;
}

.c-jobs .c-job-main__sorting-right .c-jobs-sortby .react-select__control,
.c-jobs .c-job-main__sorting-right .c-jobs-sortby .react-select__control:hover,
.c-jobs .c-job-main__sorting-right .c-jobs-radius .react-select__control,
.c-jobs .c-job-main__sorting-right .c-jobs-radius .react-select__control:hover {
  width: 15rem;
  background: transparent;
  border: none;
}

.c-jobs .c-job-main__sorting-right .c-jobs-sortby .react-select__menu,
.c-jobs .c-job-main__sorting-right .c-jobs-radius .react-select__menu {
  box-shadow: none;
  overflow: hidden;
  line-height: 1;
}

.c-jobs .c-job-main__sorting-right .c-jobs-sortby .react-select__menu .react-select__menu-list,
.c-jobs .c-job-main__sorting-right .c-jobs-radius .react-select__menu .react-select__menu-list {
  background: #ffffff;
}

.c-jobs .c-job-main__sorting-right .c-jobs-sortby .react-select__menu .react-select__menu-list .react-select__option,
.c-jobs .c-job-main__sorting-right .c-jobs-radius .react-select__menu .react-select__menu-list .react-select__option {
  background-color: #ffffff;
  color: #1D1D1D;
  padding: 0.8rem 1.6rem;
  line-height: 1.5;
}

.c-jobs .c-job-main__sorting-right .c-jobs-sortby .react-select__menu .react-select__menu-list .react-select__option .react-select__option--is-focused,
.c-jobs .c-job-main__sorting-right .c-jobs-sortby .react-select__menu .react-select__menu-list .react-select__option .react-select__option--is-selected,
.c-jobs .c-job-main__sorting-right .c-jobs-sortby .react-select__menu .react-select__menu-list .react-select__option:hover,
.c-jobs .c-job-main__sorting-right .c-jobs-sortby .react-select__menu .react-select__menu-list .react-select__option:focus,
.c-jobs .c-job-main__sorting-right .c-jobs-radius .react-select__menu .react-select__menu-list .react-select__option .react-select__option--is-focused,
.c-jobs .c-job-main__sorting-right .c-jobs-radius .react-select__menu .react-select__menu-list .react-select__option .react-select__option--is-selected,
.c-jobs .c-job-main__sorting-right .c-jobs-radius .react-select__menu .react-select__menu-list .react-select__option:hover,
.c-jobs .c-job-main__sorting-right .c-jobs-radius .react-select__menu .react-select__menu-list .react-select__option:focus {
  background-color: #F8FDF0;
  color: #1D1D1D;
}

.c-jobs .c-main-hero-search {
  display: flex;
  flex-direction: column;
  margin-top: 3.6rem;
  margin-bottom: 3.3rem;
  gap: 1.5rem;
  max-width: 75rem;
  margin-left: auto;
  margin-right: auto;
}

@media screen and (min-width: 768px) {
  .c-jobs .c-main-hero-search {
    flex-direction: row;
    margin-top: 4rem;
  }
}

.c-jobs .c-main-hero-search input:focus,
.c-jobs .c-main-hero-search input:active {
  outline: none;
}

.c-jobs .c-main-hero-search__keyword {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  /* margin-bottom: 0.8rem; */
  width: 100%;
}

.c-jobs .c-job-main__left-inner>div:nth-child(3) .c-main-hero-search__keyword,
.c-jobs .c-job-main__left-inner>div:nth-child(3) .location-search {
  display: none !important;
}

.c-jobs .c-job-main__left-inner>div:nth-child(3) .c-main-hero-search__button {
  display: none !important;
}

.c-jobs .c-job-main__left-inner>div:nth-child(3) .c-main-hero-search__button button {
  pointer-events: none;
  opacity: 0;
}

.c-jobs .c-job-main__left-inner>div:nth-child(1) .c-main-hero-search__button {
  display: flex !important;
}

@media screen and (min-width: 768px) {
  .c-jobs .c-job-main__left-inner>div:nth-child(1) .c-main-hero-search__button {
    /* display: none !important; */
    /* position: absolute; */
    /* top: 32.3rem; */
    /* right: 0; */
  }

  .c-jobs .c-job-main__left-inner>div:nth-child(3) .c-main-hero-search__button {
    display: flex !important;
  }
}

.c-jobs .c-job-main__left-inner>div:nth-child(3) .c-main-hero-search {
  margin: 0 !important
}

@media screen and (min-width: 768px) {
  .c-jobs .c-job-main__left-inner>div:nth-child(3) .c-main-hero-search {
    justify-content: flex-end;
    margin-bottom: 0 !important;
    margin-top: 4rem !important
  }
}

.c-jobs .c-main-hero-search__keyword-label {
  color: #1D1D1D;
  font-size: 1.6rem;
  font-style: normal;
  font-weight: 500;
  line-height: 110%;
}

.c-jobs .c-main-hero-search__keyword-input {
  color: #AEAEAE;
}

.c-jobs .c-main-hero-search .location-search {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  /* margin-bottom: 2.4rem; */
  width: 100%;
}

.c-jobs .c-main-hero-search .keyword-search__input,
.c-jobs .c-main-hero-search .location-search-input {
  background: #ffffff;
  padding: 1.5rem 2rem;
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 0.5rem;
  position: relative;
  height: 5.9rem;
  border-radius: 99rem;
  border: 0.1rem solid #F5F5F5;
  font-weight: 500;
  font-size: 1.8rem;
  line-height: 160%;
  letter-spacing: 0%;
}

.c-jobs .c-main-hero-search .keyword-search__input .autocomplete,
.c-jobs .c-main-hero-search .location-search-input .autocomplete {
  width: 100%;
  position: unset;
}

.c-jobs .c-main-hero-search .keyword-search__input .autocomplete input,
.c-jobs .c-main-hero-search .location-search-input .autocomplete input {
  width: 100%;
  font-size: 1.6rem;
  line-height: 2.8rem;
  color: #1D1D1D;
  background-color: #fff;
}

.c-jobs .c-main-hero-search .keyword-search__input .autocomplete input::placeholder,
.c-jobs .c-main-hero-search .location-search-input .autocomplete input::placeholder {
  font-size: 1.6rem;
  line-height: 2.8rem;
  color: #1D1D1D;
}

.c-jobs .c-main-hero-search .keyword-search__input .autocomplete .autocomplete__suggestion.menu,
.c-jobs .c-main-hero-search .location-search-input .autocomplete .autocomplete__suggestion.menu {
  width: auto;
  left: 0;
  right: 0;
  top: 100%;
  background-color: #ffffff;
  color: #1D1D1D;
  position: absolute;
  font-size: 1.6rem;
  line-height: 1.2;
  font-weight: 400;
  z-index: 999;
  border-radius: 2.4rem;
  /* border: 0.1rem solid #003792; */
  border: 0.1rem solid #00439C;
  overflow: auto;
}

.c-jobs .c-main-hero-search .keyword-search__input .autocomplete .autocomplete__suggestion.menu .location-item,
.c-jobs .c-main-hero-search .location-search-input .autocomplete .autocomplete__suggestion.menu .location-item {
  padding: 1rem 2rem;
}

.c-jobs .c-main-hero-search .keyword-search__input .autocomplete .autocomplete__suggestion.menu .location-item:not(:first-child),
.c-jobs .c-main-hero-search .location-search-input .autocomplete .autocomplete__suggestion.menu .location-item:not(:first-child) {
  margin-top: 0.5rem;
}

.c-jobs .c-main-hero-search .keyword-search__input .autocomplete .autocomplete__suggestion.menu .location-item:hover,
.c-jobs .c-main-hero-search .location-search-input .autocomplete .autocomplete__suggestion.menu .location-item:hover {
  /* background-color: #003792; */
  background-color: #00439C;
  color: #ffffff;
}

.c-jobs .c-main-hero-search .keyword-search__input .autocomplete .autocomplete__suggestion.menu .location-item__text,
.c-jobs .c-main-hero-search .location-search-input .autocomplete .autocomplete__suggestion.menu .location-item__text {
  display: flex;
  width: 100%;
  align-items: center;
  flex-flow: row-reverse;
  justify-content: flex-end;
}

.c-jobs .c-main-hero-search .keyword-search__input .autocomplete .autocomplete__suggestion.menu .location-item__zip::after,
.c-jobs .c-main-hero-search .location-search-input .autocomplete .autocomplete__suggestion.menu .location-item__zip::after {
  content: "-";
  margin: 0 0.3rem;
}

.c-jobs .c-main-hero-search .keyword-search__input .autocomplete .autocomplete__suggestion.menu .location-item--hightlight,
.c-jobs .c-main-hero-search .location-search-input .autocomplete .autocomplete__suggestion.menu .location-item--hightlight {
  background: #F8FDF0;
  color: #1D1D1D;
}

.c-jobs .c-main-hero-search .keyword-search__input .keyword-search__icon-container,
.c-jobs .c-main-hero-search .location-search-input .keyword-search__icon-container {
  background: transparent;
  position: relative;
  padding: 0 !important;
}

.c-jobs .c-main-hero-search .keyword-search__input .keyword-search__icon-container svg,
.c-jobs .c-main-hero-search .location-search-input .keyword-search__icon-container svg {
  height: 2rem;
  width: 2rem;
}

.c-jobs .c-main-hero-search .keyword-search__input .icon-container,
.c-jobs .c-main-hero-search .location-search-input .icon-container {
  background: transparent;
  padding: 0 !important;
}

.c-jobs .c-main-hero-search .keyword-search__input::before {
  content: "";
  flex-shrink: 0;
  background-image: url("https://d25zu39ynyitwy.cloudfront.net/oms/4096/image/2025/3/F0D0X_search-icon/search-icon.png");
  width: 2.4rem;
  height: 2.4rem;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}

.c-jobs .c-main-hero-search .location-search-input::before {
  content: "";
  flex-shrink: 0;
  background-image: url("https://d25zu39ynyitwy.cloudfront.net/oms/4096/image/2025/3/57SGA_location-icon/location-icon.png");
  width: 2.8rem;
  height: 2.8rem;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}

.c-jobs .c-main-hero-search .keyword-search__input-icon--search,
.c-jobs .c-main-hero-search .location-search__input-icon--pin {
  color: #8DC63F;
  display: none;
}

.c-jobs .c-main-hero-search .location-search__icon-right svg {
  width: 2rem;
  height: 2rem;
}

.c-jobs .c-main-hero-search .location-search__icon-right svg path {
  fill: #1D1D1D;
}

.c-jobs .c-main-hero-search .c-main-hero-search__location-content .icon-container .location-search__icon-left {
  display: none;
}

.c-jobs .c-main-hero-search .c-main-hero-search__location-content .icon-container>span {
  display: flex;
  align-items: center;
}

.c-jobs .c-main-hero-search .c-main-hero-search__location-content .icon-container>span>svg {
  fill: #1D1D1D;
}

.c-jobs .c-main-hero-search__button {
  width: 100%;
  margin-top: auto;
  background-image: linear-gradient(90deg, #F35B1E 0%, #FFD933 100%);
  padding: 0.2rem;
  height: 5.9rem;
  border-radius: 99rem;
  overflow: hidden;
}

@media screen and (min-width: 768px) {
  .c-jobs .c-main-hero-search__button {
    max-width: 9rem;
  }
}

.c-jobs .c-main-hero-search__button-search {
  font-size: 1.6rem;
  font-style: normal;
  font-weight: 500;
  line-height: 2.2rem;
  background-color: #FFFFFF;
  transition: 0.3s ease-out all;
  box-shadow: inset 0 100rem 0 0 rgba(0, 0, 0, 0);
  padding: 1.5rem;
  /* color: #003792; */
  color: #00439C;
  height: 100%;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 99rem;
}

.c-jobs .c-main-hero-search__button:hover .c-main-hero-search__button-search,
.c-jobs .c-main-hero-search__button:focus .c-main-hero-search__button-search {
  background-color: transparent;
  color: #FFFFFF;
}

/* .c-jobs .c-main-hero-search::before {
  content: "Keyword Search";
  font-weight: 500;
  font-size: 2rem;
  line-height: 3rem;
  margin-bottom: 1.6rem;
} */
.c-jobs .location-search--has-value .c-main-hero-search__location-drop input[aria-expanded=true]+.menu {
  position: absolute;
  bottom: -0.5rem;
  left: 0;
  transform: translateY(100%);
  background: #ffffff;
  color: #1D1D1D;
  width: 100%;
  padding: 0.5rem;
  z-index: 1;
  max-height: 19.3rem;
  overflow: auto;
  border-radius: 0.5rem;
  font-size: 1.6rem;
  line-height: 1.2;
  font-weight: 400;
}

.c-jobs .c-jobs-filter {
  display: flex !important;
  flex-direction: column;
  gap: 2rem;
  max-width: none !important;
}

@media screen and (min-width: 768px) {
  .c-jobs .c-jobs-filter {
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    gap: 2rem;
  }
}

.c-jobs .c-jobs-filter .filter-group {
  display: flex;
  flex-direction: column;
  gap: 2rem;
  /* flex-wrap: wrap; */
}

@media screen and (min-width: 768px) {
  .c-jobs .c-jobs-filter .filter-group {
    flex-direction: row;
    justify-content: center;
    align-items: center;
  }
}

.c-jobs .c-jobs-filter .filter-group>h3 {
  color: #FFFFFF;
  font-weight: 500;
  font-size: 1.8rem;
  line-height: 160%;
  letter-spacing: 0%;
}

.c-jobs .c-jobs-filter .filter-category-container {
  background-color: #FFFFFF;
  border: none;
  border-radius: 2.4rem;
  position: relative;
}

@media screen and (min-width: 768px) {
  .c-jobs .c-jobs-filter .filter-category-container {
    width: max-content;
  }
}

/* .c-jobs .c-jobs-filter .filter-category-container:last-child {
  margin-bottom: 0;
} */
.c-jobs .c-jobs-filter .filter-category-container .filter-header {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  padding: 1rem;
  font-size: 1.6rem;
  font-style: normal;
  font-weight: 400;
  line-height: 2rem;
  color: #1D1D1D;
  /* background-color: #FFFFFF1A; */
  gap: 0.5rem
}

.c-jobs .c-jobs-filter .filter-category-container .filter-header::after {
  /* content: "\f0dd";
  font: normal 900 1em/1 "Font Awesome 6 Free";
  transition: ease-out transform 0.3s;
  display: flex;
  height: 1rem;
  align-items: flex-end; */
  content: "";
  display: block;
  background-image: url(https://d25zu39ynyitwy.cloudfront.net/oms/4096/image/2025/3/BLIZA_arrow-down/arrow-down.png);
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  flex-shrink: 0;
  width: 1.4rem;
  height: 1.4rem;
  transition: ease-out transform 0.3s;
}

.c-jobs .c-jobs-filter .filter-category-container .filter-header.open::after {
  transform: rotate(180deg);
  -webkit-transform: rotate(180deg);
  -ms-transform: rotate(180deg);
}

.c-jobs .c-jobs-filter .filter-category-container .filter-options-list-container {
  /* max-height: 0; */
  max-height: 30rem;
  /* transition: max-height ease-out 0.3s; */
  overflow: hidden;
  padding: 0;
  position: absolute;
  background-color: #ffffff;
  width: 100%;
  z-index: 999;
  display: none;
  border-radius: 2.4rem;
}

.c-jobs .c-jobs-filter .filter-category-container .filter-options-list-container.is-expanded {
  /* max-height: 30rem; */
  /* animation: swipe-down 300ms linear forwards; */
  display: block;
  overflow: auto;
  min-width: 28rem;
}

/* @keyframes swipe-down {
    0% {
        display: none;
        max-height: 0;
    }

    1% {
        display: block;
        max-height: 0;
    }

    100% {
        display: block;
        max-height: 30rem;
    }
} */
.c-jobs .c-jobs-filter .filter-options-list {
  list-style: none;
  padding: 0 0 1.4rem;
}

.c-jobs .c-jobs-filter .filter-options-list-container {
  padding: 0;
  border-top: none;
  border: 0.3rem solid #F5F5F5;
}

.c-jobs .c-jobs-filter .filter-option {
  padding: 1rem 1.4rem 0
}

.c-jobs .c-jobs-filter .filter-option label {
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  gap: 1.6rem;
  color: #1D1D1D;
}

.c-jobs .c-jobs-filter .filter-option label input {
  accent-color: #1D1D1D;
  margin-top: 0.4rem;
}

.c-jobs .c-jobs-filter .filter-option label>.option-value {
  flex-grow: 1;
  display: flex;
  flex-direction: row;
  gap: 0.4rem;
  justify-content: space-between;
  font-size: 1.4rem;
}

.c-jobs .c-jobs-filter .reset-filters {
  text-align: end;
}

.c-jobs .c-jobs-filter .reset-filters .reset-filters__buton {
  font-size: 1.6rem;
  font-style: normal;
  font-weight: 700;
  color: #FFF;
}

.c-jobs .c-jobs-pagination {
  margin: 4rem 0 0;
  display: block;
  position: relative;
  width: -moz-fit-content;
  width: fit-content;
}

.c-jobs .c-jobs-pagination .page-size {
  display: none;
  border: none;
}

@media screen and (min-width: 1024px) {
  .c-jobs .c-jobs-pagination .page-size {
    background-color: #ffffff;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    border-radius: 0.8rem;
    /* border: 0.1rem solid #0303C7; */
    border: 0.1rem solid rgba(1, 125, 234, 1);
    padding: 0 0.8rem;
  }
}

.c-jobs .c-jobs-pagination .page-size:focus-visible {
  outline: none;
}

.c-jobs .c-jobs-pagination .pagination {
  display: flex;
  justify-content: center;
}

.c-jobs .pagination__list {
  display: flex;
  align-items: center;
}

@media screen and (min-width: 1024px) {
  .c-jobs .c-jobs-pagination .pagination {
    justify-content: flex-start;
  }
}

.c-jobs .c-jobs-pagination .pagination.mobile {
  display: none;
}

.c-jobs .c-jobs-pagination .page-links {
  background: #ffffff;
  display: flex;
  align-items: center;
}

@media screen and (min-width: 1024px) {
  .c-jobs .c-jobs-pagination .page-links {
    margin-right: 2rem;
  }
}

.c-jobs .c-jobs-pagination .page-links>a {
  cursor: pointer;
  color: #1D1D1D;
}

.c-jobs .c-jobs-pagination .page-link {
  font-weight: 500;
  font-size: 1.8rem;
  line-height: 2.8rem;
  transition: 0.3s ease-out all;
  padding: 0.4rem 1.2rem;
  border-radius: 1rem;
}

.c-jobs .c-jobs-pagination .page-link.page-link-next,
.c-jobs .c-jobs-pagination .page-link.page-link-last,
.c-jobs .c-jobs-pagination .page-link.page-link-first,
.c-jobs .c-jobs-pagination .page-link.page-link-previous {
  height: 3.6rem;
  width: 2rem;
  color: #1D1D1D;
  border: none;
  /* border-radius: 50%; */
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 0.5rem;
  transition: 0.3s ease-out all;
}

.c-jobs .c-jobs-pagination .page-link.page-link-next:hover,
.c-jobs .c-jobs-pagination .page-link.page-link-last:hover,
.c-jobs .c-jobs-pagination .page-link.page-link-first:hover,
.c-jobs .c-jobs-pagination .page-link.page-link-previous:hover {
  color: #1D1D1D;
  border: none;
}

.c-jobs .c-jobs-pagination .page-link.page-link-next:hover>svg>path,
.c-jobs .c-jobs-pagination .page-link.page-link-last:hover>svg>path,
.c-jobs .c-jobs-pagination .page-link.page-link-first:hover>svg>path,
.c-jobs .c-jobs-pagination .page-link.page-link-previous:hover>svg>path {
  fill: #1D1D1D;
}

.c-jobs .c-jobs-pagination .page-link.page-link-next>svg,
.c-jobs .c-jobs-pagination .page-link.page-link-last>svg,
.c-jobs .c-jobs-pagination .page-link.page-link-first>svg,
.c-jobs .c-jobs-pagination .page-link.page-link-previous>svg {
  flex-shrink: 0;
}

.c-jobs .c-jobs-pagination .page-link.page-link-next>svg>path,
.c-jobs .c-jobs-pagination .page-link.page-link-last>svg>path,
.c-jobs .c-jobs-pagination .page-link.page-link-first>svg>path,
.c-jobs .c-jobs-pagination .page-link.page-link-previous>svg>path {
  fill: #1D1D1D;
  transition: 0.3s ease-out all;
}

.c-jobs .c-jobs-pagination .page-link.page-link-next.not-selectable,
.c-jobs .c-jobs-pagination .page-link.page-link-last.not-selectable,
.c-jobs .c-jobs-pagination .page-link.page-link-first.not-selectable,
.c-jobs .c-jobs-pagination .page-link.page-link-previous.not-selectable {
  opacity: 0.5;
  cursor: not-allowed;
  display: none;
}

.c-jobs .c-jobs-pagination .page-link.page-link-last,
.c-jobs .c-jobs-pagination .page-link.page-link-first {
  display: none;
}

@media screen and (min-width: 768px) {

  .c-jobs .c-jobs-pagination .page-link.page-link-last,
  .c-jobs .c-jobs-pagination .page-link.page-link-first {
    display: flex;
  }
}

.c-jobs .c-jobs-pagination .page-link.current-page.not-selectable {
  color: #FFFFFF;
  /* background-color: #003792; */
  /* background-color: rgba(1, 125, 234, 1); */
  background-color: #0070CC;

}

.c-jobs .c-jobs-list {
  /* margin-top: 8rem; */
}

@media screen and (min-width: 1024px) {
  .c-jobs .c-jobs-list {
    margin-top: 0;
  }
}

.c-jobs .c-jobs-list .results-list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 2rem;
}

@media screen and (min-width: 768px) {
  .c-jobs .c-jobs-list .results-list {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: 4rem;
  }

}

.c-jobs .c-jobs-list .results-list:has(.result-suggestions-line) {
  gap: 1rem !important;
  margin-top: 2rem;
}

.c-jobs .c-jobs-list .result-suggestions-line {
  width: 100%;
}

/* Jobs list headings */
.jobs-list-headings-wrapper {
  padding: 0 3rem 0rem 2rem;
  display: none;
  width: 100%;
  margin-top: 8rem
}

.jobs-list-headings-wrapper>h3 {
  font-size: 2.2rem;
  font-weight: 700;
  line-height: 2.4rem;
}

.jobs-list-headings-wrapper>h3:first-child {
  width: 50%;
  flex-shrink: 0;
}

.jobs-list-headings-wrapper>h3:nth-child(2) {
  width: 60%;
}

.jobs-list-headings-wrapper>h3:nth-child(3) {
  /* flex-shrink: 0; */
  width: 40%;
}

@media screen and (min-width: 768px) {
  .jobs-list-headings-wrapper {
    display: flex;
    align-items: center;
    padding: 2rem 12rem 2rem 4rem;
    gap: 4rem;
    border: 2px solid #1D1D1D;
  }
}

/* End jobs list headings */
.c-jobs .c-jobs-list .results-list__item {
  padding: 3rem;
  display: flex;
  position: relative;
  justify-content: space-between;
  flex-direction: column;
  gap: 2rem;
  transition: 0.3s ease-out all;
  border: 0.3rem solid #F5F5F5;
  width: 100%;
  border-radius: 2.4rem;
  background-color: #fff;
}

.results-list__item-title--link,
.results-list__item-street--label {
  background-color: #ffffff;
}

@media screen and (min-width: 768px) {
  .c-jobs .c-jobs-list .results-list__item {
    padding: 3rem 24rem 3rem 3rem;
  }
}

@media screen and (min-width: 1024px) {
  .c-jobs .c-jobs-list .results-list__item {
    gap: 3rem;
    /* align-items: center; */
    width: calc((100% - 4rem) / 2);
  }
}

/* .c-jobs .c-jobs-list .results-list__item::after {
  content: "";
} */
.c-jobs .c-jobs-list .results-list__item-header {
  gap: 1.2rem;
}

@media screen and (min-width: 1024px) {
  .c-jobs .c-jobs-list .results-list__item-header {
    /* margin-right: 24.4rem; */
    /* width: 50%; */
    flex-shrink: 0;
  }
}

.c-jobs .c-jobs-list .results-list__item-header .results-list__item-title {
  text-decoration: none;
  font-size: 2.4rem;
  font-style: normal;
  font-weight: 400;
  line-height: 2.8rem;
  color: #1D1D1D;
}

.c-jobs .c-jobs-list .results-list__item-content {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 2rem;
  flex-shrink: 0;
  width: 100%;
}

@media screen and (min-width: 768px) {
  .c-jobs .c-jobs-list .results-list__item-content {
    /* flex-direction: row; */
    /* align-items: center; */
    /* width: calc(50% - 4rem); */
  }
}

.c-jobs .c-jobs-list .results-list__item-info {
  display: flex;
  flex-direction: column;
  width: 100%;
  gap: 1rem;
  justify-content: space-between;
}

@media screen and (min-width: 768px) {
  .c-jobs .c-jobs-list .results-list__item-info {
    width: 100%;
    gap: 1rem;
    /* flex-direction: row; */
    /* align-items: center; */
  }
}

.c-jobs .c-jobs-list .results-list__item-street {
  display: flex;
  flex-direction: column;
  gap: 1.2rem;
  /* flex-shrink: 0; */
  width: 100%;
}

.c-jobs .c-jobs-list .results-list__item-distance,
.c-jobs .c-jobs-list .results-list__item-brand,
.c-jobs .c-jobs-list .results-list__item-employment-type {
  display: flex;
  gap: 1.6rem;
  align-items: center;
}

.c-jobs .c-jobs-list .results-list__categories {
  text-align: left;
  /* min-width: 14rem; */
  width: 100%;
  font-size: 1.8rem;
  font-style: normal;
  font-weight: 500;
  line-height: 2.8rem;
  /* color: #003792; */
  color: #00439C;
}

@media screen and (min-width: 768px) {
  .c-jobs .c-jobs-list .results-list__categories {
    /* text-align: right; */
  }

  .c-jobs .c-jobs-list .results-list__item-street {
    /* width: 60%; */
  }

  .c-jobs .c-jobs-list .results-list__categories {
    /* width: 40%; */
  }
}

.c-jobs .c-jobs-list .results-list__item-street--label__wrapper {
  display: flex;
  gap: 1.6rem;
  align-items: center;
}

.c-jobs .c-jobs-list .results-list__item-street--icon,
.c-jobs .c-jobs-list .results-list__item-distance--icon,
.c-jobs .c-jobs-list .results-list__item-brand--icon,
.c-jobs .c-jobs-list .results-list__item-employment-type--icon {
  line-height: 1.2rem;
}

.c-jobs .c-jobs-list .results-list__item-street--icon>svg>g>g,
.c-jobs .c-jobs-list .results-list__item-distance--icon>svg>g>g,
.c-jobs .c-jobs-list .results-list__item-brand--icon>svg>g>g,
.c-jobs .c-jobs-list .results-list__item-employment-type--icon>svg>g>g {
  stroke: #1D1D1D;
}

.c-jobs .c-jobs-list .results-list__item-street--icon>svg>g,
.c-jobs .c-jobs-list .results-list__item-distance--icon>svg>g,
.c-jobs .c-jobs-list .results-list__item-brand--icon>svg>g,
.c-jobs .c-jobs-list .results-list__item-employment-type--icon>svg>g {
  stroke: #1D1D1D;
}

.c-jobs .c-jobs-list .results-list__item-street--icon {
  /* display: none !important; */
}

.c-jobs .c-jobs-list .results-list__item-street .results-list__item-distance--icon>svg>g>g,
.c-jobs .c-jobs-list .results-list__item-distance .results-list__item-distance--icon>svg>g>g,
.c-jobs .c-jobs-list .results-list__item-brand .results-list__item-distance--icon>svg>g>g,
.c-jobs .c-jobs-list .results-list__item-employment-type .results-list__item-distance--icon>svg>g>g {
  stroke: transparent;
  fill: #1D1D1D;
}

.c-jobs .c-jobs-list .results-list__item-street--label,
.c-jobs .c-jobs-list .results-list__item-street--more-locations__wrapper,
.c-jobs .c-jobs-list .results-list__item-distance--label,
.c-jobs .c-jobs-list .results-list__item-distance--more-locations__wrapper,
.c-jobs .c-jobs-list .results-list__item-brand--label,
.c-jobs .c-jobs-list .results-list__item-brand--more-locations__wrapper,
.c-jobs .c-jobs-list .results-list__item-employment-type--label,
.c-jobs .c-jobs-list .results-list__item-employment-type--more-locations__wrapper {
  font-size: 1.8rem;
  font-style: normal;
  font-weight: 300;
  /* color: #003792; */
  color: #00439C;
}

.c-jobs .c-jobs-list .results-list__item-street--more-locations::before,
.c-jobs .c-jobs-list .results-list__item-distance--more-locations::before,
.c-jobs .c-jobs-list .results-list__item-brand--more-locations::before,
.c-jobs .c-jobs-list .results-list__item-employment-type--more-locations::before {
  content: " ";
}

.c-jobs .c-jobs-list .results-list__item-apply {
  width: -moz-fit-content;
  width: fit-content;
  top: 50%;
  bottom: 0;
  right: 1rem;
  height: -moz-fit-content;
  height: fit-content;
  /* background-color: #003792; */
  /* background-color: rgba(1, 125, 234, 1); */
  background-color: #0070CC;
  padding: 1.2rem 1.6rem;
  border-radius: 99rem;
  color: #FFFFFF;
}

.c-jobs .c-jobs-list .results-list__item-apply:hover {
  /* background-image: linear-gradient(180deg, #4040FF 0%, #0303C7 100%); */
  outline: 2px solid #005499;
  outline-offset: 2px;
  background-color: #005499;
}

@media screen and (min-width: 768px) {
  .c-jobs .c-jobs-list .results-list__item-apply {
    position: absolute;
    right: 3rem;
    transform: translateY(-50%)
  }
}

.c-jobs .c-jobs-list .results-list__item-apply--label {
  color: #ffffff;
  transition: 0.3s ease-out all;
  font-size: 1.6rem;
  font-style: normal;
  font-weight: 500;
}

.c-jobs .c-jobs-list .results-list__item-apply--icon {
  display: none;
  justify-content: center;
  align-items: center;
  width: 2rem;
  height: 2rem;
  background-color: transparent;
  border-radius: 50%;
  transition: 0.3s ease-out all;
}

.c-jobs .c-jobs-list .results-list__item-apply--icon>svg>g>g {
  transition: 0.3s ease-out all;
  fill: #1D1D1D;
}

.c-jobs .c-jobs-list .results-list__item:hover {
  /* background-color: #E5ECF2; */
}

.c-jobs .c-jobs-list .results-list__item:hover .results-list__item-header .results-list__item-title {
  color: #1D1D1D !important;
}

.c-jobs .c-jobs-list .results-list__item:hover .results-list__item-apply::after {
  background-image: url(https://d25zu39ynyitwy.cloudfront.net/oms/3961/image/2024/11/TFB2D_apply-arrow-blue/apply-arrow-blue.svg);
}

.c-jobs .c-jobs-list .results-list.front {
  font-size: 1.8rem;
  font-style: normal;
  font-weight: 400;
  line-height: 160%;
}

.c-jobs .c-jobs-list .results-container {
  margin-top: 4rem;
  position: relative;
}

.c-jobs .c-jobs-list .results-container .card>h4 {
  font-size: 1.8rem;
  font-style: normal;
  font-weight: 400;
  line-height: 160%;
}

/* .c-jobs .c-main-hero-search__horizontal {
  display: flex;
  flex-direction: column;
  gap: 0.8rem;
  align-items: stretch;
  background: #F8FDF0;
  border-radius: 2rem;
  padding: 1.5rem;
  width: 100%;
  position: relative;
  max-width: none;
}
@media screen and (min-width: 768px) {
  .c-jobs .c-main-hero-search__horizontal {
    flex-direction: row;
    align-items: stretch;
    padding: 1.5rem;
    margin: 8rem 0;
  }
  .c-jobs .c-main-hero-search__horizontal > div {
    flex: 1;
  }
} */
.c-jobs .c-main-hero-search__horizontal .c-main-hero-search__keyword-label,
.c-jobs .c-main-hero-search__horizontal .c-main-hero-search__location-label {
  font-weight: 500;
  font-size: 1.8rem;
  line-height: 160%;
  letter-spacing: 0%;
  margin-bottom: 1rem;
  color: #FFFFFF;
  padding-left: 2rem;
}

.c-jobs .c-main-hero-search__horizontal .c-main-hero-search__button {
  width: 100%;
}

.c-jobs .c-main-hero-search__horizontal .menu {
  background: #ffffff;
  color: #1D1D1D;
  /* transform: translateY(calc(100% + 1.8rem)); */
}

.c-jobs .c-main-hero-search__horizontal .menu .location-item:hover {
  background: #F8FDF0;
  color: #1D1D1D;
}

.c-jobs .c-main-hero-search__horizontal .menu .location-item--hightlight {
  background: #F8FDF0;
  color: #1D1D1D;
}

.c-jobs.overview-hero-job-search {
  padding: 0 !important;
  margin-top: 0.5rem
}

.c-jobs.overview-hero-job-search .c-main-hero-search {
  gap: 2rem !important
}

.c-jobs.overview-hero-job-search .c-main-hero-search__button {
  max-width: 13rem !important;
  display: flex;
  align-items: flex-end;
}

.c-jobs.overview-hero-job-search .c-main-hero-search {
  margin: 0 !important;
}

@media screen and (min-width: 768px) {
  .c-jobs.overview-hero-job-search .c-main-hero-search {
    gap: 0.8rem !important
  }

  .c-jobs.overview-hero-job-search .c-main-hero-search__button {
    max-width: 13rem !important;
  }
}

.c-jobs.overview-hero-job-search .c-main-hero-search .keyword-search__input::before,
.c-jobs.overview-hero-job-search .c-main-hero-search .location-search-input::before {
  display: none !important;
}

.c-jobs.overview-hero-job-search input {
  font-size: 1.6rem !important;
}

.c-jobs.overview-hero-job-search .c-main-hero-search .keyword-search__input,
.c-jobs.overview-hero-job-search .c-main-hero-search .location-search-input {
  padding: 1.2rem 1.9rem !important;
}

.c-jobs.overview-hero-job-search .c-main-hero-search .keyword-search__input .autocomplete input::placeholder,
.c-jobs.overview-hero-job-search .c-main-hero-search .location-search-input .autocomplete input::placeholder {
  color: #071B4580 !important;
  font-size: 1.6rem !important;
}

.jobs-sort-by[data-react-component="jobs-sort-by"] .jobs-sort-by_select_display,
.jobs-radius[data-react-component="jobs-radius"] .jobs-radius_select_display {
  border: none;
  width: 10rem;
  background-color: #333;
  color: var(--color-white);
  font-weight: bold
}

:lang(de) .jobs-sort-by[data-react-component="jobs-sort-by"] .jobs-sort-by_select_display {
    width: 18rem;
}

.jobs-radius_select_display_text,
.jobs-sort-by_select_display_text {

  width: 100%;
}

.jobs-radius[data-react-component="jobs-radius"] .jobs-radius_select_display_icon,
.jobs-sort-by[data-react-component="jobs-sort-by"] .jobs-sort-by_select_display_icon {
  display: none;
}

/* Facet list Style */
/* Default (fallback) using Flexbox */
[data-react-component="jobs-filter"] .advanced-search-container .filter-category-container .filter-options-list-container .filter-options-list div.filter-option,
[data-react-component="jobs-filter"] .advanced-search-container .filter-category-container .filter-options-list-container .filter-options-list label.filter-option {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
  /* padding: 6px 0; */
}

[data-react-component="jobs-filter"] input[type="checkbox"] {
  margin-right: 12px;
}

.option-value.count {
  margin-left: auto;

}

/* Modern Grid override if supported */
@supports (display: grid) {

  [data-react-component="jobs-filter"] .advanced-search-container .filter-category-container .filter-options-list-container .filter-options-list div.filter-option,
  [data-react-component="jobs-filter"] .advanced-search-container .filter-category-container .filter-options-list-container .filter-options-list label.filter-option {
    display: grid;
    grid-template-columns: 16px auto auto;
    align-items: center;
    gap: 12px;
    /* padding: 8px 0; */
    justify-content: normal;
  }

  .option-value.count {
    justify-self: end;
    margin-left: 0;
  }

  [data-react-component="jobs-filter"] input[type="checkbox"] {
    margin-right: 0;
  }
}

/* Synced from Paradox platform - review before editing manually */
.c-main-hero-search>div:not(.location-permission-modal) {
  display: flex;
  flex-direction: column;
  position: relative;
  padding-bottom: 1.5rem;
}

.c-main-hero-search label {
  font-weight: bold;
  margin-bottom: 10px;
  display: block;
}

.c-main-hero-search input {
  width: 100%;
  background-color: var(--color-light-yellow);
  border-radius: 5px;
  padding: 1rem;
  padding-left: 40px;
  color: var(--color-header-black);
  text-overflow: ellipsis;
  padding-right: 25px;
}

.c-main-hero-search .location-search--has-value input[aria-expanded="true"] {
  border-radius: 5px 5px 0 0;
}

.keyword-search__input-icon--search,
.location-search__input-icon--pin {
  position: absolute;
  left: 15px;
  color: #8F92A1;
  z-index: 1;
}

.c-main-hero-search .c-main-hero-search__button-search {
  background-color: var(--color-red);
  padding: 1rem;
  font-weight: bold;
  border-radius: 5px;
  margin-top: 1rem;
  transition: 0.3s all ease-in-out;
  font-size: 1.14285714286rem;
  color: var(--color-white);
}

.c-main-hero-search .c-main-hero-search__button-search:hover {
  background-color: var(--color-red);
  color: var(--color-white);
  filter: brightness(0.92);
}

.c-main-hero-search .c-main-hero-search__button-search:active {
  transition: 0s all ease-in-out;
}

[data-react-prop-horizontal="false"] .c-main-hero-search .location-search--has-value div[aria-expanded="true"] .menu {
  top: initial;
}

.c-main-hero-search .location-search--has-value div[aria-expanded="true"] .menu {
  border-radius: 0 0 10px 10px;
  background: var(--color-light-yellow);
  padding: 20px;
  position: absolute;
  overflow: auto;
  max-height: 15rem;
  height: auto;
  z-index: 2;
  top: 100%;
  border-top: 1px solid rgb(41 41 41 / 15%);
  width: 100%;
}

input[aria-expanded="true"]+.menu {
  border-radius: 0 0 10px 10px;
  background: var(--color-light-yellow);
  padding: 20px;
  position: absolute;
  overflow: auto;
  max-height: 15rem;
  height: auto;
  z-index: 2;
  top: 100%;
  border-top: 1px solid rgb(41 41 41 / 15%);
  width: 100%;
}

@media (max-width: 768px) {
  .c-main-hero-search .location-search--has-value div[aria-expanded="true"] .menu {
    max-height: 12.5rem;
  }
}

.location-item__text {
  display: flex;
  width: 100%;
  align-items: center;
  flex-flow: row-reverse;
  justify-content: flex-end;

}

.location-item__zip:after {
  content: '-';
  margin: 0 3px;
}

.c-main-hero-search__horizontal {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-flow: column
}

@media (min-width: 1000px) {
  .c-main-hero-search__horizontal {
    flex-flow: wrap
  }
}

.c-main-hero-search__horizontal .c-main-hero-search__location-label,
.c-main-hero-search__horizontal .c-main-hero-search__keyword-label {
  display: none;
}

.c-main-hero-search__horizontal .c-main-hero-search__button-search {
  margin-top: 0;
}

.c-main-hero-search__horizontal>div:not(.location-permission-modal) {
  margin: 10px 10px 10px 10px;
  padding-bottom: 0;
  width: 100%;

}

@media (min-width: 1000px) {
  .c-main-hero-search__horizontal>div:not(.location-permission-modal) {
    width: auto;
    margin: 0 10px 0 5px;
  }
}

@media (min-width: 1000px) {
  .c-main-hero-search__horizontal>div:nth-child(1) {
    flex-grow: 2
  }
}

@media (min-width: 1000px) {
  .c-main-hero-search__horizontal>div:nth-child(2) {
    flex-grow: 2
  }
}

@media (min-width: 1000px) {
  .c-main-hero-search__horizontal>div:nth-child(3) {
    flex-grow: 1
  }
}

.c-job-main {
  width: calc(100% - 3rem);
  margin: 0 auto;
  display: flex;
  flex-flow: column
}

@media (min-width: 1000px) {
  .c-job-main {
    width: calc(100% - 9rem);
    flex-flow: row;
    max-width: 1440px;
  }
}

.c-job-main>div:nth-child(1) {
  width: 100%;
}

.c-job-main>div:nth-child(2) {
  width: 100%;
  display: flex;
  flex-flow: column;

}

@media (max-width: 1000px) {
  .c-job-main__right {
    margin-top: 3rem;
  }
}

@media (min-width: 1000px) {
  .c-job-main>div:nth-child(1) {
    width: 30%;
    margin-right: 60px;
  }
}

@media (min-width: 1000px) {
  .c-job-main>div:nth-child(2) {
    width: 70%;
    align-items: flex-start;

  }
}

.c-jobs-filter.advanced-search-container .filter-group h3 {
  display: none;
}

.c-job-main .advanced-search-container {
  max-width: 100%;
}

.c-jobs-filter {
  margin-top: 2rem;
}

@media (max-width: 1000px) {
  [data-react-component="jobs-filter"] .advanced-search-container.c-jobs-filter {
    width: 100%;
    max-width: 100%;
  }
}

.c-jobs-filter .filter-header {
  background: none !important;
}

.jobs-current-searches__title {
  font-size: 21px;
  display: block;
  margin-bottom: 1rem;
  color: #6D7278;
}

.jobs-current-searches__tag-list {
  padding: 0;
  margin: 0 auto;
  display: flex;
  flex-flow: wrap;
  position: relative;
}

.jobs-current-searches__tag-item {
  /*width: 100%;*/
  width: auto;
  display: flex;
  background-color: #D6D6D6;
  border-radius: 100px;
  align-items: center;
  /*padding: 5px 15px;*/
  margin: 0 5px 10px 0;

  border: solid 2px rgba(182, 184, 185, 0.29);
  height: auto;

}

.jobs-current-searches__tag-close {
  background-color: #6F6F6F;
  margin: 3px 3px 3px 1rem;
  border-radius: 50%;
  color: var(--color-white);
  width: 1.575rem;
  height: 1.575rem;
  display: flex;
  align-items: center;
  justify-content: center;
  flex: 1 0 auto;
}

.jobs-current-searches__tag-close svg {
  fill: var(--color-white);
  /*width: 10px;*/
  height: 20px;
}

.c-job-main__sorting-right {
  display: flex;
  justify-content: space-between;
  flex-flow: column
}

@media (min-width: 600px) {
  .c-job-main__sorting-right {
    flex-flow: row;
    justify-content: start;
  }
}

@media (min-width: 600px) {
  .c-job-main__sorting-right>div:nth-child(1) {
    margin-right: 1rem;
  }
}

@media (min-width: 1000px) {
  .c-job-main__sorting-right {
    justify-content: space-between;
  }
}

@media (min-width: 1000px) {
  .c-job-main__sorting-right>div:nth-child(1) {
    margin-right: 0;
  }
}

@media (max-width: 1000px) {
  .c-job-main__sorting-right>div {
    margin-bottom: 1rem
  }
}

.c-jobs-sortby {
  margin-left: 1rem;
}

[data-react-prop-classname="c-jobs-sortby"]>div,
.c-jobs-radius {
  display: flex;
  align-items: center;
  background-color: #F3F3F4;
  padding: 5px 20px;
  border-radius: 5px
}

@media (max-width: 1000px) {

  [data-react-prop-classname="c-jobs-sortby"]>div,
  .c-jobs-radius {
    margin: 0 auto;
    justify-content: space-between;
  }
}

[data-react-prop-classname="c-jobs-sortby"] .Select-clear-zone,
.c-jobs-radius .Select-clear-zone {
  display: none;
}

[data-react-prop-classname="c-jobs-sortby"]>div .react-select,
.c-jobs-radius .react-select {
  width: 145px;
  font-weight: bold;
}

[data-react-prop-classname="c-jobs-sortby"] .react-select_jobs-sort-by_item__control,
.c-jobs-radius .react-select_jobs-radius_item__control {
  border: none;
  background: none;
}

.c-jobs-radius .Select.is-disabled>.react-select {
  background: none;
}

[data-react-prop-classname="c-jobs-sortby"] .react-select:hover,
.c-jobs-radius .react-select:hover {
  box-shadow: none;
}

.c-job-main__sorting {
  display: flex;

  width: 100%;
  justify-content: space-between;
  flex-flow: column
}

.c-job-main__sorting-left {
  margin-bottom: 2rem;
}

@media (min-width: 1000px) {
  .c-job-main__sorting {
    flex-flow: row;
    align-items: center;
  }
}

@media (min-width: 1000px) {
  .c-job-main__sorting-left {
    margin-bottom: 0;
  }
}

.c-jobs-sortby .is-open>.react-select {
  background-color: transparent;
}

.c-jobs-sortby .Select-menu-outer {
  background-color: transparent;
}

.c-jobs-list-only .results-list {
  padding: 0;
  margin: 0 auto;

}

.results-list__item {
  display: block;
  margin-bottom: 2rem;
  border-bottom: 1px rgb(0 0 0 / 6%) solid;
  padding-bottom: 2rem;
}

@media (min-width: 600px) {
  .results-list__item-brand {
    margin-bottom: 0;
  }
}

.results-list__item-title--link {
  font-weight: bold;
  color: var(--color-header-black);
}

.results-list__item-distance {
  display: flex;
  align-items: center;
  margin-top: 10px;
}

@media (min-width: 600px) {
  .results-list__item-distance {
    margin-top: 0;
  }
}

.results-list__item-distance--icon {
  display: block;
  margin-right: 15px;
}

.results-list__item-street--icon,
.results-list__item-brand--icon {
  display: block;
  margin-right: 10px;
}

.results-list__item-street,
.results-list__item-brand {
  display: flex;
}

.results-list__item-street {
  margin-top: 15px;
}

@media (min-width: 1000px) {
  .results-list__item-street--label {
    /*width: 95%;*/
    /* text-overflow: ellipsis; */
    /*overflow: hidden;*/
    /* white-space: nowrap;*/
  }
}

.results-list__item-apply {
  border: 1px solid rgba(255, 255, 255, 0.2);
  display: flex;
  font-size: 16px;
  align-items: center;
  justify-content: center;

  line-height: 1.2em;
  background-color: var(--color-yellow);
  padding: 5px 15px;
  position: relative;
  border-radius: 0.5rem;
  -webkit-transition: all .45s ease;
  transition: all .45s ease;
  margin-top: 1rem;
}

@media (min-width: 600px) {
  .results-list__item-apply {
    margin-top: 0;
  }
}

.results-list__item-info {
  display: flex;
  flex-flow: column-reverse;
  margin-bottom: 1rem;
}

@media (min-width: 1000px) {
  .results-list__item-info {

    margin-bottom: 0;
  }
}

.results-list__item-content {
  display: flex;
  justify-content: space-between;

  flex-flow: column
}

@media (min-width: 600px) {
  .results-list__item-content {
    flex-flow: row;
    align-items: center;
  }
}

.results-list__item-apply--icon {
  margin: 3px 3px 3px 1rem;
  background-color: var(--color-red);
  border-radius: 50%;
  color: var(--color-white);
  width: 1.875rem;
  height: 1.875rem;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
  align-items: center;
  -ms-flex-pack: center;
  justify-content: center;
  transition: background-color 0.3s cubic-bezier(0.4, 0, 0, 1), transform .4s cubic-bezier(.215, .61, .355, 1);
  ;
}

.results-list__item-apply:hover .results-list__item-apply--icon {
  transform: scale(1.08);
  background-color: var(--color-header-black);
}

.results-list__item:last-child {
  margin-bottom: 0;
  border-bottom: 0;
  padding-bottom: 0;
}

.results-list__item-apply--label {
  color: var(--color-header-black);
  font-weight: bold;
}

.results-header {
  color: #6D7278;
  font-weight: bold;
  font-size: 16px;
}

.results-header__content-total {
  color: var(--color-red);
}

.results-header__content {
  color: var(--color-header-black);
}

.c-jobs-pagination .pagination.mobile {
  display: none;
}

.c-jobs-pagination .page-links {
  padding: 1rem 2rem;
  background: var(--color-white);
  border-radius: 2rem;
  display: flex;
  align-items: center;

}

@media (min-width: 1000px) {
  .c-jobs-pagination .page-links {
    margin-left: 30px;
  }
}

.c-jobs-pagination .page-link.page-link-next,
.c-jobs-pagination .page-link.page-link-last,
.c-jobs-pagination .page-link.page-link-first,
.c-jobs-pagination .page-link.page-link-previous {
  height: 2rem;
  width: 2rem;
  background: #f3f3f4;
  color: var(--color-header-black);
  border-radius: 2rem;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 5px;
}

.c-jobs-pagination .page-link.page-link-first.not-selectable,
.c-jobs-pagination .page-link.page-link-next.not-selectable,
.c-jobs-pagination .page-link.page-link-previous.not-selectable,
.c-jobs-pagination .page-link.page-link-last.not-selectable {
  opacity: 0.5;
  cursor: not-allowed;
  display: none;
}

.c-jobs-pagination .page-links>a {
  cursor: pointer;
  margin: 0 0.5rem;
  color: var(--color-black);
}

.c-jobs-pagination .page-link.current-page.not-selectable {
  color: var(--color-red);
}

.c-jobs-pagination .pagination {
  display: flex;
  flex-flow: row-reverse;
  justify-content: center;
}

@media (max-width: 1000px) {
  .c-jobs-pagination .pagination {
    justify-content: flex-start
  }
}

.c-main-hero-search__location-content {
  display: flex;
  align-items: center;
}

.c-main-hero-search__location-drop {
  width: 100%;
}

.c-jobs-current-location {
  margin-bottom: 2rem;
}

.c-jobs-filter .filter-category-container .filter-options-list-container .filter-options-list input[type="checkbox"] {
  float: right;
  width: auto;
  appearance: auto;
}

.advanced-search-container.c-jobs-filter .filter-category-container .filter-options-list-container .filter-options-list {
  box-shadow: none;
  background-color: transparent;
  padding: 15px 0;
}

.c-jobs-filter .filter-category-container .filter-options-list-container .filter-options-list label {
  display: flex;
  flex-flow: row;
  width: 100%;
  align-items: center;
  justify-content: space-between;
  padding-bottom: 1em;
}

.advanced-search-container.c-jobs-filter .filter-category-container .filter-options-list-container .filter-options-list label>.option-value {
  width: 100%;
  display: flex;
  justify-content: space-between;
  margin-left: 10px;
  height: 100%;
  align-items: center;
}

[data-react-component="jobs-filter"] .advanced-search-container .filter-category-container .filter-options-list-container .filter-options-list .option-value {
  font-size: 14px !important;
  /* text-overflow: ellipsis;
    width: 90%;
    display: block;
    overflow: hidden;
    white-space: nowrap; */
}

.advanced-search-container.c-jobs-filter .filter-category-container .filter-options-list-container .filter-options-list .option-value.count {
  margin-left: 20px;
  background-color: #F3F3F4;
  padding: 3px;
  border-radius: 5px;
  width: 4rem;

  display: flex;
  justify-content: center;
  transition: background-color 0.3s cubic-bezier(0.4, 0, 0, 1), transform .4s cubic-bezier(.215, .61, .355, 1);
  ;

}

.advanced-search-container.c-jobs-filter .filter-category-container .filter-header {
  padding: 12px 0;
}

.advanced-search-container .filter-category-container .filter-header .filter-title {
  font-weight: bold;
  color: var(--color-header-black);
}

.c-jobs-filter .reset-filters {
  text-align: right;
}

.c-jobs-filter .reset-filters a {
  color: var(--color-header-black);
  font-weight: bold;
  transition: 0.3s all ease-in-out;

}

.c-jobs-filter .reset-filters a:hover {
  color: var(--color-red);
}

.c-jobs-pagination {
  margin: 30px 0;
  display: block;
  position: relative;
}

.c-jobs-pagination .page-size {
  display: none;

}

@media (min-width: 1000px) {
  .c-jobs-pagination .page-size {
    background-color: var(--color-white);
    border-radius: 200px;
    display: flex;
    align-items: center;
    width: auto;
    padding: 1rem;
    justify-content: center;
    text-align: center;
  }
}

.results-list__item-street--label__wrapper {
  display: flex;
}

.filter-options-list ul {
  position: relative;
}

.react-select_jobs-sort-by_item__indicator-separator,
.react-select_jobs-radius_item__indicator-separator {
  display: none;
}

.jobs-radius[data-react-component="jobs-radius"] .c-jobs-radius,
.jobs-sort-by[data-react-component="jobs-sort-by"] .c-jobs-sortby {
  justify-content: space-between;
}

.jobs-radius[data-react-component="jobs-radius"] .c-jobs-radius>div,
.jobs-sort-by[data-react-component="jobs-sort-by"] .c-jobs-sortby>div {
  width: auto;
}

.c-main-hero-search__keyword-label,
.c-main-hero-search__location-label {
  font-weight: bold;
  margin-bottom: 10px;
  display: block;
}

.pagination__list {
  display: flex;
  gap: 1.2rem;
  align-items: center;
  flex-flow: wrap;
}

/* Jobs listing — match https://jobs.mchire.com/jobs hero + sort-by */
[data-react-component="jobs-sort-by"] .jobs-sort-by_label {
  margin-right: 10px;
  font-weight: 700;
  font-size: 16px;
  line-height: 24px;
  white-space: nowrap;
}

[data-react-component="jobs-sort-by"] .jobs-sort-by_select_wrapper {
  position: relative;
}

[data-react-component="jobs-sort-by"] .jobs-sort-by_select_display {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 10rem;
  height: 30px;
  padding: 3px 10px;
  border: none;
  border-radius: 5px;
  background-color: #333;
  color: #fff;
  font-size: 14px;
  font-weight: 700;
  line-height: 24px;
  text-align: center;
}

[data-react-component="jobs-sort-by"] .jobs-sort-by_select_options {
  display: none;
  position: absolute;
  top: 100%;
  left: 0;
  width: 100%;
  margin: 5px 0 0;
  padding: 0;
  list-style: none;
  border: 1px solid #ddd;
  border-radius: 5px;
  background: #fff;
  z-index: 100;
}

[data-react-component="jobs-sort-by"] .jobs-sort-by_select_options.open {
  display: block;
}

[data-react-component="jobs-sort-by"] .jobs-sort-by_select_options li {
  padding: 10px;
  cursor: pointer;
}

[data-react-component="jobs-sort-by"] .jobs-sort-by_select_options li:hover {
  background: #eee;
}

/* Jobs hero + search card — Figma 8306:1035 (desktop).
   White hero with dark title; the search card overlaps its bottom edge. */
[data-namespace="crm-jobs"] .c-main-hero {
  height: auto;
  min-height: 0;
  background-color: var(--color-white);
}

[data-namespace="crm-jobs"] .c-main-hero__inner {
  /* top = fixed header (84px mobile, 8rem desktop) + Figma 120px */
  padding: calc(84px + 64px + 56 * var(--ramp)) 0 calc(96px + 16.5 * var(--ramp));
}

[data-namespace="crm-jobs"] .c-main-hero__container {
  height: auto;
}

[data-namespace="crm-jobs"] .c-main-hero__title {
  color: var(--color-text-black);
  font-size: var(--fs-hero-title);
  letter-spacing: var(--ls-title);
  line-height: normal;
  text-transform: capitalize;
}

[data-namespace="crm-jobs"] .c-main-hero__title-bg {
  display: none;
}

/* Grey page band (Figma BG Grey) starts where the card leaves the hero */
[data-namespace="crm-jobs"] [data-component="mcdonalds-jobs"] {
  --jobs-overlap: calc(40px + 24 * var(--ramp));
  position: relative;
  margin-top: calc(-1 * var(--jobs-overlap));
  background: linear-gradient(to bottom, transparent var(--jobs-overlap), #f9f9f9 var(--jobs-overlap));
}

[data-namespace="crm-jobs"] .jobs-search[data-react-component] {
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
}

/* Figma: white "og button", black Speedee Bold 16/32 */
[data-namespace="crm-jobs"] .jobs-search .c-main-hero-search__button-search {
  background-color: var(--color-white);
  color: #000;
}

[data-namespace="crm-jobs"] .jobs-search .c-main-hero-search__button-search:hover,
[data-namespace="crm-jobs"] .jobs-search .c-main-hero-search__button-search:focus-visible {
  background-color: var(--color-red);
  color: var(--color-white);
  filter: none;
}

@media (min-width: 1000px) {
  [data-namespace="crm-jobs"] .c-main-hero__inner {
    padding: calc(8rem + 7.5rem) 0 7.5rem;
  }

  [data-namespace="crm-jobs"] [data-component="mcdonalds-jobs"] {
    --jobs-overlap: 4rem;
  }

  [data-namespace="crm-jobs"] .jobs-search[data-react-component] {
    padding: 1.5rem 2rem;
  }
}

/* Jobs listing colours — Figma 8306:1074 (desktop) */
[data-namespace="crm-jobs"] .jobs-current-searches__title {
  color: rgba(34, 34, 34, 0.6);
  font-size: var(--fs-h3);
  font-weight: 700;
  letter-spacing: var(--ls-title);
}

[data-namespace="crm-jobs"] .c-jobs-filter .filter-header .filter-title,
[data-namespace="crm-jobs"] .c-jobs-filter .reset-filters__buton {
  color: var(--color-text-black);
  letter-spacing: var(--ls-title);
}

[data-namespace="crm-jobs"] .results-header__content {
  background-color: transparent;
  color: var(--color-text-black);
  font-size: var(--sb-fs-input);
}

[data-namespace="crm-jobs"] .c-jobs-sortby.jobs-sort-by_container {
  background-color: #efefef;
}

[data-namespace="crm-jobs"] .jobs-sort-by_label {
  color: var(--color-text-black);
  letter-spacing: var(--ls-title);
}

[data-namespace="crm-jobs"] [data-react-component="jobs-sort-by"] .jobs-sort-by_select_display {
  background-color: var(--color-header-black);
}

[data-namespace="crm-jobs"] .c-jobs-list-only {
  border-radius: 5px;
  background-color: var(--color-white);
}

[data-namespace="crm-jobs"] .results-list__item {
  border-bottom-color: #f9f9f9;
}

[data-namespace="crm-jobs"] .results-list__item-title--link {
  background-color: transparent;
  color: var(--color-header-black);
  letter-spacing: var(--ls-title);
}

[data-namespace="crm-jobs"] .results-list__item-street--label,
[data-namespace="crm-jobs"] .results-list__parent-organization-name--label,
[data-namespace="crm-jobs"] .results-list__custom1--label {
  background-color: transparent;
  color: #58595b;
  letter-spacing: var(--ls-title);
}

[data-namespace="crm-jobs"] .c-jobs-pagination .page-links,
[data-namespace="crm-jobs"] .c-jobs-pagination .page-size {
  border-color: transparent;
  border-radius: 40px;
  background-color: var(--color-white);
}

[data-namespace="crm-jobs"] .c-jobs-pagination .page-links .page-link {
  color: #58595b;
}

[data-namespace="crm-jobs"] .c-jobs-pagination .page-links .page-link.current-page {
  color: var(--color-red);
}

[data-namespace="crm-jobs"] .c-jobs-pagination .page-link.page-link-next,
[data-namespace="crm-jobs"] .c-jobs-pagination .page-link.page-link-last,
[data-namespace="crm-jobs"] .c-jobs-pagination .page-link.page-link-first,
[data-namespace="crm-jobs"] .c-jobs-pagination .page-link.page-link-previous {
  background-color: #cfcece;
  color: var(--color-text-black);
}

[data-namespace="crm-jobs"] .c-jobs-filter .filter-option .option-value.count {
  background-color: var(--color-white);
}

/* Job card info — Figma 8306:1127: address first, then location name
   with a building icon (the widget's extra field row). */
[data-namespace="crm-jobs"] .results-list__item-info {
  flex-direction: column;
}

/* The widget renders this row as either field depending on the component's
   config: `job_card_extra_fields` maps it to `.results-list__custom1` here, so
   both are matched — styling only parent-organization-name left the row bare. */
[data-namespace="crm-jobs"] .results-list__parent-organization-name,
[data-namespace="crm-jobs"] .results-list__custom1 {
  display: flex;
  align-items: flex-start;
  gap: 16px;
  margin-top: 8px;
}

[data-namespace="crm-jobs"] .results-list__parent-organization-name::before,
[data-namespace="crm-jobs"] .results-list__custom1::before {
  content: "";
  flex-shrink: 0;
  width: 16px;
  height: 19px;
  margin-top: 6.5px;
  background: url("https://cdn.sites.stg.mchire.com/media-public/8641/61d3f1bb-b6dd-4d96-a195-8baa2aaaf313/image/17902382194126043location-building.svg") no-repeat center / contain;
}

/* Job card — Figma 8306:1124 */
[data-namespace="crm-jobs"] .results-list__item {
  margin-bottom: 16px;
  padding-bottom: 16px;
  filter: drop-shadow(0 1px 1.5px rgba(0, 0, 0, 0.1));
}

[data-namespace="crm-jobs"] .results-list__item:last-child {
  margin-bottom: 0;
}

[data-namespace="crm-jobs"] .results-list__item-header {
  margin-bottom: 12px;
}

[data-namespace="crm-jobs"] .results-list__item-title--link,
[data-namespace="crm-jobs"] .results-list__item-street--label,
[data-namespace="crm-jobs"] .results-list__parent-organization-name--label,
[data-namespace="crm-jobs"] .results-list__custom1--label {
  line-height: 32px;
}

[data-namespace="crm-jobs"] .results-list__item-street {
  margin-top: 0;
}

/* Icons sit on the first 32px line when the text wraps */
[data-namespace="crm-jobs"] .results-list__item-street--label__wrapper {
  display: flex;
  align-items: flex-start;
}

[data-namespace="crm-jobs"] .results-list__item-street--icon {
  display: flex;
  margin-top: 6px;
  margin-right: 16px;
}

[data-namespace="crm-jobs"] .results-list__item-apply {
  display: flex;
  flex-shrink: 0;
  align-items: center;
  gap: 24px;
  padding: 8px 16px;
  border: 0;
  border-radius: 5px;
}

[data-namespace="crm-jobs"] .results-list__item-apply--label {
  color: #000;
  font-size: 18px;
  font-weight: 700;
  line-height: 44px;
  letter-spacing: -0.18px;
}

[data-namespace="crm-jobs"] .results-list__item-apply--icon {
  width: 31px;
  height: 31px;
  margin: 0;
}

/* Titles and addresses wrap on small screens; 32px leading reads too loose */
@media (max-width: 999px) {

  [data-namespace="crm-jobs"] .results-list__item-title--link,
  [data-namespace="crm-jobs"] .results-list__item-street--label,
  [data-namespace="crm-jobs"] .results-list__parent-organization-name--label,
  [data-namespace="crm-jobs"] .results-list__custom1--label {
    line-height: 1.5;
  }

  [data-namespace="crm-jobs"] .results-list__item-street--icon,
  [data-namespace="crm-jobs"] .results-list__parent-organization-name::before,
  [data-namespace="crm-jobs"] .results-list__custom1::before {
    margin-top: 2px;
  }
}

/* Widget pin ships stroke="#D6D6D6"; Figma uses Neutrals/text gray for both icons */
[data-namespace="crm-jobs"] .results-list__item-street--icon svg g {
  stroke: #58595b;
}

/* Figma job info groups title + address + location, with Apply centred on
   the whole block. The widget renders the title in a separate header, so
   lay the card out as a grid and flatten the content wrapper into it. */
@media (min-width: 600px) {
  [data-namespace="crm-jobs"] .results-list__item {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    column-gap: 24px;
    align-items: center;
  }

  [data-namespace="crm-jobs"] .results-list__item-header {
    grid-column: 1;
    grid-row: 1;
  }

  [data-namespace="crm-jobs"] .results-list__item-content {
    display: contents;
  }

  [data-namespace="crm-jobs"] .results-list__item-info {
    grid-column: 1;
    grid-row: 2;
  }

  [data-namespace="crm-jobs"] .results-list__item-apply {
    grid-column: 2;
    grid-row: 1 / span 2;
    margin-top: 0;
  }
}



/* German: nouns and sentence starts only are capitalized, so drop the
   title-case (text-transform: capitalize) the EN design applies.
   !important: id-scoped and page-scoped rules elsewhere re-apply capitalize. */
html:is([lang="de"], [lang^="de-"], [lang="/de"]) :is(body, [data-page]) :is(
  .c-header-navigation__topbar-link,
  .c-header-navigation__link,
  .lang_sel-text,
  .c-main-hero__title,
  .c-main-hero__title-inner,
  .c-main-hero__subtitle-content,
  .c-main-hero__subtitle-message,
  .l-layout__content-title,
  .l-layout__content-text,
  .c-faq-min__title,
  .c-milestones__title,
  .c-commitments__card-title,
  .c-commitments__card-text
) {
  text-transform: none !important;
}

/* About hero: the long German headline must wrap before the golden arches
   instead of running over them (nowrap in the base hero title). */
@media (min-width: 1000px) {
  html:is([lang="de"], [lang^="de-"], [lang="/de"]) [data-page="corporate"] .c-main-hero__title-inner {
    white-space: normal;
    max-width: 34vw;
  }
}