/* DFS Catalog — Search Results v0.5.0 */

.dfs-search-page {
  padding-bottom: clamp(3.5rem, 7vw, 6rem);
  background: #fff;
}

.dfs-search-page__hero {
  background: linear-gradient(115deg, #04102b 0%, #071a45 62%, #0a2b69 100%);
  color: #fff;
}

.dfs-search-page__hero-inner {
  display: flex;
  min-height: clamp(170px, 16vw, 230px);
  flex-direction: column;
  justify-content: center;
  padding-block: clamp(2.25rem, 4.5vw, 4rem);
}

.dfs-search-page__breadcrumb {
  display: flex;
  gap: 0.45rem;
  margin-bottom: 0.9rem;
  color: rgb(255 255 255 / 66%);
  font-size: 0.86rem;
}

.dfs-search-page__breadcrumb a,
.dfs-search-page__breadcrumb a:visited {
  color: rgb(255 255 255 / 76%);
  text-decoration: none;
}

.dfs-search-page__breadcrumb a:hover,
.dfs-search-page__breadcrumb a:focus-visible {
  color: #fff;
}

.dfs-search-page__hero h1 {
  max-width: 1100px;
  margin: 0;
  color: #fff;
  font-size: clamp(2.2rem, 4.5vw, 4.2rem);
  font-weight: var(--dfs-weight-extrabold);
  letter-spacing: -0.045em;
  line-height: 1;
}

.dfs-search-page__body {
  display: grid;
  gap: 1.5rem;
}

.dfs-search-page__search {
  padding-block: clamp(1.5rem, 3vw, 2.25rem);
  border-bottom: 1px solid var(--dfs-color-border);
}

.dfs-search-page__search .dfs-search-control {
  min-height: 62px;
  border: 1px solid #d8dee8;
  border-radius: 14px;
  background: #fff;
  box-shadow: 0 4px 16px rgb(16 24 40 / 4%);
}

.dfs-search-page__search .dfs-search-field {
  min-height: 60px;
  padding-left: 1.2rem;
}

.dfs-search-page__meta {
  padding-top: 0.35rem;
  border-bottom: 1px solid var(--dfs-color-border);
}

.dfs-search-page__meta p {
  margin: 0 0 1rem;
  color: #667085;
  font-size: 0.9rem;
}

.dfs-search-page__grid {
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
}

.dfs-search-page__pagination {
  margin-top: 1.5rem;
}

.dfs-search-page__empty {
  margin-top: 1rem;
}

@media (max-width: 1080px) {
  .dfs-search-page__grid {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 720px) {
  .dfs-search-page__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  .dfs-search-page__hero h1 {
    font-size: clamp(2rem, 10vw, 3rem);
  }
}
