/*
Global Variables
*/
:root {
  --font-heading: "politica", sans-serif;
  --font-heading-cd: "politica", sans-serif;
  --font-heading-xp: "politica", sans-serif;
  --font-nav: "open-sans", sans-serif;
  --font-body: "new-atten-italic", sans-serif;
  --font-button: "new-atten-italic", sans-serif;
  --font-body-large: clamp(1.375rem, 1.2813rem + 0.25vw, 1.5rem);
  --color-yellow: #FFCC58;
  --color-primary: var(--color-yellow);
  --color-green: #367A71;
  --color-secondary: var(--color-green);
  --color-cream: #FFF8EB;
  --color-cream-dark: #FFFAF2;
  --color-black: #3F4343;
  --color-red-gradient: linear-gradient(var(--color-red) 0%, color-mix(in srgb, var(--color-red) 80%, var(--color-cream)) 100%);
  --expo-out: cubic-bezier(.16, 1, .3, 1);
  --color-body: var(--color-black);
  --header-height: 100px;
  --border-radius-large: 40px;
  --border-radius-small: 20px;
}
@media screen and (max-width: 1100px) {
  :root {
    --border-radius-large: 20px;
    --font-body-large: 1rem;
  }
}

/*
Font Families
Font files imported at the top of _fonts.scss 
*/
/*
Mixins
Add mixins to any css page using @include
*/
/*
CSS Transitions

e.g.
.element{
	@include transition( background .2s ease-out )
} 
*/
/*
Truncate text to specific number of lines with an ellipsis

e.g. include up to three lines.
.element{
    @include truncate-text(3);
}
*/
/*
Style placholder text for inputs

e.g.
input, 
textarea { 
    @include placeholder {
        color: #333333;
    }
}
*/
.bg-dark {
  --color-body: white;
  --color-heading: white;
  --bg-color: var(--color-black);
}

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

.bg-red {
  --color-text: var(--color-white);
  --bg-color: var(--color-red);
}
.bg-red p,
.bg-red ul,
.bg-red a {
  color: var(--color-grey-light);
}

@property --gradient-start {
  syntax: "<percentage>";
  inherits: true;
  initial-value: 100%;
}
@property --gradient-end {
  syntax: "<percentage>";
  inherits: true;
  initial-value: 80%;
}
@property --depth {
  syntax: "<integer>";
  inherits: false;
  initial-value: 1;
}
.bg-cream {
  --bg-color: var(--color-cream);
}
.bg-cream + .bg-cream {
  padding-top: 0;
}

.bg-cream-gradient {
  --bg-color: var(--color-cream);
  --gradient-start: calc(100% - (var(--depth) - 1) * 20%);
  --gradient-end: calc(100% - var(--depth) * 20%);
  background: -webkit-gradient(linear, left top, left bottom, from(color-mix(in srgb, var(--bg-color) var(--gradient-start), white)), to(color-mix(in srgb, var(--bg-color) var(--gradient-end), white)));
  background: linear-gradient(to bottom, color-mix(in srgb, var(--bg-color) var(--gradient-start), white) 0%, color-mix(in srgb, var(--bg-color) var(--gradient-end), white) 100%);
}
.bg-cream-gradient + .bg-cream-gradient {
  padding-top: 5%;
}

.bg-green {
  background-color: var(--color-green);
  color: var(--color-white);
}
.bg-green h1,
.bg-green h2,
.bg-green h3,
.bg-green h4,
.bg-green h5,
.bg-green h6 {
  color: var(--color-cream);
}

.bg-yellow {
  background-color: var(--color-yellow);
  color: var(--color-black);
}
.bg-yellow h1,
.bg-yellow h2,
.bg-yellow h3,
.bg-yellow h4,
.bg-yellow h5,
.bg-yellow h6 {
  color: var(--color-black);
}

