/*   
Theme Name: MMDWC
Author: MATTIEU MOREAU DOMECQ WEB CONCEPTION
Author URI: http://www.mattieumoreaudomecq.com
*/

/* 
-------------------------------------------------------------------------------*/

html,
body,
body div,
span,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
abbr,
address,
cite,
code,
del,
dfn,
em,
img,
ins,
kbd,
q,
samp,
small,
strong,
sub,
sup,
var,
b,
i,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
article,
aside,
figure,
footer,
header,
hgroup,
menu,
nav,
section,
time,
mark,
audio,
video {
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
  font-size: 100%;
  vertical-align: baseline;
  background: transparent;
}

/*=============================================
========== CSS            
=============================================*/

html,
body {
  width: 100%;
  height: 100%;
  padding: 0;
  margin: 0;
}

html {
  font-size: 15px;
  line-height: 30px;
}

body.loading {
  opacity: 0;
}

body {
  font-family: 'Poppins', sans-serif;
  color: var(--black);
  transition: background-color 0.5s ease-out, color 0.5s ease-out;
}

#wrapper {
  width: 100%;
  height: 100%;
}

.container-fluid {
  padding-right: 6rem;
  padding-left: 6rem;
}

* {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

* {
  -webkit-overflow-scrolling: touch;
}

* {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.link-absolute {
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  z-index: 2;
}

a:hover {
  text-decoration: none !important;
}

.helper {
  color: red;
  font-style: italic;
  font-size: 0.75rem;
  line-height: 1rem;
  border: 1px solid;
  display: inline-block;
  padding: 1rem;
  margin-top: 1rem;
  display: none;
}

.helper:before {
  content: 'Helper : ';
  display: block;
}

/*=============================================
========== Theme Colors Animations              
=============================================*/

body.no-transitions {
  transition: none !important;
  background-color: black;
}

.background-color-change-trigger {
  background-color: transparent !important;
  color: unset !important;
}

/* =========================================================
   THEME BLACK
========================================================= */
body.theme-black {
  background-color: var(--black);
  color: var(--white);
}

body.theme-black section .swiper p {
  color: white;
}

body.theme-black section .p--big p,
body.theme-black section .inline-link,
body.theme-black section ul,
body.theme-black section ul a,
body.theme-black section p,
body.theme-black section .resources-item-link,
body.theme-black section .accordion {
  color: var(--white) !important;
}

body.theme-black section .inline-carousel-item {
  border-color: white !important;
}

/*body.theme-black section .card p {
  color: black !important;
}*/

body.theme-black section .custom-btn,
body.theme-black section .border-bottom {
  background-color: white;
  color: black;
}

body.theme-black section .white-circle.black-bgd {
  --circleColor: var(--black);
}

body.theme-black section .white-circle.black-bgd:hover {
  color: var(--white);
}

body.theme-black section .custom-btn.white-circle .icon,
body.theme-black section .custom-btn.white-circle .icon,
body.theme-black section .logo-text-img,
body.theme-black .solutions-top-section-logo-container {
  filter: var(--filterWhite);
}

body.theme-black section .testimonies-inline-carousel-controls img {
  /*! filter: var(--filterBlack); */
}

/* =========================================================
   THEME WHITE
========================================================= */
body.theme-white {
  background-color: var(--white);
  color: var(--black);
}

body.theme-white section .p--big p,
body.theme-white section .inline-link,
body.theme-white section ul,
body.theme-white section p,
body.theme-white section .resources-item-link {
  color: var(--black);
}

body.theme-white section .resource-content--related p {
  color: var(--white);
}

body.theme-white section .resource-content--related .custom-btn.white-bgd {
  background-color: var(--white);
  color: black;
}

body.theme-white section .inline-carousel-item {
  border-color: black !important;
}

body.theme-white section .custom-btn.white-bgd {
  background-color: var(--black);
  color: white;
}

body.theme-white section .custom-btn.white-bgd.yellow-circle {
  background-color: var(--white);
  color: var(--black);
}

body.theme-white .row--featured-post .custom-btn.white-bgd.yellow-circle {
  background-color: var(--black);
  color: var(--white);
}

body.theme-white section .custom-btn.white-bgd:hover {
  color: black;
}

body.theme-white section .custom-btn.white-bgd.water-circle:hover,
body.theme-white section .custom-btn.white-bgd.energy-circle:hover {
  color: white;
}

body.theme-white section .energy-bgd .custom-btn.white-bgd,
body.theme-white section .water-bgd .custom-btn.white-bgd,
body.theme-white section .food-beverage-bgd .custom-btn.white-bgd,
body.theme-white section .purple-bgd .custom-btn.white-bgd {
  --circleColor: var(--white);
}

body.theme-white section .energy-bgd .custom-btn.white-bgd .icon,
body.theme-white section .water-bgd .custom-btn.white-bgd .icon,
body.theme-white section .food-beverage-bgd .custom-btn.white-bgd .icon,
body.theme-white section .purple-bgd .custom-btn.white-bgd .icon,
body.theme-white section .logo-cell img {
  filter: var(--filterBlack) !important;
}

body.theme-white section .logo-text-img,
body.theme-white .header-mobile-logo-container .logo-text-img,
body.theme-white #menu-toggle {
  filter: var(--filterBlack) !important;
}

body.theme-white section .logo-cell,
body.theme-white section .trusted-grid {
  border-color: black !important;
}

body.theme-white section .trusted-grid-filters-filter {
  border-color: black !important;
  color: black;
}

body.theme-white section .timeline::before {
  background: var(--black);
}

body.theme-white section .form-container p {
  color: var(--white);
}

body.theme-white #section-lets-see-whats-in-your-water .form-container {
  background-color: var(--purple);
}

/* =========================================================
   THEME BLUE
========================================================= */
body.theme-blue {
  background-color: var(--blue);
  color: var(--black);
}

body.theme-blue section h2,
body.theme-blue section h3 {
  color: black;
}

body.theme-blue section .logo-cell,
body.theme-blue section .trusted-grid {
  border-color: black !important;
}

body.theme-blue section .logo-cell img {
  filter: var(--filterBlack);
}

body.theme-blue section .trusted-grid-filters-filter,
body.theme-blue section .trusted-grid .left,
body.theme-blue section .trusted-grid .right {
  border-color: black !important;
  color: black;
}

body.theme-blue section .testimonies-inline-carousel .carousel-progress-fill,
body.theme-blue section .form-container-quote-builder {
  background: var(--black);
}

/* =========================================================
   THEME WATER
========================================================= */
body.theme-water {
  background-color: var(--water);
  color: var(--white);
}

body.theme-water section h1,
body.theme-water section h2,
body.theme-water section h3,
body.theme-water footer h3,
body.theme-water footer a {
  color: white;
}

body.theme-water section .blue ul li::before,
body.theme-water section .water .arrow-list li::before,
body.theme-water section .water.inline-carousel .carousel-controls img,
body.theme-water section .inline-carousel-controls img {
  filter: var(--filterWhite) !important;
}

body.theme-water .logo-header,
body.theme-water .header-mobile-logo-container .logo-img,
body.theme-water .header-mobile-logo-container .logo-text-img,
body.theme-water #menu-toggle {
  filter: var(--filterWhite);
}

body.theme-water section .testimonies-inline-carousel-controls img {
  filter: var(--filterBlack);
}

body.theme-water section .water.inline-carousel .swiper-scrollbar-drag {
  background: var(--black);
}

/* =========================================================
   THEME PURPLE
========================================================= */
body.theme-purple {
  background-color: var(--purple);
  color: var(--white);
}

body.theme-purple section h1,
body.theme-purple section .custom-breadcrumb a,
body.theme-purple section h2,
body.theme-purple section h3,
body.theme-purple footer h3,
body.theme-purple footer a {
  color: white !important;
}

body.theme-purple footer .logo-header,
body.theme-purple section .carousel-controls {
  filter: var(--filterWhite) !important;
}

body.theme-purple section .inline-carousel .swiper-scrollbar-drag {
  filter: var(--filterBlack) !important;
}

/* =========================================================
   THEME ENERGY
========================================================= */
body.theme-energy {
  background-color: var(--energy);
  color: var(--white);
}

body.theme-energy section h2,
body.theme-energy section h3,
body.theme-energy section ul,
body.theme-energy section p,
body.theme-energy section .p--big,
body.theme-energy footer a,
body.theme-energy footer h3 {
  color: white !important;
}

body.theme-energy section .purple ul li::before,
body.theme-energy section .energy .arrow-list li::before,
body.theme-energy .header-mobile-logo-container .logo-img,
body.theme-energy .header-mobile-logo-container .logo-text-img,
body.theme-energy #menu-toggle {
  filter: var(--filterWhite) !important;
}

body.theme-energy .logo-header {
  filter: var(--filterWhite);
}

body.theme-energy section .energy.inline-carousel .swiper-scrollbar-drag {
  background: var(--black);
}

/* =========================================================
   THEME GREEN
========================================================= */
body.theme-green {
  background-color: var(--green);
  color: var(--black);
}

body.theme-green section h2,
body.theme-green section h3,
body.theme-green section .form-container,
body.theme-green section .p--big p,
body.theme-green section label {
  color: black;
}

body.theme-green section.icon,
body.theme-green section .logo-img {
  filter: var(--filterBlack);
}

body.theme-green section .blue-circle {
  --circleColor: var(--white);
}

body.theme-green section .blue-circle:hover {
  color: black;
}
body.theme-green section .blue-circle .circle,
body.theme-green section .blue-circle .custom-btn::after {
  background-color: white;
}

body.theme-green .resource-content--text,
body.theme-green section .blue-circle .icon,
body.theme-green footer,
body.theme-green #section-404-content .purple {
  filter: var(--filterBlack) !important;
}

body.theme-green
  section
  .purple.testimonies-inline-carousel
  .carousel-progress-fill,
body.theme-green section .inline-carousel .swiper-scrollbar-drag,
body.theme-green .form-container-quote-builder {
  background: var(--black);
}

body.theme-green section .purple.testimonies-inline-carousel {
  --cp-fill: var(--black);
}

body.theme-green section .accordion--about .accordion-dot {
  background: var(--black);
}

body.theme-green #solutions-section-bugcount .logo-text-img {
  filter: var(--filterBlack) !important;
}

body.theme-green section .purple-circle:hover {
  color: var(--black);
}
body.theme-green section .custom-btn.purple-circle {
  --circleColor: var(--white);
}

body.theme-green section .custom-btn.yellow-circle {
  --circleColor: var(--black);
}

body.theme-green section .custom-btn.yellow-circle .icon {
  filter: var(--filterWhite);
}

body.theme-green section .purple-circle .icon {
  filter: var(--filterBlack) !important;
}

/* =========================================================
   THEME FOOD & BEVERAGE
========================================================= */
body.theme-food-beverage {
  background-color: var(--green);
  color: var(--black);
}

body.theme-food-beverage section h2,
body.theme-food-beverage section h3,
body.theme-food-beverage section ul,
body.theme-food-beverage section p,
body.theme-food-beverage section .p--big,
body.theme-food-beverage footer h3 {
  color: black;
}

body.theme-food-beverage section .carousel-controls,
body.theme-food-beverage section .food-beverage ul li::before,
body.theme-food-beverage section .energy .arrow-list li::before,
body.theme-food-beverage
  section
  .testimonies-inline-carousel
  .carousel-progress,
body.theme-food-beverage .header-mobile-logo-container .logo-img,
body.theme-food-beverage .header-mobile-logo-container .logo-text-img,
body.theme-food-beverage #menu-toggle {
  filter: var(--filterBlack);
}

