@font-face {
  font-family: "icomoon";
  src: url(/Emeis2026/Ressources/new/fonts/icomoon.eot?xtehue=);
  src:
    url(/Emeis2026/Ressources/new/fonts/icomoon.eot?xtehue=#iefix)
      format("embedded-opentype"),
    url(/Emeis2026/Ressources/new/fonts/icomoon.woff2?xtehue=) format("woff2"),
    url(/Emeis2026/Ressources/new/fonts/icomoon.ttf?xtehue=) format("truetype"),
    url(/Emeis2026/Ressources/new/fonts/icomoon.woff?xtehue=) format("woff"),
    url(/Emeis2026/Ressources/new/fonts/icomoon.svg?xtehue=#icomoon)
      format("svg");
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: "DIN Round W01 Regular";
  src:
    url(/Emeis2026/Ressources/new/fonts/f612b547-9f1d-4c4a-b5fc-730a26dcf406.woff2)
      format("woff2"),
    url(/Emeis2026/Ressources/new/fonts/8bc1090c-99da-496f-a4b7-7edf131ad2a1.woff)
      format("woff");
}

@font-face {
  font-family: "DIN Round W01 Medium";
  src:
    url(/Emeis2026/Ressources/new/fonts/e24bacc7-9a2f-4cf8-b283-937308fd4a58.woff2)
      format("woff2"),
    url(/Emeis2026/Ressources/new/fonts/0811f3c8-6ce7-47a4-beb9-b5bdd0db5cee.woff)
      format("woff");
}
[class^="icon-"],
[class*=" icon-"] {
  font-size: 16px;
  font-family: "icomoon" !important;
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
.icon-check::before,
li.facet-item input[type="checkbox"]:checked + label::before {
  content: "\e91c";
}
.icon-instagram::before {
  content: "\e900";
}
.icon-issuu::before {
  content: "\e901";
}
.icon-youtube_bg::before {
  content: "\e902";
}
.icon-facebook_bg::before {
  content: "\e903";
}
.icon-twitter_bg::before {
  content: "\e904";
}
.icon-google::before {
  content: "\e910";
}
.icon-spinner::before {
  content: "\e905";
}
.icon-expand_less::before {
  content: "\e906";
}
.icon-expand_more::before {
  content: "\e907";
}
.icon-add_circle_black::before {
  content: "\e908";
}
.icon-add_circle_outline::before {
  content: "\e909";
}
.icon-previous::before {
  content: "\e90a";
}
.icon-next::before {
  content: "\e90b";
}
.icon-first::before {
  content: "\e90d";
}
.icon-last::before {
  content: "\e90c";
}
.icon-quote-open::before {
  content: "\e90e";
}
.icon-quote-close::before {
  content: "\e90f";
}
.icon-clock::before,
.page-header__date::before,
.open-house__date::before {
  content: "\e925";
}
.icon-message::before {
  content: "\e911";
}
.icon-compass::before {
  content: "\e912";
}
.icon-urgently::before {
  content: "\e913";
}
.icon-job::before {
  content: "\e914";
}
.icon-privacy::before {
  content: "\e915";
}
.icon-brochure::before,
.brochure .file::before {
  content: "\e916";
}
.icon-home::before,
.breadcrumb ol li:first-child a:before,
.vacancy-full .vacancy-full__label:before,
.vacancy-teaser__location::before,
.related-residence::before {
  content: "\e917";
}
.icon-arrow-right::before,
.residence__cta-link:before,
.open-house__read-more::before {
  content: "\e918";
}
.icon-location::before,
.vacancy-full .vacancy-full__city:before,
.vacancy-full .vacancy-full__apply-address:before,
.residence-contact__address:before,
.open-house__location::before {
  content: "\e919";
}
.icon-library::before {
  content: "\e91a";
}
.icon-hospital::before {
  content: "\e91b";
}
.icon-admin::before {
  content: "\e91d";
}
.icon-garden::before {
  content: "\e91e";
}
.icon-handyman::before {
  content: "\e91f";
}
.icon-email::before,
.site-footer__middle__right a[href^="mailto:"]::before,
.residence__email:before,
.open-house__email::before {
  content: "\e920";
}
.icon-phone::before,
.site-header
  .header__middle__wrapper
  .header__middle--right
  a[href^="tel:"]::before,
.site-footer__middle__right a[href^="tel:"]::before,
.residence-hero__phone a::before,
.residence-contact__phone:before,
.residence-teaser__phone::before,
.open-house__phone::before,
.paragraph-textblockicon .icontext__text a.button[href^="tel:"]::before {
  content: "\e921";
}
.icon-facebook::before {
  content: "\e922";
}
.icon-youtube::before {
  content: "\e923";
}
.icon-linkedin::before {
  content: "\e924";
}

/* 3. Icomoon - Icons */
@font-face {
  font-family: "icomoon";
  src:
    url("/Emeis2026/Ressources/new/fonts/icomoon.woff2") format("woff2"),
    url("/Emeis2026/Ressources/new/fonts/icomoon.woff") format("woff"),
    url("/Emeis2026/Ressources/new/fonts/icomoon.ttf") format("truetype");
  font-weight: normal;
  font-style: normal;
  font-display: block;
}

:root {
  --brand-orange: #ffb400;
  --brand-pink: #e91e63;
  --font-main: "DIN Round W01 Regular", "Trebuchet MS", sans-serif;
  --nav-blue: #005a6d;
  --nav-height: 90px;
}

html,
body {
  font-family: "DIN Round W01 Regular", "Trebuchet MS", sans-serif;
}

div.application_form p {
  color: #005a6d;
}

.main-title .greenH1 {
  font-size: 48px;
  font-weight: 700;
  line-height: 58px;
  padding-bottom: 0;
  text-align: left;
  margin-top: 0px;
  margin-bottom: 30px;
  text-transform: none;
  font-family:
    "Trebuchet MS", "Source Sans Pro", "Trebuchet MS", "Source Sans Pro", Arial,
    sans-serif;
  position: relative;
  color: #f28300;
  border: 0;
  display: block;
  white-space: normal;
}

/* BANNER */
.banner-slider-content .banner-item {
  height: 600px !important;
}

.banner-pg-container {
  height: 400px !important;
  position: relative;
}

.header-image {
  width: 100%;
  height: 700px;
  object-fit: cover;
  object-position: center; /* Ensures the focus remains on the subjects */
  display: block;
}

/* Responsive adjustments for smaller screens */
@media (max-width: 768px) {
  .header-image {
    height: 300px; /* Adjust height for tablets/mobile */
  }
}

@media (max-width: 480px) {
  .header-image {
    height: 200px; /* Adjust height for small phones */
  }
}

/* home page */
.custom-recruitment-block {
  max-width: 900px;
  margin: 40px auto;
  text-align: center;
  padding: 20px;
  color: #005b61;
  font-family: inherit; /* Inherits font from your site */
}

.recruitment-title {
  color: #f38b1c;
  font-size: 32px;
  font-weight: bold;
  margin-bottom: 15px;
}

.recruitment-subtitle {
  font-size: 24px;
  font-weight: bold;
  margin-bottom: 30px;
}

.recruitment-body p {
  margin-bottom: 18px;
  line-height: 1.6;
}

.recruitment-final-call {
  font-size: 1.1rem;
  margin-top: 25px;
}

.recruitment-buttons {
  display: flex;
  flex-wrap: wrap;
  gap: 15px;
  justify-content: center;
  margin-top: 40px;
}

.recruitment-btn {
  background-color: #fbb000;
  color: #fff;
  padding: 14px 28px;
  border-radius: 50px;
  text-decoration: none;
  font-weight: bold;
  font-size: 15px;
  min-width: 180px;
  display: inline-block;
  transition: all 0.2s ease-in-out;
}

.recruitment-btn:hover {
  background-color: #e5a100;
  text-decoration: none;
  color: #fff;
}

/* Mobile adjustments */
@media (max-width: 650px) {
  .recruitment-btn {
    width: 100%;
    min-width: auto;
  }
}

.custom-values-block {
  max-width: 1100px;
  margin: 60px auto;
  text-align: center;
  color: #005b61;
}

.values-intro,
.values-shared {
  margin-bottom: 50px;
  padding: 0 20px;
}

.intro-text {
  max-width: 800px;
  margin: 0 auto;
  font-size: 18px;
  line-height: 1.5;
}

.values-grid {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 30px;
  margin-top: 40px;
}

.value-item {
  flex: 1;
  min-width: 220px;
  padding: 10px;
}

.value-icon {
  width: 100px; /* Adjust based on your actual images */
  height: auto;
  margin-bottom: 20px;
}

.value-name {
  color: #f38b1c;
  font-size: 22px;
  font-weight: bold;
  margin-bottom: 15px;
  min-height: 54px; /* Keeps titles aligned */
  display: flex;
  align-items: center;
  justify-content: center;
}

.value-desc {
  font-size: 16px;
  line-height: 1.4;
}

/* Mobile adjustments */
@media (max-width: 768px) {
  .values-grid {
    flex-direction: column;
    align-items: center;
  }
  .value-item {
    max-width: 300px;
  }
}

.custom-ethics-block {
  max-width: 900px;
  margin: 60px auto;
  text-align: center;
  color: #005b61;
}

.ethics-link-wrapper {
  margin-top: 20px;
}

.ethics-link {
  color: #005b61;
  text-decoration: underline;
  font-weight: bold;
  font-size: 1.1rem;
  transition: color 0.2s ease;
}

.ethics-link:hover {
  color: #f38b1c; /* Changes to orange on hover */
}

.custom-ambiance-block {
  max-width: 1000px;
  margin: 60px auto;
  padding: 0 20px;
  color: #005b61;
}

.ambiance-row {
  display: flex;
  align-items: center;
  gap: 40px;
  margin-bottom: 80px;
  text-align: left;
}

.ambiance-text {
  flex: 1;
}

.ambiance-video-thumbnail,
.ambiance-image {
  flex: 1;
  position: relative;
  cursor: pointer;
  border-radius: 15px;
  overflow: hidden;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
  max-width: 300px;
  height: 300px;
}

.video-preview,
.side-image {
  width: 100%;
  display: block;
}

.play-button-overlay {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 80px;
  height: 80px;
}

.play-icon {
  width: 100%;
  height: 100%;
  filter: drop-shadow(0 0 10px rgba(0, 0, 0, 0.3));
}

.ambiance-video-thumbnail:hover .play-icon {
  transform: scale(1.075);
  filter: drop-shadow(0 0 10px rgba(0, 0, 0, 0));
}

.ess-note {
  font-size: 0.9rem;
  font-style: italic;
  margin-top: 15px;
}

/* Modal CSS */
.video-modal {
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.85); /* Dark transparent overlay */
  z-index: 10001; /* Must be higher than your side menu */
}

.modal-content {
  position: relative;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 90%;
  max-width: 800px;
}

.close-modal {
  position: absolute;
  top: -45px;
  right: 0;
  color: white;
  font-size: 35px;
  cursor: pointer;
}

@media (max-width: 768px) {
  .ambiance-row,
  .ambiance-row.reverse {
    flex-direction: column;
    text-align: center;
  }
}

.custom-jobs-intro {
  max-width: 900px;
  margin: 80px auto 40px; /* Large top margin to separate from the previous section */
  text-align: center;
  padding: 0 20px;
}

.jobs-intro-title {
  color: #005b61; /* The emeis teal color */
  font-size: 2.5rem;
  font-weight: bold;
  margin-bottom: 25px;
}

.jobs-intro-text {
  color: #005b61;
  font-size: 1.15rem;
  line-height: 1.6;
  max-width: 800px;
  margin: 0 auto;
}

/* Mobile adjustments */
@media (max-width: 768px) {
  .jobs-intro-title {
    font-size: 1.8rem;
  }
  .custom-jobs-intro {
    margin: 50px auto 30px;
  }
}

/* Container padding to match the site margin */
.job-categories-container {
  max-width: 1200px;
  margin: 60px auto;
  padding: 0 15px;
}

/* Grid setup: 3 columns with standard spacing */
.job-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 10px;
}

.job-card {
  position: relative;
  background: #ffffff;
  overflow: hidden;
  margin-bottom: 40px;
  transition: box-shadow 128ms ease-in;
  box-shadow: 0px 20px 50px rgba(0, 90, 109, 0.05);
  border-radius: 8px;
  color: #005a6d;
  padding: 20px;
  text-decoration: none;
  display: block;
  background-color: #fff;
  text-align: center;
  flex-shrink: 1;
  flex-grow: 1;
  flex-basis: 200px;
  margin-left: 12px;
  margin-right: 12px;
}

/* Hover effect: Subtle lift and shadow increase */
.job-card:hover {
  transition: box-shadow 128ms ease-in;
  box-shadow: 0 5px 15px rgba(0, 90, 109, 0.25);
  transition: box-shadow 256ms ease-out;
}

.job-card:hover .job-card-overlay span {
  border-bottom: 2px solid #e8315f;
}

/* Ensures images are perfectly square/consistent */
.job-card img {
  width: 100%;
  height: 300px;
  object-fit: cover;
  display: block;
  transition: transform 0.5s ease;
}

/* Original bar is a greyish-transparent strip at the bottom of the image */
.job-card-overlay {
  position: absolute;
  bottom: 20px; /* Positioned slightly above the very bottom */
  left: 12px;
  right: 12px;
  background: rgba(
    85,
    85,
    85,
    0.6
  ); /* Grey-transparent look from screenshots */
  padding: 10px 5px;
  text-align: center;
  backdrop-filter: blur(2px);
  margin-left: 11px;
  margin-right: 11px;
}

/* Text styling with the branding underline */
.job-card-overlay span {
  color: #ffffff;
  border-bottom: 2px solid #005b61;
  font-family:
    "Trebuchet MS", "Source Sans Pro", "Trebuchet MS", "Source Sans Pro", Arial,
    sans-serif;
  font-weight: 700;
  line-height: 1.2;
  word-wrap: break-word;
  overflow-wrap: break-word;
  font-size: 1.5rem;
}

/* Responsive: 2 columns for tablets, 1 for mobile */
@media (max-width: 992px) {
  .job-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 650px) {
  .job-grid {
    grid-template-columns: 1fr;
  }
  .job-card img {
    height: 250px;
  }
}

.emeis-expectations-section {
  max-width: 1000px;
  margin: 60px auto;
  padding: 0 20px;
  font-family: "Trebuchet MS", "Source Sans Pro", Arial, sans-serif;
  text-align: center;
}

.teal-text {
  color: #005b61;
}
.orange-text {
  color: #f38b1c;
}

.section-title {
  font-size: 2.2rem;
  font-weight: bold;
  margin-bottom: 30px;
}

/* Custom Bullet List */
.expectation-list {
  list-style: none;
  padding: 0;
  text-align: left;
  display: inline-block;
  max-width: 850px;
}

.expectation-list li {
  position: relative;
  padding-left: 25px;
  margin-bottom: 15px;
  color: #005b61;
  line-height: 1.5;
}

/* The small circular "o" bullet seen in screenshots */
.expectation-list li::before {
  content: "o";
  position: absolute;
  left: 0;
  color: #005b61;
  font-weight: bold;
}

/* FAQ Pill Button */
.faq-button-container {
  margin: 40px 0 80px;
}

.faq-pill-button {
  display: inline-block;
  padding: 15px 40px;
  border: 2px solid #f38b1c;
  border-radius: 50px; /* Perfect pill shape */
  color: #f38b1c;
  text-decoration: none;
  font-weight: bold;
  transition: all 0.3s ease;
}

.faq-pill-button:hover {
  background-color: transparent;
  color: #d97500;
  text-decoration: none;
}

/* Final CTA Styling */
.final-cta h2 {
  font-size: 2.5rem;
  margin-bottom: 20px;
}

.cta-subtitle {
  font-size: 1.3rem;
  margin-bottom: 10px;
}

.cta-footer {
  font-size: 1.1rem;
}
/* no job */
.jobs
  #modules-jobs-listing
  .modules-jobs-listing.ourjobs
  .content-container
  .card
  .card-body.no-job-found {
  display: flex;
  padding: 32px;
  flex-direction: column;
  justify-content: center;
  border-radius: 24px;
  border: 1px solid var(--heading-color);
  border: 0;
  -webkit-border-radius: 8px;
  border-radius: 8px;
  background-color: #ffffff;
  box-shadow: 0 5px 15px rgba(58, 70, 84, 0.25);
  -webkit-box-shadow: 0 5px 15px rgba(58, 70, 84, 0.25);
}

.jobs
  #modules-jobs-listing
  .modules-jobs-listing.ourjobs
  .content-container
  .card:has(.card-body.no-job-found) {
  border: none !important;
}

.jobs
  #modules-jobs-listing
  .modules-jobs-listing.ourjobs
  .content-container
  .card
  .card-body.no-job-found
  h5 {
  font-size: 40px;
  font-style: normal;
  font-weight: 600;
  line-height: 120%;
  color: var(--nav-blue);
  font-family:
    "Trebuchet MS", "Source Sans Pro", "Trebuchet MS", "Source Sans Pro", Arial,
    sans-serif;
}

.jobs
  #modules-jobs-listing
  .modules-jobs-listing.ourjobs
  .content-container
  .card
  .card-body.no-job-found
  .card-text
  p {
  color: var(--nav-blue);
  font-size: 24px;
  font-style: normal;
  font-weight: 400;
  line-height: 160%;
}

/* for disable filter dropdown */
.disabled-dropdown {
  pointer-events: none;
  opacity: 0.5;
}

/* jobcat detail */
/* --- GLOBAL DESIGN SYSTEM --- */
.emeis-dynamic-content {
  font-family: "Source Sans Pro", "Trebuchet MS", Arial, sans-serif;
  color: #005b61; /* Emeis Teal */
  max-width: 900px;
  margin: 0 auto;
  padding: 40px 20px;
  line-height: 1.6;
}

/* Titles */
.cat-main-title {
  color: #f39200; /* Emeis Orange */
  font-size: 2.5rem;
  font-weight: 700;
  text-align: center;
  margin-bottom: 40px;
}

.cat-sub-title {
  font-size: 1.8rem;
  font-weight: 700;
  margin-bottom: 25px;
}
.cat-sub-title.orange {
  color: #f39200;
  text-align: center;
}
.cat-sub-title.teal {
  color: #005b61;
}

.emeis-dynamic-content a.interview-link {
  text-decoration: underline;
  color: #005a6d;
}

/* Paragraphs */
.emeis-dynamic-content p {
  font-size: 1.125rem;
  margin-bottom: 20px;
  text-align: left;
}

/* Shared Image Float (Used in all 9 sections) */
.siege-image-wrapper {
  float: left;
  margin: 0 40px 20px 0;
  width: 300px;
}

.siege-image-wrapper img {
  width: 300px;
  height: 300px;
  object-fit: cover;
  border-radius: 12px;
  box-shadow: 0 10px 25px rgba(0, 0, 0, 0.12);
}

/* Clearfix to prevent layout breaking */
.siege-body-container::after,
.maintenance-body-container::after,
.admin-body-container::after {
  content: "";
  display: table;
  clear: both;
}

/* Quotes Styling */
.siege-quote,
.cuisine-quote {
  margin: 40px 0;
  text-align: center;
}
.siege-quote p,
.cuisine-quote p {
  font-style: italic;
  display: inline;
  letter-spacing: 0.5px;
  font-size: 1.5rem;
}
.quote-mark,
.quote-mark-end {
  color: #f39200;
  font-size: 40px;
  font-family: Georgia, serif;
  line-height: 0;
  vertical-align: middle;
}

/* Special Sections: Chef & Management Grid */
.chef-section {
  display: flex;
  gap: 40px;
  align-items: flex-start;
  margin-top: 50px;
  padding-top: 30px;
}
.chef-content {
  flex: 1;
}
.chef-image {
  flex: 0 0 280px;
}
.chef-image img {
  width: 100%;
  border-radius: 10px;
}

.button-grid {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 12px;
}

.text-align-center {
  text-align: center !important;
}

.emeis-btn-large-orange {
  display: inline-block;
  background-color: #fbb700; /* Emeis Orange */
  color: #ffffff !important;
  padding: 18px 45px;
  border-radius: 40px; /* Highly rounded as per original image */
  font-weight: 600;
  text-decoration: none;
  font-size: 1.15rem;
  transition: background-color 0.3s ease;
  border: none;
}

.emeis-btn-large-orange:hover {
  background: #e2a400;
  color: #fff;
}
.emeis-btn-outline {
  padding: 10px 20px;
  border: 1.5px solid #f39200;
  border-radius: 50px;
  color: #f39200;
  text-decoration: none;
  font-weight: 600;
  transition: 0.3s;
}
.emeis-btn-outline:hover {
  background-color: transparent;
  color: #d97500;
}

/* Lists for Maintenance & Admin */
.maintenance-list,
.admin-list {
  list-style: none;
  padding: 0;
  margin: 30px 0;
}
.maintenance-list li,
.admin-list li {
  position: relative;
  padding-left: 25px;
  margin-bottom: 12px;
  font-size: 1.1rem;
}
.maintenance-list li::before,
.admin-list li::before {
  content: "○";
  color: #f39200;
  position: absolute;
  left: 0;
  font-weight: bold;
}

.cat-footer-link {
  color: #f39200;
  font-size: 1.4rem;
  font-weight: 700;
  margin-top: 50px;
  text-align: center;
}

.emeis-btn-yellow {
  display: inline-block;
  background-color: #f39200;
  color: #ffffff !important;
  padding: 12px 35px;
  border-radius: 50px;
  text-decoration: none;
  font-weight: bold;
  transition: background-color 0.3s;
}

.emeis-btn-yellow:hover {
  background-color: #d68100;
}

/* Mobile Responsiveness */
@media (max-width: 768px) {
  .siege-image-wrapper,
  .chef-image {
    float: none;
    width: 100%;
    margin: 0 0 20px 0;
  }
  .chef-section {
    flex-direction: column-reverse;
  }
  .cat-main-title {
    font-size: 2rem;
  }
}

/* Joblist */

.section_jobs .modules-jobs-listing .main-title {
  font-size: 48px;
  font-weight: 700;
  line-height: 58px;
  font-family: "Trebuchet MS", "Source Sans Pro", Arial, sans-serif;
  color: #f28300;
}

.modules-jobs-listing.ourjobs .job-count h3 {
  color: var(--nav-blue);
  text-align: start !important;
  font-size: 18px;
  font-style: normal;
  font-weight: 400;
  line-height: 120%;
}

.modules-jobs-listing.ourjobs
  .content-container
  .jobs-list-container
  .title-overflow-card
  h3.card-title {
  font-family:
    "DIN Round W01 Medium", "Trebuchet MS", "Source Sans Pro", Helvetica, Arial,
    sans-serif;
  font-weight: 400;
  font-size: 1.5rem;
  color: #f28300;
  margin-bottom: 5px;
  transition: color 128ms linear;
}

.wave-overlay {
  position: absolute;
  bottom: -5px;
  width: 100%;
  height: auto;
  transform: rotateY(180deg);
}

.wave-overlay h1.greenH1 {
  color: #fff !important;
  position: absolute;
  top: -50%;
  left: 50%;
  transform: translate(-55%, -150%) scaleX(-1);
}

.mm-container {
  width: 100%;
}

a.title-overflow-card {
  width: 100%;
}

a {
  color: var(--brand-orange);
  text-decoration: unset;
}

a:hover {
  color: color-mix(in srgb, var(--brand-orange) 80%, transparent);
  /* opacity: 0.8; */
}

.text-primary {
  color: var(--brand-orange) !important;
}

.btn-primary {
  background-color: var(--brand-orange);
  border-color: var(--brand-orange);
  width: 100%;
}

.btn-primary:hover {
  background-color: color-mix(in srgb, var(--brand-orange) 80%, transparent);
  border-color: color-mix(in srgb, var(--brand-orange) 80%, transparent);
  /* opacity: 0.8; */
}

.btn-primary:not(:disabled):not(.disabled).active,
.btn-primary:not(:disabled):not(.disabled):active,
.show > .btn-primary.dropdown-toggle {
  background-color: color-mix(in srgb, var(--brand-orange) 80%, transparent);
  border-color: color-mix(in srgb, var(--brand-orange) 80%, transparent);
  /* opacity: 0.8; */
}

.btn-primary:not(:disabled):not(.disabled).active:focus,
.btn-primary:not(:disabled):not(.disabled):active:focus,
.show > .btn-primary.dropdown-toggle:focus,
.btn-primary.focus,
.btn-primary:focus {
  box-shadow: 0 0 0 0.2rem
    color-mix(in srgb, var(--brand-orange) 50%, transparent);
}

div.vacatures-accordion div.my-accordion-header div.new-version:after {
  color: var(--brand-orange);
}

div.jobs-list-container div.jobs-items .card .card-body:hover,
div.vacatures-accordion .card.card-body:hover {
  background: none !important;
  color: #005a6d !important;
}

div.jobs-list-container div.jobs-items .card:hover .vacancy-teaser__read-more,
div.vacatures-accordion .card:hover .vacancy-teaser__read-more {
  color: #e8315f !important;
  text-decoration: underline;
}

.vacancy-teaser__read-more {
  font-family: "Trebuchet MS", "Source Sans Pro", Arial, sans-serif;
  font-weight: 700;
  display: block;
  margin-top: 10px;
  color: #005a6d;
  text-decoration: none;
  transition: color 128ms linear;
}

div.jobs-list-container div.jobs-items .card:hover .card-title .title-overflow,
div.vacatures-accordion .card:hover .card-title .title-overflow {
  color: #005a6d !important;
}

div.jobs-list-container div.jobs-items .card:hover,
div.vacatures-accordion .card:hover {
  box-shadow: 0 5px 15px rgba(0, 90, 109, 0.25);
  transition: box-shadow 256ms ease-out;
}

div.jobs-list-container div.jobs-items .card,
div.vacatures-accordion .card {
  transition: box-shadow 128ms ease-in;
  box-shadow: 0px 20px 50px rgba(0, 90, 109, 0.05);
  border-radius: 8px !important;
  /* background-color: #fff; */
  display: flex;
  flex-direction: column;
  height: 100%;
  box-sizing: border-box;
  text-decoration: none;
  padding: 20px;
  color: #005a6d;
  background-color: #fff;
  border: none;
}

div.jobs-list-container div.jobs-items .card .card-body,
div.vacatures-accordion .card.card-body {
  transition: all 0.05s ease-in-out !important;
}

div.jobs-list-container div.jobs-items div.location:before,
div.jobs-list-container div.jobs-items div.date:before,
div.vacatures-accordion div.jobs-items div.location:before,
div.vacatures-accordion div.jobs-items div.date:before {
  color: var(--brand-orange);
}

.job-item-container.jobs-items a:hover {
  text-decoration: none;
}

/* .job-item-container
  .title-overflow-card
  .card
  .card-body
  .job-read-more-container {
  order: 3;
  padding-top: 1.5rem;
  justify-content: end;
} */

/* 2 column display job list */
div.jobs-list-container div.jobs-items .card.show-2col {
  height: 440px;
}

div.jobs-list-container
  div.jobs-items
  .card.show-2col
  .card-body
  .title.item.card-title
  .title-overflow {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
  text-overflow: ellipsis;
  line-height: 1.5em;
  max-height: calc(1.5em * 2);
}

/* Job cat chip */
.job-item-container
  .title-overflow-card
  .card
  .card-body
  .job-info-container
  .job-info.job-cat
  span {
  display: flex;
  height: 30px;
  padding: 8px 16px;
  justify-content: center;
  align-items: center;
  gap: 4px;
  border-radius: 24px;
  border: 1px solid var(--brand-orange);
  background: var(--White, #fff);
  color: var(--brand-orange);

  /* text detail */
  font-size: 12px;
  font-style: normal;
  font-weight: 600;
  line-height: 120%; /* 14.4px */
  letter-spacing: -0.24px;
  text-transform: capitalize;
}

.card .card-body .teaser.card-text.job-teaser,
.job-info-container .job-date div span,
.job-info-container .job-location div span {
  color: #005a6d;
  font-family: "Trebuchet MS", "Source Sans Pro", Arial, sans-serif;
  font-size: 1.125rem;
}

div.jobs-list-container
  div.jobs-items
  .card
  .card-body:hover
  .teaser.card-text.job-teaser,
div.jobs-list-container
  div.jobs-items
  .card
  .card-body:hover
  .job-info-container
  .job-date
  div
  span,
div.jobs-list-container
  div.jobs-items
  .card
  .card-body:hover
  .job-info-container
  .job-location
  div
  span {
  color: #005a6d;
}

div.jobs-list-container
  div.jobs-items
  .card
  .card-body:hover
  div.location:before,
div.jobs-list-container div.jobs-items .card .card-body:hover div.date:before,
div.vacatures-accordion
  div.jobs-items
  .card
  .card-body:hover
  div.location:before,
div.vacatures-accordion div.jobs-items .card .card-body:hover div.date:before {
  color: var(--text-color);
}

.olContainer ul li .delete-cat-icons:after {
  color: var(--brand-orange);
}

.btn-outline-secondary {
  color: var(--text-color);
  border-color: var(--text-color);
}

.btn-outline-secondary:not(:disabled):not(.disabled).active,
.btn-outline-secondary:not(:disabled):not(.disabled):active,
.show > .btn-outline-secondary.dropdown-toggle,
.btn-outline-secondary:hover {
  color: #fff;
  background-color: var(--text-color);
  border-color: var(--text-color);
}

.btn-outline-secondary:not(:disabled):not(.disabled).active:focus,
.btn-outline-secondary:not(:disabled):not(.disabled):active:focus,
.show > .btn-outline-secondary.dropdown-toggle:focus,
.btn-outline-secondary.focus,
.btn-outline-secondary:focus {
  box-shadow: 0 0 0 0.2rem
    color-mix(in srgb, var(--text-color) 50%, transparent);
}

.list-group-item.active {
  background-color: var(--brand-orange);
  border-color: var(--brand-orange);
}

.badge-primary {
  background-color: var(--brand-orange);
}

.list-group-item.active .badge-primary {
  background-color: var(--text-color);
}

.active .badge-primary {
  color: var(--brand-orange);
}

/* CHECKBOX & RADIO BUTTONS */

.custom-control-input:checked ~ .custom-control-label::before {
  border-color: var(--brand-orange);
  background-color: var(--brand-orange);
}

/* NAVBAR *



/* Top Bar Container */
.header__top {
  background-color: var(--brand-orange);
  padding: 6px 0;
  font-family:
    "DIN Round W01 Regular", "Trebuchet MS", "Source Sans Pro", Helvetica,
    Arial, sans-serif !important;
}

.header__top__wrapper {
  max-width: 1140px;
  margin: 0 auto;
  padding: 0 15px;
  display: flex;
  justify-content: flex-end;
  align-items: center;
}

/* Horizontal Menu Styling */
.header__top__nav ul,
.header__top__languages ul {
  display: flex;
  list-style: none;
  margin: 0;
  padding: 0;
  align-items: center;
  gap: 10px;
}

.header__top__nav li {
  margin-right: 25px;
}

.header__top__nav a,
.header__top__languages a {
  color: #ffffff;
  text-decoration: none;
  font-size: 0.9375rem;
  font-weight: 400;
  transition: opacity 0.2s ease;
  line-height: 1em;
}

.header__top__nav a:hover,
.header__top__languages a:hover {
  color: var(--nav-blue);
}

/* Language Section Specifics */
.header__top__languages {
  padding-left: 20px;
  margin-left: 5px;
}

.header__top__languages .separator {
  color: #ffffff;
  padding: 0 4px;
  font-size: 13px;
}

/* Active Language (Pink Highlight) */
.header__top__languages li.active a {
  color: var(--brand-pink);
}

/* --- 2. Layout & Colors (Updated Icons) --- */
.header__middle {
  background: #ffffff;
  padding: 15px 0;
  border-bottom: 1px solid #f2f2f2;
  font-family: "DIN Round W01 Regular", sans-serif;
}

.header__middle__wrapper {
  max-width: 1200px;
  margin: 0 auto;
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0 20px;
}

.header__middle--right {
  display: flex;
  align-items: center;
  gap: 30px;
}

/* Navigation Links */
.navigation .menu {
  display: flex;
  list-style: none;
  margin: 0;
  padding: 0;
  gap: 25px;
}

.navigation .menu > li {
  position: relative;
}

.navigation .menu > li > a {
  font-size: 1.25rem;
  color: #f28300;
  text-decoration: none;
  padding: 10px 0;
  display: flex;
  align-items: center;
  padding: 0 8px;
}

.navigation .menu > li > a:hover {
  color: var(--nav-blue);
}

/* --- UPDATED: CSS Arrow (No font needed) --- */
.header__middle .navigation.menu--main ul.menu > li.menu-item--expanded::after {
  content: "";
  position: absolute;
  top: 15px;
  right: -8px;
  height: 5px;
  width: 5px;
  border: solid 1px #f28300;
  border-width: 0px 1px 1px 0px;
  transform: rotate(45deg);
  pointer-events: none;
}

/* --- UPDATED: Jobs Pink Bell SVG --- */
.menu-item-jobs > a {
  border-bottom: 2px solid #e8315f !important;
  position: relative;
}

.menu-item-jobs > a::before {
  content: "";
  display: block;
  position: absolute;
  top: -5px;
  right: -12.5px;
  width: 20px;
  height: 20px;
  background-color: #e8315f;
  border-radius: 10px;
  background-image: url("data:image/svg+xml,%3Csvg width='16' height='17' viewBox='0 0 16 17' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M2.28378 10.8124L2.28391 10.8129L12.185 13.0779L12.4254 13.0091L12.4252 13.0085C12.4252 13.0085 12.4252 13.0085 12.4252 13.0085L11.9661 11.4047C11.7669 10.7077 11.7606 9.96932 11.9483 9.26885L12.2728 8.05805C12.8079 6.06094 11.6182 4.00039 9.62111 3.46527C7.62399 2.93014 5.56345 4.1198 5.02832 6.11691L4.70389 7.32771C4.51621 8.02814 4.14161 8.66439 3.62072 9.16841C3.62069 9.16845 3.62066 9.16848 3.62062 9.16851L2.4211 10.3279C2.42103 10.3279 2.42097 10.328 2.4209 10.328C2.29066 10.4534 2.23916 10.6391 2.28378 10.8124ZM11.0044 11.6792L11.0044 11.6794L11.2209 12.4349L3.75067 10.4333L4.3156 9.88708C4.31561 9.88706 4.31562 9.88705 4.31563 9.88704C4.96713 9.25732 5.43525 8.46192 5.66981 7.58653L5.99424 6.37573C6.38672 4.91097 7.89753 4.03871 9.36229 4.43119C10.827 4.82367 11.6993 6.33448 11.3068 7.79923L10.9824 9.01003C10.7478 9.88544 10.7555 10.8083 11.0044 11.6792Z' fill='white' stroke='white' stroke-width='0.5'/%3E%3Cpath d='M10.0756 1.77515C9.40948 1.59668 8.7231 1.99296 8.54462 2.65904L8.2858 3.62497C8.21435 3.89163 8.37272 4.16589 8.63936 4.23733C8.90603 4.30879 9.1803 4.15044 9.25175 3.88378L9.51056 2.91787C9.54626 2.78464 9.68351 2.7054 9.81674 2.74109C9.94997 2.77679 10.0292 2.91404 9.99352 3.04727L9.73469 4.01321C9.66324 4.27986 9.82161 4.55412 10.0883 4.62556C10.3549 4.69702 10.6292 4.53867 10.7006 4.27201L10.9595 3.3061C11.1379 2.64001 10.7416 1.95363 10.0756 1.77515Z' fill='white' stroke='white' stroke-width='0.5'/%3E%3Cpath d='M9.81778 12.8529L9.81778 12.8529L9.09398 13.0518C9.12207 13.1533 9.12228 13.2678 9.09412 13.3729C9.00497 13.7056 8.66139 13.904 8.32866 13.8148C7.99593 13.7257 7.79757 13.3821 7.88672 13.0494C7.91488 12.9443 7.9723 12.8452 8.0474 12.7713L8.0474 12.7713L8.04784 12.7709C8.19459 12.6251 8.19621 12.3881 8.051 12.2406L8.05101 12.2406L8.04971 12.2393C7.90358 12.0951 7.66849 12.0911 7.52024 12.237L7.52024 12.237L7.52002 12.2372C7.34848 12.4069 7.22468 12.6204 7.16178 12.8551L7.16178 12.8551C6.96549 13.5878 7.40137 14.3428 8.13407 14.5392C8.8668 14.7355 9.62166 14.2995 9.819 13.5673L9.81905 13.5672C9.88195 13.3324 9.8815 13.0856 9.81778 12.8529Z' fill='white' stroke='white' stroke-width='0.25'/%3E%3C/svg%3E%0A");
  background-position: center center;
  background-size: 16px 17px;
  background-repeat: no-repeat;
  box-shadow: 0px 4px 4px rgba(216, 183, 114, 0.2);
}

.header__middle__phone .button {
  font-family: "Trebuchet MS", sans-serif; /* Applied here */
  font-weight: 400;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  color: #f28300;
  border: 1px solid #f28300;
  height: 35px;
  border-radius: 17.5px;
  padding: 0 20px;
  text-decoration: none;
}

/* The 100% Match Icon */
.header__middle__phone .button::before {
  content: "\e921";
  font-family: "icomoon" !important;
  font-size: 18px;
  line-height: 1;
  display: inline-block;
}

.header__middle__phone .button:hover {
  background-color: transparent;
  color: #d97500;
}

/* Ensure the container is "hittable" */
.navigation .menu > li.actionMenu {
  position: relative;
  display: block; /* Ensures it has a hit area */
  padding-bottom: 10px; /* Bridge the gap between link and dropdown */
}

/* Ensure the link inside takes up space */
.actionMenuHeader {
  display: inline-block;
  pointer-events: auto !important;
  cursor: pointer;
}

.actionMenu:hover .actionMenuContent {
  display: block !important;
}

/* Dropdown Content Box */
.actionMenuContent {
  display: none !important;
  position: absolute;
  top: 100%;
  left: 0;
  min-width: 180px;
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.1);
  padding: 15px 0;
  z-index: 1000;
  list-style: none;
  background-color: #fff;
  display: block;
  width: 100%;
  text-align: center;
}

.actionMenuContent li a {
  color: #005a6d;
  font-size: 1.125rem;
  box-sizing: border-box;
  font-family:
    "DIN Round W01 Regular", "Trebuchet MS", "Source Sans Pro", Helvetica,
    "Trebuchet MS", "Source Sans Pro", Arial, sans-serif;
  font-weight: 400;
  padding: 5px 5px 10px;
  line-height: 30px;
  text-decoration: none;
  display: block;
  border-left: solid 1px #f0f1f2;
  border-right: solid 1px #f0f1f2;
  border-bottom: solid 1px #f0f1f2;
}

.actionMenuContent li a:hover {
  background: #f9f9f9;
  color: #ffb400;
}

/* Respponsive header nav */
/* ==========================================================================
   MOBILE RESET & TOGGLE (Hidden on Desktop)
   ========================================================================== */
.header__top__languages-mobile {
  display: none;
}
/* Hide the checkbox logic from the UI */
.mobile-menu-checkbox {
  display: none;
}

/* Hide the hamburger button and mobile-only nav by default */
.mobile-menu-button,
.mobile-only-top-nav {
  display: none;
}

.header__middle
  .navigation.menu--main
  ul.menu
  > li.menu-item--expanded:has(.header__top__languages-mobile)::after {
  display: none !important;
}

/* ==========================================================================
   RESPONSIVE STYLES (Targeting Tablet & Mobile)
   ========================================================================== */

@media screen and (max-width: 1024px) {
  /* 1. Adjust Top Bar */
  .header__top__nav,
  .header__top,
  .header__top__wrapper,
  .header__middle__phone {
    display: none; /* Hide the horizontal top nav to save space */
  }

  .header__top__languages-mobile {
    display: flex;
  }

  /* 2. Hamburger Button Layout */
  .mobile-menu-button {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    width: 25px;
    height: 18px;
    cursor: pointer;
    z-index: 10001;
    margin-left: 15px;
  }

  .mobile-menu-button .bar {
    width: 100%;
    height: 3px;
    background: #f28300;
    border-radius: 1px;
    opacity: 1;
    left: 0;
    transform: rotate(0deg);
    transition: 0.25s ease-in-out;
  }

  /* 3. Navigation Drawer (The Slide-out Menu) */
  .header__middle--right {
    position: fixed;
    top: 0;
    right: -100%; /* Hidden off-screen */
    width: 300px;
    height: 100vh;
    background: #ffffff;
    padding: 80px 25px 40px 25px;
    box-shadow: -5px 0 15px rgba(0, 0, 0, 0.1);
    transition: right 0.4s cubic-bezier(0.4, 0, 0.2, 1);
    z-index: 10000;
    overflow-y: auto;
    display: block !important; /* Force display block for the container */
  }

  /* 4. Trigger Menu Open */
  .mobile-menu-checkbox:checked ~ .header__middle--right {
    right: 0;
  }

  /* Animate Hamburger to 'X' when checked */
  .mobile-menu-checkbox:checked + .mobile-menu-button .bar:nth-child(1) {
    transform: translateY(8px) rotate(45deg);
  }
  .mobile-menu-checkbox:checked + .mobile-menu-button .bar:nth-child(2) {
    opacity: 0;
  }
  .mobile-menu-checkbox:checked + .mobile-menu-button .bar:nth-child(3) {
    transform: translateY(-8px) rotate(-45deg);
  }

  /* 5. Mobile Menu Item Styling */
  .navigation.menu--main .menu {
    flex-direction: column !important;
    padding: 0;
    margin: 0;
    gap: 0.5rem;
  }

  .navigation.menu--main .menu > li {
    width: 100%;
    padding-bottom: 0;
  }

  /* 6. Sub-menu (Dropdowns) Handling */
  #header .actionMenuContent {
    position: static !important;
    display: block !important; /* Sub-items visible in mobile drawer */
    box-shadow: none !important;
    padding: 0 0 0 15px !important;
    background: transparent !important;
    visibility: visible !important;
    opacity: 1 !important;
  }

  #header .actionMenuContent li a {
    color: #555;
    border: none;
    text-align: start;
    font-size: 1.125rem;
    font-family:
      "DIN Round W01 Regular", "Trebuchet MS", "Source Sans Pro", Helvetica,
      Arial, sans-serif;
    font-weight: 400;
    color: #f28300;
  }

  /* 7. Mobile-only Top Nav (The part you requested) */
  .mobile-only-top-nav {
    display: block;
    margin: 1rem 0;
    order: 1;
  }

  .mobile-sub-list {
    list-style: none;
    padding: 0;
    margin: 0;
  }

  .mobile-sub-list li {
    margin-bottom: 12px;
  }

  .mobile-sub-list li a {
    color: rgba(0, 0, 0, 0.3);
    text-decoration: none;
    display: block;
    padding-left: 10px;
    border-left: 2px solid #fff;
    font-family:
      "DIN Round W01 Medium", "Trebuchet MS", "Source Sans Pro", Helvetica,
      Arial, sans-serif;
    font-weight: 400;
  }

  .mobile-divider {
    border: 0;
    border-top: 1px solid #eee;
    margin: 20px 0;
  }

  /* Ensure logo stays visible and aligned */
  .header__middle__wrapper {
    display: flex;
    align-items: center;
    justify-content: space-between;
  }

  .header__top__nav a,
  .header__top__languages a {
    color: #f28300;
    text-decoration: none;
    font-size: 0.9375rem;
    font-weight: 400;
    transition: opacity 0.2s ease;
    line-height: 1em;
  }

  .header__top__languages .separator {
    color: #f28300;
    padding: 0 4px;
    font-size: 13px;
  }

  .header__top__languages {
    padding-left: 0px;
    margin-left: 5px;
  }

  .navigation .menu > li > a {
    font-size: 1.5rem;
    color: #f28300;
    text-decoration: none;
    border-left: 2px solid #fff;
    font-family:
      "DIN Round W01 Medium", "Trebuchet MS", "Source Sans Pro", Helvetica,
      Arial, sans-serif;
    border-bottom: none !important;
  }

  .menu-item-jobs > a::before {
    display: none;
  }

  .social-menu {
    padding: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    list-style: none;
    gap: 1rem;
  }

  .social-menu .menu-item a {
    color: #005a6d;
  }

  .header__middle
    .navigation.menu--main
    ul.menu
    > li.menu-item--expanded::after {
    display: none;
  }
}