.feature-slider-section {
  position: relative;
}
.feature-slider-section.content-left .button-prev {
  display: none;
}
.feature-slider-section.content-left .button-next {
  right: 0;
  -webkit-transform: translateX(50%);
          transform: translateX(50%);
}
.feature-slider-section.content-right .feature-content-slider {
  -webkit-box-ordinal-group: 3;
      -ms-flex-order: 2;
          order: 2;
}
.feature-slider-section.content-right .feature-image-slider {
  padding-right: 0;
  padding-left: 5%;
  -webkit-box-ordinal-group: 2;
      -ms-flex-order: 1;
          order: 1;
}
.feature-slider-section.content-right .button-next {
  right: unset;
  left: 0;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
}
.feature-slider-section .controls {
  position: absolute;
  bottom: 1em;
  left: 1em;
  z-index: 2;
}
@media screen and (max-width: 768px) {
  .feature-slider-section .controls {
    margin-top: 2em;
    gap: 1em;
    width: 100%;
    -webkit-box-pack: start;
        -ms-flex-pack: start;
            justify-content: flex-start;
  }
}
.feature-slider-section .controls .swiper-button-next,
.feature-slider-section .controls .swiper-button-prev {
  display: none;
}
@media screen and (max-width: 768px) {
  .feature-slider-section .controls .swiper-button-next,
  .feature-slider-section .controls .swiper-button-prev {
    position: relative;
    -webkit-transform: unset;
            transform: unset;
  }
}
.feature-slider-section .controls .swiper-button-next:hover,
.feature-slider-section .controls .swiper-button-prev:hover {
  background: var(--color-red-80);
}
@media screen and (max-width: 768px) {
  .feature-slider-section .controls .swiper-pagination {
    text-align: left;
    -webkit-box-pack: start;
        -ms-flex-pack: start;
            justify-content: flex-start;
  }
}
.feature-slider-section .controls .swiper-pagination .swiper-pagination-bullet {
  background: var(--color-cream);
  opacity: 0.5;
}
.feature-slider-section .controls .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active {
  background: var(--color-cream);
  opacity: 1;
}
.feature-slider-section .inner {
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
@media screen and (max-width: 768px) {
  .feature-slider-section .inner {
    -webkit-box-orient: vertical;
    -webkit-box-direction: reverse;
        -ms-flex-direction: column-reverse;
            flex-direction: column-reverse;
  }
}
.feature-slider-section .feature-content-slider {
  width: 50%;
  -webkit-box-flex: 0;
      -ms-flex: 0 0 50%;
          flex: 0 0 50%;
  position: relative;
  z-index: 2;
  padding-right: 5%;
}
@media screen and (max-width: 768px) {
  .feature-slider-section .feature-content-slider {
    width: 100%;
    -webkit-box-flex: 0;
        -ms-flex: 0 0 100%;
            flex: 0 0 100%;
  }
}
.feature-slider-section .feature-content-slider .content-wrapper {
  max-width: 55ch;
  margin: auto;
  text-wrap: balance;
  font-size: var(--font-body-large);
}
@media screen and (max-width: 768px) {
  .feature-slider-section .feature-content-slider .content-wrapper {
    max-width: 100%;
  }
}
.feature-slider-section .feature-content-slider .graphic-wrapper {
  min-height: 200px;
}
@media screen and (max-width: 768px) {
  .feature-slider-section .feature-content-slider .graphic-wrapper {
    min-height: 100px;
    margin-top: 5%;
  }
}
.feature-slider-section .feature-content-slider .graphic-wrapper .graphic-inner {
  position: absolute;
  left: -20%;
  width: 100%;
}
@media screen and (max-width: 768px) {
  .feature-slider-section .feature-content-slider .graphic-wrapper .graphic-inner {
    position: static;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
  }
}
.feature-slider-section .feature-content-slider .graphic-wrapper img {
  max-width: 30vw;
}
@media screen and (max-width: 768px) {
  .feature-slider-section .feature-content-slider .graphic-wrapper img {
    max-width: 300px;
    margin: auto;
  }
}
.feature-slider-section .feature-image-slider {
  position: relative;
  overflow: hidden;
  width: 50%;
}
@media screen and (max-width: 768px) {
  .feature-slider-section .feature-image-slider {
    width: 100%;
    border-radius: 0;
    margin-bottom: 1em;
    overflow: visible;
  }
}
.feature-slider-section .feature-image-slider .swiper-slide .img-wrapper {
  position: relative;
  aspect-ratio: 10/9;
  border-radius: var(--border-radius-large);
  overflow: hidden;
}
.feature-slider-section .feature-image-slider .swiper-slide img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}/*# sourceMappingURL=feature-slider.css.map */