body.theme-food-beverage .logo-header {
  filter: var(--filterBlack);
}

body.theme-food-beverage
  section
  .food-beverage.inline-carousel
  .swiper-scrollbar-drag {
  background: var(--black);
}

/* =========================================================
   THEME ORANGE
========================================================= */
body.theme-orange {
  background-color: var(--orange);
  color: var(--white);
}

body.theme-orange section h2,
body.theme-orange section h3,
body.theme-orange footer a,
body.theme-orange footer h3 {
  color: white;
}

body.theme-orange section .inline-carousel .swiper-scrollbar-drag {
  background: var(--black);
}

body.theme-orange section .carousel-controls img,
body.theme-orange footer .logo-header {
  filter: var(--filterWhite);
}

/*=============================================
========== Color Variables              
=============================================*/
:root {
  --blue: #00a3e1;
  --water: #00a3e1;
  --purple: #ac4fc6;
  --energy: #ac4fc6;
  --green: #26d07c;
  --foodBeverage: #26d07c;
  --darkpurple: #6244bb;
  --yellow: #ffcd00;
  --orange: #ff7f32;
  --pink: #e93cac;
  --lightgrey: #eeeeee;
  --mediumgrey: #9a9a9a;
  --white: #ffffff;
  --black: #000000;

  --filterBlue: brightness(0) saturate(100%) invert(46%) sepia(60%)
    saturate(4234%) hue-rotate(169deg) brightness(103%) contrast(100%);
  --filterWater: brightness(0) saturate(100%) invert(46%) sepia(60%)
    saturate(4234%) hue-rotate(169deg) brightness(103%) contrast(100%);
  --filterPurple: brightness(0) saturate(100%) invert(57%) sepia(100%)
    saturate(4144%) hue-rotate(255deg) brightness(83%) contrast(84%);
  --filterEnergy: brightness(0) saturate(100%) invert(57%) sepia(100%)
    saturate(4144%) hue-rotate(255deg) brightness(83%) contrast(84%);
  --filterGreen: brightness(0) saturate(100%) invert(60%) sepia(87%)
    saturate(1300%) hue-rotate(100deg) brightness(106%) contrast(70%);
  --filterfoodBeverage: brightness(0) saturate(100%) invert(60%) sepia(87%)
    saturate(1300%) hue-rotate(100deg) brightness(106%) contrast(70%);
  --filterYellow: brightness(0) saturate(100%) invert(68%) sepia(98%)
    saturate(451%) hue-rotate(358deg) brightness(102%) contrast(105%);
  --filterOrange: brightness(0) saturate(100%) invert(63%) sepia(22%)
    saturate(6678%) hue-rotate(339deg) brightness(106%) contrast(101%);
  --filterPink: brightness(0) saturate(100%) invert(46%) sepia(56%)
    saturate(6739%) hue-rotate(299deg) brightness(97%) contrast(87%);
  --filterLightGrey: brightness(0) saturate(100%) invert(99%) sepia(0%)
    saturate(2118%) hue-rotate(185deg) brightness(113%) contrast(77%);
  --filterMediumGrey: brightness(0) saturate(100%) invert(76%) sepia(0%)
    saturate(0%) hue-rotate(142deg) brightness(83%) contrast(82%);
  --filterWhite: brightness(0) saturate(100%) invert(100%) sepia(92%)
    saturate(0%) hue-rotate(302deg) brightness(107%) contrast(107%);
  --filterBlack: brightness(0) saturate(100%) invert(0%) sepia(1%) saturate(29%)
    hue-rotate(63deg) brightness(99%) contrast(100%);
}

.blue {
  color: var(--blue);
}
.purple {
  color: var(--purple);
}
.darkpurple {
  color: var(--darkpurple);
}
.green,
.green:hover {
  color: var(--green);
}
.yellow {
  color: var(--yellow);
}
.orange {
  color: var(--orange);
}
.pink {
  color: var(--pink);
}
.white {
  color: var(--white);
}
.white-bgd {
  background-color: var(--white);
}
.black {
  color: var(--black);
}
.mediumgrey {
  color: var(--mediumgrey);
}
.blue-bgd {
  background-color: var(--blue);
}
.purple-bgd {
  background-color: var(--purple);
}
.green-bgd {
  background-color: var(--green);
}
.black-bgd {
  background-color: var(--black);
}
.black-bgd a {
  color: white;
}
.yellow-bgd {
  background-color: var(--yellow);
}
.orange-bgd {
  background-color: var(--orange);
}
.water {
  color: var(--water);
}
.water-bgd {
  background-color: var(--water);
  color: var(--white);
}
.water-bgd .custom-breadcrumb a {
  color: var(--white);
}
.energy {
  color: var(--energy);
}
.energy-bgd {
  background-color: var(--energy);
  color: var(--white);
}
.energy-bgd .custom-breadcrumb a {
  color: var(--white);
}
.food-beverage {
  color: var(--foodBeverage);
}
.food-beverage-bgd {
  background-color: var(--foodBeverage);
  color: var(--black);
}
.food-beverage-bgd .custom-breadcrumb a,
section.food-beverage-bgd .inline-link {
  color: var(--black);
}

.filter-white {
  filter: var(--filterWhite);
}
/*=============================================
========== Fonts & Text Variables           
=============================================*/

.inter {
  font-family: 'Inter', sans-serif;
  font-optical-sizing: auto;
  font-style: normal;
}

.poppins {
  font-family: 'Poppins', sans-serif;
  font-style: normal;
}

.light {
  font-weight: 300;
}

.regular {
  font-weight: 400;
}

.medium {
  font-weight: 500;
}

.semibold {
  font-weight: 600;
}

.bold {
  font-weight: 700;
}

h1,
h2,
h3,
h4,
h5 {
  font-weight: normal;
  font-size: inherit;
  line-height: inherit;
}

h1 {
  font-family: 'Poppins', sans-serif;
  font-size: 5rem;
  line-height: 6rem;
  font-style: normal;
  font-weight: 700;
}

h1.h1--small {
  font-size: 2.5rem;
  line-height: 3rem;
}

h1 sup {
  top: -0.5rem;
  left: -1rem;
  font-size: 4.5rem;
}

.custom-breadcrumb,
h2 {
  font-family: 'Poppins', sans-serif;
  font-size: 2.5rem;
  font-style: normal;
  font-weight: 700;
  line-height: 3rem;
}

h2 span.number {
  font-weight: 300;
  margin-right: 1rem;
}

.custom-breadcrumb a {
  color: var(--black);
}

h3 {
  font-family: 'Poppins', sans-serif;
  font-size: 1.5rem;
  font-style: normal;
  font-weight: 700;
  line-height: 2rem;
}

h4 {
  font-family: 'Poppins', sans-serif;
  font-size: 1rem;
  font-style: normal;
  font-weight: 700;
  line-height: 1.5rem;
}

h5 {
  font-weight: 700;
}

.custom-breadcrumb a:hover {
  text-decoration: none;
  border-bottom: 3px solid;
}

p {
  font-size: 1rem;
  line-height: 1.5rem;
}

.p--small,
.p--small p {
  font-size: 0.75rem;
  line-height: 1rem;
}

.p--medium,
.p--medium p {
  font-size: 1.25rem;
  line-height: 2rem;
}

.p--big,
.p--big p {
  font-size: 1.5rem;
  line-height: 2rem;
  font-weight: 300;
}

.p--big p {
  margin-bottom: 2rem;
}

.p--ultrabig,
.p--ultrabig p {
  font-family: 'Poppins', sans-serif;
  font-size: 2.5rem;
  font-style: normal;
  font-weight: 700;
  line-height: 3rem;
}

.arrow-list {
  font-size: 1.25rem;
  line-height: 2rem;
  font-weight: 500;
}

sup {
  font-size: 0.5rem;
  top: -0.5rem;
  left: 0.05rem;
}

#resource-content ul,
.resource-content--text ul,
.arrow-list ul {
  list-style: none;
}

#resource-content ul li,
.resource-content--text ul li,
.arrow-list li {
  position: relative;
  padding-left: 3rem;
  margin-bottom: 1.5rem;
}

#resource-content ul li:before,
.resource-content--text ul li:before,
.arrow-list li:before {
  content: '';
  position: absolute;
  left: 0;
  top: 50%;
  width: 1.75rem;
  height: 1.75rem;
  background-image: url(_/img/checked.svg);
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  transform: translateY(-50%);
  filter: var(--filterBlue);
}

.resource-content--text ul li:before {
  filter: var(--filterPurple);
}

#resource-content .blue ul li:before,
.water .arrow-list li:before {
  filter: var(--filterBlue);
}

#resource-content .purple ul li:before,
.resource-content--text .purple ul li:before,
.energy .arrow-list li:before {
  filter: var(--filterPurple);
}

#resource-content .green ul li:before,
.food-beverage .arrow-list li:before {
  filter: var(--filterGreen);
}

#resource-content .yellow ul li:before {
  filter: var(--filterYellow);
}

#resource-content .orange ul li:before {
  filter: var(--filterOrange);
}

