.consultation-banner-section {
  padding: 16px 0;
  background: #ffffff;
}

.consultation-banner-main {
  position: relative;
  min-height: 860px;
  overflow: hidden;
  border-radius: 17px;
  background-image: url("./images/consultation/consultation-lighthouse-bg.png");

  background-repeat: no-repeat;
  background-size: cover;
}

.consultation-banner-row {
  position: relative;
  z-index: 5;
  min-height: 860px;
}

/* Decorative Fine Lines
   ========================================================= */

.consultation-banner-lines {
  position: absolute;
  z-index: 1;
  top: -110px;
  left: 28%;
  width: 510px;
  height: 330px;
  border-radius: 50%;
  opacity: 0.45;
  transform: rotate(7deg);
  background: repeating-radial-gradient(
    ellipse at center,
    transparent 0,
    transparent 12px,
    rgba(255, 91, 0, 0.28) 13px,
    transparent 14px
  );
  pointer-events: none;
}

/* Lighthouse
   ========================================================= */

/*
   IMPORTANT:

   The image supplied earlier contains unwanted screenshot text
   on its LEFT side.

   This element deliberately zooms the image and shows only
   the RIGHT side where the lighthouse artwork exists.

   Do not use it as a full 51% background.
*/

.consultation-lighthouse {
  position: absolute;
  z-index: 2;
  left: 23%;
  bottom: 0;
  width: 34%;
  height: 43%;
  overflow: hidden;
  pointer-events: none;

  background-image:
    linear-gradient(
      90deg,
      rgba(2, 13, 34, 1) 0%,
      rgba(2, 13, 34, 0.18) 30%,
      rgba(2, 13, 34, 0) 100%
    ),
    url("./images/consultation/consultation-lighthouse-bg.pmg");

  background-repeat: no-repeat;
  background-size: cover;

  opacity: 0.98;
}

.consultation-lighthouse::after {
  content: "";
  position: absolute;
  inset: 0;

  background: linear-gradient(
    180deg,
    rgba(3, 18, 43, 0) 42%,
    rgba(2, 10, 25, 0.25) 100%
  );
}

/* Left Side
   ========================================================= */

.consultation-banner-left {
  position: relative;
  z-index: 6;
  min-height: 860px;
  padding: 76px 62px 50px;

  display: flex;
  flex-direction: column;

  color: #ffffff;
}

.consultation-banner-copy {
  position: relative;
  z-index: 5;
  max-width: 680px;
}

/* Kicker
   ========================================================= */

.consultation-banner-kicker {
  gap: 11px;
  margin-bottom: 25px;

  color: #ff5a00;

  font-size: 16px;
  line-height: 1.2;
  font-weight: 700;
}

.consultation-kicker-line {
  position: relative;

  width: 29px;
  height: 2px;

  background: #ff5a00;
}

.consultation-kicker-line::before,
.consultation-kicker-line::after {
  content: "";

  position: absolute;
  top: 50%;

  width: 4px;
  height: 4px;

  border-radius: 50%;

  background: #ff5a00;

  transform: translateY(-50%);
}

.consultation-kicker-line::before {
  left: 0;
}

.consultation-kicker-line::after {
  right: 0;
}

/* Main Heading
   ========================================================= */

.consultation-banner-title {
  margin: 0;

  color: #ffffff;

  font-size: 55px;
  line-height: 1.08;
  font-weight: 800;

  letter-spacing: -0.035em;
}

.consultation-banner-title span {
  display: block;
}

/* Subtitle
   ========================================================= */

.consultation-banner-subtitle {
  margin-top: 22px;

  color: #dadde6;

  font-size: 26px;
  line-height: 1.35;
  font-weight: 600;

  letter-spacing: -0.025em;
}

.consultation-banner-subtitle strong {
  color: #ff5a00;
  font-weight: 800;
}

/* Description
   ========================================================= */

.consultation-banner-description {
  max-width: 610px;

  margin: 27px 0 0;

  color: rgba(255, 255, 255, 0.9);

  font-size: 18px;
  line-height: 1.68;
  font-weight: 400;
}

/* Feature Row
   ========================================================= */

.consultation-feature-row {
  margin-top: 38px;
}

.consultation-feature {
  min-width: 0;
  gap: 12px;
}

.consultation-feature-icon {
  width: 63px;
  min-width: 63px;
  height: 63px;

  border: 1px solid rgba(255, 91, 0, 0.5);
  border-radius: 50%;

  color: #ff5a00;

  font-size: 25px;
}

.consultation-feature-content {
  min-width: 0;

  color: #ffffff;

  font-size: 15px;
  line-height: 1.45;
}

.consultation-feature-content strong,
.consultation-feature-content span {
  display: block;
}

