

/* =========================================================
   EASYCAB AIRBNB-STYLE HOMEPAGE TOP
========================================================= */

.easycab-marketplace-hero {

  position: relative;

  padding:
    42px
    0
    58px;

  overflow: hidden;

  background:
    radial-gradient(
      circle at 8% 0%,
      rgba(8, 127, 140, 0.08),
      transparent 25%
    ),
    radial-gradient(
      circle at 95% 3%,
      rgba(244, 183, 64, 0.12),
      transparent 25%
    ),
    #ffffff;

  border-bottom:
    1px solid
    #ecefed;

}

.easycab-marketplace-inner {

  width:
    min(
      1420px,
      calc(100% - 54px)
    );

  margin:
    0
    auto;

}


/* =========================================================
   INTRODUCTION
========================================================= */

.easycab-marketplace-heading {

  max-width: 780px;

  margin:
    0
    auto
    26px;

  text-align: center;

}

.easycab-marketplace-eyebrow {

  display: inline-block;

  margin-bottom: 8px;

  color: #087f8c;

  font-size: 12px;

  font-weight: 800;

  letter-spacing: 1.25px;

  text-transform: uppercase;

}

.easycab-marketplace-heading h1 {

  margin:
    0
    0
    11px;

  color: #172642 !important;

  font-family:
    Georgia,
    "Times New Roman",
    serif;

  font-size:
    clamp(
      34px,
      5vw,
      58px
    );

  font-weight: 700;

  line-height: 1.06;

  letter-spacing: -1.8px;

}

.easycab-marketplace-heading p {

  max-width: 680px;

  margin:
    0
    auto;

  color: #667085;

  font-size: 16px;

  line-height: 1.65;

}


/* =========================================================
   VISUAL CATEGORY TABS
========================================================= */

.easycab-marketplace-tabs {

  display: flex;

  justify-content: center;

  gap: 40px;

  margin-bottom: 28px;

  overflow-x: auto;

  scrollbar-width: none;

}

.easycab-marketplace-tabs::-webkit-scrollbar {

  display: none;

}

.easycab-marketplace-tab {

  position: relative;

  display: flex;

  flex: 0 0 auto;

  flex-direction: column;

  align-items: center;

  min-width: 100px;

  padding:
    0
    8px
    12px;

  color: #53606f;

  text-decoration: none;

}

.easycab-marketplace-tab::after {

  content: "";

  position: absolute;

  right: 13px;

  bottom: 0;

  left: 13px;

  height: 3px;

  border-radius: 99px;

  background: transparent;

}

.easycab-marketplace-tab.active::after,
.easycab-marketplace-tab:hover::after {

  background: #087f8c;

}

.easycab-marketplace-tab-image {

  width: 58px;

  height: 58px;

  margin-bottom: 8px;

  overflow: hidden;

  border:
    2px solid
    #ffffff;

  border-radius: 18px;

  background: #f1f4f4;

  box-shadow:
    0 8px 20px
    rgba(23, 38, 66, 0.12);

}

.easycab-marketplace-tab-image img {

  display: block;

  width: 100%;

  height: 100%;

  object-fit: cover;

}

.easycab-marketplace-tab-text {

  color: #3e4957;

  font-size: 13px;

  font-weight: 800;

  white-space: nowrap;

}


/* =========================================================
   FLOATING SEARCH BAR
========================================================= */

.easycab-search-bar {

  position: relative;

  z-index: 5;

  max-width: 1320px;

  margin:
    0
    auto
    50px;

}

.easycab-search-fields {

  display: grid;

  grid-template-columns:
    1.35fr
    1.35fr
    1fr
    0.82fr
    1fr
    0.82fr
    auto;

  align-items: center;

  overflow: hidden;

  border:
    1px solid
    #e3e7e8;

  border-radius: 999px;

  background: #ffffff;

  box-shadow:
    0 13px 36px
    rgba(23, 38, 66, 0.13);

}

.easycab-search-field {

  position: relative;

  min-width: 0;

  padding:
    14px
    20px;

}

.easycab-search-field::after {

  content: "";

  position: absolute;

  top: 18px;

  right: 0;

  bottom: 18px;

  width: 1px;

  background: #e7ebed;

}

.easycab-search-field label {

  display: block;

  margin-bottom: 2px;

  color: #172642;

  font-size: 11px;

  font-weight: 800;

}

.easycab-search-field input,
.easycab-search-field select {

  width: 100%;

  height: 28px !important;

  min-height: 28px !important;

  padding: 0 !important;

  border: 0 !important;

  background: transparent !important;

  color: #697586;

  font-size: 13px;

  box-shadow: none !important;

}

.easycab-search-field .select2-container {

  width: 100% !important;

}

.easycab-search-field
.select2-container--default
.select2-selection--single {

  height: 28px !important;

  padding: 0 !important;

  border: 0 !important;

  background: transparent !important;

}

.easycab-search-field
.select2-container--default
.select2-selection--single
.select2-selection__rendered {

  padding:
    0
    20px
    0
    0 !important;

  color: #697586 !important;

  line-height: 28px !important;

  font-size: 13px !important;

}

.easycab-search-field
.select2-container--default
.select2-selection--single
.select2-selection__arrow {

  height: 28px !important;

}

.easycab-time-controls {

  display: flex;

  align-items: center;

  gap: 3px;

}

.easycab-time-controls > span {

  color: #8b94a1;

  font-weight: 800;

}

.easycab-time-controls .select2-container {

  flex:
    1
    1
    0;

  min-width: 36px;

}

.easycab-search-actions {

  display: flex;

  align-items: center;

  justify-content: center;

  padding:
    7px
    9px
    7px
    5px;

}

