/* ==========================================================================
   1. VARIABLES
   ========================================================================== */
:root {
  --brand-color-1: #df0030;
  --brand-color-2: #f7f2ea;
  --brand-color-3: #212121;
  --brand-color-4: #000000;
  --brand-color-5: #ffffff;

  --intact-aqua: #7EE6E0;
  --intact-soothing-sand: #F7F2EA;
  --intact-dark-sand: #E8DDC8;
  --intact-sage-green: #2f7370;
  
  --h1-size: clamp(2.5rem, 0.83vw + 2.3338rem, 3rem);
  --h1-line-height: 1.2;

  --h2-size: clamp(2rem, 0.83vw + 1.8338rem, 2.5rem);
  --h2-line-height: 1.2;

  --h3-size: clamp(1.5rem, 0.83vw + 1.3338rem, 2rem);
  --h3-line-height: 1.3;

  --h4-size: clamp(1.25rem, 0.42vw + 1.1663rem, 1.5rem);
  --h4-line-height: 1.4;

  --h5-size: clamp(1rem, 0.42vw + 0.9163rem, 1.25rem);
  --h5-line-height: 1.5;

  --h6-size: clamp(1rem, 0.83vw + 0.8338rem, 1.5rem);
  --h6-line-height: 1.5;

  --main-border-radius: .25rem;
  --btn-padding-y: 6px;
  --btn-padding-x: 30px;
  --btn-border-radius: .25rem;
  --btn-primary-color: var(--brand-color-1);
  --btn-secondary-color: #9b0723;

  --z-index-accessibility: 1021;
  --z-index-sticky-apply: 1022;
  --header-height: 88px;
  --sticky-apply-height: 143px;
  --additional-sticky-apply-padding: 1rem;
  --bs-border-color: #9e9e9e;
  scroll-behavior: smooth;
}

.container {
    @media (min-width: 1600px) { max-width: 1500px; }
}

p a {
  text-decoration: underline;
  font-weight: bold;
}

.p-t-5 {
  --p-t: 5px;
}
.p-t-10 {
  --p-t: 10px;
}
.p-t-15 {
  --p-t: 15px;
}
.p-t-20 {
  --p-t: 20px;
}
.p-t-25 {
  --p-t: 25px;
}
.p-t-30 {
  --p-t: 30px;
}
.p-t-35 {
  --p-t: 35px;
}
.p-t-40 {
  --p-t: 40px;
}
.p-t-45 {
  --p-t: 45px;
}
.p-t-50 {
  --p-t: 50px;
}
.p-t-55 {
  --p-t: 55px;
}
.p-t-60 {
  --p-t: 60px;
}
.p-t-65 {
  --p-t: 65px;
}
.p-t-70 {
  --p-t: 70px;
}
.p-t-75 {
  --p-t: 75px;
}
.p-t-80 {
  --p-t: 80px;
}
.p-t-85 {
  --p-t: 85px;
}
.p-t-90 {
  --p-t: 90px;
}
.p-t-95 {
  --p-t: 95px;
}
.p-t-100 {
  --p-t: 100px;
}
.p-b-5 {
  --p-b: 5px;
}
.p-b-10 {
  --p-b: 10px;
}
.p-b-15 {
  --p-b: 15px;
}
.p-b-20 {
  --p-b: 20px;
}
.p-b-25 {
  --p-b: 25px;
}
.p-b-30 {
  --p-b: 30px;
}
.p-b-35 {
  --p-b: 35px;
}
.p-b-40 {
  --p-b: 40px;
}
.p-b-45 {
  --p-b: 45px;
}
.p-b-50 {
  --p-b: 50px;
}
.p-b-55 {
  --p-b: 55px;
}
.p-b-60 {
  --p-b: 60px;
}
.p-b-65 {
  --p-b: 65px;
}
.p-b-70 {
  --p-b: 70px;
}
.p-b-75 {
  --p-b: 75px;
}
.p-b-80 {
  --p-b: 80px;
}
.p-b-85 {
  --p-b: 85px;
}
.p-b-90 {
  --p-b: 90px;
}
.p-b-95 {
  --p-b: 95px;
}
.p-b-100 {
  --p-b: 100px;
}

.row-reverse .page-row-border {
  flex-direction: row-reverse;
}

header:not(.chatbot-header) {
    padding-inline: .5rem;
    .navbar {
        --bs-navbar-nav-link-padding-x: .5rem;
        @media (min-width: 1400px) {
            --bs-navbar-nav-link-padding-x: 1rem;
        }
    }
  
    a.nav-link {
        color: #000;
        font-weight: bold;
        text-underline-offset: 2px;
        text-decoration-thickness: 2px;
        line-height: 1.2;
        padding: .5rem;
        @media (min-width: 1200px) {
            text-align: center;
            padding: .5rem;
            padding-inline-start: .5rem;
            padding-inline-end: .5rem;
        }
      
        @media (min-width: 1400px) {
            padding: 1rem;
        }

        &:hover,
        &:focus,
        &:active,
        &:visited {
            color: #000;
        }

        &:has(.icon) {
            display: flex;
            gap: 0.5rem;
            @media (min-width: 1200px) {
                gap: 0;
                .text {
                    text-indent: -9999px;
                }
            }

            &.search-link {
                --fa: "\f002";
                .icon:before{
                  font-weight:700;
                }
            }

            @media (min-width: 1200px) {
                --display: inline;
                &.profile-link { --fa: "\f007"; }
                &.sign-in { --fa: "\f2f6"; }
                &.sign-out { --fa: "\f08b"; }
                &.my-account { --fa: "\f007"; }
                &.alerts-link { --fa: "\f0f3"; }
            }
            &.nav-refresh-link { --fa: "\f021"; --display: inline; }
            &.css-refresh-link { --fa: "\f1fc"; --display: inline; }
            &:hover {
                text-decoration: none;

                .text {
                    text-decoration: underline;
                    text-decoration-thickness: 2px;
                    text-underline-offset: 2px;
                }
            }

            .icon {
                display: var(--display, none);
                &:before {
                    font-family: var(--fa-pro-family, "Font Awesome 7 Free");
                    content: var(--fa, none);
                    font-weight: 400;
                }
            }
        }
    }
    .header-icons {
        display: flex;
        flex-wrap: wrap;
        .nav-link {
            width: 100%;
            @media (min-width: 1200px) {
                width: fit-content;
            }
        }
    }
}