/* SUB-HEADER */
.jobs-sub-header {
  padding: 20px 0;
  font-family: "Trebuchet MS", "Source Sans Pro", Arial, sans-serif;
  max-width: 1100px;
  margin: 0 auto;
}

.jobs-breadcrumbs {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 14px;
  color: #0084a1; /* Emeis Teal */
  margin-bottom: 60px;
}

.jobs-breadcrumbs a {
  color: #0084a1;
  text-decoration: none;
}

.jobs-breadcrumbs .sep {
  color: #ffb400; /* Yellow separator */
  font-weight: bold;
}

.jobs-actions {
  display: flex;
  gap: 15px;
  flex-wrap: wrap;
  justify-content: center;
}

.btn-emeis-yellow {
  background-color: #ffb400; /* Emeis Yellow */
  color: #fff;
  padding: 12px 28px;
  border-radius: 30px; /* Capsule shape */
  text-decoration: none;
  font-weight: 600;
  font-size: 15px;
  display: inline-block;
  transition: background-color 0.2s ease-in-out;
}

.btn-emeis-yellow:hover {
  background-color: #e6a200;
  color: #fff;
  text-decoration: none;
}

/* Ensure mobile responsiveness */
@media (max-width: 768px) {
  .jobs-actions {
    flex-direction: column;
    align-items: flex-start;
  }
  .btn-emeis-yellow {
    width: 100%;
    text-align: center;
  }
}