.consultation-feature-content strong {
  margin-bottom: 2px;
  font-weight: 700;
}

.consultation-feature-content span {
  color: rgba(255, 255, 255, 0.9);
  white-space: nowrap;
}

/* Social Proof
   ========================================================= */

.consultation-social-proof {
  position: relative;
  z-index: 6;

  max-width: 660px;

  margin-top: 12%;

  padding-top: 24px;

  border-top: 1px solid rgba(255, 255, 255, 0.08);
}

.consultation-social-inner {
  gap: 23px;
}

.consultation-client-list img,
.consultation-client-count {
  width: 53px;
  min-width: 53px;
  height: 53px;

  border: 2px solid #ffffff;
  border-radius: 50%;
}

.consultation-client-list img {
  display: block;
  object-fit: cover;
}

.consultation-client-list img:not(:first-child),
.consultation-client-count {
  margin-left: -11px;
}

.consultation-client-count {
  background: linear-gradient(135deg, #ff7200 0%, #ff3c00 100%);

  color: #ffffff;

  font-size: 16px;
  font-weight: 800;
}

.consultation-social-text {
  color: #ffffff;

  font-size: 16px;
  line-height: 1.45;
  font-weight: 700;
}

.consultation-social-text span {
  display: block;
}

/* =========================================================
   Form
   ========================================================= */

.consultation-form-area {
  position: relative;
  z-index: 10;

  min-height: 860px;

  padding: 44px 35px 28px 0;
}

.consultation-form-card {
  width: 100%;

  min-height: 786px;

  padding: 38px 38px 27px;

  border-radius: 22px;

  background: linear-gradient(135deg, #ffffff 0%, #fbfcff 100%);

  box-shadow: 0 20px 60px rgba(0, 0, 0, 0.19);
}

/* Form Heading
   ========================================================= */

.consultation-form-head {
  margin-bottom: 27px;
}

.consultation-form-head h2 {
  margin: 0;

  color: #071333;

  font-size: 30px;
  line-height: 1.2;
  font-weight: 800;

  letter-spacing: -0.035em;
}

.consultation-form-head > span {
  display: block;

  width: 59px;
  height: 3px;

  margin: 17px auto 0;

  background: #ff5a00;
}

/* Form Grid
   ========================================================= */

.consultation-form-grid {
  --bs-gutter-x: 28px;
  --bs-gutter-y: 22px;
}

.consultation-field {
  min-width: 0;
}

.consultation-field label {
  display: block;

  margin-bottom: 9px;

  color: #071333;

  font-size: 15px;
  line-height: 1.25;
  font-weight: 600;
}

.consultation-field label span {
  color: #ff3d00;
}

/* Inputs
   ========================================================= */

.consultation-field .form-control,
.consultation-field .form-select {
  width: 100%;

  min-height: 49px;

  padding: 11px 15px;

  border: 1px solid #d7deea;

  border-radius: 8px;

  background-color: #ffffff;

  color: #071333;

  font-family: inherit;
  font-size: 14px;
  line-height: 1.4;

  box-shadow: none;
}

.consultation-field .form-control::placeholder {
  color: #697287;
  opacity: 1;
}

.consultation-field .form-control:focus,
.consultation-field .form-select:focus {
  border-color: #ff6800;

  box-shadow: 0 0 0 3px rgba(255, 104, 0, 0.1);
}

.consultation-field textarea.form-control {
  min-height: 76px;

  padding-top: 14px;

  resize: none;
}

/* Date / Time Icons
   ========================================================= */

.consultation-input-wrap {
  position: relative;
}

.consultation-input-wrap .form-control {
  padding-right: 50px;
}

.consultation-input-wrap i {
  position: absolute;

  top: 50%;
  right: 17px;

  color: #17254d;

  font-size: 18px;

  transform: translateY(-50%);

  pointer-events: none;
}

/* Submit
   ========================================================= */

.consultation-submit-btn {
  width: 100%;

  min-height: 55px;

  padding: 13px 25px;

  border: 0;
  border-radius: 8px;

  background: linear-gradient(90deg, #ff3d00 0%, #ff5100 100%);

  color: #ffffff;

  font-family: inherit;

  font-size: 16px;
  line-height: 1.3;
  font-weight: 800;

  display: inline-flex;
  align-items: center;
  justify-content: center;

  gap: 31px;

  cursor: pointer;

  transition:
    transform 0.2s ease,
    box-shadow 0.2s ease;
}

.consultation-submit-btn:hover {
  transform: translateY(-1px);

  box-shadow: 0 13px 27px rgba(255, 80, 0, 0.25);
}

.consultation-submit-btn i {
  font-size: 20px;
}

/* Privacy
   ========================================================= */

.consultation-privacy {
  gap: 10px;

  color: #626b80;

  font-size: 13px;
  line-height: 1.4;

  text-align: center;
}

.consultation-privacy i {
  color: #26345d;
  font-size: 14px;
}

/* =========================================================
   Trusted Brands
   ========================================================= */

.consultation-brand-strip {
  min-height: 119px;

  margin-top: 13px;

  padding: 21px 60px;

  border: 1px solid #dbe6f5;

  border-radius: 16px;

  background: #ffffff;

  box-shadow: 0 7px 20px rgba(17, 40, 80, 0.025);
}

.consultation-brand-intro {
  min-height: 69px;

  padding-right: 28px;

  border-right: 1px solid #d8dfeb;

  color: #071333;

  font-size: 14px;
  line-height: 1.55;
}

.consultation-brand-intro strong,
.consultation-brand-intro > span {
  display: block;
}

.consultation-brand-intro strong {
  font-weight: 800;
}

.consultation-brand-arrows {
  margin-top: 9px;

  color: #ff5a00;

  font-size: 10px;

  letter-spacing: 8px;
}

.consultation-brand-list {
  min-height: 74px;

  padding-left: 52px;

  gap: 32px;
}

.consultation-brand-item {
  flex: 1 1 0;

  min-width: 0;

  display: flex;
  align-items: center;
  justify-content: center;
}

.consultation-brand-item img {
  display: block;

  width: auto;
  max-width: 145px;
  max-height: 50px;

  object-fit: contain;
}

/* =========================================================
   Free Consultation Banner Responsive
   ========================================================= */

@media (max-width: 1399.98px) {
  .consultation-banner-main,
  .consultation-banner-row,
  .consultation-banner-left,
  .consultation-form-area {
    min-height: 710px;
  }

  .consultation-banner-left {
    padding: 54px 40px 40px;
  }

  .consultation-banner-kicker {
    margin-bottom: 20px;

    font-size: 14px;
  }

  .consultation-banner-title {
    font-size: 40px;
  }

  .consultation-banner-subtitle {
    margin-top: 18px;

    font-size: 22px;
  }

  .consultation-banner-description {
    margin-top: 21px;

    font-size: 15px;
  }

  .consultation-feature-row {
    margin-top: 28px;
  }

  .consultation-feature-icon {
    width: 50px;
    min-width: 50px;
    height: 50px;

    font-size: 21px;
  }

  .consultation-feature {
    gap: 9px;
  }

  .consultation-feature-content {
    font-size: 12px;
  }

  .consultation-social-proof {
    padding-top: 20px;
  }

  .consultation-client-list img,
  .consultation-client-count {
    width: 46px;
    min-width: 46px;
    height: 46px;
  }

  .consultation-client-count {
    font-size: 13px;
  }

  .consultation-social-text {
    font-size: 12px;
  }

  .consultation-form-area {
    padding: 34px 25px 25px 0;
  }

  .consultation-form-card {
    min-height: 650px;

    padding: 28px 29px 23px;
  }

  .consultation-form-head {
    margin-bottom: 20px;
  }

  .consultation-form-head h2 {
    font-size: 26px;
  }

  .consultation-form-head > span {
    margin-top: 13px;
  }

  .consultation-form-grid {
    --bs-gutter-x: 20px;
    --bs-gutter-y: 15px;
  }

  .consultation-field label {
    margin-bottom: 6px;

    font-size: 13px;
  }

  .consultation-field .form-control,
  .consultation-field .form-select {
    min-height: 45px;

    font-size: 13px;
  }

  .consultation-field textarea.form-control {
    min-height: 68px;
  }

  .consultation-submit-btn {
    min-height: 48px;

    font-size: 14px;
  }

  .consultation-brand-strip {
    min-height: 102px;

    padding: 17px 34px;
  }

  .consultation-brand-intro {
    font-size: 12px;
  }

  .consultation-brand-list {
    padding-left: 34px;

    gap: 24px;
  }

  .consultation-brand-item img {
    max-width: 120px;
    max-height: 42px;
  }

  .consultation-lighthouse {
    width: 38%;
  }
}

@media (max-width: 1199.98px) {
  .consultation-banner-left {
    padding-left: 30px;
    padding-right: 25px;
  }

  .consultation-feature-content span {
    white-space: normal;
  }

  .consultation-form-card {
    padding-left: 23px;
    padding-right: 23px;
  }

  .consultation-brand-list {
    gap: 18px;
  }

  .consultation-brand-item img {
    max-width: 102px;
  }
}

@media (max-width: 991.98px) {
  .consultation-banner-main,
  .consultation-banner-row {
    min-height: 0;
  }

  .consultation-banner-left {
    min-height: 690px;

    padding: 55px 45px 42px;
  }

  .consultation-form-area {
    min-height: 0;

    padding: 22px 24px 28px;
  }

  .consultation-form-card {
    min-height: 0;
  }

  .consultation-lighthouse {
    left: 40%;

    width: 58%;
    height: 40%;
  }

  .consultation-brand-strip {
    padding: 23px 28px;
  }

  .consultation-brand-intro {
    min-height: auto;

    padding: 0 0 17px;

    border-right: 0;

    border-bottom: 1px solid #d8dfeb;

    text-align: center;
  }

  .consultation-brand-list {
    padding: 25px 0 0;

    flex-wrap: wrap;

    justify-content: center !important;

    gap: 30px 45px;
  }

  .consultation-brand-item {
    flex: 0 0 auto;
  }

  .consultation-brand-item img {
    max-width: 125px;
  }
}

@media (max-width: 767.98px) {
  .container-custom {
    width: calc(100% - 24px);
  }

  .consultation-banner-main {
    border-radius: 14px;
  }

  .consultation-banner-left {
    min-height: 650px;

    padding: 40px 22px 32px;
  }

  .consultation-banner-kicker {
    font-size: 12px;
  }

  .consultation-banner-title {
    font-size: 32px;

    line-height: 1.12;
  }

  .consultation-banner-subtitle {
    font-size: 19px;
  }

  .consultation-banner-description {
    font-size: 15px;

    line-height: 1.55;
  }

  .consultation-feature-row {
    margin-top: 25px;
  }

  .consultation-feature-content {
    font-size: 14px;
  }

  .consultation-feature-icon {
    width: 48px;
    min-width: 48px;
    height: 48px;

    font-size: 20px;
  }

  .consultation-social-inner {
    gap: 15px;

    flex-wrap: wrap;
  }

  .consultation-social-text {
    font-size: 14px;
  }

  .consultation-form-area {
    padding: 13px 12px 20px;
  }

  .consultation-form-card {
    padding: 26px 18px 22px;

    border-radius: 16px;
  }

  .consultation-form-head h2 {
    font-size: 22px;
  }

  .consultation-field label {
    font-size: 13px;
  }

  .consultation-field .form-control,
  .consultation-field .form-select {
    min-height: 48px;

    font-size: 14px;
  }

  .consultation-form-grid {
    --bs-gutter-y: 17px;
  }

  .consultation-submit-btn {
    min-height: 50px;

    padding: 12px 16px;

    font-size: 15px;

    white-space: normal;
  }

  .consultation-privacy {
    font-size: 12px;
  }

  .consultation-brand-strip {
    min-height: 0;

    padding: 19px 18px;

    border-radius: 14px;
  }
}

@media (max-width: 575.98px) {
  .consultation-banner-left {
    min-height: 680px;

    padding: 35px 18px 30px;
  }

  .consultation-banner-title span {
    display: inline;
  }

  .consultation-banner-subtitle {
    font-size: 18px;
  }

  .consultation-banner-description {
    font-size: 14px;
  }

  .consultation-feature-row .col-md-4 + .col-md-4 {
    margin-top: 5px;
  }

  .consultation-feature {
    max-width: 260px;
  }

  .consultation-feature-content {
    font-size: 14px;
  }

  .consultation-lighthouse {
    left: 39%;
    width: 61%;
    height: 31%;
  }

  .consultation-social-text {
    width: 100%;

    font-size: 13px;
  }

  .consultation-social-text span {
    display: inline;
  }

  .consultation-form-area {
    padding-left: 8px;
    padding-right: 8px;
  }

  .consultation-form-card {
    padding: 24px 15px 20px;
  }

  .consultation-form-head h2 {
    font-size: 20px;
  }

  .consultation-brand-list {
    gap: 28px 20px;
  }

  .consultation-brand-item {
    flex: 0 0 calc(50% - 12px);
  }

  .consultation-brand-item img {
    max-width: 105px;
    max-height: 38px;
  }
}

/* base styles */
h2 {
  font-size: 44px !important;
}

@media (max-width: 1599.98px) {
  h2 {
    font-size: 32px !important;
  }
}

@media (max-width: 1399.98px) {
  h2 {
    font-size: 30px !important;
  }
}

@media (max-width: 1199.98px) {
  h2 {
    font-size: 28px !important;
  }
}

@media (max-width: 991.98px) {
  h2 {
    font-size: 26px !important;
  }
}

@media (max-width: 767.98px) {
  h2 {
    font-size: 22px !important;
  }
}

@media (max-width: 575.98px) {
  h2 {
    font-size: 21px !important;
  }
}

@media (max-width: 374.98px) {
  h2 {
    font-size: 20px !important;
  }
}