.earcu .header-icons .profile-link {
    display: none !important;
}

@media (max-width: 1199.98px) { /* Match your navbar-expand breakpoint */
  /* 1. Reset Bootstrap's collapse overflow default */
  .navbar-collapse.collapsing,
  .navbar-collapse.show {
    position: fixed;
    top: var(--header-height, 0px); /* Height of your navbar header */
    left: 0;
    right: 0;
    height: calc(100vh - var(--header-height, 0px)) !important;
    background-color: #ffffff; /* Match your menu background */
    overflow-y: auto;
    
    max-height: 100vh;
    opacity: 1;
    
    /* Smooth CSS slide-down animation */
    transition: max-height 0.4s ease-in-out, opacity 0.4s ease-in-out !important;
  }

  /* 2. Closed state */
  .navbar-collapse:not(.show) {
    display: block !important; /* Keep in DOM for smooth transition */
    max-height: 0;
    opacity: 0;
    overflow: hidden;
  }
}

.table > :not(caption) > * > * {
    padding: 1rem .5rem;
    border-block-end: 1px solid #DEDEDE;
}

.table tr:hover a,
.table tr a:hover {
    text-decoration: underline;
    text-decoration-thickness: 2px;
    text-underline-offset: 3px;
}

/* ==========================================================================
   2. TYPOGRAPHY & FONTS
   ========================================================================== */

/* Intact Sans - Light (300) */
@font-face {
  font-family: 'Intact Sans';
  src: url('https://d36rd0l160k43h.cloudfront.net/e76a1ed0ac62666ed658c345efac3a3d/76a996a68e4f69658ca960f51875bffe/Intact_Sans-Light.woff2') format('woff2'),
       url('https://d36rd0l160k43h.cloudfront.net/e76a1ed0ac62666ed658c345efac3a3d/76a996a68e4f69658ca960f51875bffe/Intact_Sans-Light.ttf') format('truetype'),
       url('https://d36rd0l160k43h.cloudfront.net/e76a1ed0ac62666ed658c345efac3a3d/76a996a68e4f69658ca960f51875bffe/Intact_Sans-Light.otf') format('opentype');
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}