/* PAGINATION */
/* Target the specific pager wrapper that is trapped in the columns */
.pager-container.ourjobsinfo
  .pager-content.col-xs-12.col-sm-4.col-md-6.col-lg-6 {
  width: 100% !important;
  max-image-width: 100% !important;
  flex: 0 0 100% !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  float: none !important; /* Forces it out of the older float-based grids */
}

/* Ensure the inner pager container is a flexbox for space-between */
.pager-container.ourjobsinfo .pager-container.ourjobsinfo {
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  width: 100% !important;
}

/* Ensure the results text and page numbers are on opposite sides */
.showing {
  flex: 1;
  text-align: left;
}

.pager-content {
  flex: 1;
  text-align: right;
}

.pager-center {
  display: inline-flex !important;
  justify-content: flex-end;
  gap: 8px;
}

.pager-content .pager-container.ourjobsinfo .showing span,
.pager-content .pager-container.ourjobsinfo .showing span a {
  color: var(--brand-orange);
  font-weight: 700;
}

.pager-content .pager-container.ourjobsinfo .showing span a:hover {
  text-decoration: none;
  color: var(--brand-orange) !important;
}

.pager-content span.pageNumDisabled {
  background-color: var(--brand-orange);
  border: 1px solid var(--brand-orange);
  color: #fff !important;
}