.card {
  padding: 5rem 5rem 5rem 5rem;
  border-radius: 1rem;
  height: 100%;
  border: none;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

.card--no-flex {
  display: block;
}

.card--small {
  padding: 2.5rem;
}

.card--problem-solution {
  padding: 2.5rem 2.5rem 7.5rem 2.5rem;
  display: block;
}

body section .card--problem-solution p {
  color: var(--black) !important;
}

.card-add-more {
  height: auto;
  padding: 2rem;
}

.mega-anim {
  will-change: transform, opacity;
}

.card-add-more .solutions-logo-container .logo-img,
.card-add-more .solutions-logo-container .logo-text-img {
  height: 2.75rem;
  filter: var(--filterWhite) !important;
}

.card-add-more .solutions-logo-container:hover .logo-img,
.card-add-more .solutions-logo-container:hover .logo-text-img {
  height: 2.75rem;
  filter: var(--filterYellow) !important;
}

/*=============================================
========== Margins           
=============================================*/

.mb-05 {
  margin-bottom: calc(1rem / 3);
}
.mb-10 {
  margin-bottom: calc(1rem * 2 / 3);
}
.mb-15 {
  margin-bottom: 1rem;
}
.mb-30 {
  margin-bottom: 2rem;
}
.mb-45 {
  margin-bottom: 3rem;
}
.mb-60 {
  margin-bottom: 4rem;
}
.mb-90 {
  margin-bottom: 6rem;
}
.mb-120 {
  margin-bottom: 8rem;
}

.mt-30 {
  margin-top: 2rem;
}

.mt-60 {
  margin-top: 4rem;
}

/*=============================================
========== Paddings           
=============================================*/

.pb-15 {
  padding-bottom: 1rem;
}
.pb-30 {
  padding-bottom: 2rem;
}
.pb-45 {
  padding-bottom: 3rem;
}
.pb-60 {
  padding-bottom: 4rem;
}
.pb-90 {
  padding-bottom: 6rem;
}
.pb-120 {
  padding-bottom: 8rem;
}

.pr-120 {
  padding-right: 8rem;
}
/*=============================================
========== IMG & VIDEOS
=============================================*/

.img-container {
  border-radius: 1rem;
  overflow: hidden;
}

.img-container--square {
  width: 100%;
  aspect-ratio: 4/4;
}

.img-container--4-3 {
  width: 100%;
  aspect-ratio: 4/3;
}

.img-container--3-4 {
  width: 100%;
  aspect-ratio: 3/4;
}

.img-container--16-9 {
  width: 100%;
  aspect-ratio: 16/9;
}

.img-container img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

img {
  width: 100%;
  height: auto;
  display: block;
  position: relative;
}

.video-container {
  position: relative;
  width: 100%;
  padding-bottom: 56.25%; /* 16:9 */
  height: 0;
  overflow: hidden;
  border-radius: 1rem;
}

.video-container video {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}

/*=============================================
========== SECTION
=============================================*/

.top-section {
  padding-top: 10rem;
}

.cta-section {
  padding: 10rem 0rem;
}

.content-section {
  padding: 10rem 0rem;
}

.content-section--resources-inline-carousel {
  padding: 4rem 0rem 0rem 0rem;
}

/*=============================================
========== CUSTOM BUTTON BIG
=============================================*/

@property --tx {
  syntax: '<number>';
  inherits: false;
  initial-value: 0;
}
@property --ty {
  syntax: '<number>';
  inherits: false;
  initial-value: 0;
}

.custom-btn {
  overflow-clip-margin: border-box;
  position: relative;
  display: inline-flex;
  align-items: center;
  padding: 0.75rem 0;
  font-size: 1rem;
  line-height: 1.5rem;
  clip-path: inset(-1px round 9999px);
  border-radius: 9999px;
  font-weight: 400;
  text-decoration: none;
  --dot-size: 1.5rem;
  --dot-offset: 1rem;
  --dur: 0.3s;
  --mask-radius: 9999px;
  --start-top: calc(50% - (var(--dot-size) / 2));
  --start-right: var(--dot-offset);
  --start-bottom: calc(50% - (var(--dot-size) / 2));
  --start-left: calc(100% - (var(--dot-offset) + var(--dot-size)));
  --epsilon: 1.5px;
  text-align: unset;
}

.custom-btn.custom-btn--list {
  background-color: transparent !important;
}

.custom-btn .label {
  position: relative;
  z-index: 2;
  padding: 0 4rem 0 2rem;
  display: block;
}

.custom-btn .circle {
  position: absolute;
  top: 50%;
  right: calc(1rem - 2px);
  transform: translateY(-50%);
  background: var(--circleColor);
  width: 1.5rem;
  height: 1.5rem;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 3;
  overflow: hidden;
}

.custom-btn .icon-wrapper {
  position: relative;
  width: 0.75rem;
  height: 0.75rem;
  overflow: hidden;
  text-align: left;
}

.custom-btn .icon {
  position: absolute;
  top: 0;
  width: 0.75rem;
  height: 0.75rem;
  transition: transform 0.3s cubic-bezier(0.785, 0.135, 0.15, 0.86);
  text-align: left;
}

.custom-btn .arrow-1 {
  left: 0;
  transform: translateX(0%);
}

.custom-btn .arrow-2 {
  transform: translateX(calc(-100% - 0.75rem));
}

.custom-btn::after {
  content: '';
  position: absolute;
  top: -1.5px;
  left: -1.5px;
  right: -1.5px;
  bottom: -1.5px;
  background: var(--circleColor);
  z-index: 1;
  border-radius: var(--mask-radius);
  will-change: clip-path;
  backface-visibility: hidden;
  transform: translateZ(0);
  -webkit-transform: translateZ(0);
  clip-path: inset(
    max(-1.5px, calc(var(--start-top) * (1 - var(--ty)) - var(--epsilon)))
      max(-1.5px, calc(var(--start-right) * (1 - var(--tx)) - var(--epsilon)))
      max(-1.5px, calc(var(--start-bottom) * (1 - var(--ty)) - var(--epsilon)))
      max(-1.5px, calc(var(--start-left) * (1 - var(--tx)) - var(--epsilon)))
      round
      calc(
        (
            ((calc(var(--dot-size))) / 2) * (1 - var(--ty)) +
              (var(--mask-radius) * var(--ty))
          ) * 999999999
      )
  );
  transition: --tx var(--dur) cubic-bezier(0.785, 0.135, 0.15, 0.86),
    --ty var(--dur) cubic-bezier(0.785, 0.135, 0.15, 0.86);
}

.custom-btn:hover {
  text-decoration: none;
}

.custom-btn:hover .arrow-1 {
  transform: translateX(100%);
}

.custom-btn:hover .arrow-2 {
  transform: translateX(0%);
}

.custom-btn:hover::after {
  --tx: 1;
  --ty: 1;
}

/*=============================================
========== CUSTOM BUTTON SMALL
=============================================*/

.custom-btn.custom-btn--small {
  padding: 0.75rem 0;
  font-size: 0.75rem;
  line-height: 0.75rem;
  --dot-size: 1.125rem;
  --dot-offset: 0.75rem;
  --epsilon: 1.125px;
}

.custom-btn.custom-btn--small .label {
  padding: 0 3rem 0 1.5rem;
}

.custom-btn.custom-btn--small .circle {
  right: calc(0.75rem - 1.5px);
  width: 1.125rem;
  height: 1.125rem;
}

.custom-btn.custom-btn--small .icon-wrapper {
  width: 0.5625rem;
  height: 0.5625rem;
}

.custom-btn.custom-btn--small .icon {
  width: 0.5625rem;
  height: 0.5625rem;
}

.custom-btn.custom-btn--small .arrow-2 {
  transform: translateX(calc(-100% - 0.5625rem));
}

.custom-btn.custom-btn--small::after {
  top: -1.125px;
  left: -1.125px;
  right: -1.125px;
  bottom: -1.125px;
}

.custom-btn.custom-btn--small:hover .arrow-2 {
  transform: translateX(0);
}
.custom-btn.custom-btn--small:hover .arrow-1 {
  transform: translateX(100%);
}

.button-link-container {
  display: flex;
  gap: 3rem;
  align-items: center;
  white-space: nowrap;
  font-size: 1rem;
  line-height: 1.5rem;
}

.inline-link {
  text-decoration: none !important;
  border-bottom: 1px solid;
}

.inline-link:hover {
  color: inherit;
  border-bottom-color: transparent;
}

/*=============================================
========== CUSTOM BUTTON BIG COLORS
=============================================*/

.custom-btn[class*='-circle'] {
  --circleColor: transparent;
}
.custom-btn[class*='-circle'] .circle {
  background: var(--circleColor);
}

.resource-content--text .custom-btn,
.custom-btn.black-bgd {
  background-color: black;
  color: white;
}

.custom-btn.white-bgd {
  background-color: white;
  color: black;
}

.custom-btn.white-bgd .icon {
  filter: var(--filterWhite);
}

.resource-content--text .custom-btn .icon,
.custom-btn.black-bgd .icon {
  filter: var(--filterWhite);
}

.custom-btn.black-bgd.white-circle .icon {
  filter: var(--filterBlack);
}

.custom-btn.white-bgd:hover {
  color: white;
}

.custom-btn.black-bgd:hover {
  color: white;
}

.custom-btn.black-bgd.white-circle:hover {
  color: black;
}

.custom-btn.black-circle {
  --circleColor: var(--black);
}

.custom-btn.white-circle {
  --circleColor: var(--white);
}

.custom-btn.blue-circle,
.custom-btn.water-circle {
  --circleColor: var(--blue);
}

.custom-btn.green-circle,
.custom-btn.food-beverage-circle {
  --circleColor: var(--green);
}

.custom-btn.purple-circle,
.custom-btn.energy-circle {
  --circleColor: var(--purple);
}

.custom-btn.orange-circle {
  --circleColor: var(--orange);
}

.custom-btn.pink-circle {
  --circleColor: var(--pink);
}

.custom-btn.yellow-circle {
  --circleColor: var(--yellow);
}

.custom-btn.yellow-circle .icon {
  filter: var(--filterBlack);
}

.custom-btn.darkblue-circle {
  --circleColor: var(--pink);
}

.custom-btn.lightgrey-circle {
  --circleColor: var(--pink);
}

/*=============================================
========== CAT
=============================================*/

.industry-cat {
}

.industry-cat a {
  color: var(--mediumgrey);
  border: 1px solid var(--mediumgrey);
  display: inline-block;
  font-size: 0.75rem;
  line-height: 0.75rem;
  padding: 0.5rem 1rem;
  border-radius: 999999px;
}

.industry-cat a:hover {
  text-decoration: none;
  background-color: var(--mediumgrey);
  color: var(--white);
}

/*=============================================
========== RESOURCES ITEM
=============================================*/

.resources-item-header {
  display: flex;
  gap: 1rem;
  flex-wrap: wrap;
}

.inline-carousel-item-top h3 {
  font-weight: 600;
  font-size: 1rem;
  line-height: 1.5rem;
}

/*=============================================
========== CAROUSEL
=============================================*/

.carousel-controls {
  border-radius: 100%;
  cursor: pointer;
  transition: all 0.3s ease-in-out;
}

.carousel-controls img {
  width: 2rem;
  padding: 0.5rem;
}

.carousel-controls.prev img {
  transform: rotate(180deg);
}

.carousel-controls.next {
}

/*=======================================================================================================================
================================================== HEADER
========================================================================================================================*/

/* ---------------------------------------------------------------------------
   HEADER BASE STYLES
--------------------------------------------------------------------------- */
header {
  font-size: 1rem;
  line-height: 1rem;
  position: fixed;
  top: 0;
  width: 100%;
  z-index: 102;
  transition: transform 0.5s ease-in-out, background-color 0.3s ease-in-out;
}

/* Hide header when scrolling down */
header.header-has-scrolled {
  transform: translateY(-200%);
}

.luminultra-logo-container {
  display: flex;
  align-items: center;
  gap: 0.25rem;
}

.luminultra-logo-container img {
  height: 4.5rem;
  width: auto;
  display: block;
}

/* ---------------------------------------------------------------------------
   LOGOS
--------------------------------------------------------------------------- */
.logo-header,
.logo-solutions {
  max-width: 250px;
}

/* ---------------------------------------------------------------------------
   HEADER TOP BAR
--------------------------------------------------------------------------- */
#header-top {
  position: relative;
  z-index: 103;
  padding: 1.5rem 0;
  border-top: 0.25rem solid var(--yellow);
  height: 100px;
}

/* Border when mega menu is opened */
.mega-menu-opened #header-top {
  border-bottom: 1px solid var(--mediumgrey);
}

/* ---------------------------------------------------------------------------
   LINK COLORS (DEFAULT + WHITE TEXT MODE)
--------------------------------------------------------------------------- */

/* Default links (black text) */
header #header-top .menu a,
header #header-top .inline-link {
  color: black;
}

/* White-text mode (used on dark backgrounds) */
.white-text-header header #header-top .menu a,
.white-text-header header #header-top .inline-link {
  color: white;
}

/* ---------------------------------------------------------------------------
   LOGO LETTERS FILTER
--------------------------------------------------------------------------- */

/* Default (black filter) */
header #header-top .letters {
  filter: var(--filterBlack);
}

/* White-text mode (white filter) */
.white-text-header header #header-top .letters {
  filter: var(--filterWhite);
}

/* ---------------------------------------------------------------------------
   CUSTOM BUTTON
--------------------------------------------------------------------------- */

/* Default button (black background, white text) */
header #header-top .custom-btn {
  color: white;
  background-color: var(--black);
}

/* Hover state */
header #header-top .custom-btn:hover {
  color: var(--white);
}

/* White-text mode → button switches to white bg + black text */
.white-text-header header #header-top .custom-btn {
  color: black;
  background-color: var(--white);
}

/* Hover (white-text mode) */
.white-text-header header #header-top .custom-btn:hover {
  color: white;
}