/* Intact Sans - Regular (400) */
@font-face {
  font-family: 'Intact Sans';
  src: url('https://d36rd0l160k43h.cloudfront.net/e76a1ed0ac62666ed658c345efac3a3d/76a996a68e4f69658ca960f51875bffe/Intact_Sans-Regular.woff2') format('woff2'),
       url('https://d36rd0l160k43h.cloudfront.net/e76a1ed0ac62666ed658c345efac3a3d/76a996a68e4f69658ca960f51875bffe/Intact_Sans-Regular.ttf') format('truetype'),
       url('https://d36rd0l160k43h.cloudfront.net/e76a1ed0ac62666ed658c345efac3a3d/76a996a68e4f69658ca960f51875bffe/Intact_Sans-Regular.otf') format('opentype');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

/* Intact Sans - Medium (500) */
@font-face {
  font-family: 'Intact Sans';
  src: url('https://d36rd0l160k43h.cloudfront.net/e76a1ed0ac62666ed658c345efac3a3d/76a996a68e4f69658ca960f51875bffe/Intact_Sans-Medium.woff2') format('woff2'),
       url('https://d36rd0l160k43h.cloudfront.net/e76a1ed0ac62666ed658c345efac3a3d/76a996a68e4f69658ca960f51875bffe/Intact_Sans-Medium.ttf') format('truetype'),
       url('https://d36rd0l160k43h.cloudfront.net/e76a1ed0ac62666ed658c345efac3a3d/76a996a68e4f69658ca960f51875bffe/Intact_Sans-Medium.otf') format('opentype');
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

/* Intact Sans - Bold (700) */
@font-face {
  font-family: 'Intact Sans';
  src: url('https://d36rd0l160k43h.cloudfront.net/e76a1ed0ac62666ed658c345efac3a3d/76a996a68e4f69658ca960f51875bffe/Intact_Sans-Bold.woff2') format('woff2'),
       url('https://d36rd0l160k43h.cloudfront.net/e76a1ed0ac62666ed658c345efac3a3d/76a996a68e4f69658ca960f51875bffe/Intact_Sans-Bold.ttf') format('truetype'),
       url('https://d36rd0l160k43h.cloudfront.net/e76a1ed0ac62666ed658c345efac3a3d/76a996a68e4f69658ca960f51875bffe/Intact_Sans-Bold.otf') format('opentype');
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

/* Intact Sans - ExtraBold (800) */
@font-face {
  font-family: 'Intact Sans';
  src: url('https://d36rd0l160k43h.cloudfront.net/e76a1ed0ac62666ed658c345efac3a3d/76a996a68e4f69658ca960f51875bffe/Intact_Sans-ExtraBold.woff2') format('woff2'),
       url('https://d36rd0l160k43h.cloudfront.net/e76a1ed0ac62666ed658c345efac3a3d/76a996a68e4f69658ca960f51875bffe/Intact_Sans-ExtraBold.ttf') format('truetype'),
       url('https://d36rd0l160k43h.cloudfront.net/e76a1ed0ac62666ed658c345efac3a3d/76a996a68e4f69658ca960f51875bffe/Intact_Sans-ExtraBold.otf') format('opentype');
  font-weight: 800;
  font-style: normal;
  font-display: swap;
}

/* Intact Serif - Regular (400) */
@font-face {
  font-family: 'Intact Serif';
  src: url('https://d36rd0l160k43h.cloudfront.net/e76a1ed0ac62666ed658c345efac3a3d/76a996a68e4f69658ca960f51875bffe/Intact_Serif-Regular.woff2') format('woff2'),
       url('https://d36rd0l160k43h.cloudfront.net/e76a1ed0ac62666ed658c345efac3a3d/76a996a68e4f69658ca960f51875bffe/Intact_Serif-Regular.ttf') format('truetype'),
       url('https://d36rd0l160k43h.cloudfront.net/e76a1ed0ac62666ed658c345efac3a3d/76a996a68e4f69658ca960f51875bffe/Intact_Serif-Regular.otf') format('opentype');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

/* Intact Serif - Medium (500) */
@font-face {
  font-family: 'Intact Serif';
  src: url('https://d36rd0l160k43h.cloudfront.net/e76a1ed0ac62666ed658c345efac3a3d/76a996a68e4f69658ca960f51875bffe/Intact_Serif-Medium.woff2') format('woff2'),
       url('https://d36rd0l160k43h.cloudfront.net/e76a1ed0ac62666ed658c345efac3a3d/76a996a68e4f69658ca960f51875bffe/Intact_Serif-Medium.ttf') format('truetype'),
       url('https://d36rd0l160k43h.cloudfront.net/e76a1ed0ac62666ed658c345efac3a3d/76a996a68e4f69658ca960f51875bffe/Intact_Serif-Medium.otf') format('opentype');
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

/* Intact Serif - Bold (700) */
@font-face {
  font-family: 'Intact Serif';
  src: url('https://d36rd0l160k43h.cloudfront.net/e76a1ed0ac62666ed658c345efac3a3d/76a996a68e4f69658ca960f51875bffe/Intact_Serif-Bold.woff2') format('woff2'),
       url('https://d36rd0l160k43h.cloudfront.net/e76a1ed0ac62666ed658c345efac3a3d/76a996a68e4f69658ca960f51875bffe/Intact_Serif-Bold.ttf') format('truetype'),
       url('https://d36rd0l160k43h.cloudfront.net/e76a1ed0ac62666ed658c345efac3a3d/76a996a68e4f69658ca960f51875bffe/Intact_Serif-Bold.otf') format('opentype');
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

/* ==========================================================================
   3. BASE STYLES
   ========================================================================== */

body, p, li {
  font-family: 'Intact Sans', sans-serif;  
  font-size: 16px;
  line-height: 1.5;
  font-weight: 400;
  letter-spacing: normal;
}

h1, h2, h3, h4, h5, h6 {
  font-family: 'Intact Serif', serif;
  font-weight: 500;
  letter-spacing: normal;
}

a, a:visited {
  color: var(--brand-color-4);
}

h1 {
	font-size: var(--h1-size);
	line-height: var(--h1-line-height);
}

h2 {
	font-size: var(--h2-size);
	line-height: var(--h2-line-height);
}

h3 {
	font-size: var(--h3-size);
	line-height: var(--h3-line-height);
}

h4 {
	font-size: var(--h4-size);
	line-height: var(--h4-line-height);
}

h5 {
	font-size: var(--h5-size);
	line-height: var(--h5-line-height);
}

h6 {
	font-size: var(--h6-size);
	line-height: var(--h6-line-height);
}

blockquote {
  border-left: 4px solid #f5f5f5;
  padding: 15px;
  margin: 15px;
}

/* ==========================================================================
   4. HEADER & NAVIGATION
   ========================================================================== */
.site-header {
  background-color: var(--brand-color-5);
}

.header-logo {
  height: 58px;
  width: auto;
  display: block;
}

.navbar {
  --bs-navbar-nav-link-padding-x: 1rem;
}

.navbar-brand {
  padding-top: 0;
  padding-bottom: 0;
  margin-right: 0;
}

.navbar-nav li {
  margin-bottom: 0;
}

.navbar-toggler {
  border: 2px solid var(--brand-color-4);
}

.site-header .nav-link {
  color: var(--brand-color-4);
  font-size: 16px;
  font-weight: 800; 
  transition: color 0.2s ease-in-out;
}

.site-header .nav-link:hover,
.site-header .nav-link:focus {
  color: var(--brand-color-1);
}

.header-icons a {
  transition: color 0.2s ease-in-out;
}

.header-icons a:hover {
  color: var(--brand-color-1) !important;
}

.user-icon,
.search-icon {
  padding:16px;
}

@media (max-width: 1199.98px) {
  .navbar {
    padding-block-end: 20px;
  }
}

/* ==========================================================================
   5. BANNER / HERO
   ========================================================================== */
.bg-image1 {
  /*background: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), 
              url('https://d36rd0l160k43h.cloudfront.net/e76a1ed0ac62666ed658c345efac3a3d/76a996a68e4f69658ca960f51875bffe/001-251022-162322_LaunchEvent-Oct25.jpg') no-repeat center center / cover;*/
  background: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), 
              url('https://d8yy0r0qfxgnb.cloudfront.net/public/uploads/e731c5be931c9671ba1cbc020c81ab57/images/files/5f9b6661adcf93eb191029e3d07e8f43/large/home.jpg?1792429760') no-repeat center center / cover;
}

.bg-image1 h1,
.bg-image1 p {
  color: var(--brand-color-5);
}

.bg-image1 p {
  font-size: 24px;
  line-height: 32px;
}

.page-row.banner--solid {
  background-color: var(--intact-soothing-sand);
  h1, h2, h3, h4, h5, h6 {
    color: #000;
  }
}

.page-row .container-fluid .block-image {
    margin-right: calc(var(--bs-gutter-x) * -.5);
	margin-left: calc(var(--bs-gutter-x) * -.5);
}

.short-cover .block-image-cover {
  height: 150px;
}

@media (min-width: 768px) {
  .p-t-100.bg-image1 {
    padding-top: 300px !important;
  }

  .short-cover .block-image-cover {
    height: 300px;
  }
}

/* ==========================================================================
   6. FORMS & INPUT GROUPS
   ========================================================================== */
.input-group input,
.form-control {
  border-radius: 0.25rem;  
}

.input-group input, 
.input-group-btn button {
  height: auto;
}

.input-group:not(.has-validation) > .dropdown-toggle:nth-last-child(n+3), 
.input-group:not(.has-validation) > .form-floating:not(:last-child) > .form-control,
.input-group:not(.has-validation) > .form-floating:not(:last-child) > .form-select, 
.input-group:not(.has-validation) > :not(:last-child):not(.dropdown-toggle):not(.dropdown-menu):not(.form-floating) {
  border-top-right-radius: 0.25rem;
  border-bottom-right-radius: 0.25rem;
}

@media (max-width: 767px) {
  .job-search-control .input-group {
    display: flex;
    flex-direction: column;
    width: 100%;
  }

  .job-search-control .easy-autocomplete {
    width: 100% !important;
    margin-right: 0 !important;
  }

  .job-search-control .easy-autocomplete input {
    width: 100% !important;
  }

  .job-search-control .input-group-btn,
  .job-search-control .near-me-control {
    display: block;
    width: 100%;
    margin-left: 0;
  }

  .job-search-control .btn {
    width: 100%;
    display: block;
  }

  .job-search-control .input-group-btn:last-child .btn {
    margin-bottom: 0;
  }
}

.input-group>:not(:first-child):not(.dropdown-menu):not(.valid-tooltip):not(.valid-feedback):not(.invalid-tooltip):not(.invalid-feedback) {
    margin-inline-start: 0;
}

/* ==========================================================================
   7. BUTTONS
   ========================================================================== */
.btn,
a.btn,
a.button,
.block-job-description .job-description-controls .btn {
  border-radius: 0.25rem;
  text-transform: none;
  font-size: 1rem;
  line-height: 1.5;
  font-weight: 700;  
  letter-spacing: normal;
  padding: .75rem 1rem !important;
  font-family: "Intact Sans", sans-serif;
  text-decoration: none;
  text-underline-offset: auto;
  text-underline-position: from-font;
  text-decoration-skip-ink: auto;
  text-decoration-thickness: auto;
  &:hover {
    text-decoration-line: underline;
    transition: background .3s ease-out, color .3s ease-out, text-decoration-line .3s ease-out;
  }

  &:active {
    text-decoration-line: underline;
  }
}

/* Button Variants */
a.button.button1,
.btn-primary {
  background: #df0030;
  color: #FFF;
  border: 1px solid #df0030;
  &:hover {
    color: #fff;
	background: #9b0723;
    border: 1px solid #9b0723;
  }

  &:active {
    color: #fff;
	background: #9b0723;
	border-radius: 6px;
    border: 1px solid #9b0723;
    outline: 2px solid #9b0723;
    outline-offset: 2px;
    text-decoration-line: underline;
    transition: background .3s linear, color .3s linear, text-decoration-line .3s linear;
  }

  &:focus-visible {
    color: #fff;
	background: #df0030;
	border-radius: 6px;
    border: 1px solid #df0030;
	outline-offset: 2px;
	outline: 2px solid #df0030;
	text-decoration-line: underline;
	transition: background .3s ease-out, color .3s ease-out, text-decoration-line .3s ease-out;
    box-shadow: none;
  }
}

.modal-footer:has(.start-cookie-actions, .end-cookie-actions) {
  .btn-success,
  .btn-info {
    border: 2px solid var(--btn-primary-color);
    background: var(--btn-primary-color);
    color: var(--brand-color-5)!important; 
  
    &:hover,
    &:focus
    &:active{
      border: 2px solid var(--btn-secondary-color);
      background: var(--btn-secondary-color);
    }
  }
}

.btn-info:hover {
  border: 2px solid var(--btn-secondary-color);
  background: var(--btn-secondary-color);  
  color: #fff;
}

.btn-info,
.btn-warning, 
.btn-danger,
a.button.button2,
button.candidate-favourite,
a.btn-primary.view-favourites,
.btn.btn-success.near-me-btn {
  background: #fff;
  color: #000;
  border: 1px solid #000000;
  &:hover {
    color: #fff;
    background: #000;
    text-decoration-line: underline;
    border: 1px solid #000000;
    transition: background .3s ease-out, color .3s ease-out, text-decoration-line .3s ease-out;
  }

  &:active {
    color: #fff;
	background: #000;
	border-radius: 6px;
	outline-offset: 2px;
	outline: 2px solid #000000;
	text-decoration-line: underline;
    border: 1px solid #000000;
	transition: background .3s linear, color .3s linear, text-decoration-line .3s linear;
  }

  &:focus-visible {
    color: #000;
	background: #fff;
	border-radius: 6px;
	outline-offset: 2px;
	outline: 2px solid #000000;
    border: 1px solid #000000;
	text-decoration-line: underline;
	transition: background .3s ease-out, color .3s ease-out, text-decoration-line .3s ease-out;
  }
}

.bg-image1 .btn.btn-success.near-me-btn {
    border-color: #FFF;
    &:hover,
    &:active,
    &:focus-visible {
        border-color: #000;
        outline-color: #FFF;
    }
}

/* ==========================================================================
   8. CARDS & LAYOUTS
   ========================================================================== */
.center-align .col-md-6 {
  align-self: center;
}

/* Job Cards */
.job-list-cards .jobs-list {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
  margin-left: -15px;
  margin-top: -15px;
  align-items: stretch;
}

.job-list-cards .job {
  background: var(--brand-color-2);
  box-shadow: none;
  border: 1px solid #c1bcbc;
  padding: 30px;
  width: calc(33.333% - 30px);
  margin-left: 15px;
  margin-top: 15px;
  margin-bottom: 0 !important;
  display: flex;
  flex-direction: column;
  box-sizing: border-box;
  border-radius: 4px;
}

.job-list-cards .job .job-title {
  margin-bottom: 10px;
  color: #000a12 !important;
  font-weight: 700;
}

.job-list-cards .job-summary {
  padding-top: 12px;
  color: #444444 !important;
}

.block-jobs .job h3.job-title {
  margin-top: 0;
  margin-bottom: 25px;
}

/*
.job-location, 
.job-department {
  font-weight: 700;
  display: block;
}
*/

.block-jobs {
	.job {
		span.job-field {
			font-weight: bold;
            display: flex;
            gap: .25rem;
            width: 100%;
            &:before {
                font-family: "Font Awesome 7 Free";
                content: var(--fa, none);
                min-width: 1.5rem;
                display: flex;
                justify-content: center;
                width: fit-content;
            }
		}

        .job-requisition-identifier { --fa: "\f56c"; }
        .job-location { --fa: "\f3c5"; }
        .job-department { --fa: "\f0b1"; }
	}
}

.job-component-dropdown-field-1 {
    .fa-asterisk {
        --fa: "\f0b1";
    }
}

@media (max-width: 768px) {
  .job-list-cards .job {
    width: calc(50% - 30px);
  }

  .card {
    margin-bottom: 30px;
  }
}

@media (max-width: 480px) {
  .job-list-cards .job {
    width: calc(100% - 30px);
  }
}

/* Department Cards */
.dept-cards {
  .row {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(100%, 1fr));
    row-gap: 1.5rem;
    @media (min-width: 768px) { grid-template-columns: repeat(auto-fill, minmax(50%, 1fr)); }
    @media (min-width: 1200px) { grid-template-columns: repeat(auto-fill, minmax(25%, 1fr)); }
    [class*="col-"] {
      width: 100%;
      row-gap: 0;
    }

    .block-wrapper.card {
      margin-bottom: 0;
    }
    
    [class*="col-"],
    .block-wrapper,
    .block-html,
    .page-block {
      display: grid;
      grid-template-rows: subgrid;
      grid-row: span 5; /* Spans Logo, Heading, Field List */
    }
  }
  
  [class*="col-"] {
    display: flex;
    align-items: stretch;
  }
  
  .block-wrapper {
    position: relative;
    a {
      display: inline-block;
      text-decoration: none;
      &:before {
        content: "";
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
      }

      span {
          position: relative;
          display: flex;
          padding-inline-end: 1rem;
          align-items: center;
          &:after {
            font-family: "Font Awesome 7 Free";
            content: "\f054";
            font-weight: bold;
            margin-inline-start: .5rem;
            font-size: .75rem;
            position: absolute;
            right: 0;
            margin-top: .25rem;
          }
      }

      &:hover {
        text-decoration: underline;
      }
    }
  }
}

.dept-cards a.button.button1, 
.dept-cards a.button.button1:hover, 
.dept-cards a.button.button1:focus, 
.dept-cards a.button.button1:visited, 
.dept-cards a.button.button1:active,
.dept-cards a.button.button2, 
.dept-cards a.button.button2:hover, 
.dept-cards a.button.button2:focus, 
.dept-cards a.button.button2:visited, 
.dept-cards a.button.button2:active,
.dept-cards p:nth-child(2) {
  border: none;
  background: #d9fffb;
  color: #263d3c !important;
  border-radius: 25px;
  font-size: 10px;
  padding: 4px 15px !important;
  line-height: 24px;
  width: fit-content;
}

.dept-cards p,
.dept-cards h3 {
  margin-left: 15px;
  margin-right: 15px;
}

.dept-cards h3,
.dept-cards a {
  font-weight: 700;
}

.dept-cards h3 {
  font-size: 20px;
  line-height: 32px;
}

.dept-cards img {
  height: 200px;
  object-fit: cover;
}

/* Carousel */

.carousel h2 {
  font-size: 16px;
  line-height: 24px;
  font-family: 'Intact Sans', sans-serif;
  font-weight: bold;
}

.carousel-indicators [data-bs-target] {
  background-color: #df0030!important;
}

/* Custom Previous (Back) Icon */
.carousel-block .carousel-control-prev-icon {
  background-image: url("https://d8yy0r0qfxgnb.cloudfront.net/public/uploads/e731c5be931c9671ba1cbc020c81ab57/images/files/ae67c70e796b8c81384279a6f174034c/medium/icon-back.png?1786618392");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  /* Optional: Adjust size if needed (default Bootstrap is 2rem) */
  width: 32px;
  height: 32px;
  opacity: 1;
}

/* Custom Next Icon */
.carousel-block .carousel-control-next-icon {
  background-image: url("https://d8yy0r0qfxgnb.cloudfront.net/public/uploads/e731c5be931c9671ba1cbc020c81ab57/images/files/ed3194dc5dd2153508b55c9c7f793d8a/medium/icon-next.png?1786618398");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  /* Optional: Adjust size if needed */
  width: 32px;
  height: 32px;
  opacity: 1;
}

.carousel-control-next, .carousel-control-prev {
  opacity: 1;  
}

.carousel-indicators {
    bottom: -10px;
}


@media (max-width: 768px) {
    .carousel-control-next, .carousel-control-prev {
        display: none;
    }
}

@media (min-width: 767px) {
    .clinch-video-player.video-js {
        height: 300px;
    }

  .carousel-item-block-image {
    height: 300px;
    object-fit: cover;
    width: 100%;
  }

  .carousel-inner {
    padding: 0 100px;
  }
  
  .carousel-control-prev {
    left: -50px;
  }
  
  .carousel-control-next {
    right: -50px;
  }
}

/* People Carousel using carousel block type */

/* 1. Prevent card box-shadow from being clipped by carousel overflow */
.employee-carousel .carousel-inner {
  padding-top: 15px !important;
  padding-bottom: 25px !important;
}

/* 2. Style blocks as Cards */
.employee-carousel .carousel-item-block {
  background-color: #ffffff;
  border-radius: 8px;
  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1);
  overflow: hidden; /* Clips top image/video to card's top rounded corners */
  display: flex;
  flex-direction: column;
}

/* 3. Ensure top media stays flush to the card edges */
.employee-carousel .carousel-item-block-image,
.employee-carousel .carousel-item-block-video {
  width: 100%;
  display: block;
  margin: 0;
}

/* 4. Reset caption overlay to a padded section inside the card */
.employee-carousel .carousel-item-block .carousel-caption {
  position: static; /* Removes default Bootstrap absolute overlay positioning */
  padding: 20px; /* Padding for text section */
  width: 100%;
  text-align: left;
  color: #333333;
  flex-grow: 1;
}

/* 5. Mobile Spacing (stacked view) */
@media (max-width: 767px) {
  .employee-carousel .carousel-item-block {
    margin-bottom: 20px;
  }
  .employee-carousel .carousel-item-block:last-child {
    margin-bottom: 0;
  }
}

/* 6. Desktop Spacing (grid view) */
@media (min-width: 768px) {
  .employee-carousel .carousel-item .row {
    display: flex;
    gap: 20px; /* Space between cards */
    margin-left: 0;
    margin-right: 0;
  }

  .employee-carousel .carousel-item-block {
    /* Calculates 3 equal columns with 20px gap accounted for */
    flex: 0 0 calc((100% - 40px) / 3);
    max-width: calc((100% - 40px) / 3);
    padding-left: 0;
    padding-right: 0;
  }

  .employee-carousel .carousel-indicators {
    bottom: -22px;
  }
}
    

/* Tile Blocks */

@media (min-width: 768px) {
  .block-tile-layout img.card-img-top {
      height: 300px!important;
  }
}

/* 5 Col */

.page-body.page.not-editing .five-col .page-row-border > div:nth-child(6) {
  display: none !important;
}

@media (min-width: 768px) {
.page-body.page.not-editing .five-col .page-row-border > div:not(:nth-child(6)) {
    flex: 0 0 20% !important;
    max-width: 20% !important;
    width: 20% !important;
  }
}


/* large header */

.large-header h2 {
  font-family: 'Intact Sans', sans-serif;  
}

@media (min-width: 768px) {
  .large-header h2 {
    font-size: 66px;
    font-weight: bold;
  }
}

/* White box on Image  */


.image-block1 .block-image-text {
    background-color: #fff;
    padding: 30px 50px;
}

.image-block1 .block-image-text * {
  color: #000;
}

.image-block1 .block-image-cover {
  position: relative !important;
  overflow: hidden;
}

.image-block1 .block-image-cover::before {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  width: 70%; /* Expanded width further across the row */
  height: 100%;
  /* Fully opaque red (alpha: 1) on the far right, holds strong for 30%, then fades out */
  background: linear-gradient(to left, rgba(223, 0, 48, 1) 0%, rgba(223, 0, 48, 0.85) 30%, transparent 100%);
  z-index: 1;
  pointer-events: none;
}

.image-block1 .block-image-text {
  position: relative !important;
  z-index: 2;
}

@media (max-width: 767px) {
  /* 1. Make cover container fit content & set height for top image */
  .image-block1 .block-image-cover {
    height: auto !important;
    padding-top: 220px; /* Adjusts visible height of the image on top */
    background-position: top center !important;
    background-size: 405px;
  }

  /* 2. Stack text card below full width */
  .image-block1 .block-image-text {
    width: 100% !important;
    float: none !important;
    position: static !important;
    transform: none !important;
    padding: 25px 20px !important;
  }

  /* 3. Reorient gradient to cover top image area on mobile */
  .image-block1 .block-image-cover::before {
    width: 100% !important;
    height: 220px !important; /* Matches top image height */
    background: linear-gradient(to bottom, transparent 20%, rgba(223, 0, 48, 0.85) 100%) !important;
  }
}

@media (min-width: 768px) {
  .image-block1 .block-image-text {
      position: relative;
      top: 50%;
      width: 50%;
      float: right;
      padding: 30px 50px;
  }
}

/* ==========================================================================
   9. SEARCH PAGE
   ========================================================================== */

.badge {
  /* background-color: #df0030; */
}

.job-search-filter .badge {
    background-color: var(--intact-sage-green);
    color: #FFF;
    min-width: 2rem;
}

.active-filter.bg-primary {
    background-color: var(--intact-aqua) !important;
    color: #000;
    padding: .5rem;
    button {
        background-color: var(--intact-aqua) !important;
        color: #000;
    }
}

.near-me-control {
  margin-left: 15px;
}

input.form-control {
  border-radius: 0.25rem;
}

.job-search-results-title a {
  font-weight: bold;
}

.job-search-results {
    input.form-control {
        border-radius: 0.25rem;
    }
}

.job-search-control .form-control {
    display: flex;
    align-items: stretch;
    input {
        margin-inline-end: 0;
    }
}

.job-search-control .input-group:has(> .easy-autocomplete, > input.form-control) {
    display: grid;
    grid-template-columns: 100%;
    gap: .5rem;
    @media (min-width: 992px) {
        grid-template-columns: 60% 20% 20%;
    }

    > .easy-autocomplete,
    > input.form-control,
    > .input-group-btn {
        width: 100% !important;
        button, span {
            width: 100%;
        }
    }
}

.job-search-control {
	.near-me-control {
		margin-inline-start: 0;
	}
}

@media (max-width: 767.98px) {
  .input-group>.form-control, 
  .input-group>.form-floating, 
  .input-group>.form-select {
    width: 100%;
  }

  .job-search-results {
    input.form-control {
        margin-block-start: .5rem;
    }
  }
}

.block-job-search-results {
	.job-search-results {
        .row.job-search-results-sub-search-actions {
            flex-wrap: wrap;
        }
    }
}

.col-9.job-search-results-active-filters {
    width: 100%;
    @media (min-width: 992px) {
        width: 75%;
    }
}

.col-3.job-search-results-dropdown {
    width: 100%;
    @media (min-width: 992px) {
        width: 25%;
    }
}

/* ==========================================================================
   10. JOB PAGE
   ========================================================================== */

.bg-65 .block-image-cover {
  background-position: 50% 65%!important;
}

.bg-29 .block-image-cover {
  background-position: 50% 29%!important;
}

.sidebar {
  background-color: var(--brand-color-2);
  padding: 35px 45px;
  margin-bottom: 30px;
}

.selectize-control.multi .selectize-input > div {
  background-color: var(--intact-aqua);
  color: #000;
  border-radius: .25rem;
}

.selectize-control:has(.selectize-input.items) {
  &:after {
    font-family: "Font Awesome 7 Free";
    content: var(--fa, "\f078");
    font-weight: 700;
    position: absolute;
    right: .5rem;
    top: calc(50% - 4px);
    transform: translateY(-50%);
    z-index: 1;
    pointer-events: none;
  }

  &:has(.dropdown-active) {
    --fa: "\f077";
  }
}

body:has(.block-job-description) {
  .sidebar {
    border-radius: .25rem;
  }
  
  .google-map {
    max-height: 300px;
    border-radius: .25rem;
    overflow: hidden;
  }
}

.component--benefits {
    p:has(img) {
        display: flex;
        align-items: center;
        gap: 1rem;
        img {
            min-width: 40px;
        }
    }

    ul {
        list-style: none;
        padding: 0;
        margin: 0;
        li {
            padding: 0;
            margin: 0;
            p {
                display: flex;
                align-items: start;
                gap: .5rem;
                i {
                    font-size: 1.5rem;
                    line-height: 2.25rem;
                    font-weight: 400;
                    min-width: 2rem;
                    display: flex;
                    justify-content: center;
                    &.fa-square-sterling {
                        font-weight: 700;
                    }
                }

                span {
                    font-size: 1.25rem;
                    line-height: 2.25rem;
                }
            }
        }
    }
}

.block-job-description {
    .job-component-string-field-14,
    .job-component-string-field-15,
    .job-component-dropdown-field-2 {
        display: none;
    }

    .job-component-icon-and-text span:before {
        content: var(--content, none);
        font-weight: bold;
    }

    .job-component-requisition-identifier {
        --content: "Job reference: ";
        i { --fa: "\f56c"; }
    }
    .job-component-location {
        --content: "Location: ";
        i { --fa: "\f3c5"; }
    }
    .job-component-department {
        --content: "Business area: ";
        i {
            --fa: "\f0b1";
        }
    }
}

.component--meet-the-recruiter {
    &:where(.not-editing .component--meet-the-recruiter):not(:has(.img-wrapper)) {
        display: none;
    }
  
    .page-block {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        .img-wrapper {
            width: 200px;
            aspect-ratio: 1 / 1;
            overflow: hidden;
            margin-bottom: 1rem;
            display: flex;
            justify-content: center;
            align-items: center;
            &:has(img) {
                border-radius: 400px;
            }
          
            .fa {
                font-size: 8rem;
            }

            img {
                object-fit: cover;
                width: 100%;
            }

            &:has(.fa) {
                width: 150px;
            }
        }

        h2, h3, h4, p {
            text-align: center;
            width: 100%;
        }

        .recruiter-name {
            font-size: clamp(1.25rem, 0.45vw + 1.16rem, 1.5rem);
            font-weight: bold;
        }

        .recruiter-job-title {
            font-size: clamp(1rem, 0.45vw + 0.91rem, 1.25rem);
        }
    }
}

.form-template-field-job-alert {
    .alert-preferences {
        font-size: var(--h4-size);
        line-height: var(--h4-line-height);
        font-weight: bold;
        margin-block-end: .5rem;
    }
}

.sidebar h3 {
  text-align: center;
}

.benefits strong {
  vertical-align: middle;
}

.benefits p {
  margin: 17px 0;
}

.margin-bottom-30 {
  margin-bottom: 30px;  
}

.social-sharing-block .page-block {
    display: flex;
    justify-content: center;
    align-items: center;
}

.social-sharing-block button {
    height: 27px !important;
    display: flex !important;
    align-items: center;
    justify-content: center;
    padding: 0.2rem 0.8rem 0 !important;
    border: none;
    background-color: #f7f2ea;
}

.social-sharing-block .IN-widget {
  margin-right: 1.5rem !important;
}

.social-sharing-block .twitter-share-button,
.social-sharing-block .IN-widget {
    margin-bottom: 0.5rem !important;
}

#fb-share-button {
background: #3b5998;
    border-radius: 3px;
    font-weight: 600;
    padding: 5px 8px;
    display: inline-block;
    position: static;
    margin: -13px 0 0 10px;
}

#fb-share-button:hover {
    cursor: pointer;
    background: #213A6F
}

#fb-share-button svg {
    width: 18px;
    fill: white;
    vertical-align: middle;
    border-radius: 2px
}

