/* CALL TO ACTION */
/* cta layout */
.call_to_action {
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-template-rows: 15vh 55vh;
  background-image: linear-gradient(
    rgb(43, 53, 83, 0.88),
    rgb(43, 53, 83, 0.88)),
     url(../img/blog_images/cta.jpg);
  background-size: cover;
  z-index: 50;
}

.call_to_action-header {
  grid-column: 1/-1;
  grid-row: 1/2;
  text-align: center;
}

.call_to_action-header h3 {
  font-size: 2.4rem;
}
.call_to_action-header p {
  font-size: 1.4rem;
  font-weight: 400;
}

.call-information {
  grid-column: 1/2;
  grid-row: 2/-1;
}

.form {
  grid-column: 2/-1;
  grid-row: 2/-1;
  margin: 2.5rem 0 0 .5rem;
}

.call_to_action {
  grid-column: 1/-1;
  grid-row: 5/6;
  /* border:1px solid #1d8cf8; */
}

.cta-header-title {
  padding: 1.1rem 0;
}
.cta-header-description {
  padding: .7rem 0;
}

.form {
  height: 32rem;
  width: 36rem;
  padding: 2.7rem 2.5rem;
  background-color: rgb(23, 25, 65, 0.88);
  border-radius: 1rem;
}

.form-input  {
  color: #c0c1c2;
  font-size: 1.2rem;
  width: 100%;
  padding: .7rem 1.8rem;
  border: .1rem solid hsl(225, 32%, 25%);
  background-color: transparent;
  border-radius: .5rem;
}

.form-input:focus {
  outline: none;
  color: #c0c1c2;
  background-color: transparent;
  border-color: #1d8cf8;
  transition: color 0.3s ease-in-out,
   border-color 0.3s ease-in-out,
   background-color 0.3s ease-in-out;
}

.form-input::placeholder {
  font-family: "Poppins";
  color: #f1f1f1;
}

.form-group {
  display: flex;
  flex-direction: column;
  gap: 2rem;
}

.form-group-title {
  padding: .2rem .5rem;
}

.btn-form {
  border: none;
  cursor: pointer;
  color: white;
  background-image: linear-gradient(to bottom left,
   #1d8cf8, #3358f4, #1d8cf8);
  padding: .7rem 2rem;
  border-radius: .5rem;
}


/* CTA - INFORMATION */
.call-information {
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding-left: 36.9rem;
  gap: 5rem;
}

.call-information-section { /* base positioning*/
  position: relative;
  display: flex;
  flex-direction: column;
}

.call-information-icon {
  position: absolute;
  top:-.7rem;
  left: -5.7rem;
  height: 5rem;
  width: 5rem;
  background-color: #3358f4;
  border-radius: 100%;
}

.call-information-heading {
  font-weight: 600;
  padding: .2rem .5rem;
}

.call-information-description {
  font-size: 1.3rem;
  font-weight: 400;;
  padding: .2rem .5rem;
}

.social-icon-cta {
  position: absolute;
  top: 1.2rem;
  left: 1.3rem;
}

/* FOOTER */
.footer {
  grid-column: 1/-1;
  grid-row: 6/7;
  background-color: #333;
  /* border:1px solid #1d8cf8; */
  text-align: center;
  padding-top: 1.1rem;
  font-size: 1.4rem;
  font-weight: 100;
  line-height: 1.2;
  letter-spacing: .15rem;
}
