:root {
  --heading-color: #000;
  --para-color: #717171;
  --textover-color: #0A0A0A;
  --bg-alt: #FCF8EE;
  --bg-alt-dark: #EEE7D7;
  --white: #fff;
  --anchor-color: #2EB7E5;
  --footer-border-color: #BFBFBF;
  --upper-nav-bg: #003A5A;
  --dropdown-border-color: #F2F2F2;
  --sml-menu-border-color: #EAEAEA;
  --footer-statement-box-border: #D9D9D9;
  --footer-statement-box-background: #FAFAFA;
  --hero-background: #ede7d7;
  --pricing-border:#D6D6D6;
  --cart-total-bg: #fcf8ee;
}

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

body {
  font-size: 16px;
  margin: 0;
  color: var(--para-color);
}

body.no-scroll {
  overflow: hidden;
}

h1,
h2,
h3,
p {
  margin: 0;
}

h1,
h2,
h3 {
  color: var(--heading-color);
}

h1 {
  font-size: 43px;
  line-height: 52.03px;
  margin-bottom: 20px;
}

section {
  padding-top: 80px;
  padding-bottom: 80px;
}
section:not(.bg-alt):not(.bg-alt-dark) + section:not(.bg-alt):not(.bg-alt-dark):not(.bg-alt):not(.bg-alt-dark) {
  padding-top: 0;
}
section.bg-alt + .bg-alt {
  padding-top: 0;
}
section.bg-alt-dark + .bg-alt-dark {
  padding-top: 0;
}

.section-title {
  max-width: 828px;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 60px;
}
.section-title h2 {
  font-size: 32px;
  line-height: 38.72px;
  margin: 0;
}
.section-title h2 + p {
  margin-top: 20px;
}

h3 {
  font-size: 20px;
  line-height: 30px;
}

p {
  line-height: 28px;
}
p strong {
  color: var(--heading-color);
}

.btn-cta,
.btn-cta-white {
  padding: 16px 40px;
  border-radius: 30px;
  text-decoration: none;
  display: inline-block;
  transition: 0.5s ease-in-out;
  text-transform: uppercase;
}
.btn-cta:hover,
.btn-cta-white:hover {
  opacity: 0.8;
}
.btn-cta.white,
.btn-cta-white.white {
  background: var(--white);
  color: var(--heading-color);
}
.btn-cta.outlined,
.btn-cta-white.outlined {
  background: transparent;
}
.btn-cta.outlined.white,
.btn-cta-white.outlined.white {
  border: 1px solid var(--white);
  color: var(--white);
}
.btn-cta.outlined.dark,
.btn-cta-white.outlined.dark {
  border: 1px solid var(--heading-color);
  color: var(--heading-color);
}

.btn-cta {
  background: var(--heading-color);
  color: var(--white);
}

.btn-cta-white {
  background: var(--white);
  color: var(--heading-color);
}

.cpg-text-over {
  font-size: 16px;
  line-height: 24px;
  letter-spacing: 0.13em;
  color: var(--textover-color);
  margin-bottom: 12px;
  text-transform: uppercase;
  display: inline-block;
}

.bg-alt {
  background: var(--bg-alt);
}

.bg-alt-dark {
  background: var(--bg-alt-dark);
}

.cp-logo {
  display: inline-block;
}

ul li {
  list-style: none;
}

a {
  transition: 0.5s ease-in-out;
  text-decoration: none;
}
a:hover {
  opacity: 0.8;
}

.banner-background {
  background: var(--bg-alt);
}

.dark-text {
  color: var(--heading-color);
}

.light-text {
  color: var(--para-color);
}

.inner-banner ul.nav-wrapper {
  display: flex;
  gap: 28px;
  align-items: center;
  margin-bottom: 12px;
  padding-bottom: 0;
}
.inner-banner ul.nav-wrapper h3 {
  font-size: 14px;
  line-height: 21px;
}
.inner-banner ul.nav-wrapper.no-border {
  border-bottom: none;
}
.inner-banner ul.nav-wrapper.no-border li strong {
  color: var(--heading-color);
}
.inner-banner ul.nav-wrapper.no-border li:not(:last-child) {
  position: relative;
}
.inner-banner ul.nav-wrapper.no-border li:not(:last-child)::after {
  content: "";
  background: url("../images/icons/arrow-right.svg");
  background-size: contain;
  background-repeat: no-repeat;
  width: 16px;
  height: 16px;
  position: absolute;
  right: -20px;
  top: 50%;
  transform: translateY(-50%);
}

.arrows-wrapper {
  gap: 24px;
  justify-content: flex-end;
}
.arrows-wrapper img {
  height: 32px;
  width: 32px;
  cursor: pointer;
}
.arrows-wrapper img.first-arrow {
  transform: scaleX(-1);
}
.arrows-wrapper img.disabled {
  opacity: 0.5;
  pointer-events: none;
}

.cp-overlay {
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.3019607843);
  display: none;
  z-index: 9;
}
.cp-overlay:hover {
  opacity: 1;
}

a {
  transition: 0.4s;
  cursor: pointer;
}
a:Hover {
  opacity: 0.8;
}

.cp-incrementor {
  border: 1px solid var(--heading-color);
  border-radius: 1000px;
  display: flex;
  align-items: center;
  width: 90px;
  justify-content: space-between;
  padding: 14px 12px;
  gap: 8px;
}
.cp-incrementor input {
  border: none;
  color: var(--heading-color);
  width: 3ch;
  -moz-appearance: textfield;
  -webkit-appearance: textfield;
          appearance: textfield;
}
.cp-incrementor input::-webkit-outer-spin-button, .cp-incrementor input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  appearance: none;
  margin: 0;
}
.cp-incrementor input:focus {
  outline: none;
}
.cp-incrementor a {
  color: var(--heading-color);
}