#fb-share-button span {
    vertical-align: middle;
    color: white;
    font-size: 14px;
    padding: 0 3px
}

.social-sharing-block .page-block {
    display: flex;
    justify-content: center;
    align-items: center;
}

@media (max-width: 768px) {
  .sidebar {
      padding: 35px 15px;
  }
}

/* ==========================================================================
   11. FOOTER
   ========================================================================== */
footer p {
  color: var(--brand-color-5);
}

footer a {
  color: var(--brand-color-5) !important;
  font-weight: 700; 
  text-decoration: underline;
}

.footer-top {
  background-color: var(--brand-color-3);
  color: var(--brand-color-5);
}

.footer-bottom {
  background-color: var(--brand-color-4);
  border-top: 1px solid rgba(255, 255, 255, 0.1);
}

.footer-logo-img {
  height: 60px;
  width: auto;
  display: block;
  filter: brightness(0) invert(1);
}

.social-links a {
  color: var(--brand-color-5);
  font-size: 1.1rem;
  transition: color 0.2s ease-in-out;
}

.social-links a:hover {
  color: var(--brand-color-1);
}

.footer-heading {
  font-size: 20px;
}

.footer-links a {
  color: var(--brand-color-5);
  text-decoration: none;
  line-height: 2;
  transition: color 0.2s ease-in-out;
}