/* Mega menu opened or white background → button switches back to black bg */
.white-text-header.mega-menu-opened header #header-top .custom-btn,
.white-text-header header.header-white-bgd #header-top .custom-btn {
  color: white;
  background-color: var(--black);
}

/* ---------------------------------------------------------------------------
   HEADER BACKGROUND STATES
--------------------------------------------------------------------------- */

/* White background (scrolled or forced) */
header.header-white-bgd,
.white-text-header.mega-menu-opened header {
  background-color: white;
}

.header-white-bgd .logo-header {
  filter: none !important;
}

/* Drop shadow when header has white background */
header.header-white-bgd,
.mega-menu-opened header #mega-menu {
  box-shadow: 0vw 0vw 2vw 2vw rgba(0, 0, 0, 0.15);
}

/* White background or mega menu → links and letters become black */
.white-text-header.mega-menu-opened header #header-top .menu a,
.white-text-header.mega-menu-opened header #header-top .inline-link,
.white-text-header header.header-white-bgd #header-top .menu a,
.white-text-header header.header-white-bgd #header-top .inline-link {
  color: black;
}

.white-text-header.mega-menu-opened header #header-top .letters,
.white-text-header header.header-white-bgd #header-top .letters {
  filter: var(--filterBlack);
}

/*=======================================================================================================================
================================================== MENU
========================================================================================================================*/

header .menu {
  display: flex;
  list-style: none;
  justify-content: center;
  gap: 45px;
}

header .menu a:hover,
header .current-menu-item a,
header .current-page-ancestor a,
.single-resource header #menu-item-25 a,
.tax-industries header #menu-item-27 a,
.single-product header #menu-item-26 a,
.tax-solutions header #menu-item-26 a {
  text-decoration: none;
  /*border-bottom: 1px solid;*/
  font-weight: 700;
}

/*=======================================================================================================================
================================================== MEGA MENU
========================================================================================================================*/

body.mega-menu-opened #mega-menu {
  transform: translateY(0);
}

#mega-menu {
  background-color: white;
  position: absolute;
  top: 0px;
  z-index: 101;
  padding: calc(100px + 3rem) 0rem 2rem 0rem;
  transform: translateY(-100%);
  transition: transform 0.3s ease-in-out;
  /*! box-shadow: 0vw 0vw 2vw 2vw rgba(0, 0, 0, 0.15); */
  border-top: 1px solid var(--mediumgrey);
}

.mega-menu-sub-menu {
}

.mega-menu-item-flex-container {
  display: flex;
  flex-wrap: wrap;
  column-gap: 2rem;
  row-gap: 0;
}

.mega-menu-item-flex-container > .mega-menu-item {
  flex: 0 0 calc(50% - 1rem);
  box-sizing: border-box;
}

.mega-menu-item {
  margin-bottom: 2rem;
  position: relative;
}

.mega-menu-title {
  font-family: 'Poppins', sans-serif;
  font-size: 1.5rem;
  font-style: normal;
  font-weight: 700;
  line-height: 2rem;
}

.mega-menu-sub-title {
}

#mega-menu-industries .mega-menu-item .mega-menu-sub-title {
  color: black;
  font-weight: 500;
}
#mega-menu-industries .mega-menu-item:hover .mega-menu-sub-title {
  font-weight: 700;
}

#mega-menu-industries .mega-menu-item.water:hover .mega-menu-sub-title {
  color: var(--water);
}

#mega-menu-industries .mega-menu-item.energy:hover .mega-menu-sub-title {
  color: var(--energy);
}

#mega-menu-industries .mega-menu-item.food-beverage:hover .mega-menu-sub-title {
  color: var(--food-beverage);
}

#mega-menu-solutions .solutions-logo-container img {
  height: 4rem;
}

#mega-menu-solutions .solutions-logo-container .logo-img {
  filter: var(--filterBlack);
}

#mega-menu-solutions .mega-menu-item--solutions:hover .logo-img {
  filter: none;
}

#mega-menu-solutions .mega-menu-item--solutions:hover div.p {
  color: var(--blue);
}

#mega-menu-solutions .mega-menu-item--solutions:hover p {
  color: var(--blue);
}

#mega-menu-solutions .svg-logo-container svg {
  height: 4rem;
  width: auto;
  display: block;
}

#mega-menu-resources,
#mega-menu-solutions,
#mega-menu-about,
#mega-menu-contact {
  display: none;
  visibility: hidden;
  opacity: 0;
  transition: opacity 0.5s ease;
  color: black;
}

#mega-menu-resources .content-types {
  list-style: none;
  text-transform: uppercase;
  font-weight: 700;
  font-size: 0.75rem;
  line-height: 1.5rem;
  letter-spacing: 0.1rem;
}

#mega-menu-resources .content-types a {
  color: var(--black);
}

.solutions-logo-container {
  display: flex;
  align-items: center;
  gap: 0.25rem;
}

.solutions-logo-container img {
  height: 4.5rem;
  width: auto;
  display: block;
}

.tax-solutions .solutions-logo-container img {
  height: 6rem;
  /*! overflow: hidden; */
}

/*=======================================================================================================================
================================================== HOME
========================================================================================================================*/

