/******************************************************************
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
*********************/
.page-template-page-contact-us .contact-us-breadcrumb {
  margin: 0 0 2rem;
  color: #fff;
  text-align: left;
}
.page-template-page-contact-us .contact-us-breadcrumb a,
.page-template-page-contact-us .contact-us-breadcrumb .breadcrumb_last {
  color: #fff;
}
.page-template-page-contact-us .contact-us-hero.page-hero {
  --page-hero-overlay: inset 0 0 0 2000px var(--lime-200);
  background-color: var(--lime-200);
  background-image: none;
}
.page-template-page-contact-us .contact-us-hero.page-hero .hero-content {
  color: var(--navy-400);
  text-align: center;
}
.page-template-page-contact-us .contact-us-hero.page-hero h1 {
  margin-bottom: 2rem;
  color: var(--navy-200);
  font-size: 4.8rem;
  font-weight: 900;
  line-height: 1.05;
  text-transform: none;
}
.page-template-page-contact-us .contact-us-hero__row {
  align-items: stretch;
}
.page-template-page-contact-us .contact-us-hero__content {
  position: relative;
  padding: 0 0 6rem;
}
.page-template-page-contact-us .contact-us-hero__content::after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: 0;
  width: min(31rem, 86vw);
  aspect-ratio: 678/1048;
  transform: translateX(-50%);
  background: url("/wp-content/themes/vocovision/images/headers/contact-us-bg-cutout.webp") no-repeat center bottom/contain;
  opacity: 0.16;
  pointer-events: none;
}
.page-template-page-contact-us .contact-us-hero__content-copy {
  max-width: 52rem;
  margin: 0 auto;
  position: relative;
  z-index: 1;
}
.page-template-page-contact-us .contact-us-hero__content-copy > *:last-child {
  margin-bottom: 0;
}
.page-template-page-contact-us .contact-us-hero__content-copy p {
  margin-bottom: 1.6rem;
  font-size: 1.7rem;
  font-weight: 500;
  line-height: 1.45;
}
@media screen and (min-width: 768px) {
  .page-template-page-contact-us .contact-us-hero.page-hero {
    background-image: none;
  }
  .page-template-page-contact-us .contact-us-hero.page-hero .hero-content {
    margin-top: 3rem;
  }
  .page-template-page-contact-us .contact-us-hero__content::after {
    width: 34rem;
    opacity: 0.18;
  }
  .page-template-page-contact-us .contact-us-hero__content-copy h1 {
    font-size: 6.2rem;
  }
}
@media screen and (min-width: 1240px) {
  .page-template-page-contact-us .contact-us-hero.page-hero {
    --page-hero-overlay: none;
    background-color: #a2c27b;
    background-image: none;
  }
  .page-template-page-contact-us .contact-us-hero.page-hero .hero-content {
    margin-top: 0;
    padding-top: 0;
    text-align: left;
  }
  .page-template-page-contact-us .contact-us-hero.page-hero h1 {
    font-size: 5.8rem;
  }
  .page-template-page-contact-us .contact-us-hero__row {
    position: relative;
  }
  .page-template-page-contact-us .contact-us-hero__row::before {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    width: 67.8rem;
    height: 104.8rem;
    background: url("/wp-content/themes/vocovision/images/headers/contact-us-bg-cutout-lg.webp") no-repeat left bottom/45rem auto;
    pointer-events: none;
    z-index: 0;
  }
  .page-template-page-contact-us .contact-us-hero__row > * {
    position: relative;
    z-index: 1;
  }
  .page-template-page-contact-us .contact-us-hero__content {
    min-height: 88rem;
    padding-bottom: 20rem;
  }
  .page-template-page-contact-us .contact-us-hero__content::before {
    content: none;
    display: none;
  }
  .page-template-page-contact-us .contact-us-hero__content::after {
    content: none;
    display: none;
  }
  .page-template-page-contact-us .contact-us-hero__content-copy {
    max-width: 58rem;
    margin: 0;
  }
}
@media screen and (min-width: 1480px) {
  .page-template-page-contact-us .contact-us-hero__row::before {
    background: url("/wp-content/themes/vocovision/images/headers/contact-us-bg-cutout-lg.webp") no-repeat left bottom/50rem auto;
  }
}
.page-template-page-contact-us .contact-us-form {
  margin-inline: calc(50% - 50vw);
  padding: 4.2rem 2.8rem 5rem;
  background-color: var(--navy-300);
}
.page-template-page-contact-us .contact-us-form .gfield {
  max-width: 100%;
}
.page-template-page-contact-us .contact-us-form .gform_wrapper {
  margin: 0 auto;
}
.page-template-page-contact-us .contact-us-form .gform_wrapper.gravity-theme .gform-icon--circle-error::before {
  content: none;
  display: none;
  background-image: none;
}
.page-template-page-contact-us .contact-us-form .gform_wrapper.gravity-theme .gform_validation_errors {
  width: 100%;
  margin: 0 0 2.4rem;
  padding: 1.6rem;
  border: 2px solid #fff;
  border-radius: 0;
  box-shadow: none;
  background: #c32b0e;
  color: #fff;
}
.page-template-page-contact-us .contact-us-form .gform_wrapper.gravity-theme .gform_validation_errors .gform_submission_error {
  margin: 0;
  color: #fff;
  font-size: 1.6rem;
  font-weight: 500;
  line-height: 1.35;
  text-align: left;
  text-transform: none;
}
.page-template-page-contact-us .contact-us-form .gform_wrapper.gravity-theme .gform_validation_errors ol,
.page-template-page-contact-us .contact-us-form .gform_wrapper.gravity-theme .gform_validation_errors ul {
  margin: 1.6rem 0 0;
  padding-left: 2.4rem;
}
.page-template-page-contact-us .contact-us-form .gform_wrapper.gravity-theme .gform_validation_errors li {
  margin: 0 0 0.8rem;
  color: #fff;
  font-size: 1.6rem;
  line-height: 1.35;
}
.page-template-page-contact-us .contact-us-form .gform_wrapper.gravity-theme .gform_validation_errors li:last-child {
  margin-bottom: 0;
}
.page-template-page-contact-us .contact-us-form .gform_wrapper.gravity-theme .gform_validation_errors li a {
  color: #fff;
  font-size: 1.6rem;
  text-decoration: none;
}
.page-template-page-contact-us .contact-us-form .gform_wrapper.gravity-theme .gform_validation_errors li a:hover, .page-template-page-contact-us .contact-us-form .gform_wrapper.gravity-theme .gform_validation_errors li a:focus {
  text-decoration: underline;
}
.page-template-page-contact-us .contact-us-form .gform_wrapper.gravity-theme .gform_fields {
  row-gap: 1.8rem;
}
.page-template-page-contact-us .contact-us-form .gform_wrapper.gravity-theme .gfield_label,
.page-template-page-contact-us .contact-us-form .gform_wrapper.gravity-theme .gform-field-label,
.page-template-page-contact-us .contact-us-form .gform_wrapper.gravity-theme legend,
.page-template-page-contact-us .contact-us-form .gform_wrapper.gravity-theme .gform_required_legend {
  color: #fff;
  text-transform: none;
}
.page-template-page-contact-us .contact-us-form .gform_wrapper.gravity-theme .gfield_label,
.page-template-page-contact-us .contact-us-form .gform_wrapper.gravity-theme .gform-field-label,
.page-template-page-contact-us .contact-us-form .gform_wrapper.gravity-theme legend {
  font-size: 1.6rem;
  font-weight: 600;
  letter-spacing: 0.08rem;
  line-height: 1.15;
}
.page-template-page-contact-us .contact-us-form .gform_wrapper.gravity-theme .gform_required_legend {
  display: block;
  margin-bottom: 2.4rem;
  font-size: 1.4rem;
  font-weight: 400;
  line-height: 1.35;
  text-align: right;
}
.page-template-page-contact-us .contact-us-form .gform_wrapper.gravity-theme .gfield_checkbox label,
.page-template-page-contact-us .contact-us-form .gform_wrapper.gravity-theme .gfield_checkbox label a,
.page-template-page-contact-us .contact-us-form .gform_wrapper.gravity-theme .gfield_consent_label,
.page-template-page-contact-us .contact-us-form .gform_wrapper.gravity-theme .gfield_consent_label a,
.page-template-page-contact-us .contact-us-form .gform_wrapper.gravity-theme .gfield_description,
.page-template-page-contact-us .contact-us-form .gform_wrapper.gravity-theme .ginput_counter {
  color: #fff;
}
.page-template-page-contact-us .contact-us-form .gform_wrapper.gravity-theme .gfield textarea {
  min-height: 19rem;
}
.page-template-page-contact-us .contact-us-form .gform_wrapper.gravity-theme .gform_footer {
  align-items: center;
  padding-top: 3rem;
}
.page-template-page-contact-us .contact-us-form .gform_wrapper.gravity-theme .gform_footer input[type=submit] {
  border: 0;
  border-radius: 0.4rem;
  color: #fff;
  background-color: var(--fuchsia-aa);
  padding: 1.4rem 3.8rem;
  font-size: 1.8rem;
  font-weight: 700;
  line-height: 1;
}
@media screen and (min-width: 1240px) {
  .page-template-page-contact-us .contact-us-form {
    margin-inline: 0;
    margin-bottom: 12rem;
    padding: 4rem 4.2rem 7rem;
    width: 100%;
    max-width: 693px;
  }
  .page-template-page-contact-us .contact-us-form .gform_wrapper {
    max-width: 45.2rem;
  }
}
.page-template-page-contact-us .contact-us-phone-strip {
  padding: 3.2rem 0 3.6rem;
  text-align: center;
  background-color: #fff;
}
.page-template-page-contact-us .contact-us-phone-strip__eyebrow {
  margin: 0;
  color: var(--navy-300);
  font-size: 1.8rem;
  font-weight: 600;
  line-height: 1.56;
}
.page-template-page-contact-us .contact-us-phone-strip__number {
  margin: 0;
  font-size: 2.4rem;
  font-weight: 900;
  line-height: normal;
  color: var(--teal-aa);
}
.page-template-page-contact-us .contact-us-phone-strip__number a {
  font-size: 2.4rem;
  font-weight: 900;
  line-height: normal;
  color: var(--teal-aa);
  text-decoration: none;
}
.page-template-page-contact-us .contact-us-phone-strip__number a:hover, .page-template-page-contact-us .contact-us-phone-strip__number a:focus {
  text-decoration: underline;
}
@media screen and (min-width: 768px) {
  .page-template-page-contact-us .contact-us-phone-strip {
    padding: 4rem 0 4.4rem;
  }
}
@media screen and (min-width: 1240px) {
  .page-template-page-contact-us .contact-us-phone-strip {
    padding: 7.2rem 0;
  }
  .page-template-page-contact-us .contact-us-phone-strip__number {
    font-size: 3.4rem;
  }
}