.footer-links a:hover {
  color: var(--brand-color-1);
  text-decoration: underline;
}

.text-muted-custom {
  color: #a0a0a0;
  font-size: 0.725rem;
  line-height: 1.5;
}

.footer-bottom a {
  transition: color 0.2s ease-in-out;
  font-weight: 800;
  text-decoration: underline;
}

.footer-bottom a:hover {
  color: var(--brand-color-1) !important;
}

/* Sticky search button */

.sticky-search-btn {
  position: fixed;
  top: 60%;
  right: 0;
  z-index: 9999;
  writing-mode: vertical-rl;
  transform: translateY(-50%) rotate(180deg);
  background-color: #df0030;
  color: #ffffff!important;
  text-decoration: none;
  font-weight: bold;
  font-size: 16px;
  letter-spacing: 1px;
  padding: 20px 12px;
  border-radius: 0 5px 5px 0;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.3);
  transition: background-color 0.3s ease, padding 0.3s ease;
}

/* Hover Effect */
.sticky-search-btn:hover {
  padding-bottom: 30px; /* Slight expansion effect when hovered */
  color: #ffffff;
  text-decoration: none;
}

/* #region Accessibility */
	#pojo-a11y-toolbar.pojo-a11y-toolbar-right {
		z-index: var(--z-index-accessibility);
	}

	.pojo-a11y-toolbar-toggle,
	.pojo-a11y-toolbar-overlay {
		background-color: #FFF;
	}

	body.pojo-a11y-grayscale {
		filter: none;
		-webkit-filter: none;
		-moz-filter: none;
		-ms-filter: none;
		-o-filter: none;
	}

	body.pojo-a11y-grayscale header,
	body.pojo-a11y-grayscale main,
	body.pojo-a11y-grayscale footer,
	body.pojo-a11y-grayscale #pojo-a11y-toolbar {
		-webkit-filter: grayscale(100%);
		-webkit-filter: grayscale(1);
		-moz-filter: grayscale(100%);
		-ms-filter: grayscale(100%);
		-o-filter: grayscale(100%);
		filter: grayscale(100%);
	}

	#pojo-a11y-toolbar {
      top: 30%;
	}