.industry-card {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

body.theme-black section .industry-card.water-bgd p,
body.theme-black section .industry-card.energy-bgd p {
  color: white !important;
}

body.theme-black section .industry-card.food-beverage-bgd p {
  color: black !important;
}

/*======== ACCORDION ========================================*/

.accordion {
}

.accordion-item-header {
  position: relative;
  cursor: pointer;
}

.accordion-item-content {
  display: none;
}

.accordion--basic .accordion-item {
  border-top: 1px solid;
}

.accordion--basic .accordion-item-header {
  font-size: 3rem;
  line-height: 3rem;
  padding: 1rem 5rem 1rem 0;
}

.accordion--basic .accordion-item-header .svg-logo-container svg {
  height: 5rem;
  width: auto;
  display: block;
}

.accordion--basic .accordion-item .arrow-up {
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
  transition: all 0.3s ease-in-out;
  width: 2rem;
}

.accordion--basic .accordion-item.accordion-opened .arrow-up {
  transform: translateY(-50%) rotate(180deg);
}

.accordion--basic .accordion-item svg {
  filter: var(--filterBlack);
}

.accordion--basic .accordion-item-header .logo-solutions {
  filter: var(--filterBlack);
}

.accordion--basic .accordion-item-header:hover .logo-solutions,
.accordion--basic
  .accordion-item.accordion-opened
  .accordion-item-header
  .logo-solutions {
  filter: none;
}

.accordion--basic .accordion-item-content {
  padding-top: 1.5rem;
  padding-bottom: 4.5rem;
}

/*======== ACCORDION HOME ========================================*/

.accordion--home .logo-img {
  filter: var(--filterBlack);
}

.accordion--home .accordion-item:hover .logo-img,
.accordion--home .accordion-opened .logo-img {
  filter: none;
}
/*======== ACCORDION ABOUT & CONTACT ========================================*/

.accordion--about-contact {
  border-top: 1px solid var(--lightgrey);
}

.accordion--about-contact .accordion-item {
  border-bottom: 1px solid var(--lightgrey);
  position: relative;
}

.accordion--about-contact .accordion-item-header {
  font-size: 2.5rem;
  line-height: 2.5rem;
  padding: 2rem 0rem 2rem 0;
}

.accordion--about-contact .accordion-item-content {
  padding-top: 0rem;
  padding-bottom: 2rem;
}

.accordion--about-contact
  .accordion-item-header
  .accordion-dot-container:last-child {
  display: flex; /* allow right alignment of the dot */
  justify-content: flex-end;
  align-items: center;
}

.accordion--about-contact .accordion-dot {
  position: relative;
  width: 3rem;
  height: 3rem;
  border-radius: 50%;
  flex: 0 0 auto;
  pointer-events: none;
}

.accordion--about-contact .accordion-dot::before {
  content: '+';
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 300;
  font-size: 1.5rem;
  line-height: 1;
}

.accordion--about-contact .accordion-item.accordion-opened .accordion-dot,
.accordion--about-contact .accordion-item:hover .accordion-dot {
  background-color: var(--black);
}

.accordion--about-contact
  .accordion-item.accordion-opened
  .accordion-dot::before {
  content: '−';
}

/*======== ACCORDION ABOUT ========================================*/

.accordion--about .accordion-dot {
  background: var(--purple);
}

.accordion--about .accordion-dot::before {
  color: var(--white);
}

/*======== ACCORDION CONTACT ========================================*/

.accordion--contact .accordion-dot {
  background: var(--lightgrey);
}

.accordion--contact .accordion-dot::before {
  color: var(--black);
}

.accordion--contact .accordion-item.accordion-opened .accordion-dot::before,
.accordion--contact .accordion-item:hover .accordion-dot::before {
  color: var(--white);
}

/*======== TRUSTED GRID LOGOS ========================================*/

.trusted-grid {
  display: flex;
  border: 1px solid var(--white);
  border-radius: 1rem;
}

.trusted-grid .left {
  width: 40%;
  padding: 3rem 2rem;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

.trusted-grid .right {
  width: 60%;
}

.trusted-grid-filters {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}
.trusted-grid-filters-filter {
  border: 1px solid var(--white);
  color: var(--white);
  padding: 1rem 1rem;
  border-radius: 2rem;
  font-weight: 500;
  cursor: pointer;
  background-color: transparent;
}
.trusted-grid-filters-filter:hover,
.trusted-grid-filters-filter:focus-visible,
.trusted-grid-filters-filter.is-active {
  border-color: transparent;
  outline: none;
}

.trusted-grid-filters-filter[industry-cat='water'].is-active,
.trusted-grid-filters-filter[industry-cat='water']:hover {
  background: var(--blue);
}

.trusted-grid-filters-filter[industry-cat='energy'].is-active,
.trusted-grid-filters-filter[industry-cat='energy']:hover {
  background: var(--purple);
}

.trusted-grid-filters-filter[industry-cat='food-beverage'].is-active,
.trusted-grid-filters-filter[industry-cat='food-beverage']:hover {
  background: var(--green);
  color: var(--black);
}

.logo-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  overflow: hidden;
}

.logo-cell {
  height: 10rem;
  position: relative;
  border-bottom: 1px solid var(--white);
  border-left: 1px solid var(--white);
  overflow: hidden;
}

.logo-cell:nth-last-child(-n + 3) {
  border-bottom: 0;
}

.logo-cell img {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  max-width: 75%;
  max-height: 50%;
  width: auto;
  height: auto;
  object-fit: contain;
  cursor: pointer;
}

.logo-cell img {
  filter: var(--filterWhite);
}

.logo-cell[industry-cat='water']:hover img,
.logo-cell[industry-cat='water'].is-active img {
  filter: var(--filterBlue);
}

.logo-cell[industry-cat='energy']:hover img,
.logo-cell[industry-cat='energy'].is-active img {
  filter: var(--filterPurple);
}

.logo-cell[industry-cat='food-beverage']:hover img,
.logo-cell[industry-cat='food-beverage'].is-active img {
  filter: var(--filterGreen);
}

/*======== TESTIMONIES INLINE CAROUSEL ========================================*/

.testimonies-inline-carousel-controls-container {
  display: flex;
  gap: 1rem;
  padding-left: 6rem;
}

.testimonies-inline-carousel-item {
  padding-left: 6rem;
  padding-right: 18rem;
}

.testimonies-inline-carousel-controls:hover {
  background-color: var(--purple);
}
.testimonies-inline-carousel-controls {
  background-color: var(--lightgrey);
}

.testimonies-inline-carousel-controls img {
  filter: var(--filterPurple);
}

.testimonies-inline-carousel-controls:hover img {
  filter: var(--filterWhite) !important;
}

.purple.testimonies-inline-carousel .carousel-progress-fill {
  background: var(--purple);
}

.water.testimonies-inline-carousel .carousel-progress-fill {
  background: var(--water);
}

.water.testimonies-inline-carousel .carousel-controls img {
  filter: var(--filterWater);
}

.water.testimonies-inline-carousel .carousel-controls:hover {
  background-color: var(--water);
}

.energy.testimonies-inline-carousel .carousel-progress-fill {
  background: var(--energy);
}

.energy.testimonies-inline-carousel .carousel-controls img {
  filter: var(--filterEnergy);
}

.energy.testimonies-inline-carousel .carousel-controls:hover {
  background-color: var(--energy);
}

.food-beverage.testimonies-inline-carousel .carousel-progress-fill {
  background: var(--foodBeverage);
}

.food-beverage.testimonies-inline-carousel .carousel-controls img {
  filter: var(--filterfoodBeverage);
}

.food-beverage.testimonies-inline-carousel .carousel-controls:hover {
  background-color: var(--foodBeverage);
}

/*======== RESOURCES INLINE CAROUSEL ========================================*/

.inline-carousel {
  padding-left: 6rem;
}

.inline-carousel .swiper-wrapper {
  align-items: stretch;
}

.inline-carousel .swiper-slide {
  /*! height: auto; */
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

.inline-carousel-item {
  border-left: 1px solid;
  padding-left: 2rem;
  height: 100%;
}

.inline-carousel-item .link-absolute {
  position: absolute;
  width: 100%;
  height: calc(100% - 60px);
  left: 0;
  top: 60px;
  z-index: 2;
}

.inline-carousel-footer {
  display: flex;
  align-items: center;
  gap: 5%;
}

.inline-carousel-item-link {
  text-decoration: none !important;
  border-bottom: 1px solid;
}

.resources-item-link {
}

.inline-carousel .swiper-scrollbar {
  height: 1px;
  background: var(--lightgrey);
  position: relative;
  width: 80%;
  left: 0;
  right: unset;
  top: 50%;
  transform: translateY(-50%);
  bottom: unset;
}
.inline-carousel .swiper-scrollbar-drag {
  background: var(--green);
}

.inline-carousel-footer-controls {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 10%;
  gap: 1rem;
}

.inline-carousel-controls:hover {
  background-color: transparent;
}
.inline-carousel-controls {
  background-color: transparent;
}

.inline-carousel-controls img {
  filter: var(--filterGreen);
}

.inline-carousel-controls:hover img {
  filter: var(--filterWhite);
}

.green .inline-carousel-resources-item:hover,
.green .inline-carousel-resources-item:hover .inline-carousel-item-link {
  color: var(--green);
}

.water .inline-carousel-resources-item:hover,
.water .inline-carousel-resources-item:hover .inline-carousel-item-link {
  color: var(--water) !important;
}

.water.inline-carousel .swiper-scrollbar-drag {
  background: var(--water);
}

.water.inline-carousel .carousel-controls {
  filter: var(--filterWater);
}

.energy .inline-carousel-resources-item:hover,
.energy .inline-carousel-resources-item:hover .inline-carousel-item-link {
  color: var(--energy) !important;
}

.energy.inline-carousel .swiper-scrollbar-drag {
  background: var(--energy);
}

.energy.inline-carousel .carousel-controls {
  filter: var(--filterEnergy);
}

.food-beverage .inline-carousel-resources-item:hover,
.food-beverage
  .inline-carousel-resources-item:hover
  .inline-carousel-item-link {
  color: var(--foodBeverage) !important;
}

.food-beverage.inline-carousel .swiper-scrollbar-drag {
  background: var(--foodBeverage);
}

.food-beverage.inline-carousel .carousel-controls {
  filter: var(--filterfoodBeverage);
}

/*======== RESOURCES SINGLE CAROUSEL ========================================*/

.resources-single-carousel-item .link-absolute {
  position: absolute;
  width: 100%;
  height: calc(100% - 60px);
  left: 0;
  top: 60px;
  z-index: 2;
}

.resources-single-carousel-item-link {
  text-decoration: none !important;
  border-bottom: 1px solid;
  color: var(--white);
}

.resources-single-carousel-item:hover,
.resources-single-carousel-item:hover .resources-carousel-item-link {
  color: var(--yellow);
}

/*======== PROGRESS BAR ========================================*/

.carousel-progress {
  --cp-height: 1px;
  --cp-dash: 3px;
  --cp-space: 3px;
  --cp-track: var(--mediumgrey);
  --cp-fill: var(--purple);
  width: 100%;
}

.carousel-progress-bar {
  position: relative;
  height: var(--cp-height);
}

.carousel-progress-track {
  position: absolute;
  inset: 0;
  border-radius: 999px;
  background: repeating-linear-gradient(
    to right,
    var(--cp-track) 0 var(--cp-dash),
    transparent var(--cp-dash) calc(var(--cp-dash) + var(--cp-space))
  );
  opacity: 0.75;
  overflow: hidden;
}

.carousel-progress-fill {
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 0%;
  background: var(--cp-fill);
  border-radius: 999px;
  transition: width 0.1s linear;
}

/*======== PROGRESS BAR SINGLE CAROUSEL ========================================*/

.resources-single-carousel .carousel-progress {
  --cp-fill: var(--yellow);
  display: block;
  height: var(--cp-height);
  padding: 0;
  margin: 3rem 0 1.5rem 0;
  grid-template-columns: none;
  column-gap: 0;
}

/*======== PROGRESS BAR TESTIMONIES INLINE CAROUSEL ========================================*/

.testimonies-inline-carousel .carousel-progress {
  --cp-gap: 7rem;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  column-gap: var(--cp-gap);
  align-items: center;
  margin: 0 auto 4rem auto;
  padding: 0 6rem;
}

/*======== ARCHIVES INDUSTRIES ========================================*/

.archives {
}

.row_anchors .custom-btn {
  display: block;
}

.row_anchors .custom-btn .arrow-1 {
  transform: rotate(90deg);
}

.row_anchors .custom-btn .arrow-2 {
  display: none !important;
}

.content-section.black-bgd {
}

.content-section.white-bgd {
}

.content-section.black-bgd .resources-carousel-item,
.content-section.black-bgd .resources-carousel-item a {
  color: var(--white);
}

.content-section.white-bgd .resources-carousel-item,
.content-section.white-bgd .resources-carousel-item a {
  color: var(--black);
}

.content-section.white-bgd .card--problem-solution {
  background-color: var(--lightgrey);
}

.content-section.water .resources-carousel-item:hover,
.content-section.water
  .resources-carousel-item:hover
  .resources-carousel-item-bottom
  a,
.content-section.water .resources-carousel-item:hover .link-absolute {
  color: var(--blue);
}

.content-section.water .inline-carousel .swiper-scrollbar-drag {
  background: var(--blue);
}

.content-section.water .inline-carousel-controls img {
  filter: var(--filterBlue);
}

.content-section.energy .resources-carousel-item:hover,
.content-section.energy
  .resources-carousel-item:hover
  .resources-carousel-item-bottom
  a,
.content-section.energy .resources-carousel-item:hover .link-absolute {
  color: var(--purple);
}

.content-section.energy .inline-carousel .swiper-scrollbar-drag {
  background: var(--purple);
}

.content-section.energy .inline-carousel-controls img {
  filter: var(--filterPurple);
}

.content-section.food-beverage .resources-carousel-item:hover,
.content-section.food-beverage
  .resources-carousel-item:hover
  .resources-carousel-item-bottom
  a,
.content-section.food-beverage .resources-carousel-item:hover .link-absolute {
  color: var(--green);
}

.content-section.food-beverage .inline-carousel .swiper-scrollbar-drag {
  background: var(--green);
}

.content-section.food-beverage .inline-carousel-controls img {
  filter: var(--filterGreen);
}

.child-industries-content-section.white-bgd
  .content-section--resources-inline-carousel {
  background-color: transparent;
}

.child-industries-content-section.white-bgd
  .content-section--resources-inline-carousel
  .inline-carousel-resources-item,
.child-industries-content-section.white-bgd
  .content-section--resources-inline-carousel
  .inline-carousel-resources-item
  .inline-carousel-item-link {
  color: var(--black);
}

#module-section-resource-hub-universal-block.white-bgd .inline-carousel-item,
#module-section-resource-hub-universal-block.white-bgd .inline-carousel-item a {
  color: var(--black);
}

/*======== PAGE ABOUT ========================================*/

/*======== ABOUT TIMELINE ========================================*/

.timeline {
  position: relative;
  width: 100%;
  margin: 0 auto;
}

/* center vertical line (solid, no halo) */
.timeline::before {
  content: '';
  position: absolute;
  inset: 0;
  margin: auto;
  width: 1px; /* keep in px */
  background: var(--white);
}

/* items (two columns layout) */
.timeline-item {
  position: relative;
  width: calc(50% - 4rem); /* wider because circles are 3rem */
  margin-bottom: 2rem;
}
.timeline-item:nth-child(odd) {
  margin-right: auto;
  text-align: right;
  padding-right: 3.5rem; /* spacing to the center line/circle */
}
.timeline-item:nth-child(even) {
  margin-left: auto;
  padding-left: 3.5rem;
}

/* first circle stuck at the very top */
.timeline-item:first-child {
  padding-top: 0;
}
.timeline-item:first-child::after {
  top: 0;
}

/* circle background (behind the symbol) */
.timeline-item::after {
  content: '';
  position: absolute;
  top: 0; /* align with top of .date */
  left: 100%;
  transform: translateX(
    calc(4rem - 1px - 1.5rem)
  ); /* center the 3rem circle on the line */
  width: 3rem;
  height: 3rem;
  border-radius: 50%;
  background: var(--yellow);
  box-shadow: none;
  z-index: 1; /* draw under the +/- symbol */
  pointer-events: none; /* not clickable by default (items without content) */
}
.timeline-item:nth-child(even)::after {
  left: auto;
  right: 100%;
  transform: translateX(calc(-4rem + 1px + 1.5rem));
}

/* make the yellow circle show pointer ONLY when the item has content */
.timeline-item.has-content::after {
  pointer-events: auto; /* allow the hover to register */
  cursor: pointer; /* pointer cursor over the circle */
}

/* plus/minus symbol (only when the item truly has content) */
.timeline-item.has-content::before {
  content: '+';
  position: absolute;
  top: 0;
  left: 100%;
  transform: translateX(calc(4rem - 1px - 1.5rem));
  width: 3rem;
  height: 3rem;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 300;
  font-size: 1.5rem;
  color: var(--black);
  z-index: 2; /* above the circle */
  pointer-events: none; /* text itself should not capture clicks */
}
.timeline-item.has-content:nth-child(even)::before {
  left: auto;
  right: 100%;
  transform: translateX(calc(-4rem + 1px + 1.5rem));
}
.timeline-item.has-content.is-active::before {
  content: '−'; /* true minus sign */
}

/* header: clickable only when there is content */
.timeline-item-header {
  display: grid;
  cursor: default;
}
.timeline-item.has-content .timeline-item-header {
  cursor: pointer;
}

.timeline-item.is-active .timeline-item-header .date,
.timeline-item.is-active .timeline-item-header h3 {
  color: var(--white);
}

.timeline-item.is-active:after {
  background: var(--white);
}

/* collapsible content */
.timeline-item-content {
  display: none;
}
.timeline-item-content p,
.timeline-item-content .img-container {
  margin-bottom: 1rem;
}

/* load more button */
.timeline-load-more {
  display: block;
  margin: 5rem auto 0 auto;
  padding: 0;
  border: none;
  color: var(--white);
  cursor: pointer;
  background: transparent;
  font-family: 'Poppins', sans-serif;
  font-size: 1.5rem;
  font-style: normal;
  font-weight: 700;
  line-height: 2rem;
}
.timeline-load-more:disabled {
  display: none;
}

/*======== PAGE ABOUT CAREERS ========================================*/

#about-job-listing {
  padding-top: 3rem;
}
.accordion--listing {
}

