.esimy-directory {
  background: #f8f7ff;
}

.esimy-directory__section {
  max-width: 1320px;
}

.esimy-directory__intro {
  max-width: 760px;
}

.esimy-directory__intro p {
  margin-bottom: .75rem;
}

.esimy-directory__nav a {
  border: 1px solid #e4e1f3;
  background: #fff;
  color: #36394c;
  font-weight: 700;
}

.esimy-directory__nav a:hover,
.esimy-directory__nav a:focus-visible {
  border-color: #6850ee;
  color: #5941df;
}

.esimy-directory__nav a[aria-current="page"] {
  border-color: #6850ee;
  background: #6850ee;
  color: #fff;
}

.esimy-directory__row {
  margin-top: 12px;
  overflow: hidden;
  border: 1px solid #e8e5f3;
  border-radius: 18px;
  background: #fff;
  box-shadow: 0 8px 24px rgba(36, 30, 79, .035);
  transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease;
}

.esimy-directory__row:hover,
.esimy-directory__row:focus-within {
  border-color: #aea0fa;
  box-shadow: 0 12px 30px rgba(77, 58, 158, .11);
  transform: translateY(-2px);
}

.esimy-directory__link:focus-visible {
  outline: 3px solid #6850ee;
  outline-offset: -3px;
}

.esimy-directory__name {
  display: flex;
  align-items: center;
}

.esimy-directory__name small {
  color: #697084;
}

.esimy-directory__plan {
  min-width: 0;
  border-left: 1px solid #f0eef7;
}

.esimy-directory__plan-label {
  color: #293044;
  font-size: .88rem;
  font-weight: 700;
  line-height: 1.3;
}

.esimy-directory__plan-validity {
  color: #747b8d;
  font-size: .75rem;
  line-height: 1.3;
}

.esimy-directory__plan data {
  color: #6249e7;
  font-weight: 800;
}

.esimy-directory__arrow {
  color: #6850ee;
  font-size: 1.55rem;
  line-height: 1;
}

.esimy-directory__faq details {
  border: 1px solid #e8e5f3;
  border-radius: 14px;
  background: #fff;
}

.esimy-directory__faq details[open] {
  border-color: #c8befb;
  box-shadow: 0 8px 24px rgba(36, 30, 79, .05);
}

@media (min-width: 1024px) {
  .esimy-directory__link {
    display: grid;
    grid-template-columns: minmax(190px, 1.45fr) repeat(5, minmax(112px, 1fr)) 48px;
  }

  .esimy-directory__link > * {
    grid-column: auto !important;
  }
}

@media (max-width: 1023px) {
  .esimy-directory__link {
    display: flex;
    align-items: center;
    justify-content: space-between;
    min-height: 88px;
  }

  .esimy-directory__link > :first-child {
    flex: 1;
  }

  .esimy-directory__nav ul {
    flex-wrap: wrap;
  }
}