.pager-content a.pageNumActive {
  color: var(--brand-orange);
}

.pager-content a.pageNumActive:hover {
  background-color: var(--brand-orange);
  border: 1px solid var(--brand-orange);
}

.pager-content a.page .pagePrec {
  color: var(--brand-orange);
}

.pager-content a.page .pagePrec:hover {
  background-color: var(--brand-orange);
  border: 1px solid var(--brand-orange);
}

.pager-content a.page .pageFirst {
  color: var(--brand-orange);
}

.pager-content a.page .pageFirst:hover {
  background-color: var(--brand-orange);
  border: 1px solid var(--brand-orange);
}

.pager-content a.page .pageSuiv {
  color: var(--brand-orange);
}

.pager-content a.page .pageSuiv:hover {
  background-color: var(--brand-orange);
  border: 1px solid var(--brand-orange);
}

.pager-content a.page .pageLast {
  color: var(--brand-orange);
}

.pager-content a.page .pageLast:hover {
  background-color: var(--brand-orange);
  border: 1px solid var(--brand-orange);
}

/* Container alignment */
.pager-center {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
}

/* Base style for both numbers and arrow containers */
.pager-center a,
.pager-center span.pageNumDisabled {
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 40px; /* Adjust based on image_332307.png */
  height: 40px;
  border-radius: 5px;
  text-decoration: none;
  color: #f39200;
  font-weight: bold;
}