/* #endregion */

.max-width400 {
        max-width: 520px;
        margin: 0 auto;
    }

.block-call-to-action {
    form {
        max-width: 520px;
        margin: 0 auto;
    }
}

/* Placeholders */

.call-to-action-form {
    input:not([type='submit']), textarea, select {
        font-weight: 600;
    }
}

input::placeholder {
    color: #000000 !important;
    opacity: 1 !important;
}

input[type="text"]::placeholder,
input[type="search"]::placeholder,
textarea::placeholder {
    color: #000000 !important;
    opacity: 1 !important;
}

.benefits strong {
    display: flex;
    align-items: center;
    gap: 12px;
}


.job-search-filter-groups {
  background-color: #f7f2ea;
}

.block-job-search-results {
    & .job-search-results {
        .job-search-filter-groups {
            width: auto;
        }
    }
}

@media (min-width: 1400px) {
  .block-job-search-results {
      & .job-search-results {
          .job-search-filter-groups {
              margin-right: 30px;
          }
      }
  }
}

.block-job-search-results {
	.job-search-filter-groups {
        .list-unstyled {
            overflow-x: hidden;
        }
    }
}

/*
.block-job-search-results {
    .job-search-filter-groups {
        width: 100%;
        background-color: transparent;
        padding: 0;
        .search-filter {
            width: calc(100% - 1rem);
            margin: .5rem auto 0;
        }
      
        .list-unstyled {
            overflow-x: hidden;
        }
    
        section {
            display: flex;
            flex-wrap: wrap;
            gap: 0.5rem;
        }
        
        .job-search-filter {
            background-color: transparent;
            border: 2px solid var(--brand-color-1);
            padding: 0;
            border-radius: 0;
            overflow: hidden;
            margin-bottom: 0;
            width: 100%;
            h4, .h4 {
                font-size: 1.25rem;
                margin-bottom: 0;
                background-color: var(--brand-color-1);
                padding: 0.6rem 1rem;
                color: #FFF;
                cursor: pointer;
                margin-top: 0;
                font-weight: 600;
                position: relative;
                line-height: 1.5;
                &:after {
                    position: absolute;
                    right: 1rem;
                    top: 50%;
                    transform: translateY(-50%);
                    font-family: var(--fa-family, "Font Awesome 7 Free");
                    font-weight: 900;
                    line-height: 1;
                    margin-right: 1rem;
                    color: #FFF;
                    margin-right: 0;
                    content: "\f078";
                }
            }

            .job-search-list-items {
                overflow: auto;
                scrollbar-gutter: stable;
                display: flex;
                flex-wrap: wrap;
                gap: 0;
                padding: 0.5rem 0 0 0.5rem;
                margin-bottom: 0;
                max-height: 16.9rem;
                li {
                    display: flex;
                    flex-wrap: wrap;
                    flex: 0 0 100%;
                    width: 100%;
                    align-items: center;
                    margin: 0;
                    label {
                        font-size: 1rem;
                        padding: 0;
                        flex: 1;
                        display: flex;
                        justify-content: start;
                        justify-items: start;
                        text-overflow: clip;
                        white-space: normal;
                        max-width: 100%;
                        overflow: hidden;
                        .job-search-list-item-label {
                            width: 100%;
                            max-width: calc(100% - 3rem);
                            text-overflow: ellipsis;
                            white-space: nowrap;
                            overflow: hidden;
                        }
                    }
    
                    .badge {
                        font-size: 1.125rem;
                        padding: 0.5rem 1rem;
                        display: inline-block;
                        border-radius: 4px;
                        width: auto;
                        margin-left: auto;
                        color: #FFF;
                        float: none;
                        min-width: 53px;
                        background-color: var(--brand-color-1);
                        margin-top: 0.2rem;
                    }
                }
            }
    
            &:last-child {
                margin-bottom: 0;
            }
    
            &.filter-collapsed {
                h4, .h4 {
                    background-color: var(--brand-color-1);
                    &:after { content: "\f077"; }
                }
    
                .search-filter,
                .job-search-list-items li:not(:has(input:checked)) {
                    display: none;
                }
    
                &:not(:has(input:checked)) {
                    h4 {
                        margin-bottom: 0;
                    }
    
                    fieldset {
                        display: none;
                    }
                }
            }
        }
    }
}
*/

