/* =========================
   FREE CONSULTANCY
========================= */

.consultancy-section{
  position: relative;

  padding: 130px 20px;

  background:
    linear-gradient(
      to bottom,
      #ffffff,
      #f8fbff
    );

  overflow: hidden;
}

/* BLUR */

.consult-blur{
  position: absolute;

  border-radius: 50%;

  filter: blur(90px);

  animation:
    consultBlur 8s ease-in-out infinite;
}

.consult-blur-1{
  width: 320px;
  height: 320px;

  background:
    rgba(255,0,0,0.08);

  top: -100px;
  left: -100px;
}

.consult-blur-2{
  width: 260px;
  height: 260px;

  background:
    rgba(0,110,255,0.08);

  bottom: -100px;
  right: -100px;
}

/* GRID */

.consultancy-grid{
  position: relative;
  z-index: 2;

  display: grid;

  grid-template-columns:
    1fr 1fr;

  gap: 50px;

  align-items: center;
}

/* CONTENT */

.consultancy-content{
  animation:
    fadeLeft 1s ease-in-out;
}

.consultancy-badge{
  display: inline-block;

  padding: 12px 24px;

  border-radius: 100px;

  background:
    rgba(255,0,0,0.08);

  color:
    #d40000;

  border:
    1px solid rgba(255,0,0,0.10);

  font-size: 14px;
  font-weight: 600;

  margin-bottom: 24px;
}

.consultancy-content h2{
  font-size:
    clamp(42px,6vw,74px);

  line-height: 1.1;

  color:
    #111;

  margin-bottom: 24px;

  font-weight: 800;
}

.consultancy-content h2 span{
  background:
    linear-gradient(
      90deg,
      #d40000,
      #006eff
    );

  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.consultancy-content p{
  color:
    #666;

  font-size: 18px;
  line-height: 1.9;

  margin-bottom: 40px;
}

/* INFO CARD */

.consult-info-card{
  display: flex;

  gap: 20px;

  padding: 28px;

  border-radius: 30px;

  background:
    rgba(255,255,255,0.92);

  border:
    1px solid rgba(0,0,0,0.06);

  margin-bottom: 24px;

  box-shadow:
    0 15px 40px rgba(0,0,0,0.04);

  transition:
    all 0.45s ease-in-out;
}

.consult-info-card:hover{
  transform:
    translateY(-8px);

  box-shadow:
    0 25px 60px rgba(0,0,0,0.08);
}

.consult-info-icon{
  min-width: 70px;
  height: 70px;

  border-radius: 22px;

  display: flex;
  align-items: center;
  justify-content: center;

  background:
    linear-gradient(
      135deg,
      #d40000,
      #006eff
    );

  color: white;

  font-size: 30px;
}

.consult-info-card h3{
  font-size: 24px;

  margin-bottom: 10px;

  color:
    #111;
}

.consult-info-card p{
  margin: 0;

  font-size: 16px;
}

/* FORM */

.consultancy-form-box{
  position: relative;

  padding: 40px;

  border-radius: 40px;

  background:
    rgba(255,255,255,0.95);

  border:
    1px solid rgba(0,0,0,0.06);

  box-shadow:
    0 30px 70px rgba(0,0,0,0.06);

  animation:
    fadeRight 1s ease-in-out;
}

.form-group{
  margin-bottom: 22px;
}

.form-group label{
  display: block;

  margin-bottom: 10px;

  font-size: 15px;
  font-weight: 600;

  color:
    #111;
}

.form-group input,
.form-group select{
  width: 100%;

  padding: 18px 20px;

  border-radius: 18px;

  border:
    1px solid rgba(0,0,0,0.08);

  background:
    #fff;

  font-size: 15px;

  outline: none;

  transition:
    all 0.35s ease-in-out;
}

.form-group input:focus,
.form-group select:focus{
  border-color:
    #006eff;

  box-shadow:
    0 0 0 4px rgba(0,110,255,0.10);
}

/* BUTTON */

.consultancy-form-box button{
  width: 100%;

  padding: 18px;

  border: none;

  border-radius: 20px;

  background:
    linear-gradient(
      135deg,
      #d40000,
      #006eff
    );

  color: white;

  font-size: 17px;
  font-weight: 700;

  cursor: pointer;

  transition:
    all 0.45s ease-in-out;
}

.consultancy-form-box button:hover{
  transform:
    translateY(-5px);

  box-shadow:
    0 20px 40px rgba(0,110,255,0.20);
}

/* ANIMATION */

@keyframes fadeLeft{

  from{
    opacity: 0;
    transform: translateX(-40px);
  }

  to{
    opacity: 1;
    transform: translateX(0);
  }

}

@keyframes fadeRight{

  from{
    opacity: 0;
    transform: translateX(40px);
  }

  to{
    opacity: 1;
    transform: translateX(0);
  }

}

@keyframes consultBlur{

  0%{
    transform: translateY(0);
  }

  50%{
    transform: translateY(20px);
  }

  100%{
    transform: translateY(0);
  }

}

/* RESPONSIVE */

@media(max-width:992px){

  .consultancy-grid{
    grid-template-columns: 1fr;
  }

}

@media(max-width:768px){

  .consultancy-section{
    padding: 90px 18px;
  }

  .consultancy-content h2{
    font-size: 42px;
  }

  .consultancy-form-box{
    padding: 28px;
  }

}

@media(max-width:480px){

  .consult-info-card{
    flex-direction: column;
  }

}


/* =========================
   BUTTON LOADER
========================= */

.consultancy-form-box button{
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
}

/* LOADER */

.loader{
  width: 20px;
  height: 20px;

  border: 3px solid rgba(255,255,255,0.35);
  border-top-color: #fff;

  border-radius: 50%;

  animation:
    spinLoader 0.7s linear infinite;
}

@keyframes spinLoader{

  to{
    transform: rotate(360deg);
  }

}