/* Active/Disabled State (Solid Orange) */
.pager-center span.pageNumDisabled,
.pager-center a.pageNumActive:hover {
  background-color: #f39200;
  color: #ffffff;
  border-color: #f39200;
}

/* Fixing the Arrows (pageSuiv and pageLast) */
.pageSuiv::before {
  content: "\f054"; /* FontAwesome Angle Right */
  font-family: "Font Awesome 5 Free";
  font-weight: 900;
}

.pageLast::before {
  content: "\f101"; /* FontAwesome Double Angle Right */
  font-family: "Font Awesome 5 Free";
  font-weight: 900;
}

/* Ensure the span inside the link fills the box for vertical centering */
.pager-center .page span {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
}

/* JOB DETAILS SHARING BAR */

.jobdetail .share li a:hover::before,
.jobdetail .share li a:active::before,
.jobdetail .share li a:focus::before,
.jobdetail .share li.pdf a:hover::before,
.jobdetail .share li.pdf a:focus::before,
.jobdetail .share li.pdf a:active::before {
  background: var(--brand-orange);
}

.jobdetail .share li a:hover,
.jobdetail .share li a:active,
.jobdetail .share li a:focus {
  background: var(--brand-orange) !important;
}

/* TITLES */

.jobs-details .main > h5,
.title-Myjob-h1 {
  color: var(--brand-orange) !important;
}

