.directory-page {
  --directory-blue: #0071e3;
  --directory-blue-dark: #005bb5;
  --directory-ink: #1d1d1f;
  --directory-muted: #6e6e73;
  --directory-line: rgb(29 29 31 / 10%);
  --directory-surface: rgb(255 255 255 / 88%);
  width: min(calc(100% - 4rem), 1880px);
  margin: 0 auto;
  padding: 1.35rem 0 3.75rem;
  color: var(--directory-ink);
}

.directory-sr-only {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

.directory-search {
  position: relative;
  padding: 1rem;
  overflow: hidden;
  border: 1px solid rgb(255 255 255 / 72%);
  border-radius: 1.35rem;
  background:
    linear-gradient(145deg, rgb(255 255 255 / 96%), rgb(250 250 252 / 84%));
  box-shadow:
    0 1px 2px rgb(0 0 0 / 3%),
    0 12px 36px rgb(15 23 42 / 7%);
  -webkit-backdrop-filter: blur(20px) saturate(150%);
  backdrop-filter: blur(20px) saturate(150%);
}

.directory-search::before {
  position: absolute;
  inset: 0;
  border-radius: inherit;
  background: linear-gradient(115deg, rgb(0 113 227 / 3%), transparent 42%);
  content: "";
  pointer-events: none;
}

.directory-filters {
  position: relative;
  display: grid;
  grid-template-columns:
    minmax(128px, 1fr)
    minmax(128px, 1fr)
    minmax(190px, 1.25fr)
    minmax(300px, 1.75fr);
  gap: .8rem;
  align-items: center;
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
}

.directory-filter-field,
.directory-keyword {
  min-width: 0;
}

.directory-filter-field select,
.directory-keyword input {
  width: 100%;
  min-height: 46px;
  border: 1px solid rgb(29 29 31 / 13%);
  border-radius: .82rem;
  background-color: rgb(255 255 255 / 92%);
  box-shadow: inset 0 1px 1px rgb(0 0 0 / 2%);
  color: var(--directory-ink);
  font: inherit;
  font-size: .875rem;
  transition:
    border-color .2s ease,
    background-color .2s ease,
    box-shadow .2s ease;
}

.directory-filter-field select {
  padding: .68rem 2.4rem .68rem .85rem;
  appearance: none;
  background-image:
    linear-gradient(45deg, transparent 50%, #737378 50%),
    linear-gradient(135deg, #737378 50%, transparent 50%);
  background-position:
    calc(100% - 16px) calc(50% - 1px),
    calc(100% - 11px) calc(50% - 1px);
  background-repeat: no-repeat;
  background-size: 5px 5px, 5px 5px;
  cursor: pointer;
}

.directory-filter-field select:hover:not(:disabled),
.directory-keyword:hover {
  border-color: rgb(29 29 31 / 23%);
  background-color: #fff;
}

.directory-filter-field select:disabled {
  cursor: not-allowed;
  background-color: rgb(242 242 247 / 78%);
  color: #929297;
  opacity: .82;
}

.directory-filter-field select:focus-visible,
.directory-keyword input:focus-visible {
  border-color: var(--directory-blue);
  outline: 0;
  box-shadow:
    0 0 0 3px rgb(0 113 227 / 15%),
    inset 0 1px 1px rgb(0 0 0 / 2%);
}

.directory-keyword {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  min-width: 300px;
  min-height: 46px;
  overflow: hidden;
  border: 1px solid rgb(29 29 31 / 13%);
  border-radius: .82rem;
  background: rgb(255 255 255 / 92%);
  box-shadow: inset 0 1px 1px rgb(0 0 0 / 2%);
  transition:
    border-color .2s ease,
    background-color .2s ease,
    box-shadow .2s ease;
}

.directory-keyword:focus-within {
  border-color: var(--directory-blue);
  background: #fff;
  outline: 0;
  box-shadow:
    0 0 0 3px rgb(0 113 227 / 15%),
    inset 0 1px 1px rgb(0 0 0 / 2%);
}

.directory-keyword input {
  width: auto;
  min-width: 80px;
  padding: .68rem .82rem;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  outline: 0;
}

.directory-keyword input:focus-visible {
  box-shadow: none;
}

.directory-keyword input::placeholder {
  color: #86868b;
}

.directory-search-submit,
.directory-reset {
  flex: 0 0 auto;
  min-height: 36px;
  margin: .28rem .28rem .28rem 0;
  padding: .52rem .78rem;
  border: 0;
  border-radius: .62rem;
  background: var(--directory-blue);
  box-shadow: 0 2px 7px rgb(0 113 227 / 18%);
  color: #fff;
  cursor: pointer;
  font: inherit;
  font-size: .72rem;
  font-weight: 650;
  line-height: 1;
  text-decoration: none;
  transition:
    background-color .2s ease,
    box-shadow .2s ease,
    transform .2s ease;
}

.directory-search-submit:hover,
.directory-reset:hover {
  background: var(--directory-blue-dark);
  box-shadow: 0 4px 12px rgb(0 91 181 / 22%);
  transform: translateY(-1px);
}

.directory-search-submit:active,
.directory-reset:active {
  box-shadow: 0 1px 4px rgb(0 91 181 / 18%);
  transform: translateY(0);
}

.directory-search-submit:focus-visible,
.directory-reset:focus-visible {
  outline: 3px solid rgb(0 113 227 / 25%);
  outline-offset: 2px;
}

.directory-reset {
  display: inline-flex;
  align-items: center;
  margin-right: .35rem;
}

.directory-reset.is-disabled {
  cursor: not-allowed;
  box-shadow: none;
  opacity: .46;
}

.directory-reset.is-disabled:hover {
  background: var(--directory-blue);
  box-shadow: none;
  transform: none;
}

.directory-divider {
  height: 1px;
  margin: 1.6rem 0 1.25rem;
  border: 0;
  background: linear-gradient(
    90deg,
    transparent,
    rgb(29 29 31 / 12%) 7%,
    rgb(29 29 31 / 12%) 93%,
    transparent
  );
}

.directory-divider-bottom {
  margin-top: 2rem;
}

.directory-results-heading {
  min-height: 1px;
}

.directory-result-count {
  margin: 0 0 .9rem;
  color: var(--directory-muted);
  font-size: .78rem;
  font-variant-numeric: tabular-nums;
  letter-spacing: .01em;
  text-align: right;
}

.directory-doctor-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1.25rem;
  align-items: stretch;
}

.directory-doctor-card {
  position: relative;
  display: flex;
  width: 100%;
  min-width: 0;
  min-height: 340px;
  overflow: hidden;
  border: 1px solid var(--directory-line);
  border-radius: 1.35rem;
  background: var(--directory-surface);
  box-shadow:
    0 1px 2px rgb(0 0 0 / 3%),
    0 9px 28px rgb(15 23 42 / 6%);
  isolation: isolate;
  transition:
    border-color .28s ease,
    box-shadow .28s ease,
    transform .28s cubic-bezier(.2, .8, .2, 1);
}

@media (hover: hover) and (pointer: fine) {
  .directory-doctor-card:hover {
    z-index: 2;
    border-color: rgb(29 29 31 / 17%);
    box-shadow:
      0 2px 5px rgb(0 0 0 / 4%),
      0 18px 44px rgb(15 23 42 / 11%);
    transform: translateY(-4px);
  }
}

.directory-doctor-gold {
  border: 3px solid #fbbf24;
  border-radius: 1rem;
  background: linear-gradient(
    135deg,
    #fff8e1 10%,
    #f9d976 40%,
    #fbbf24 70%,
    #f59e0b 100%
  );
  box-shadow:
    0 0 8px rgb(255 215 0 / 80%),
    0 0 20px rgb(255 215 0 / 60%),
    inset 0 0 10px rgb(255 255 255 / 60%);
}

.directory-doctor-gold::after {
  position: absolute;
  z-index: 3;
  top: 0;
  left: 0;
  width: 50%;
  height: 200%;
  background: linear-gradient(
    120deg,
    rgb(255 255 255 / 0%) 0%,
    rgb(255 255 255 / 80%) 50%,
    rgb(255 255 255 / 0%) 100%
  );
  content: "";
  pointer-events: none;
  transform: translateX(-100%) rotate(25deg);
  animation: directory-gold-shimmer 2s ease-in-out infinite;
}

.directory-doctor-silver {
  border: 2px solid #5a83c2;
  background:
    radial-gradient(circle at 12% 8%, rgb(255 255 255 / 88%), transparent 34%),
    linear-gradient(138deg, #fbfdff 0%, #e9f2ff 38%, #c6dbf7 72%, #9bb9e2 100%);
  box-shadow:
    0 1px 0 rgb(255 255 255 / 88%) inset,
    0 8px 22px rgb(42 83 145 / 18%),
    0 0 0 1px rgb(255 255 255 / 45%);
}

.directory-doctor-silver::before,
.directory-doctor-copper::before,
.directory-doctor-practice::before {
  position: absolute;
  z-index: 3;
  inset: 0;
  border: 1px solid rgb(255 255 255 / 64%);
  border-radius: inherit;
  content: "";
  pointer-events: none;
}

.directory-doctor-copper {
  border: 2px solid #b96b3d;
  background:
    radial-gradient(circle at 9% 8%, rgb(255 247 241 / 76%), transparent 36%),
    linear-gradient(138deg, #fff8f3 0%, #e8ba98 43%, #bd7747 76%, #92502e 100%);
  box-shadow:
    0 1px 0 rgb(255 255 255 / 58%) inset,
    0 9px 24px rgb(123 63 27 / 20%),
    0 0 0 1px rgb(255 236 224 / 34%);
}

.directory-doctor-practice {
  border-color: rgb(14 116 144 / 27%);
  background:
    radial-gradient(circle at 6% 8%, rgb(34 211 238 / 9%), transparent 35%),
    linear-gradient(145deg, rgb(255 255 255 / 98%), rgb(242 251 252 / 94%));
  box-shadow:
    0 1px 0 rgb(255 255 255 / 90%) inset,
    0 12px 32px rgb(14 116 144 / 10%);
}

.directory-priority-badge {
  position: absolute;
  z-index: 4;
  top: .72rem;
  left: .72rem;
  display: inline-flex;
  align-items: center;
  gap: .2rem;
  padding: .38rem .72rem;
  border: 1px solid rgb(255 255 255 / 82%);
  border-radius: 999px;
  box-shadow:
    0 1px 2px rgb(15 23 42 / 12%),
    0 5px 15px rgb(15 23 42 / 16%);
  color: #fff;
  font-size: .68rem;
  font-weight: 700;
  line-height: 1;
  letter-spacing: .01em;
  -webkit-backdrop-filter: blur(12px);
  backdrop-filter: blur(12px);
}

.directory-priority-badge-symbol {
  display: inline-flex;
  min-width: .9rem;
  align-items: center;
  justify-content: center;
  font-size: .78rem;
}

.directory-priority-badge-gold,
.directory-priority-badge-silver,
.directory-priority-badge-copper {
  width: 42px;
  height: 42px;
  justify-content: center;
  padding: 0;
  border-radius: 14px;
}

.directory-priority-gem {
  width: 25px;
  height: 25px;
  fill: rgb(255 255 255 / 16%);
  stroke: currentcolor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 1.55;
}

.directory-priority-badge-gold {
  border-color: #fff;
  background: #eab308;
  box-shadow:
    0 1px 2px rgb(113 63 18 / 20%),
    0 7px 18px rgb(202 138 4 / 35%);
  animation: directory-priority-pulse 2s ease-in-out infinite;
}

.directory-priority-badge-silver {
  border-color: rgb(255 255 255 / 90%);
  background: linear-gradient(135deg, #3977d1, #173d82);
  box-shadow:
    0 1px 2px rgb(23 61 130 / 18%),
    0 7px 18px rgb(37 84 157 / 28%);
  text-shadow: 0 1px 1px rgb(15 23 42 / 22%);
}

.directory-priority-badge-copper {
  border-color: rgb(255 245 238 / 88%);
  background: linear-gradient(135deg, #a95d1c, #dc9939);
  box-shadow:
    0 1px 2px rgb(112 60 13 / 18%),
    0 7px 18px rgb(176 100 25 / 27%);
  text-shadow: 0 1px 1px rgb(70 31 13 / 24%);
}

.directory-priority-badge-practice {
  border-color: rgb(255 255 255 / 90%);
  background: linear-gradient(135deg, #0e7490, #0f968d);
}

@media (hover: hover) and (pointer: fine) {
  .directory-doctor-gold:hover {
    border-color: #fbbf24;
    box-shadow:
      0 0 10px rgb(255 215 0 / 88%),
      0 0 26px rgb(255 215 0 / 68%),
      inset 0 0 10px rgb(255 255 255 / 64%);
  }

  .directory-doctor-silver:hover {
    border-color: #4773b5;
    box-shadow:
      0 1px 0 rgb(255 255 255 / 90%) inset,
      0 18px 42px rgb(42 83 145 / 24%);
  }

  .directory-doctor-copper:hover {
    border-color: #a65e36;
    box-shadow:
      0 1px 0 rgb(255 255 255 / 62%) inset,
      0 18px 42px rgb(123 63 27 / 27%);
  }

  .directory-doctor-practice:hover {
    border-color: rgb(14 116 144 / 42%);
    box-shadow: 0 18px 42px rgb(14 116 144 / 15%);
  }
}

.directory-photo-frame {
  position: relative;
  z-index: 1;
  flex: 0 0 42%;
  min-width: 0;
  overflow: hidden;
  background: #eeeef0;
}

.directory-photo-frame::after {
  position: absolute;
  inset: 0;
  background:
    linear-gradient(90deg, transparent 82%, rgb(0 0 0 / 3%)),
    linear-gradient(180deg, transparent 76%, rgb(0 0 0 / 8%));
  content: "";
  pointer-events: none;
}

.directory-doctor-photo {
  display: block;
  width: 100%;
  height: 100%;
  min-height: 340px;
  object-fit: cover;
  object-position: center center;
  transition: transform .5s cubic-bezier(.2, .8, .2, 1);
}

@media (hover: hover) and (pointer: fine) {
  .directory-doctor-card:hover .directory-doctor-photo {
    transform: scale(1.018);
  }
}

.directory-doctor-content {
  position: relative;
  z-index: 2;
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
  min-width: 0;
  padding: 1.25rem 1.15rem 1.1rem;
}

.directory-doctor-content h2 {
  display: -webkit-box;
  min-height: 2.55em;
  margin: 0 0 .58rem;
  overflow: hidden;
  color: var(--directory-ink);
  font-size: 1.03rem;
  font-weight: 700;
  line-height: 1.28;
  letter-spacing: -.018em;
  text-wrap: balance;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.directory-doctor-description {
  display: -webkit-box;
  min-height: 8em;
  margin: 0;
  overflow: hidden;
  color: var(--directory-muted);
  font-size: .765rem;
  font-weight: 400;
  line-height: 1.45;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 6;
}

.directory-consultation-price {
  display: flex;
  flex-wrap: wrap;
  gap: .28rem;
  margin-top: .78rem;
  padding: .62rem 0;
  border-top: 1px solid var(--directory-line);
  border-bottom: 1px solid var(--directory-line);
  color: var(--directory-ink);
  font-size: .79rem;
}

.directory-consultation-price strong {
  font-size: .88rem;
  font-variant-numeric: tabular-nums;
}

.directory-rating {
  display: flex;
  justify-content: center;
  gap: .1rem;
  margin: auto 0 .85rem;
  padding-top: .85rem;
}

.directory-star {
  width: 1.18rem;
  height: 1.18rem;
  fill: #d8d8dc;
  stroke: #d8d8dc;
  stroke-linejoin: round;
  stroke-width: 1;
}

.directory-star.is-filled {
  fill: #e9a216;
  stroke: #e9a216;
}

.directory-card-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: .46rem;
}

.directory-action {
  display: inline-flex;
  flex: 1 1 92px;
  align-items: center;
  justify-content: center;
  min-width: 0;
  min-height: 40px;
  padding: .52rem .65rem;
  border: 1px solid transparent;
  border-radius: .72rem;
  box-shadow: 0 2px 7px rgb(15 23 42 / 10%);
  color: #fff;
  font-size: .71rem;
  font-weight: 650;
  line-height: 1;
  text-align: center;
  transition:
    background-color .2s ease,
    box-shadow .2s ease,
    transform .2s ease;
}

.directory-action svg {
  flex: 0 0 auto;
  width: 1.22rem;
  height: 1.22rem;
  margin-right: .38rem;
  fill: currentcolor;
  stroke: currentcolor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 1.8;
}

.directory-action-whatsapp {
  background: #087a50;
}

.directory-action-call {
  background: #1d1d1f;
}

.directory-action-profile {
  background: #9d174d;
}

@media (hover: hover) and (pointer: fine) {
  .directory-action:hover {
    box-shadow: 0 5px 14px rgb(15 23 42 / 17%);
    filter: brightness(.92);
    transform: translateY(-1px);
  }
}

.directory-action:active {
  box-shadow: 0 1px 4px rgb(15 23 42 / 10%);
  transform: translateY(0);
}

.directory-action:focus-visible {
  outline: 3px solid rgb(0 113 227 / 27%);
  outline-offset: 2px;
}

.directory-empty-state {
  display: grid;
  min-height: 430px;
  place-content: center;
  justify-items: center;
  padding: 3rem 1rem;
  border: 1px solid rgb(29 29 31 / 8%);
  border-radius: 1.35rem;
  background: rgb(255 255 255 / 62%);
  box-shadow: 0 10px 32px rgb(15 23 42 / 4%);
  color: var(--directory-ink);
  text-align: center;
}

.directory-empty-state > svg {
  width: 3.4rem;
  height: 3.4rem;
  margin-bottom: .75rem;
  padding: .65rem;
  border-radius: 1rem;
  background: #f2f2f7;
  fill: none;
  stroke: #86868b;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 1.35;
}

.directory-empty-state h2 {
  margin: 0 0 .35rem;
  font-size: clamp(1.35rem, 4vw, 1.6rem);
  letter-spacing: -.025em;
}

.directory-empty-state p {
  max-width: 34rem;
  margin: 0;
  color: var(--directory-muted);
}

.directory-empty-reset {
  margin-top: 1.05rem;
  color: var(--directory-blue);
  font-size: .875rem;
  font-weight: 650;
  text-underline-offset: 3px;
}

.directory-empty-reset:hover {
  text-decoration: underline;
}

.directory-empty-reset:focus-visible {
  border-radius: .3rem;
  outline: 3px solid rgb(0 113 227 / 22%);
  outline-offset: 3px;
}

.directory-pagination {
  display: flex;
  max-width: 100%;
  align-items: center;
  justify-content: safe center;
  gap: .28rem;
  overflow-x: auto;
  padding: .45rem;
  scrollbar-width: thin;
  scrollbar-color: rgb(29 29 31 / 20%) transparent;
}

.directory-page-link,
.directory-page-ellipsis {
  display: inline-flex;
  flex: 0 0 auto;
  min-width: 40px;
  min-height: 40px;
  align-items: center;
  justify-content: center;
  padding: .5rem .72rem;
  border: 1px solid var(--directory-line);
  border-radius: .72rem;
  background: rgb(255 255 255 / 86%);
  box-shadow: 0 1px 3px rgb(15 23 42 / 4%);
  color: #525257;
  font-size: .75rem;
  font-weight: 550;
  font-variant-numeric: tabular-nums;
  transition:
    background-color .18s ease,
    border-color .18s ease,
    box-shadow .18s ease,
    color .18s ease,
    transform .18s ease;
}

a.directory-page-link:hover {
  z-index: 1;
  border-color: rgb(0 113 227 / 24%);
  background: #fff;
  box-shadow: 0 4px 10px rgb(15 23 42 / 8%);
  color: var(--directory-blue);
  transform: translateY(-1px);
}

.directory-page-link:focus-visible {
  z-index: 3;
  outline: 3px solid rgb(0 113 227 / 22%);
  outline-offset: 2px;
}

.directory-page-link.is-current {
  z-index: 2;
  border-color: var(--directory-blue);
  background: var(--directory-blue);
  box-shadow: 0 4px 12px rgb(0 113 227 / 22%);
  color: #fff;
  font-weight: 700;
}

.directory-page-link.is-disabled {
  cursor: not-allowed;
  background: rgb(242 242 247 / 65%);
  box-shadow: none;
  color: #a1a1a6;
}

.directory-page-direction {
  gap: .28rem;
  padding-inline: .82rem;
}

.directory-page-direction svg {
  width: .9rem;
  height: .9rem;
  fill: none;
  stroke: currentcolor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 2;
}

.directory-page-ellipsis {
  border-color: transparent;
  background: transparent;
  box-shadow: none;
  color: #8e8e93;
}

@keyframes directory-gold-shimmer {
  0% {
    opacity: 0;
    transform: translateX(-100%) rotate(25deg);
  }

  10% {
    opacity: .4;
  }

  50% {
    opacity: .2;
    transform: translateX(100%) rotate(25deg);
  }

  90% {
    opacity: .4;
  }

  100% {
    opacity: 0;
    transform: translateX(100%) rotate(25deg);
  }
}

@keyframes directory-priority-pulse {
  0%,
  100% {
    opacity: 1;
  }

  50% {
    opacity: .9;
  }
}

@media (min-width: 1024px) {
  .directory-doctor-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (min-width: 1536px) {
  .directory-doctor-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 1120px) {
  .directory-page {
    width: min(calc(100% - 2.5rem), 1880px);
  }

  .directory-filters {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .directory-filter-specialty,
  .directory-keyword {
    min-width: 0;
  }
}

@media (max-width: 760px) {
  .directory-page {
    width: min(calc(100% - 2rem), 720px);
    padding-top: 1rem;
  }

  .directory-search {
    padding: .85rem;
    border-radius: 1.15rem;
  }

  .directory-filters {
    grid-template-columns: 1fr;
    gap: .7rem;
  }

  .directory-keyword {
    width: 100%;
    min-width: 0;
    max-width: 100%;
  }

  .directory-divider {
    margin-block: 1.3rem 1.05rem;
  }

  .directory-doctor-card {
    display: block;
    max-width: 720px;
    margin-inline: auto;
    border-radius: 1.2rem;
  }

  .directory-photo-frame {
    width: 100%;
    height: clamp(300px, 82vw, 430px);
  }

  .directory-photo-frame::after {
    background: linear-gradient(180deg, transparent 72%, rgb(0 0 0 / 9%));
  }

  .directory-doctor-photo {
    min-height: 0;
    object-position: center 20%;
  }

  .directory-doctor-content {
    padding: 1.15rem;
  }

  .directory-doctor-description {
    min-height: auto;
    -webkit-line-clamp: 7;
  }

  .directory-consultation-price {
    margin-top: .85rem;
  }

  .directory-rating {
    margin-top: .15rem;
  }

  .directory-card-actions {
    margin-top: .1rem;
  }

  .directory-action {
    flex-basis: 120px;
    min-height: 44px;
  }

  .directory-result-count {
    text-align: left;
  }

  .directory-pagination {
    justify-content: safe center;
    margin-inline: 0;
  }

  .directory-page-direction {
    font-size: 0;
    padding-inline: .65rem;
  }

  .directory-page-direction svg {
    width: 1rem;
    height: 1rem;
  }
}

@media (max-width: 520px) {
  .directory-photo-frame {
    height: clamp(340px, 112vw, 460px);
  }
}

@media (max-width: 420px) {
  .directory-page {
    width: calc(100% - 1.5rem);
    padding-bottom: 2.75rem;
  }

  .directory-search {
    padding: .72rem;
    border-radius: 1rem;
  }

  .directory-filter-field select,
  .directory-keyword {
    min-height: 44px;
  }

  .directory-keyword input {
    min-width: 0;
    padding-inline: .72rem;
  }

  .directory-search-submit,
  .directory-reset {
    justify-content: center;
    margin-right: .3rem;
    padding-inline: .62rem;
    text-align: center;
  }

  .directory-doctor-grid {
    gap: 1rem;
  }

  .directory-doctor-content {
    padding: 1rem;
  }

  .directory-card-actions {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .directory-action {
    width: 100%;
  }

  .directory-action-profile:last-child:nth-child(odd) {
    grid-column: 1 / -1;
  }

  .directory-empty-state {
    min-height: 350px;
    padding-inline: 1.25rem;
  }
}

@media (prefers-reduced-motion: reduce) {
  .directory-doctor-card,
  .directory-doctor-photo,
  .directory-search-submit,
  .directory-reset,
  .directory-action,
  .directory-page-link {
    transition: none;
  }

  .directory-doctor-card:hover,
  .directory-doctor-card:hover .directory-doctor-photo,
  .directory-search-submit:hover,
  .directory-reset:hover,
  .directory-action:hover,
  a.directory-page-link:hover {
    transform: none;
  }

  .directory-doctor-gold::after,
  .directory-priority-badge-gold {
    animation: none;
  }
}

@media (forced-colors: active) {
  .directory-search,
  .directory-doctor-card,
  .directory-empty-state,
  .directory-page-link {
    border: 1px solid CanvasText;
  }

  .directory-action,
  .directory-page-link.is-current {
    border-color: ButtonText;
  }
}