/******************************************************************
Site Name: VocoVision
Author: Soliant MC

Stylesheet: Variables

Here is where we declare all our variables like colors, fonts,
base values, and defaults. We want to make sure this file ONLY
contains variables that way our files don't get all messy.
No one likes a mess.

******************************************************************/
/*********************
COLORS
*********************/
/* ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */
/*
* HOMEPAGE (TEMPLATE)
* use: Home
*/
.home-reasons {
  padding-top: 0;
  padding-bottom: 2rem;
  overflow: hidden;
}
@media (min-width: 768px) {
  .home-reasons {
    padding-bottom: 10rem;
  }
}
.home-reasons .block-reason-wrap {
  padding-bottom: 0;
}
@media (min-width: 768px) {
  .home-reasons .block-reason-wrap {
    align-items: start;
  }
  .home-reasons .block-reason-wrap .block-reason {
    height: 100%;
    padding-bottom: 0;
  }
}
@media (min-width: 1024px) {
  .home-reasons .block-reason-wrap {
    padding-top: 5rem;
  }
}
.home-reasons .block-reason-wrap .block-reason {
  background-color: #0a2f6c;
  color: #fff;
  padding: 5rem 6rem 4rem 4rem;
  margin-bottom: 4rem;
}

.home {
  --home-hero-offset: 8%;
}
.home .angle + section {
  padding-top: 0;
  margin-top: -8rem;
  z-index: 3;
}
.home .sec-with-edge {
  padding-top: 12rem;
}
.home .sec-with-edge h4 {
  color: #4f4f4f;
  font-size: 1.8rem;
  font-weight: 600;
  line-height: 1.56;
  margin-top: 3rem;
}
.home .sec-with-edge .link-list-columns {
  margin: 3rem 0 5rem;
  max-width: 592px;
}
.home .sec-with-edge .link-list-columns ul {
  flex: 1;
  list-style-type: none;
  padding: 0;
  margin: 0;
  padding-right: 20px;
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 1rem;
}
.home .sec-with-edge .link-list-columns li {
  padding: 5px 0;
  width: 100%;
  box-sizing: border-box;
}
.home .sec-with-edge .link-list-columns li a {
  font-size: 1.7rem;
  font-weight: 700;
  line-height: 1.4;
  -webkit-text-decoration-line: underline;
          text-decoration-line: underline;
}
.home .sec-with-edge .link-list-columns li a:hover {
  text-decoration: none;
}
@media (min-width: 768px) {
  .home .sec-with-edge h4 {
    font-size: 2.4rem;
    line-height: 1.35;
  }
  .home .sec-with-edge .link-list-columns {
    display: flex;
    flex-wrap: wrap;
  }
  .home .sec-with-edge .link-list-columns ul {
    flex: 0 0 calc(50% - 10px);
    width: auto;
  }
}
.home .page-hero {
  --hero-focus-ring: var(--navy-400);
  position: relative;
  overflow: hidden;
  background-image: url("/wp-content/themes/vocovision/images/headers/home-1.jpg");
  background-position: 70% 30%;
  background-size: cover;
  background-repeat: no-repeat;
  padding-bottom: var(--home-hero-offset);
}
.home .page-hero > * {
  position: relative;
  z-index: 1;
}
.home .page-hero.hero-fade {
  background-image: none;
}
.home .page-hero.hero-fade::before, .home .page-hero.hero-fade::after {
  content: "";
  position: absolute;
  inset: 0;
  background-position: 70% 30%;
  background-size: cover;
  background-repeat: no-repeat;
  transition: opacity 900ms ease-in-out;
  z-index: 0;
}
.home .page-hero.hero-fade::before {
  opacity: 1;
  background-image: var(--hero-bg-current, url("/wp-content/themes/vocovision/images/headers/home-1.jpg"));
}
.home .page-hero.hero-fade::after {
  opacity: 0;
  background-image: var(--hero-bg-next, var(--hero-bg-current));
}
.home .page-hero.hero-fade.is-fading::after {
  opacity: 1;
}
.home .page-hero.hero-fade.hero-slide-1 {
  --hero-bg-current: url('/wp-content/themes/vocovision/images/headers/home-1.jpg');
}
.home .page-hero.hero-fade.hero-slide-2 {
  --hero-bg-current: url('/wp-content/themes/vocovision/images/headers/home-2.jpg');
}
.home .page-hero.hero-fade.hero-slide-3 {
  --hero-bg-current: url('/wp-content/themes/vocovision/images/headers/home-3.jpg');
}
.home .page-hero.hero-fade.hero-slide-4 {
  --hero-bg-current: url('/wp-content/themes/vocovision/images/headers/home-4.jpg');
}
.home .page-hero.hero-fade.hero-slide-next-1 {
  --hero-bg-next: url('/wp-content/themes/vocovision/images/headers/home-1.jpg');
}
.home .page-hero.hero-fade.hero-slide-next-2 {
  --hero-bg-next: url('/wp-content/themes/vocovision/images/headers/home-2.jpg');
}
.home .page-hero.hero-fade.hero-slide-next-3 {
  --hero-bg-next: url('/wp-content/themes/vocovision/images/headers/home-3.jpg');
}
.home .page-hero.hero-fade.hero-slide-next-4 {
  --hero-bg-next: url('/wp-content/themes/vocovision/images/headers/home-4.jpg');
}
.home .page-hero .content-wrap {
  padding-bottom: 1rem;
}
.home .page-hero .hero-content a:focus-visible,
.home .page-hero .hero-content button:focus-visible,
.home .page-hero .hero-content [role=button]:focus-visible,
.home .page-hero .hero-content [tabindex]:not([tabindex="-1"]):focus-visible {
  outline: 2px solid var(--hero-focus-ring);
  outline-offset: 2px;
}
@media (min-width: 1900px) {
  .home .page-hero {
    background-position: 0 45%;
  }
}
.home .page-hero .hero-content {
  color: var(--navy-200);
}
.home .home-stats {
  padding: 7.4rem 1.5rem 10rem;
}
.home .home-stats .block-stats-wrap {
  display: flex;
  flex-direction: column;
  gap: 6rem;
  margin: 1.4rem 0 5.4rem;
  font-size: 2.4rem;
  font-weight: 600;
  line-height: 1.35;
}
.home .home-stats .block-stats-wrap span {
  font-size: 2.8rem;
  font-weight: 900;
  margin-bottom: 1.8rem;
}
.home .home-stats .stat {
  padding: 0;
  margin: 0 auto;
  background-color: var(--navy-200);
  flex: 1 1 auto;
  max-width: 369px;
}
@media screen and (min-width: 768px) {
  .home .home-stats {
    padding: 2rem 0;
  }
  .home .home-stats .block-stats-wrap {
    padding: 4rem 0 6.4rem;
    flex-direction: row;
    -moz-column-gap: 1rem;
         column-gap: 1rem;
    justify-content: space-between;
    width: 100%;
  }
  .home .home-stats .block-stats-wrap .stat {
    flex: 1 1 369px;
  }
}
@media screen and (min-width: 1030px) {
  .home .home-stats {
    margin-top: calc(var(--home-hero-offset) * -1);
    padding-top: var(--home-hero-offset);
    padding-bottom: var(--home-hero-offset);
  }
  .home .home-stats + section {
    margin-top: -10rem;
  }
  .home .home-stats + section h3 {
    margin-top: 12rem;
  }
}
.home .section--image-copy-block .content-image {
  margin: 0 auto;
  display: block;
}
@media (max-width: 1029px) {
  .home .page-hero:not(.hero-fade)::after {
    content: "";
    position: absolute;
    inset: 0;
    background-color: rgba(255, 255, 255, 0.4);
    z-index: 0;
  }
  .home .page-hero.hero-fade::before, .home .page-hero.hero-fade::after {
    background-image: linear-gradient(rgba(255, 255, 255, 0.4), rgba(255, 255, 255, 0.4)), var(--hero-bg-current, url("/wp-content/themes/vocovision/images/headers/home-1.jpg"));
  }
  .home .page-hero.hero-fade::after {
    background-image: linear-gradient(rgba(255, 255, 255, 0.4), rgba(255, 255, 255, 0.4)), var(--hero-bg-next, var(--hero-bg-current, url("/wp-content/themes/vocovision/images/headers/home-1.jpg")));
  }
}

.page-template-page-home .section--latest-slp-jobs h4 {
  text-align: left;
}
.page-template-page-home .section--latest-slp-jobs .owl-theme .owl-dots {
  margin-top: 4rem;
}
.page-template-page-home .section--latest-slp-jobs .card-footer li {
  text-align: left;
}
@media screen and (min-width: 768px) {
  .page-template-page-home .section--latest-slp-jobs footer.job-carousel-footer {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    padding: 0 1.5rem;
    margin-top: 2rem;
    gap: 1rem;
  }
  .page-template-page-home .section--latest-slp-jobs footer.job-carousel-footer p {
    margin: 0;
    font-size: 2.4rem;
    font-weight: 600;
  }
}
@media (min-width: 1030px) {
  .page-template-page-home .section--latest-slp-jobs h3 {
    font-size: 3.6rem;
    font-weight: 900;
  }
  .page-template-page-home .section--latest-slp-jobs .card-footer {
    justify-content: space-between;
  }
}