.accordion--listing .accordion-item:hover .arrow-right {
  transform: translateY(-50%) rotate(-45deg);
}

.accordion--listing .arrow-right {
  position: absolute;
  right: 15px;
  top: 50%;
  transform: translateY(-50%);
  transform-origin: center center;
  transition: all 0.3s ease-in-out;
  width: 2.5rem;
}
/*======== PAGE CONTACT ========================================*/

#contact-accordion {
  padding-top: 5rem;
}

.border-bottom {
  width: 100%;
  height: 1px;
}

.row-border-bottom:last-child {
  display: none;
}

/*======== RESSOUCES ========================================*/

.resources-grid-item {
  display: flex;
  gap: 2rem;
  position: relative;
}

.resources-grid-item-left {
  width: 40%;
}

.resources-grid-item-right {
  width: 60%;
}

.resources-grid-item h3 {
}

.load-more-wrapper {
  text-align: center;
}

/*======== SINGLE RESOURCE ========================================*/

#resource-content {
}

#resource-content .resource-content {
  margin-bottom: 2rem;
}

#resource-content .resource-content--related {
  margin-bottom: 4rem;
}

.resource-content--text p,
.resource-content--text ul {
  color: black;
}

.resource-content--text h3,
.resource-content--text h2 {
  margin-bottom: 2rem;
}

.resource-content--text ul {
  margin-bottom: 2rem;
  list-style: none;
}

.resource-content--text ul li {
}

.resource-content--text p {
  margin-bottom: 2rem;
}

.resource-content .img-container {
  margin-bottom: 1rem;
}

.resource-content .caption {
  margin-bottom: 2rem;
}

.resource-content .caption p {
  font-size: 0.75rem;
  line-height: 1.25rem;
  margin-bottom: 0;
}

.resource-content--related {
  padding: 3rem 3rem;
  border-radius: 1rem;
  overflow: hidden;
  margin-bottom: 4rem;
}

.resource-content a:not(.custom-btn) {
  font-weight: 700;
  border-bottom: 1px solid;
}

.resource-content a:not(.custom-btn):hover {
  border-bottom: 0px solid;
}

.resource-content--text.blue a:not(.custom-btn) {
  color: var(--blue);
}
.resource-content--text.purple a:not(.custom-btn) {
  color: var(--purple);
}

.resource-content--text.green a:not(.custom-btn) {
  color: var(--green);
}
.resource-content--text.yellow a:not(.custom-btn) {
  color: var(--yellow);
}

.resource-content--text.orange a:not(.custom-btn) {
  color: var(--orange);
}

/*======== SEARCH AND FILTER ========================================*/

#resources-search-filter {
  padding: 3rem 0;
}

#wrapper .searchandfilter h4 {
  text-transform: uppercase;
  margin: 0;
  padding: 0;
  font-size: inherit;
  margin-bottom: 1rem;
}

#wrapper li[data-sf-field-type='taxonomy'] {
  border-bottom: 1px solid;
  margin-bottom: 2rem;
  padding-bottom: 2rem;
}

#wrapper .searchandfilter ul > li > ul:not(.children) {
  display: block;
  margin-top: 0;
  margin-bottom: 0;
  margin-left: 0rem;
}

#wrapper .searchandfilter ul .children {
  display: none !important;
}

#wrapper .sf-level-0 {
  display: flex;
  max-width: 100%;
}

#wrapper .sf-label-checkbox,
#wrapper .sf-label-radio {
  display: inline-flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;
}

#single-section-1 p a {
  color: var(--purple);
  font-weight: 700;
  border-bottom: 1px solid;
}

#single-section-1 p a:hover {
  border-bottom: none;
}

/*======== SOLUTIONS ========================================*/

.solutions-top-section-logo-container {
  color: var(--black);
  /*! filter: var(--filterBlack); */
}

.solutions-top-section-logo-container:hover {
  color: var(--blue);
  text-decoration: none;
  filter: none;
}

.solutions-top-section-logo-container .svg-logo-container svg {
  height: 4rem;
  width: auto;
  display: block;
}

.solutions-content-section .logo-img,
.solutions-content-section .logo-text-img {
  height: 6rem;
  width: auto;
  display: block;
}

.solutions-content-section.black-bgd .logo-text-img {
  filter: var(--filterWhite);
}

.tax-solutions .custom-breadcrumb,
.tax-solutions .custom-breadcrumb a {
  color: var(--mediumgrey);
}

.tax-solutions .top-section .solutions-logo-container .logo-text-img {
  filter: var(--filterWhite);
}

/*======== SINGLE SOLUTIONS ========================================*/

.icon-text-container {
  padding-right: 3rem;
}

.icon-text-container .icon-container {
  height: 5rem;
  aspect-ratio: 1/1;
  overflow: hidden;
  display: flex;
  align-items: flex-end;
}

.icon-text-container .icon-container img {
  max-height: 100%;
  max-width: 100%;
  height: auto;
  width: auto;
}

.item-product {
}

.item-product .additional-info {
}

.item-product .additional-info ul {
  list-style: none;
  line-height: 2rem;
}

.item-product .additional-info ul a {
  color: black;
}

.item-product .additional-info ul a:hover {
  /*! color: var(--blue); */
}

/*======== SINGLE SOLUTIONS BUGCOUNT ========================================*/

#solutions-bugcount-section-3 {
  padding-bottom: 5rem;
}

#solutions-bugcount-products {
  padding-top: 0;
}

/*======== SINGLE SOLUTIONS GENECOUNT ========================================*/

#solutions-genecount-products-3 .additional-info {
}

#solutions-genecount-products-3 .additional-info ul {
  list-style: none;
  line-height: 2rem;
}

#solutions-genecount-products-3 .additional-info ul a {
  color: black;
}

#solutions-genecount-products-3 .additional-info ul a:hover {
  color: var(--purple);
  font-weight: 700;
}

.solutions-timeline-section {
  padding: 10rem 0rem 7rem 0rem;
}

.timeline-col {
  position: relative;
  display: flex;
  align-items: flex-start;
  justify-content: center;
  margin-top: 1rem;
}
.timeline-col::before {
  content: '';
  position: absolute;
  top: 0;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 1.5px;
  background: var(--purple);
  height: calc(100% + 20rem);
}

#solutions-genecount-relay .timeline-col::before {
  height: 0;
}
.step-dot {
  flex-shrink: 0;
  display: inline-block;
  width: 5rem;
  height: 5rem;
  line-height: 5rem;
  border-radius: 50%;
  background: var(--purple);
  color: var(--white);
  font-weight: 700;
  font-size: 2rem;
  text-align: center;
  z-index: 100;
}

#solutions-genecount-products-5 .timeline-col::before {
  display: none;
}

/*======== SINGLE SOLUTIONS LABS ========================================*/

.test-item-labs {
  position: relative;
  padding-left: 3rem;
}

.test-item-labs p {
  line-height: 2rem;
}

.test-item-labs:before {
  content: '';
  position: absolute;
  left: 0;
  top: 0;
  width: 1.75rem;
  height: 1.75rem;
  background-image: url(_/img/checked.svg);
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  filter: var(--filterPink);
}

.test-item-labs ul {
  list-style: none;
  line-height: 1.5rem;
}

.test-item-labs ul a {
  color: black;
}

.test-item-labs ul a:hover {
  color: var(--pink);
}
/*======== SINGLE SOLUTIONS POLYTECHNIC ========================================*/

#solutions-polytechnic-section-2 .row > .col-6:nth-of-type(even) {
  margin-top: -6rem;
}

/*======== FORMS ========================================*/

input:focus,
textarea:focus,
select:focus {
  outline: none;
  box-shadow: none;
}

.form-container {
  padding: 2rem;
  border-radius: 1rem;
}

.form-flex-container {
  display: flex;
  flex-wrap: wrap;
  column-gap: 3rem;
}

.form-input-container {
  margin-bottom: 2rem;
  flex: 1 1 calc(50% - 1.5rem);
  position: relative;
}

.form-input-opt-in {
  margin-bottom: 2rem;
}

.form-input-container p {
  margin: 0;
}

.form-input-container label {
  margin-bottom: 0.25rem;
  color: white;
}

.form-input-container textarea {
  resize: none;
  height: 10rem !important;
}

.form-input-container input,
.form-input-container textarea,
.form-input-container select {
  border: none;
  border-radius: 0.25rem;
  line-height: 2rem;
  width: 100%;
  padding: 0.5rem;
  height: 3rem;
  background-color: white;
}

.form-container .custom-btn {
  -webkit-appearance: none;
  appearance: none;
  border: 0;
  cursor: pointer;
}

#wrapper .wpcf7-list-item {
  margin: 0;
}

input[type='number']::-webkit-inner-spin-button,
input[type='number']::-webkit-outer-spin-button {
  opacity: 1;
}

#wrapper .wpcf7 form .wpcf7-response-output {
  border: none;
  margin: 0;
  padding: 0;
}

#wrapper .wpcf7-form.sent .wpcf7-response-output {
  margin-top: 1.5rem;

  font-size: 1.5rem;
  line-height: 2rem;
  font-weight: 700;
  color: var(--black);
}

/*======== FORM LET'S SEE WHAT'S IN YOUR WATER ========================================*/

#section-lets-see-whats-in-your-water .form-container {
  background-color: transparent;
}

/*======== FORM GATED RESOURCE ========================================*/

.form-container-gated-resource {
}

/*======== FORM PAGE CONTACT ========================================*/

.form-container-accordion-contact {
  padding: 0;
}

.form-container-accordion-contact input,
.form-container-accordion-contact textarea,
.form-container-accordion-contact select {
  border: 1px solid;
}

.form-container-accordion-contact label {
  color: var(--black);
}

.form-container .wpcf7-not-valid-tip {
  font-size: 0.75rem;
  line-height: 1.5rem;
  position: absolute;
  bottom: -2.5rem;
}

/*======== PRODUCTS ========================================*/

#product-section-1 h1 {
  font-family: 'Poppins', sans-serif;
  font-size: 2.5rem;
  font-style: normal;
  font-weight: 700;
  line-height: 3rem;
}

#product-section-1 .p--big p {
  font-size: 3rem;
  line-height: 3.5rem;
}

#build-quote-form {
  /*! border-top: 1px solid; */
  /*! padding-top: 2rem; */
}

#section-product-details {
  padding-top: 7.5rem;
  padding-bottom: 0;
}

#section-product-description {
  padding-top: 7.5rem;
}

#section-product-details .p--big a {
  color: var(--purple);
  font-weight: 500;
}

.product-options-container.product-options-container--requirements {
  border-bottom: none;
  margin-bottom: 1rem;
}

.row-requirement {
  border-top: 1px solid;
  border-bottom: 1px solid;
  padding: 1rem 0rem;
  margin-bottom: 1rem;
}

.row-requirement--or {
  font-size: 1.5rem;
  line-height: 1.5rem;
  font-style: italic;
  font-weight: 300;
  margin-bottom: 1rem;
}

.row-requirement a {
  color: var(--purple);
  font-size: 1.5rem;
  line-height: 2rem;
}