.page-header__title-prefix {
  color: #f28300;
  display: block;
  font-family: "Trebuchet MS", "Source Sans Pro", Arial, sans-serif;
  font-weight: 700;
  line-height: 1.2;
  overflow-wrap: break-word;
  font-size: 36px;
  font-size: 2.25rem;
  margin: 0 0 22px 0;
}

.jobs-details-title {
  color: #e8315f;
  display: block;
  font-family: "Trebuchet MS", "Source Sans Pro", Arial, sans-serif;
  font-weight: 700;
  line-height: 1.2;
  overflow-wrap: break-word;
  font-size: 36px;
  font-size: 2.25rem;
  margin: 0 0 22px 0;
}
.modules-jobs-details .jobdetail .row p,
.modules-jobs-details .jobdetail .row ul {
  color: #005a6d;
  font-family: "Trebuchet MS", "Source Sans Pro", Arial, sans-serif;
  line-height: 1.55;
  font-size: 1.3125rem;
}

.modules-jobs-details .jobdetail h3 {
  font-family: "Trebuchet MS", "Source Sans Pro", Arial, sans-serif;
  font-weight: 700;
  color: #f28300;
  line-height: 1.2;
  overflow-wrap: break-word;
  padding: 0;
  letter-spacing: 0.4px;
}

/* COOKIES */

.rhc-banner {
  background: #fff !important;
  border-top: 1px solid #d4d4d4;
}

.rhc-banner__content__message {
  color: #005a6d !important;
}

.rhc-banner__content .consent-decline {
  background-color: transparent;
  color: var(--brand-orange) !important;
  box-shadow: none;
  border-radius: 10px;
  border: 1px solid var(--Grey-20, #d4d4d4);
}

.rhc-banner__content .consent-decline:hover {
  border-color: transparent;
  background-color: transparent;
  color: color-mix(in srgb, var(--brand-orange) 80%, transparent) !important;
  box-shadow: none;
  text-decoration: underline;
}

.rhc-banner__content .consent-approve {
  background-color: var(--brand-orange) !important;
  border-radius: 10px;
}

.rhc-banner__content .consent-approve:hover {
  background-color: color-mix(
    in srgb,
    var(--brand-orange) 80%,
    transparent
  ) !important;
}

.rhc-banner__content__message a {
  text-decoration: underline !important;
  color: var(--brand-orange) !important;
  font-weight: 400 !important;
}

.rhc-banner__content__message a:hover {
  text-decoration: none !important;
  color: color-mix(in srgb, var(--brand-orange) 80%, transparent) !important;
}

/* 
.cc-message .cc-link,
.cc-banner .cc-btn.cc-deny {
  color: var(--brand-orange) !important;
}

.cc-message .cc-link:hover,
.cc-message .cc-link:focus,
.cc-banner .cc-btn.cc-deny:hover,
.cc-banner .cc-btn.cc-deny:focus {
  color: color-mix(in srgb, var(--brand-orange) 80%, transparent) !important;
}

.cc-animate.cc-revoke.cc-bottom {
  color: var(--brand-orange) !important;
  border-top: 3px solid var(--text-color) !important;
  background: #f8f9fa !important;
} */

/* SELECT2 */

.select2-container--bootstrap4 .select2-results__option--highlighted,
.select2-container--bootstrap4
  .select2-results__option--highlighted.select2-results__option[aria-selected="true"] {
  background-color: var(--brand-orange) !important;
}

div.talentfinder-autocompleter.label
  div.MuiAutocomplete-root.MuiAutocomplete-root {
  width: 100% !important;
}
/* * upload file */

.application-files .file {
  padding: 1.75rem;
  align-items: center;
  display: grid;
  grid-template-columns: 2fr 2fr 2fr;
}

#uploadcv .file {
  padding: 1.75rem;
  align-items: center;
  display: grid;
  grid-template-columns: 2fr 2fr 2fr;
}

.message-container .title-file {
  color: #005a6d;
  font-size: 1rem;
  font-weight: 400;
  padding-bottom: 0.5rem;
}

.message-container .extension-file {
  color: rgba(0, 0, 0, 0.4);
  font-size: 0.85rem;
  font-weight: 400;
}
.message-container {
  width: 78%;
}

.tableBox {
  display: flex;
  flex-direction: column;
}

.tableBox .tableTitle {
  order: 3;
  padding: 1.75rem;
  vertical-align: bottom;
  border-bottom: 1px solid rgba(0, 0, 0, 0.25);
  border-top: 1px solid rgba(0, 0, 0, 0.25);

  margin-top: 24px;
  display: grid;
  grid-template-columns: 2fr 2fr 2fr;
  color: #005a6d;
}

.tableBox .tableFoot {
  order: 1;
  padding: 24px;
  border: 1.5px dashed rgba(0, 0, 0, 0.25);
  border-radius: 48px;
}

body .tableFoot:hover {
  background-color: transparent !important;
}

.tableBox .curriculum-vitae,
.tableBox .emply {
  order: 3;
}

#upload-cv-container {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 0.8rem;
}

#upload-cv-container button {
  width: fit-content;
  border-radius: 64px;
  height: 48px;
  background: var(--brand-orange) !important;
  border: 1px solid var(--brand-orange) !important;
  color: #fff !important;
  outline: none;
}

.tableFoot:hover #upload-cv-container button {
  background-color: #e6a200 !important;
  border: 1px solid #e6a200 !important;
  color: #fff !important;
}

#questioninfo #complete-form-container .contact-info .line .radio-group,
#questioninfo
  #complete-form-container
  .contact-info
  .line
  .talentfinder-textfield-label {
  display: grid;
  grid-template-columns: 0.5fr 2fr;
  align-items: center;
}

#questioninfo
  #complete-form-container
  .address-info
  .line
  .talentfinder-textfield-label,
#questioninfo
  #complete-form-container
  .address-info
  .line
  .talentfinder-select-label,
#questioninfo
  #complete-form-container
  .address-info
  .line
  .talentfinder-autocompleter,
#questioninfo
  #complete-form-container
  .address-info
  .line
  .talentfinder-autocompleter {
  display: grid;
  grid-template-columns: 0.5fr 2fr;
  align-items: center;
}

#questioninfo
  #complete-form-container
  .address-info
  .line.address-postalCode
  div.talentfinder-autocompleter.label
  div.MuiAutocomplete-root.MuiAutocomplete-root {
  width: 100% !important;
}

.MuiRadio-colorPrimary svg,
.MuiCheckbox-colorPrimary svg {
  fill: var(--brand-orange) !important;
}

.position-preference .line .talentfinder-select-label,
.position-preference .remuneration-package .line .talentfinder-select-label,
.position-profile
  .remuneration-package
  .line.input-select
  .talentfinder-select-label,
#self-application-disclaimer
  .person-base
  #self-application-disclaimer
  .line
  .talentfinder-select-label,
#self-application-disclaimer
  .person-base
  #self-application-disclaimer
  .line
  .talentfinder-textfield-label,
#self-application-disclaimer
  .person-legal
  #self-application-disclaimer
  .line
  .talentfinder-select-label {
  display: flex;
  flex-direction: column;
}

.position-preference
  .application-from
  .line
  .geographical-area
  .checkbox-group.inline-label {
  display: grid;
  grid-template-columns: 0.5fr 2fr;
  align-items: center;
}
/* language form */
.myjobsite-language-table {
  display: inline-table !important;
}

#language-skills
  table.myjobsite-language-table
  td
  .talentfinder-select-label
  .MuiInputBase-root.MuiOutlinedInput-root {
  width: 75% !important;
}

/* My Profile */

.row.myjobsite-breadcrumb .backgroundcolor.current::before {
  background: ar(--brand-orange) !important;
}

.row.myjobsite-breadcrumb .backgroundcolor.current::after {
  border: 4px solid var(--brand-orange) !important;
  background: #fff !important;
}

.row.myjobsite-breadcrumb .backgroundcolor::before {
  background: var(--brand-orange) !important;
}

.row.myjobsite-breadcrumb .backgroundcolor::after {
  border: 4px solid var(--brand-orange) !important;
  background: var(--brand-orange) !important;
}

/* language */
.myjobsite-language-table {
  display: inline-table !important;
}

#language-skills
  table.myjobsite-language-table
  td
  .talentfinder-select-label
  .MuiInputBase-root.MuiOutlinedInput-root {
  width: 75% !important;
}

/* jobdetail page */

.jobdetail .content-container .jobs-details .row div p img {
  width: 100%;
}

.modules-jobs-details .jobs-details .card {
  border: none;
  background-color: transparent;
}

.modules-jobs-details .jobs-details .card .organization-name {
  font-family:
    "DIN Round W01 Medium", "Trebuchet MS", "Source Sans Pro", Helvetica, Arial,
    sans-serif;
  font-weight: 400;
  color: #005a6d;
  font-size: 1.25rem;
  line-height: 1.2;
  overflow-wrap: break-word;
  margin: 0 0 10px 0;
}

.modules-jobs-details .jobs-details .card .extra-info .extra-info-content {
  font-family:
    "DIN Round W01 Medium", "Trebuchet MS", "Source Sans Pro", Helvetica, Arial,
    sans-serif;
  font-weight: 400;
  color: #f28300;
  font-size: 1rem;
  line-height: 1.55;
}

.jobs-details .apply-option-container .apply-btn {
  font-size: 1rem;
  border-radius: 30px;
  height: 60px;
  font-family: "Trebuchet MS", "Source Sans Pro", Arial, sans-serif;
  font-weight: 400;
  margin-top: 20px;
}

.jobs-details .apply-button-bottom {
  max-width: max-content;
}

.postion-opening .extra-info-content .content-title,
.postion-opening .organization-info-content .content-title {
  color: #005a6d !important;
  padding-left: 24px;
}

a.info-website-text {
  color: var(--brand-orange) !important;
  text-decoration: none;
  cursor: pointer;
}

.postion-opening.organization-info
  .organization-info-content.organization-name {
  font-weight: 500;
  line-height: 1.2;
}

.jobdetail .share li.back-to-list a {
  color: var(--brand-orange) !important;
}