.easycab-search-button {

  display: inline-flex;

  align-items: center;

  justify-content: center;

  gap: 8px;

  min-width: 112px;

  min-height: 58px;

  padding:
    12px
    19px;

  border: 0;

  border-radius: 999px;

  background:
    linear-gradient(
      135deg,
      #ff5a5f,
      #e94355
    );

  color: #ffffff;

  font-size: 14px;

  font-weight: 800;

  cursor: pointer;

  box-shadow:
    0 10px 22px
    rgba(233, 67, 85, 0.25);

}


/* =========================================================
   IMAGE DISCOVERY CARDS
========================================================= */

.easycab-inspiration-heading {

  display: flex;

  align-items: flex-end;

  justify-content: space-between;

  gap: 24px;

  margin-bottom: 20px;

}

.easycab-inspiration-heading span {

  display: block;

  margin-bottom: 3px;

  color: #087f8c;

  font-size: 12px;

  font-weight: 800;

  letter-spacing: 1px;

  text-transform: uppercase;

}

.easycab-inspiration-heading h2 {

  margin: 0;

  color: #172642 !important;

  font-size:
    clamp(
      24px,
      3vw,
      34px
    );

  font-weight: 800;

  letter-spacing: -0.7px;

}

.easycab-inspiration-heading > a {

  display: inline-flex;

  align-items: center;

  gap: 8px;

  color: #172642;

  font-size: 14px;

  font-weight: 800;

  text-decoration: none;

  white-space: nowrap;

}

.easycab-inspiration-scroll {

  display: grid;

  grid-auto-flow: column;

  grid-auto-columns:
    minmax(
      235px,
      1fr
    );

  gap: 16px;

  overflow-x: auto;

  padding-bottom: 12px;

  scroll-snap-type: x mandatory;

  scrollbar-width: thin;

}

.easycab-inspiration-card {

  scroll-snap-align: start;

  color: #172642;

  text-decoration: none;

}

.easycab-inspiration-image {

  position: relative;

  height: 230px;

  margin-bottom: 13px;

  overflow: hidden;

  border-radius: 20px;

  background: #edf1f2;

}

.easycab-inspiration-image img {

  display: block;

  width: 100%;

  height: 100%;

  object-fit: cover;

  transition: transform 0.4s ease;

}

.easycab-inspiration-card:hover
.easycab-inspiration-image img {

  transform: scale(1.05);

}

.easycab-inspiration-image::after {

  content: "";

  position: absolute;

  inset: 0;

  background:
    linear-gradient(
      180deg,
      rgba(8, 18, 34, 0.03),
      rgba(8, 18, 34, 0.53)
    );

}

.easycab-inspiration-image span {

  position: absolute;

  z-index: 2;

  bottom: 14px;

  left: 15px;

  padding:
    7px
    11px;

  border-radius: 999px;

  background:
    rgba(255, 255, 255, 0.92);

  color: #172642;

  font-size: 11px;

  font-weight: 800;

}

.easycab-inspiration-card h3 {

  margin:
    0
    0
    5px;

  color: #172642 !important;

  font-size: 16px;

  font-weight: 800;

  line-height: 1.35;

}

.easycab-inspiration-card p {

  margin: 0;

  color: #6e7887;

  font-size: 13px;

  line-height: 1.5;

}




.easycab-inspiration-empty {
  padding: 34px 24px;
  border: 1px solid #e3e7e8;
  border-radius: 20px;
  background: #ffffff;
  text-align: center;
}

.easycab-inspiration-empty p {
  margin: 0 0 10px;
  color: #6e7887;
}

.easycab-inspiration-empty a {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: #087f8c;
  font-weight: 800;
  text-decoration: none;
}

/* =========================================================
   TABLET
========================================================= */

@media (max-width: 1180px) {

  .easycab-search-fields {

    grid-template-columns:
      1fr
      1fr
      0.9fr
      0.8fr;

    border-radius: 28px;

  }

  .easycab-search-field {

    border-bottom:
      1px solid
      #edf0f1;

  }

  .easycab-search-actions {

    grid-column:
      1 / -1;

    justify-content: stretch;

    padding: 10px;

  }

  .easycab-search-button {

    width: 100%;

    min-height: 50px;

  }

}


/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 767px) {

  .easycab-marketplace-hero {

    padding:
      26px
      0
      40px;

  }

  .easycab-marketplace-inner {

    width:
      min(
        calc(100% - 22px),
        1420px
      );

  }

  .easycab-marketplace-heading h1 {

    font-size: 37px;

    letter-spacing: -1px;

  }

  .easycab-marketplace-heading p {

    font-size: 14px;

  }

  .easycab-marketplace-tabs {

    justify-content: flex-start;

    gap: 22px;

    margin-right: -11px;

    margin-left: -11px;

    padding:
      0
      11px
      3px;

  }

  .easycab-marketplace-tab {

    min-width: 90px;

  }

  .easycab-search-bar {

    margin-bottom: 40px;

  }

  .easycab-search-fields {

    display: block;

    overflow: visible;

    padding: 8px;

    border-radius: 25px;

  }

  .easycab-search-field {

    padding:
      13px
      15px;

    border-bottom:
      1px solid
      #eceff0;

  }

  .easycab-search-field::after {

    display: none;

  }

  .easycab-search-actions {

    display: block;

    padding:
      10px
      4px
      4px;

  }

  .easycab-search-button {

    width: 100%;

    min-height: 50px;

  }

  .easycab-inspiration-heading > a {

    display: none;

  }

  .easycab-inspiration-scroll {

    grid-auto-columns: 78%;

  }

  .easycab-inspiration-image {

    height: 225px;

  }

}