.product-options-container {
  border-bottom: 1px solid;
  padding-bottom: 0.5rem;
}

.product-options-container .title {
  text-transform: uppercase;
  font-weight: 700;
  font-size: 0.75rem;
  line-height: 1.5rem;
  letter-spacing: 0.1rem;
}

.product-options-container .sub-title {
  margin-top: -0.5rem;
}

.product-options-container .field {
  margin-bottom: 1.5rem;
  font-size: 0.75rem;
  display: flex;
  column-gap: 0.5rem;
  align-items: center;
}
.product-options-container ._3_columns,
.product-options-container ._2_columns {
  display: flex;
  flex-wrap: wrap;
  column-gap: 2rem;
}

.product-options-container ._3_columns .field {
  flex: 1 1 calc((100% - 4rem) / 3);
}

.product-options-container ._2_columns .field {
  flex: 1 1 calc((100% - 4rem) / 2);
}

.product-options-container .field .instruction {
  margin-left: 1rem;
  border-bottom: 1px solid transparent;
}

.product-options-container .field .instruction:hover {
  color: var(--purple);
  border-bottom: 1px solid;
}

#build-quote-form #product-qty {
  width: 4rem;
  margin-bottom: 3rem;
  padding: 0rem 0rem 0rem 1rem;
}

#build-quote-form .custom-btn {
  cursor: pointer;
}

#build-quote-form .response {
}

.product-gallery-main {
  margin-bottom: 1rem;
}

.product-gallery-main .img-container,
.product-gallery-thumbs .img-container {
  cursor: pointer;
}

.product-gallery-grid-thumbs {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 1rem;
}

.product-gallery-grid-thumbs .custom-thumbnail {
  cursor: pointer;
  opacity: 0.4;
}

.product-gallery-grid-thumbs .custom-thumbnail.active {
  opacity: 1;
}

.accordion--products {
}

.accordion--basic.accordion--products .accordion-item-header {
  font-weight: 500;
  padding: 1.5rem 5rem 1.5rem 0;
}

.accordion--basic.accordion--products .accordion-item-content {
  padding-top: 0rem;
  padding-bottom: 1.5rem;
}

.accordion--products p {
  margin-bottom: 1rem;
}

.accordion--products ul {
  margin-left: 1rem;
  margin-bottom: 1rem;
}

.accordion--products ul li {
}

.accordion--products a {
  color: var(--black);
}

.accordion--products a:hover {
  color: var(--purple);
}

.specifications-table {
  width: 100%;
  border-collapse: collapse;
  table-layout: fixed;
  margin-bottom: 1rem;
}

.specifications-table th,
.specifications-table td {
  border: 1px solid grey;
  padding: 1rem;
  text-align: left;
  width: 50%;
}

.specifications-table thead th {
  background-color: lightgrey;
  font-weight: bold;
}

#single-product-genecount .logo-text-img {
  filter: var(--filterWhite);
}

/*======== BUILD MY QUOTE ========================================*/

.accordion--build-a-quote .logo-text-img,
.accordion--build-a-quote .arrow-up {
  filter: var(--filterWhite);
}

/*======== MY QUOTE ========================================*/

.quote-has-product .header-start-my-quote,
.header-view-my-quote {
  display: none;
}

.quote-has-product .header-view-my-quote {
  display: block;
}

#my-quote-section-1 {
  padding-bottom: 3rem;
}

#my-quote-section-content {
  padding-top: 0rem;
}

#quote-list {
  border-top: 1px solid black;
  padding-top: 2rem;
}

#quote-list h3 a {
  color: var(--purple);
}

.row-item-my-quote {
  margin-bottom: 2rem;
}

.row-item-my-quote .options {
  list-style: none;
  text-transform: uppercase;
  text-transform: uppercase;
  font-size: 0.75rem;
  line-height: 1.5rem;
  letter-spacing: 0.1rem;
  margin-bottom: 1.5rem;
}

.row-item-my-quote .options .title {
  font-weight: 700;
}

.row-item-my-quote .remove-qty-container {
  display: flex;
  column-gap: 1.5rem;
  align-items: center;
  margin-bottom: 1.5rem;
}

.row-item-my-quote .remove {
  cursor: pointer;
  display: inline-block;
  border-bottom: 1px solid;
  font-size: 0.75rem;
  line-height: 1rem;
}

.row-item-my-quote .quote-qty-input {
  width: 4rem;
  padding: 0rem 0rem 0rem 1rem;
}

.form-input-container-hidden {
  position: absolute;
  left: -9999px;
  width: 1px;
  height: 1px;
  overflow: hidden;
}
/*======== FOOTER ========================================*/

footer {
  padding: 6rem 0;
  border-bottom: 0.25rem solid var(--yellow);
  position: relative;
}

footer .logo-header .letters {
  filter: var(--filterBlack);
}

footer .row-footer-top {
  border-bottom: 1px solid var(--lightgrey);
  padding-bottom: 6rem;
}

footer .row-footer-top a {
  color: var(--black);
}

footer .menu {
  list-style: none;
  line-height: 1.75rem;
}

footer .menu a {
  color: var(--mediumgrey);
}

footer .menu a:hover {
  font-weight: 700;
}

footer .copyright,
footer .back-to-top {
  position: absolute;
  bottom: 1.5rem;
}

footer .copyright {
  left: 2rem;
}

footer .back-to-top {
  position: fixed;
  right: 3rem;
  cursor: pointer;
  display: none;
  z-index: 1000;
}

.mobile {
  display: none;
}

