/* MDoc 0.36.1 — brand refresh and homepage container correction. */

:root {
  --mdoc-brand-deep: #045d53;
  --mdoc-brand: #078778;
  --mdoc-brand-bright: #15b5a4;
  --mdoc-brand-mint: #69cdbd;
  --mdoc-brand-pale: #e9f7f3;
  --mdoc-brand-blush: #f5c0d0;
}

/* Brand: new MDoc.uz mark, readable wordmark and compact tagline. */
.mdoc-brand-mark {
  width: 46px;
  height: 46px;
  object-fit: contain;
  filter: drop-shadow(0 8px 14px rgba(4, 93, 83, .18));
}

.mdoc-brand-copy strong {
  display: inline-flex;
  align-items: baseline;
  color: #102b25;
  font-size: 23px;
  font-weight: 900;
  line-height: 1;
  letter-spacing: -.035em;
}

.mdoc-brand-domain {
  margin-left: 1px;
  color: var(--mdoc-brand-bright);
  font-size: .68em;
  font-weight: 850;
  letter-spacing: -.02em;
}

.mdoc-brand-copy small {
  margin-top: 4px;
  color: #5f756e;
  font-size: 9px;
  font-weight: 760;
  letter-spacing: .1em;
  line-height: 1.2;
  text-transform: uppercase;
}

/* The homepage uses the normal MDoc frame again. Only the card layout differs. */
.directions-home-v30 > .container,
.home-showcase-section > .container,
.home-map-section > .container {
  width: min(calc(100% - 40px), var(--container)) !important;
}

.home-showcase-section {
  padding-block: 58px !important;
}

.home-showcase-heading {
  margin-bottom: 26px !important;
}

/* Six direction cards remain possible inside the normal 1320px frame. */
.direction-grid-home {
  gap: 12px !important;
}

.direction-grid-home .direction-card__link {
  grid-template-rows: 112px minmax(0, 1fr);
  min-height: 358px !important;
  border-radius: 20px;
  box-shadow: 0 12px 30px rgba(17, 61, 52, .07);
}

.direction-grid-home .direction-card__visual {
  min-height: 112px;
}

.direction-grid-home .direction-card__icon {
  width: 64px;
  height: 64px;
  border-width: 7px;
  border-radius: 20px;
}

.direction-grid-home .direction-card__icon img {
  width: 48px;
  height: 48px;
}

.direction-grid-home .direction-card__body {
  min-height: 246px !important;
  padding: 17px 15px 15px;
}

.direction-grid-home .direction-card__title strong {
  min-height: 44px;
  font-size: 16px;
  line-height: 1.25;
}

.direction-grid-home .direction-card__description {
  min-height: 62px !important;
  margin-top: 8px;
  font-size: 12.5px;
  line-height: 1.5;
  -webkit-line-clamp: 3;
}

.direction-grid-home .direction-card__metrics {
  gap: 5px;
  padding-top: 12px;
  padding-right: 42px;
}

.direction-grid-home .direction-card__metrics > span {
  min-height: 19px;
  font-size: 11.5px;
}

.direction-grid-home .direction-card__metrics strong {
  font-size: 13px;
}

.direction-grid-home .direction-card__title > span {
  right: 13px;
  bottom: 13px;
  width: 36px;
  height: 36px;
}

.home-directions-more {
  margin-top: 26px;
}

@media (max-width: 1220px) {
  .directions-home-v30 > .container,
  .home-showcase-section > .container,
  .home-map-section > .container {
    width: min(calc(100% - 32px), var(--container)) !important;
  }

  .direction-grid-home {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 16px !important;
  }
}

@media (max-width: 760px) {
  .home-showcase-section {
    padding-block: 46px !important;
  }

  .direction-grid-home {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  .direction-grid-home .direction-card__link {
    min-height: 348px !important;
  }
}

@media (max-width: 520px) {
  .directions-home-v30 > .container,
  .home-showcase-section > .container,
  .home-map-section > .container {
    width: min(calc(100% - 22px), var(--container)) !important;
  }

  .direction-grid-home {
    grid-template-columns: 1fr !important;
  }

  .direction-grid-home .direction-card__link {
    grid-template-columns: 104px minmax(0, 1fr);
    grid-template-rows: auto;
    min-height: 238px !important;
  }

  .direction-grid-home .direction-card__visual {
    min-height: 100%;
  }

  .direction-grid-home .direction-card__body {
    min-height: 238px !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  .direction-grid-home .direction-card__link {
    transition: none !important;
  }
}