/* Layout */
.contact-content {
  margin-bottom: calc(1.525rem + 3.3vw);
  position: relative;
  background: linear-gradient(90deg, #FAFAFA 0 45%, transparent 45%);
}

@media (max-width: 768px) {
  .contact-content {
    background: linear-gradient(180deg, #FAFAFA 0 46%, transparent 46%);
    padding-top: 136px !important;
  }
}
  .contact-content {
    margin-bottom: 4rem;
  }

  @media (min-width: 768px) {
    .page-template-default .content > section.contact-section.contact-content:first-child
   {
    margin-top: 73px !important;
  }
}

.contact-content > .wrap {
  width: 100%;
  max-width: 73.5em;
  margin: 0 auto;
  padding-right: 0.75em;
  padding-left: 0.75em;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: calc(1.525rem + 3.3vw);
}
@media (min-width: 1200px) {
  .contact-content > .wrap {
    gap: 4rem;
  }
}
@media (max-width: 809px) {
  .contact-content > .wrap {
    grid-template-columns: 1fr;
  }
}

/* Left panel */
.contact-content .text {
    padding-right: 64px;
}


@media (max-width: 768px) {
  .contact-content .text {
    padding-right: 0;
  }
}
.contact-content .text h1 {
  margin-bottom: 1rem;
  color: var(--primary-900, #1E3851);
    font-size: 46px;
    font-weight: 600;
    line-height: 56px; /* 121.739% */
    letter-spacing: -0.92px;
}

.contact-content .contact-intro {
  color: #525252;
font-size: 20px;
font-weight: 400;
line-height: 32px;
padding-right: 100px;
margin-bottom: 32px;
}

@media (max-width: 768px) {
  .contact-content .contact-intro {
    padding-right: 0;
    text-align: center;
    font-size: 16px;
    font-weight: 400;
    line-height: 24px;
  }

  .contact-content .text h1 {
    text-align: center;
    font-size: 30px;
    font-weight: 600;
    line-height: 40px;
  }
}

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

.contact-content .text ul li {
  display: flex;
  align-items: flex-start;
  gap: 1rem;
  color: var(--primary-900, #1E3851);
font-size: 20px;
font-weight: 600;
line-height: 32px;
margin-bottom: 2rem;
}

@media (max-width: 768px) {
    .contact-content .text ul {
        margin-bottom: 2rem;
    }
  .contact-content .text ul li { margin-bottom: 32px; }
}

.contact-content .text ul li:last-child { margin-bottom: 0; }
.contact-content .text ul li > svg {
  flex: 0 0 auto;
    fill: transparent;
}
@media (max-width: 768px) {
  .contact-content .text ul li > svg {
    width: 24px;
    height: 24px;
  }
}

.contact-content .text ul p {
  margin: 0 0 .25rem 0;
}
.contact-content .text ul p span {
  display: block;
  margin-bottom: 8px;
}
@media (max-width: 768px) {
  .contact-content .text ul p span {
    color: var(--primary-900, #1E3851);
    font-size: 20px;
    font-weight: 600;
    line-height: 32px;
  }
}

.contact-content .text ul p strong,
.contact-content .text ul p a {
  display: block;
  margin-bottom: 20px;
  color:  #525252;
font-size: 16px;
font-style: normal;
font-weight: 400;
line-height: 24px;
}
.contact-content .text a.contact-cta,
.contact-content .text a {
  display: inline-block;
  color: #23479A;
font-size: 16px;
font-weight: 600;
line-height: 24px;
text-decoration: none;
border-bottom: none;
}

.contact-content .text a {
    text-decoration: underline;
}

/* Hours note */
.contact-content .contact-hours {
  color:#525252;
font-size: 14px;
font-weight: 400;
line-height: 22px; /* 157.143% */
letter-spacing: -0.14px;
}

@media (max-width: 768px) {
  .contact-content .contact-hours {
    text-align: center;
  }
}

/* Form side */
.contact-content .form {
  background: #fff;
}
@media (max-width: 768px) {
  .contact-content .form {
    margin-top: 48px;
  }
}


/* Gravity Forms grid to match the design (2-up at desktop) */
.contact-content .gform_fields {
  display: grid;
  grid-template-columns: 1fr 1fr;
  align-items: flex-start;
  margin-bottom: 1.5em;
  gap: calc(1.325rem + 0.9vw) calc(1.375rem + 1.5vw);
}
  .contact-content .gform_fields { gap: 1.5rem 1.875rem; }

.contact-content .gfield { grid-column: auto / span 2; }
.contact-content .gfield.half { grid-column: auto; } /* add .half on First/Last name fields via GF */
@media (max-width: 560px) {
  .contact-content .gform_fields { grid-template-columns: 1fr; }
  .contact-content .gfield { grid-column: auto; }
}

/* Small bits */
.contact-content .gfield_label {
  display: block;
  color:#525252;
font-size: 16px;
font-weight: 400;
line-height: 24px;
margin-bottom: 6px;
}
.contact-content ::placeholder { color: rgba(76, 83, 112, 0.4); }
.contact-content .gform_footer .btn-solid {
  display: block;
  width: 100%;
}
.contact-content .validation_error,
.contact-content .validation_message {
  color: #ea4335;
}

.contact-content .gform_confirmation_message h2 { 
color:#1E3851;
font-size: 32px;
font-weight: 600;
line-height: 40px; /* 125% */
letter-spacing: -0.64px;
}
.contact-content .gform_confirmation_message {
  text-align: center;
  padding-bottom: 1.5rem;
  color: var(--neutral-700, #525252);
text-align: center;
font-size: 16px;
font-weight: 400;
line-height: 24px;
}

/* Base (unchanged from yours + a tiny transition) */
.contact-content input[type="text"],
.contact-content input[type="password"],
.contact-content input[type="search"],
.contact-content input[type="email"],
.contact-content input[type="url"],
.contact-content input[type="number"],
.contact-content input[type="tel"],
.contact-content select,
.contact-content textarea {
  border-radius: 8px;
  border: 1px solid #E4E4E4;
  background: #FFF;
  box-shadow: 0 1px 2px 0 rgba(84, 79, 99, 0.05);
  transition: border-color .15s ease, box-shadow .15s ease, background-color .15s ease;
  padding: 12px 16px;
}

/* Hover */
.contact-content input[type="text"]:hover,
.contact-content input[type="password"]:hover,
.contact-content input[type="search"]:hover,
.contact-content input[type="email"]:hover,
.contact-content input[type="url"]:hover,
.contact-content input[type="number"]:hover,
.contact-content input[type="tel"]:hover,
.contact-content select:hover,
.contact-content textarea:hover {
  border-radius: 8px;                 /* redundant but explicit per request */
  border: 1px solid #C2D4F8;
}

/* Focus */
.contact-content input[type="text"]:focus,
.contact-content input[type="password"]:focus,
.contact-content input[type="search"]:focus,
.contact-content input[type="email"]:focus,
.contact-content input[type="url"]:focus,
.contact-content input[type="number"]:focus,
.contact-content input[type="tel"]:focus,
.contact-content select:focus,
.contact-content textarea:focus,
.contact-content input[type="text"]:focus-visible,
.contact-content input[type="password"]:focus-visible,
.contact-content input[type="search"]:focus-visible,
.contact-content input[type="email"]:focus-visible,
.contact-content input[type="url"]:focus-visible,
.contact-content input[type="number"]:focus-visible,
.contact-content input[type="tel"]:focus-visible,
.contact-content select:focus-visible,
.contact-content textarea:focus-visible {
  background: var(--neutral-0, #FFF);
  border: 1px solid #C2D4F8;
  box-shadow: 0 0 0 4px #E9EFFF;      /* focus ring */
  outline: none;                      /* rely on the ring */
}

/* Apply to GF submit button in this block */
.contact-content .gform_footer .gform_button,
.btn-solid {
  border: 1px solid #23479A;         /* was $blue-light-100 */
  background-color: #23479A;          /* was $white */
  color: #ffffff;                     /* was $blue-dark */
  text-transform: none;
  font-size: 16px;                    /* rfs(1rem) */
  font-style: normal;
  font-weight: 600;
  line-height: 1.5rem;                /* rfs(1.5rem) */
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .25rem;
  width: 100%;                        /* keep full-width per design */
  padding: 0.9rem 1rem;
  border-radius: 8px;
  transition: color .2s ease, border-color .2s ease, background-color .2s ease;
}

/* Arrow after text */
.contact-content .gform_footer .gform_button::after,
.btn-solid::after {
  content: "";
  display: inline-block;
  width: 20px;
  height: 11px;
  margin-left: .25rem;
  background: url("../../images/arrow-sm-right-white.svg") no-repeat center / 18px 18px;
  transition: background .2s ease, color .2s ease, transform .2s ease;
}

/* Hover / focus styles */
.contact-content .gform_footer .gform_button:hover,
.contact-content .gform_footer .gform_button:focus-visible,
.btn-solid:hover,
.btn-solid:focus-visible {
  border-color: #16347b;  
  background: #16347b; ;            /* was $hover-border */
  color: #ffffff;                     /* was $hover-btn-color */
  outline: none;
}

/* Active / pressed state */
.contact-content .gform_footer .gform_button:active,
.contact-content .gform_footer .gform_button.is-pressed,
.contact-content .gform_footer .gform_button[aria-pressed="true"],
.btn-solid:active,
.btn-solid.is-pressed,
.btn-solid[aria-pressed="true"] {
  color: #FFFFFF;            /* was $white */
  background-color: #1e3851; /* pressed background */
  outline: none;
}


/* Layout: keep input + label aligned with 8px gap */
.contact-content .gfield_checkbox .gchoice,
.contact-content .ginput_container_consent .gchoice {
  display: inline-flex;
  align-items: center;
  gap: 8px; /* <-- required gap between box and text */
}

/* Base checkbox box: 18x18, #DDD border */
.contact-content .gfield-choice-input[type="checkbox"] {
  -webkit-appearance: none;
  appearance: none;
  width: 18px;
  height: 18px;
  border: 2px solid #DDD;          /* border color */
  background: #FFF;
  margin: 0;                        /* GF sometimes adds margins */
  display: inline-block;
  vertical-align: middle;
  cursor: pointer;
  border-radius: 3px;               /* remove if you want sharp corners */
  position: relative;
  transition: border-color .15s ease, background-color .15s ease, box-shadow .15s ease;
}

/* Checked: fill with #23479A + white checkmark */
.contact-content .gfield-choice-input[type="checkbox"]:checked {
  background-color: #23479A;
  border-color: #23479A;
  /* white checkmark as inline SVG */
  background-image: url("data:image/svg+xml,%3Csvg width='14' height='11' viewBox='0 0 14 11' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M12.333 1.5L5 8.833 1.667 5.5' stroke='%23FFFFFF' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 12px 12px;
}

/* Hover (optional nicer feel): keep border subtle */
.contact-content .gfield-choice-input[type="checkbox"]:hover {
  border-color: #C2D4F8;
}

/* Focus ring for accessibility */
.contact-content .gfield-choice-input[type="checkbox"]:focus,
.contact-content .gfield-choice-input[type="checkbox"]:focus-visible {
  outline: none;
  box-shadow: 0 0 0 4px #E9EFFF;
  border-color: #C2D4F8;
}

/* Make the label clickable and aligned */
.contact-content .gform-field-label--type-inline,
.contact-content .gchoice label {
  cursor: pointer;
  line-height: 1.4;
  color: #1d1d1d; /* tweak if needed */
}

.contact-content .gform-field-label--type-inline, .contact-content .gchoice label {
    color: var(--neutral-800, #3D3D3D);
    font-size: 16px;
    font-weight: 400;
    line-height: 24px;
}