@media (max-width: 991px) {
  .desktop {
    display: none;
  }

  .mobile {
    display: block;
  }

  header,
  footer {
    /*! display: none; */
  }

  .container-fluid {
    padding: 0 1.5rem;
  }

  h1 {
    font-size: 3rem;
    line-height: 3.5rem;
  }

  .custom-breadcrumb,
  h2 {
    font-size: 1.75rem;
    line-height: 2.25rem;
  }

  h3 {
    font-size: 1.25rem;
    line-height: 1.75rem;
  }

  .p--ultrabig,
  .p--ultrabig p {
    font-size: 1.25rem;
    line-height: 1.75rem;
  }

  .p--big,
  .p--big p {
    font-size: 1.15rem;
    line-height: 1.5rem;
  }

  .p--big p {
    margin-bottom: 0;
  }

  .p--medium,
  .p--medium p {
    font-size: 1rem;
    line-height: 1.4rem;
  }

  p {
    font-size: 0.9rem;
    line-height: 1.25rem;
  }

  .arrow-list {
    font-size: 1rem;
    line-height: 1.75rem;
    font-weight: 500;
  }

  #resource-content ul li,
  .arrow-list li {
    position: relative;
    padding-left: 2rem;
    margin-bottom: 1.5rem;
  }

  #resource-content ul li::before,
  .arrow-list li::before {
    width: 1.25rem;
    height: 1.25rem;
  }

  .button-link-container {
    display: block;
    white-space: unset;
    font-size: 0.8rem;
    line-height: 1.25rem;
  }

  .button-link-container .inline-link {
    display: inline-block;
    margin-top: 1rem;
    margin-left: 2rem;
  }

  .custom-btn {
    padding: 0.75rem 0;
    font-size: 0.9rem;
    line-height: 1.25rem;
  }

  .mb-15 {
    margin-bottom: 0.75rem;
  }

  .mb-30 {
    margin-bottom: 1.5rem;
  }

  .mb-60 {
    margin-bottom: 2.5rem;
  }

  .mb-120 {
    margin-bottom: 5rem;
  }

  .pr-120 {
    padding-right: 0rem;
  }

  .mobile-mb-15 {
    margin-bottom: 0.75rem !important;
  }

  .mobile-mb-30 {
    margin-bottom: 1.5rem !important;
  }

  .mobile-mb-60 {
    margin-bottom: 2.5rem !important;
  }

  .mobile-mb-120 {
    margin-bottom: 5rem !important;
  }

  .mobile-no-mb {
    margin-bottom: 0;
  }

  .text-left-mobile {
    text-align: left !important;
  }

  .top-section {
    padding-top: 7.5rem;
  }

  .cta-section {
    padding: 5rem 0rem;
  }

  .content-section {
    padding: 5rem 0rem;
  }

  .card--small,
  .card {
    padding: 2rem;
    display: block;
    height: auto;
  }

  .solutions-logo-container {
    gap: 0.2rem;
    overflow: hidden;
  }

  .solutions-logo-container img {
    height: 4rem;
  }

  .tax-solutions .solutions-logo-container img {
    height: 5rem;
    overflow: hidden;
  }

  .solutions-content-section .logo-img,
  .solutions-content-section .logo-text-img {
    height: 4rem;
    width: auto;
    display: block;
  }

  /*======== HEADER ========================================*/

  #header-mobile {
    position: fixed;
    width: 100%;
    z-index: 102;
    top: 0;
    transition: transform 0.5s ease-in-out, background-color 0.3s ease-in-out;
  }

  #header-mobile.header-mobile-has-scrolled {
    transform: translateY(-200%);
  }

  #header-mobile.header-mobile-black-bgd {
    background-color: var(--black);
  }
  #header-mobile.header-mobile-black-bgd
    .header-mobile-logo-container
    .logo-text-img,
  #header-mobile.header-mobile-black-bgd #menu-toggle {
    filter: var(--filterWhite) !important;
  }

  #header-mobile.header-mobile-black-bgd
    .header-mobile-logo-container
    .logo-img {
    filter: none !important;
  }

  #header-mobile-top {
    border-bottom: 1px solid var(--mediumgrey);
    position: relative;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0 1.5rem 0 0.5rem;
    z-index: 103;
  }

  #header-mobile .logo-header {
    max-width: 200px;
  }

  #menu-toggle {
    --size: 1.5rem;
    --thickness: 0.2rem;
    --color: var(--white);
    width: var(--size);
    aspect-ratio: 1 / 1;
    background: linear-gradient(var(--color), var(--color)) center /
        var(--thickness) 100% no-repeat,
      linear-gradient(var(--color), var(--color)) center / 100% var(--thickness)
        no-repeat;
    display: inline-block;
    transition: transform 0.3s ease-in-out;
  }

  .header-mobile-logo-container {
    display: flex;
    align-items: center;
    gap: 0.25rem;
  }

  .header-mobile-logo-container img {
    height: 4.5rem;
    width: auto;
    display: block;
    transition: all 0.3s ease-in-out;
  }

  .header-mobile-logo-container .logo-text-img {
    filter: var(--filterWhite);
  }

  #modal-menu-mobile {
    padding: 1.5rem;
    background-color: var(--black);
    font-size: 1.75rem;
    line-height: 2.25rem;
    height: 100vh;
    width: 100%;
    font-weight: 500;
    position: absolute;
    transform: translateY(-200%);
    transition: transform 0.3s ease-in-out;
    top: 0;
    padding-top: 6rem;
    z-index: 101;
  }

  .menu-menu-header-mobile-container {
    margin-bottom: 1.5rem;
  }

  #menu-item-1854,
  .sub-menu {
    font-size: 0.9rem;
    line-height: 1.25rem;
  }

  .sub-menu {
    line-height: 1.5rem;
    margin-top: 0.25rem;
  }

  #modal-menu-mobile ul {
    list-style: none;
  }

  #modal-menu-mobile ul li {
    border-bottom: 1px solid var(--mediumgrey);
    padding: 0.5rem 0;
    position: relative;
  }

  #modal-menu-mobile ul li a {
    color: var(--white);
  }

  #modal-menu-mobile ul #menu-item-1854,
  #modal-menu-mobile ul #menu-item-1855,
  #modal-menu-mobile ul #menu-item-1859,
  #modal-menu-mobile ul #menu-item-1862,
  #modal-menu-mobile ul #menu-item-1855 .sub-menu li,
  #modal-menu-mobile ul #menu-item-1859 .sub-menu li,
  #modal-menu-mobile ul #menu-item-1862 .sub-menu li {
    border-bottom: none;
    padding: 0.25rem 0;
  }

  #modal-menu-mobile ul #menu-item-1863 {
    border-top: 1px solid var(--mediumgrey);
    margin-top: 0.5rem;
  }

  #modal-menu-mobile ul #menu-item-1855 a {
    color: var(--water);
  }
  #modal-menu-mobile ul #menu-item-1859 a {
    color: var(--energy);
  }
  #modal-menu-mobile ul #menu-item-1862 a {
    color: var(--foodBeverage);
  }

  .sub-menu {
    display: none;
  }

  #modal-menu-mobile .submenu-toggle {
    position: absolute;
    right: 0;
    top: 0rem;
    width: 2rem;
    height: 2rem;
    border: 0;
    background: transparent;
    cursor: pointer;
    display: inline-block;
    padding: 0;
    touch-action: manipulation;
    outline: none;
    box-shadow: none;
  }

  #modal-menu-mobile .submenu-toggle::before,
  #modal-menu-mobile .submenu-toggle::after {
    content: '';
    position: absolute;
    left: 50%;
    top: 50%;
    background: currentColor;
    transform: translate(-50%, -50%);
    transition: opacity 0.2s ease, transform 0.2s ease;
  }

  #modal-menu-mobile .submenu-toggle::before {
    width: 2px;
    height: 1rem;
  }

  #modal-menu-mobile .submenu-toggle::after {
    width: 1rem;
    height: 2px;
  }

  #modal-menu-mobile .submenu-toggle.is-open::before {
    opacity: 0;
    transform: translate(-50%, -50%) scaleY(0);
  }

  #menu-item-1855 .submenu-toggle {
    color: var(--water);
  }
  #menu-item-1859 .submenu-toggle {
    color: var(--energy);
  }

  #menu-item-1855,
  #menu-item-1859 {
    border-bottom: none;
  }

  /*.menu-mobile-opened #header-mobile-top {
    background-color: var(--black);
  }*/

  .menu-mobile-opened #menu-toggle {
    transform: rotate(45deg);
  }

  .menu-mobile-opened #modal-menu-mobile {
    transform: translateY(0%);
  }

  .menu-mobile-opened .header-mobile-logo-container .logo-img {
    filter: none !important;
  }

  body.theme-white.menu-mobile-opened
    .header-mobile-logo-container
    .logo-text-img,
  body.theme-white.menu-mobile-opened #menu-toggle,
  .menu-mobile-opened .header-mobile-logo-container .logo-text-img,
  .menu-mobile-opened #menu-toggle {
    filter: var(--filterWhite) !important;
  }

  /*======== ACCORDION ========================================*/

  .accordion--basic .accordion-item-header {
    font-size: 1.5rem;
    line-height: 1.5rem;
    padding: 0.5rem 0rem 1rem 0;
  }

  .accordion--basic .accordion-item-content {
    padding-top: 0rem;
    padding-bottom: 2rem;
  }

  .accordion--basic .accordion-item .arrow-up {
    width: 1.75rem;
  }

  .accordion--about-contact .accordion-item-header {
    font-size: 1.5rem;
    line-height: 1.5rem;
    padding: 2rem 0rem 2rem 0;
  }

  /*======== CAROUSEL ========================================*/

  .testimonies-inline-carousel-item {
    padding-left: 1.5rem;
    padding-right: 1.5rem;
  }

  .testimonies-inline-carousel .carousel-progress {
    display: none;
  }

  .testimonies-inline-carousel-controls-container {
    padding-left: 1.5rem;
  }

  .inline-carousel {
    padding-left: 1.5rem;
  }

  .inline-carousel-footer {
    gap: 15%;
  }

  .inline-carousel .swiper-scrollbar {
    width: 70%;
  }

  .inline-carousel-footer-controls {
    width: 10%;
    gap: 0rem;
  }

  /*======== HOME ========================================*/

  .resources-single-carousel {
    display: none;
  }

  .video-container {
    /*! padding-bottom: 177.78%; */
  }

  /*======== TRUSTED GRID LOGOS ========================================*/

  .trusted-grid {
    display: block;
    border: none;
  }

  .trusted-grid .left {
    width: 100%;
    padding: 1rem 1rem;
    border: 1px solid var(--white);
    border-top-left-radius: 1rem;
    border-top-right-radius: 1rem;
  }

  .trusted-grid .right {
    width: 100%;
    border-right: 1px solid var(--white);
    border-bottom: 1px solid var(--white);
    border-bottom-left-radius: 1rem;
    border-bottom-right-radius: 1rem;
    overflow: hidden;
  }

  .trusted-grid-filters {
    display: flex;
    flex-wrap: wrap;
  }
  .trusted-grid-filters-filter {
    padding: 0.5rem 0.5rem;
    border-radius: 2rem;
    margin-bottom: 1rem;
  }
  .trusted-grid-filters-filter:hover,
  .trusted-grid-filters-filter:focus-visible,
  .trusted-grid-filters-filter.is-active {
    border-color: transparent;
    outline: none;
  }

  .trusted-grid-filters-filter[industry-cat='water'].is-active,
  .trusted-grid-filters-filter[industry-cat='water']:hover {
    background: var(--blue);
  }

  .trusted-grid-filters-filter[industry-cat='energy'].is-active,
  .trusted-grid-filters-filter[industry-cat='energy']:hover {
    background: var(--purple);
  }

  .trusted-grid-filters-filter[industry-cat='food-beverage'].is-active,
  .trusted-grid-filters-filter[industry-cat='food-beverage']:hover {
    background: var(--green);
    color: var(--black);
  }

  .logo-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    overflow: hidden;
  }

  .logo-cell {
    height: 10rem;
    position: relative;
    border-bottom: 1px solid var(--white);
    border-left: 1px solid var(--white);
    overflow: hidden;
  }

  .logo-cell:nth-last-child(-n + 3) {
    border-bottom: 0;
  }

  .logo-cell img {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    max-width: 75%;
    max-height: 50%;
    width: auto;
    height: auto;
    object-fit: contain;
    cursor: pointer;
  }

  .logo-cell img {
    filter: var(--filterWhite);
  }

  .logo-cell[industry-cat='water']:hover img,
  .logo-cell[industry-cat='water'].is-active img {
    filter: var(--filterBlue);
  }

  .logo-cell[industry-cat='energy']:hover img,
  .logo-cell[industry-cat='energy'].is-active img {
    filter: var(--filterPurple);
  }

  .logo-cell[industry-cat='food-beverage']:hover img,
  .logo-cell[industry-cat='food-beverage'].is-active img {
    filter: var(--filterGreen);
  }

  /*======== FORMS ========================================*/

  input:focus,
  textarea:focus,
  select:focus {
    outline: none;
    box-shadow: none;
  }

  .form-container {
    padding: 2rem 1rem;
    border-radius: 1rem;
  }

  .form-container-whats-in-your-water,
  .form-container-accordion-contact {
    padding: 0;
  }

  .form-flex-container {
    display: block;
  }

  /*======== SINGLE SOLUTIONS ========================================*/

  .item-product {
    display: block;
  }

  .item-product-left,
  .item-product-right {
    max-width: unset;
  }

  .solutions-timeline-section {
    padding: 5rem 0rem 2rem 0rem;
  }

  .timeline-col {
    display: block;
  }
  .timeline-col::before {
    display: none;
  }

  #solutions-genecount-relay .timeline-col::before {
    height: 0;
  }
  .step-dot {
    flex-shrink: 0;
    display: inline-block;
    width: 3.5rem;
    height: 3.5rem;
    line-height: 3.5rem;
    border-radius: 50%;
    background: var(--purple);
    color: var(--white);
    font-weight: 700;
    font-size: 1.5rem;
    text-align: center;
    z-index: 100;
    margin-bottom: 1rem;
  }

  #solutions-genecount-products-5 .timeline-col::before {
    display: none;
  }

  /*======== ABOUT TIMELINE ========================================*/

  .timeline::before {
    left: 2rem !important;
    right: auto !important;
    margin: 0 !important;
  }

  .timeline-item,
  .timeline-item:nth-child(odd),
  .timeline-item:nth-child(even) {
    width: calc(100% - 6rem) !important;
    margin: 0 0 2rem 6rem !important;
    padding-left: 0rem !important;
    text-align: left !important;
    position: relative !important;
  }

  .timeline-item::after {
    left: calc(-4rem - 1.5rem) !important;
    right: auto !important;
    transform: none !important;
  }

  .timeline-item.has-content::before {
    left: calc(-4rem - 1.5rem) !important;
    right: auto !important;
    transform: none !important;
  }

  /*======== RESSOUCES ========================================*/

  .resources-grid-item {
    display: block;
    gap: 2rem;
    position: relative;
  }

  .resources-grid-item-left {
    width: 100%;
  }

  .resources-grid-item-right {
    width: 100%;
  }

  .resources-grid-item h3 {
  }

  /*======== SEARCH AND FILTER ========================================*/

  .row--featured-post {
    padding-bottom: 0;
  }

  .searchandfilter {
    margin-bottom: 3rem;
  }

  #resources-search-filter {
    padding: 3rem 0;
  }

  #wrapper .searchandfilter h4 {
    text-transform: uppercase;
    margin: 0;
    padding: 0;
    font-size: inherit;
    margin-bottom: 1rem;
  }

  #wrapper li[data-sf-field-type='taxonomy'] {
    border-bottom: 1px solid;
    margin-bottom: 0rem;
    padding-bottom: 0rem;
    position: relative;
  }

  #wrapper .searchandfilter ul > li > ul:not(.children) {
    display: none;
    margin-top: 0;
    margin-bottom: 1.5rem;
    margin-left: 0rem;
  }

  #wrapper .searchandfilter ul .children {
    display: none !important;
  }

  #wrapper .sf-level-0 {
    display: flex;
    max-width: 100%;
  }

  #wrapper .sf-label-checkbox,
  #wrapper .sf-label-radio {
    display: inline-flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
  }

  #wrapper li[data-sf-field-type='taxonomy'] > h4 {
    position: relative;
    cursor: pointer;
    padding-right: 2rem;
    user-select: none;
  }

  #wrapper li[data-sf-field-type='taxonomy'] > h4::after {
    content: '+';
    position: absolute;
    right: 0;
    top: 50%;
    line-height: 1;
    transform: translateY(-50%);
    transition: transform 0.2s ease, opacity 0.2s ease;
    opacity: 0.9;
    font-size: 1.5rem;
    font-weight: 500;
  }

  #wrapper li[data-sf-field-type='taxonomy'].is-open > h4::after {
    content: '–';
  }

  #wrapper li[data-sf-field-type='taxonomy'].is-open > ul:not(.children) {
    display: block;
  }

  /*======== FOOTER ========================================*/

  footer .row-footer-top {
    border-bottom: 1px solid var(--lightgrey);
    padding-bottom: 2.5rem;
  }

  footer .copyright {
    left: 1.5rem;
    bottom: 1.75em;
    line-height: 1.5;
  }

  footer .back-to-top {
    position: fixed;
    right: 1.5rem;
    bottom: 2rem;
    cursor: pointer;
    display: none;
    z-index: 1000;
    line-height: 1.5;
  }
}