.jobdetail .share li.show_all a:hover {
  background: var(--brand-orange) !important;
  color: #fff !important;
}

/* LOGO HEADER */

img.logo-image {
  height: auto;
  flex-shrink: 0;
  width: 110px;
}

/* slogan */

.career-intro {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 16px;
}

.career-intro span {
  color: color-mix(in srgb, var(--heading-color) 70%, transparent);
  text-align: center;
  text-transform: uppercase;
  letter-spacing: 1px;
  margin-bottom: 10px;
  font-size: 24px;
  font-style: normal;
  font-weight: 400;
  line-height: 180%; /* 43.2px */
}

.career-intro h1 {
  color: var(--heading-color);
  font-size: 72px;
  font-style: normal;
  font-weight: 600;
  line-height: 120%;
}

.career-intro p {
  color: var(--heading-color);
  text-align: center;
  font-size: 24px;
  font-style: normal;
  font-weight: 400;
  line-height: 180%;
  font-family: var(--font-family);
}

/* header button */

.button-group {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
  margin: 24px 0;
  justify-content: center;
}

.menu-button a {
  color: #000;
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
}

.menu-button {
  border: 1px solid #000;
  background-color: #fff;
  color: #000;
  font-size: 14px;

  display: flex;
  width: 180px;
  height: 60px;
  padding: 12px 24px;
  justify-content: center;
  align-items: center;
  gap: 12px;
  border-radius: 100px;
  cursor: pointer;
  transition: all 0.3s ease;

  /* for button that not assign link yet */
  color: #000;
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
}

.menu-button.active,
.menu-button.active a {
  background-color: var(--brand-orange);
  color: #fff;
  border-color: transparent;
}
.menu-button:hover:not(.active) {
  background-color: color-mix(
    in srgb,
    var(--brand-orange) 20%,
    transparent
  ) !important;
}

.menu-button a:hover:not(.active) {
  text-decoration: none;
}

/* filter */

.job-item .job-title a,
.job-item a,
.job-title .title-overflow,
.job-title span {
  text-decoration: none !important;
  border-bottom: none !important;
}

.jobs-category-filter {
  width: max-content !important; /* Increased default width for visibility */
  max-width: 95vw; /* Responsive for mobile screens */
  border: 1px solid #e0e0e0;
  border-radius: 8px;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
  background: #fff;
  overflow: hidden;
  margin-bottom: 1rem;
}

/* The scrollable area */
.jobs-category-filter .card-body {
  max-height: 450px;
  overflow-y: auto !important;
  overflow-x: hidden; /* Prevents horizontal scrolling */
  padding: 0;
}

/* Custom Scrollbar */
.jobs-category-filter .card-body::-webkit-scrollbar {
  width: 6px;
}
.jobs-category-filter .card-body::-webkit-scrollbar-track {
  background: #f1f1f1;
}
.jobs-category-filter .card-body::-webkit-scrollbar-thumb {
  background: #ffb400;
  border-radius: 10px;
}

/* ============================================================
   3. CONTENT & WORD WRAP FIX
   ============================================================ */

/* Hide unwanted elements */
.jobs-category-filter input[type="checkbox"],
.jobs-category-filter .custom-control-input,
.jobs-category-filter .icon,
.jobs-category-filter .bracket {
  display: none !important;
}

/* Layout for Main and Sub items */
.jobs-category-filter .main-category a,
.jobs-category-filter .sub-item label {
  display: flex !important;
  justify-content: space-between !important;
  align-items: flex-start !important; /* Align badge to top of text */
  gap: 8px;
  padding: 12px 15px;
  margin: 0;
  text-decoration: none !important;
  cursor: pointer;
  width: 100%;
  color: var(--brand-orange) !important;
}

/* TEXT WRAP FIX: This allows text to expand and wrap */
.jobs-category-filter .link {
  flex: 1; /* Takes up all space except badge */
  white-space: normal !important; /* ALLOWS WRAPPING */
  word-wrap: break-word; /* Breaks long words if needed */
  overflow: visible !important;
  color: #005a6d !important ;
  line-height: 1.4;
  font-size: 14px;
  text-align: left;
  font-family: var(--font-main);
}

/* Hierarchy and Colors */
.jobs-category-filter .main-category {
  background-color: #f9f9f9;
  font-weight: 700;
  border-bottom: 1px solid #eee;
}

.jobs-category-filter .sub-item {
  border-bottom: 1px solid #fafafa;
  transition: background 0.2s;
}

.jobs-category-filter .sub-item:hover {
  background-color: #fff9e6;
}

/* Yellow Badge Counter */
.jobs-category-filter .badge-primary {
  background-color: #ffb400 !important;
  color: #fff;
  border-radius: 12px;
  padding: 3px 10px;
  font-size: 11px;
  font-weight: 600;
  flex-shrink: 0;
  margin-top: 2px;
}

.filter-container .navbar-nav .nav-item .nav-link.dropdown-toggle {
  font-family: "Trebuchet MS", "Source Sans Pro", Arial, sans-serif;
  font-weight: 700;
  display: block;
  margin-top: 10px;
  color: #005a6d !important;
}

.filter-container {
  gap: 5em;
  display: flex;
  justify-content: center;
  margin-left: 8px;
  margin-bottom: 1rem;
}

.filter-container .dropdown-menu.filter-menu {
  position: absolute !important;
  border: none;
}

.filter-container .navbar-nav:first-of-type .dropdown-menu.filter-menu {
  transform: translateX(-140px);
  background-color: transparent;
}

.filter-container .navbar-nav:last-of-type .dropdown-menu.filter-menu {
  transform: translateX(0px);
}

.filter-container .dropdown-menu.filter-menu .card .card-body .plugins-title {
  display: none;
}
.filter-container .dropdown-menu.filter-menu .card .card-body {
  width: 15em;
  padding: 0.5rem;
}

.filter-container .dropdown-menu.filter-menu.actionMenuContent {
  box-shadow: none;
  background-color: none !important;
}

.filter-container .dropdown-menu.filter-menu .card .card-body a {
  font-weight: 700;
  font-family: "Trebuchet MS", "Source Sans Pro", Arial, sans-serif;
}

.filter-container
  .dropdown-menu.filter-menu
  .location-filter
  .card-body
  .head-panel
  .custom-control-label {
  width: 100%;
  border-bottom: 1px solid var(--brand-orange);
}

.filter-container
  .dropdown-menu.filter-menu
  .location-filter
  .card-body
  .head-panel
  .custom-control-label
  a {
  display: flex !important;
  justify-content: space-between !important;
  align-items: flex-start !important;
  padding: 8px 5px;
  margin: 0;
  text-decoration: none !important;
  cursor: pointer;
  width: 100%;
  color: var(--nav-blue) !important;
}

.filter-container
  .dropdown-menu.filter-menu
  .card
  .card-body
  .main-category
  .cat-item-count {
  display: none;
}

.filter-container
  .dropdown-menu.filter-menu
  .card
  .card-body
  .sub-category
  .sub-item
  label.custom-control-label:not(:has(a)) {
  display: none;
}

/* Footer */
.site-footer {
  font-family: "DIN Round W01 Regular", sans-serif;
  color: #f39200;
  background: #fff;
  letter-spacing: 0.4px;
  border-top: 3px solid #f28300;
  padding-top: 2rem;
}

.site-footer__middle {
  box-sizing: border-box;
  margin-left: auto;
  margin-right: auto;
  max-width: 1280px;
  padding: 0 20px;
}

.site-footer__middle__wrapper {
  display: grid;
  grid-template-columns: 1.2fr 1fr 1.2fr 1.5fr;
  gap: 30px;
  align-items: start;
}

.footer-logo {
  max-width: 140px;
}

.footer-title {
  font-size: 1.5rem;
  font-weight: 600;
  margin-bottom: 20px;
}

.footer-menu {
  list-style: none;
  padding: 0;
  margin: 0 0 20px 0;
}

.footer-menu li {
  margin-bottom: 8px;
}

.sub-links {
  margin: 0 0 20px 0;
  margin-top: 5px;
  list-style: none;
  padding-left: 20px;
}

.sub-links li a {
  font-size: 1.125rem;
  font-family:
    "Trebuchet MS", "Source Sans Pro", "Trebuchet MS", "Source Sans Pro", Arial,
    sans-serif;
  font-weight: 400;
  color: #f28300;
  opacity: 0.8;
}

.footer-menu a {
  text-decoration: none;
  color: #f39200;
  font-size: 1.5rem;
  font-weight: 600;
  transition: opacity 0.2s;
}

.footer-menu a:hover {
  opacity: 0.7;
}

.iso-text {
  font-weight: bold;
  margin-top: 15px;
  max-width: 200px;
}

/* Contact Buttons (Outlined) */
.contact-buttons {
  display: flex;
  flex-direction: column;
  gap: 12px;
  max-width: 170px;
}

.btn-contact-outline {
  display: block;
  border: 1px solid #f39200;
  color: #f39200;
  padding: 12px 20px;
  border-radius: 25px;
  text-decoration: none;
  text-align: center;
  font-weight: 600;
  transition: all 0.3s;
}

.btn-contact-outline:hover {
  background: #f39200;
  color: #fff;
}

/* Yellow Bottom Bar */
.site-footer__bottom {
  background-color: #ffb400; /* Matches the vibrant yellow in image */
  padding: 15px 0;
  color: #fff;
}

.site-footer__bottom__wrapper {
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: 13px;
  box-sizing: border-box;
  margin-left: auto;
  margin-right: auto;
  max-width: 1280px;
  padding: 0 20px;
}

.footer-legal a {
  color: #fff;
  text-decoration: none;
  margin-left: 20px;
}

.footer-socials a {
  color: #fff;
  margin-left: 15px;
  font-size: 18px;
}

/* Mobile adjustments */
@media (max-width: 992px) {
  .site-footer__middle__wrapper {
    grid-template-columns: 1fr 1fr;
  }
}

/* Logon page */

.my-jobsite-logon .content-container p.contentBlue {
  color: #005a6d;

  font-style: normal;
  font-weight: 400;
  line-height: 160%;
}