.row.pagination-container {
    --modern-blue-1: var(--brand-color-1);
    .table-counts {
        text-align: center;
    }

    .text-right:has(> nav) {
        display: flex;
        justify-content: center;
    }

    .pagination {
        --bs-pagination-color: var(--brand-color-1);
        --bs-pagination-hover-color: var(--brand-color-1);
        --bs-pagination-focus-color: var(--brand-color-1);
    }
}

.candidate-settings-panel {
    background-color: var(--brand-color-2);
    /* BugHerd #346 - hide "Request your data" */
    /* &.export {
        display: none;
    } */
}

.page-row.logo-123 {
    .col-md-4 {
        &:before {
            content: "";
            background-image: url("https://d36rd0l160k43h.cloudfront.net/e76a1ed0ac62666ed658c345efac3a3d/76a996a68e4f69658ca960f51875bffe/123_logo.png");
            background-repeat: no-repeat;
            background-size: auto 50px;
            min-height: 100px;
            width: 100%;
            display: block;
            background-position: center;
        }
    }
}

#job-alerts {
    scroll-margin-block-start: var(--header-height, 0);
}

.modal-footer:has(.start-cookie-actions, .end-cookie-actions) {
    display: flex;
    flex-wrap: wrap;
    gap: .5rem;
}

.end-cookie-actions {
    display: flex;
    gap: .5rem;
    flex-wrap: wrap;
}

.start-cookie-actions,
.end-cookie-actions {
    width: 100%;
    margin: 0;
    button {
        width: 100%;
    }
}

.end-cookie-actions {
    gap: .5rem;
    button {
        @media (min-width: 576px) {
            width: calc(50% - .25rem);
        }
    }
}

/*header, footer {*/
    a[target="_blank"]:has(span):not(.header-icons a) {
        position: relative;
        display: flex;
        align-items: center;
        gap: .25rem;
        &:after {
            font-family: var(--fa-pro-family, "Font Awesome 7 Free");;
            content: "\f35d";
            /* position: absolute;
            right: 0; */
            font-weight: 700;
            font-size: .75rem;
        }

        &:hover {
            text-decoration: none;
            span {
                text-decoration: 2px solid underline;
                text-underline-offset: 2px;
                text-decoration-thickness: 2px;
            }
        }
    }
/*}*/