.main-title .greenH1 {
  font-size: 48px;
  font-weight: 700;
  line-height: 58px;
  padding-bottom: 0;
  text-align: left;
  margin-top: 0px;
  margin-bottom: 30px;
  text-transform: none;
  font-family:
    "Trebuchet MS", "Source Sans Pro", "Trebuchet MS", "Source Sans Pro", Arial,
    sans-serif;
  position: relative;
  color: #f28300;
  border: 0;
  display: block;
  white-space: normal;
}
div.content-Login {
  margin: 30px auto;
  padding: 0;
  border: 0;
  -webkit-border-radius: 8px;
  border-radius: 8px;
  background-color: #ffffff;
  box-shadow: 0 5px 15px rgba(58, 70, 84, 0.25);
  -webkit-box-shadow: 0 5px 15px rgba(58, 70, 84, 0.25);
}

div.content-Login
  .my-jobsite-logon-form
  .logon_myjobsite
  #MyJobSiteLogonFrmSubmit,
div.content-Login .my-jobsite-logon-form #lostPasswordFrmSubmit {
  border-radius: 40px;
  display: flex;
  padding: 8px 12px;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 10px;
  flex-shrink: 0;
  align-self: stretch;
}

.my-jobsite-logon-form .left {
  padding: 0 44px 0 40px !important;
}

.my-jobsite-logon-form .left form .gdpr-logon {
  padding-left: 0px !important;
}

.my-jobsite-logon-form .left form .gdpr-logon .checkbox label {
  text-align: left;
  padding-top: 8px;
  font-size: 16px;
}

.my-jobsite-logon-form .right {
  padding: 0 40px 0 44px !important;
}

div.csa_form div.line label {
  color: #005a6d;
}
.my-jobsite-logon-form.card-body {
  color: #005a6d;
}

/* reset password */

.my-jobsite-logon-form.reset-password.card-body {
  padding: 2.25rem 4.25rem;
}

.my-jobsite-logon-form.reset-password.card-body
  .reset-container
  form
  .logon_myjobsite
  #MyJobSiteResetFrmSubmit {
  display: flex;
  padding: 8px 12px;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 10px;
  flex-shrink: 0;
  align-self: stretch;
  border-radius: 40px;
  font-size: 20px;
  font-style: normal;
  font-weight: 600;
  line-height: normal;
}

/* Disclaimer */

.privacy-policy {
  line-height: 1.6;
  margin: 2rem;
  color: var(--heading-color);
}
.privacy-policy h1 {
  font-size: 2rem;
  font-weight: bold;
}
.privacy-policy h2 {
  font-size: 1.2rem;
  margin-top: 1.5rem;
}
.privacy-policy p {
  margin: 0.5rem 0;
}
.privacy-policy ul {
  margin: 0.5rem 0 1rem 1.5rem;
  padding-left: 1rem;
}
.privacy-policy li {
  margin-bottom: 0.5rem;
}
.privacy-policy .subtitle {
  font-size: 0.95rem;
  color: color-mix(in srgb, var(--heading-color) 80%, transparent);
  margin-bottom: 2rem;
}
.privacy-policy .section {
  margin-bottom: 2rem;
}

.privacy-policy .main-section {
  border-radius: 24px;
  border: 1px solid var(--brand-orange);
  padding: 80px;
}

/* about page */
.about-section {
  padding: 100px 40px;
  max-width: 1200px;
  margin: auto;
}

.about-title {
  font-size: 42px;
  text-align: center;
  font-weight: 700;
  margin-bottom: 20px;
  line-height: 1.2;
}

.about-subtitle {
  text-align: center;
  font-size: 18px;
  line-height: 1.8;
  max-width: 600px;
  margin: 0 auto 60px auto;
  color: #666;
}

.about-highlight {
  font-weight: 600;
}

.about-flex-bio {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  flex-wrap: wrap;
  gap: 60px;
}

.about-paragraphs {
  flex: 1 1 400px;
  font-size: 16px;
  line-height: 1.8;
  color: #444;
}

.about-founders-stacked {
  position: relative;
  width: 400px; /* or adjust as needed */
  height: 320px;
  margin: 0 auto;
}

.founder-card {
  position: absolute;
  width: 220px;
}

.founder-card img {
  width: 100%;
  border: 4px solid var(--White, #fff);
}

/* Left founder - on top, aligned left */
.founder-left {
  left: 0;
  top: 40px;
  z-index: 2;
  text-align: left;
}

/* Right founder - behind, aligned right */
.founder-right {
  right: 0;
  top: 0;
  z-index: 1;
  text-align: right;
}

.about-founder-name {
  font-size: 14px;
  font-weight: 600;
  margin-top: 10px;
}

.about-founder-role {
  font-size: 12px;
  color: #888;
  margin: 0;
}

.about-stats {
  background-color: #f5f5f5;
  display: flex;
  justify-content: space-around;
  align-items: center;
  padding: 60px 20px;
  flex-wrap: wrap;
}

.about-stat {
  text-align: center;
  margin: 20px;
}

.about-stat h3 {
  color: var(--heading-color);
  font-size: 64px;
  font-style: normal;
  font-weight: 600;
  line-height: 64px; /* 100% */
}

.about-stat p {
  color: var(--heading-color);
  font-size: 24px;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
}

.about-stat p::before {
  content: "";
  display: block;
  height: 2px;
  background-color: #3f9c5a;
  margin: 24px 0;
  width: 128px;
  margin-left: auto;
  margin-right: auto;
}

.about-team-section {
  text-align: center;
  padding: 80px 20px 60px;
}

.about-team-header h2 {
  font-size: 32px;
  font-weight: 700;
  margin-bottom: 10px;
}

.about-team-header p {
  font-size: 16px;
  line-height: 1.6;
  color: #555;
  max-width: 700px;
  margin: auto;
}

.about-team-image img {
  width: 100%;
  max-width: 900px;
  margin: 40px auto 0;
  display: block;
  border-radius: 2px;
}

.about-value-section {
  max-width: 1200px;
  margin: auto;
  padding: 60px 20px 100px;
  display: flex;
  flex-direction: column;
  gap: 80px;
}

.about-value-block {
  display: flex;
  gap: 60px;
  align-items: flex-start;
  flex-wrap: wrap;
}

.about-value-block.reverse {
  flex-direction: row-reverse;
}

.about-value-image {
  flex: 1 1 400px;
}

.about-value-image img {
  width: 100%;
  border-radius: 2px;
}

.about-value-text {
  flex: 1 1 500px;
}

.about-value-text h3 {
  font-size: 22px;
  font-weight: 700;
  margin-bottom: 16px;
}

.about-value-text p {
  font-size: 15px;
  color: #444;
  line-height: 1.8;
  margin-bottom: 16px;
}

@media (max-width: 768px) {
  .about-flex-bio,
  .about-value-block,
  .about-value-block.reverse {
    flex-direction: column !important;
    align-items: center;
  }

  .about-paragraphs,
  .about-founders,
  .about-value-image,
  .about-value-text {
    flex: 1 1 100%;
  }
}

/*  my profile */

form .my-jobsite-btn-container {
  display: grid;
  grid-template-columns: 1fr 1fr;
  direction: rtl;
}

form .my-jobsite-btn-container button.myjobsite-submit {
  width: 126px;
  background-color: var(--brand-orange) !important;
}

form .my-jobsite-btn-container button.myjobsite-back {
  width: 126px;
  justify-self: end;
  background-color: var(--brand-orange) !important;
  direction: ltr;
}

/* form .my-jobsite-btn-container button.myjobsite-back::before {
  content: "< ";
  font-weight: bold;
  font-size: 20px;
}

form .my-jobsite-btn-container button.myjobsite-submit::before {
  content: "< ";
  font-weight: bold;
  font-size: 20px;
} */

.modules-myjobsite-categories .content-container .intro p:nth-of-type(2),
.modules-myjobsite-professional .content-container .intro p:nth-of-type(2),
.modules-myjobsite-personal .content-container .intro p:nth-of-type(2) {
  display: none;
}

.content-container
  form
  .job-category
  .wish-category
  #csa_form
  .talentfinder-autocompleter
  label {
}

#leftMenu #myjob-site-menu .item div .sub-item,
#leftMenu #myjob-site-menu div #content-Profil .sub-item,
#leftMenu #myjob-site-menu div #content-Profil .leftMenuMyJobSite {
  padding: 8px 16px;
}

#leftMenu #myjob-site-menu .item div .sub-item a,
#leftMenu #myjob-site-menu div #content-Profil .sub-item a,
#leftMenu #myjob-site-menu div #content-Profil .leftMenuMyJobSite a {
  color: var(--heading-color) !important;
  padding: 8px 16px;
}

#leftMenu #myjob-site-menu .item div .sub-item a:hover,
#leftMenu #myjob-site-menu div #content-Profil .sub-item a:hover,
#leftMenu #myjob-site-menu div #content-Profil .leftMenuMyJobSite a:hover {
  text-decoration: none;
}

#leftMenu #myjob-site-menu .item div .sub-item:hover,
#leftMenu #myjob-site-menu div #content-Profil .sub-item:hover,
#leftMenu #myjob-site-menu div #content-Profil .leftMenuMyJobSite:hover {
  background-color: var(--brand-orange);
  border-radius: 5px;
}

#leftMenu #myjob-site-menu .item div .sub-item:hover a,
#leftMenu #myjob-site-menu div #content-Profil .sub-item:hover a,
#leftMenu #myjob-site-menu div #content-Profil .leftMenuMyJobSite:hover a {
  color: #fff !important;
  text-decoration: none;
}

#leftMenu #myjob-site-menu .item div .sub-item.active,
#leftMenu #myjob-site-menu div #content-Profil .sub-item.active,
#leftMenu #myjob-site-menu div #content-Profil .leftMenuMyJobSite.active {
  background-color: var(--brand-orange);
  border-radius: 5px;
}

#leftMenu #myjob-site-menu .item div .sub-item.active a,
#leftMenu #myjob-site-menu div #content-Profil .sub-item.active a,
#leftMenu #myjob-site-menu div #content-Profil .leftMenuMyJobSite.active a {
  color: #fff !important;
  text-decoration: none;
}