/* /integrations — хаб и лендинги связок (#22401). Поиск — классы .mg-exp из explanation-hub.css. */

.mg-int {
  overflow-x: clip;
}

.mg-int .mg2-hero__lead {
  max-width: none;
}

.mg-int__cta {
  margin: 24px 0 0;
}

body.mg-site--v2b .mg-int button.mg2-btn--fill,
body.mg-site--v2b .mg-int button.mg2-btn--fill:hover,
body.mg-site--v2b .mg-int button.mg2-btn--fill:focus-visible {
  color: var(--mg-on-accent, #fff);
}

.mg-int__grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 12px;
  min-width: 0;
}

@media (min-width: 720px) {
  .mg-int__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (min-width: 960px) {
  .mg-int__grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

.mg-int__card {
  display: block;
  min-width: 0;
  padding: 20px 18px;
  background: var(--mg-cream);
  color: var(--mg-black);
  text-decoration: none;
}

.mg2-band--cream .mg-int__card {
  background: var(--mg-white);
}

body.mg-site--v2b .mg-int a.mg-int__card,
body.mg-site--v2b .mg-int a.mg-int__card:hover {
  color: var(--mg-black);
  text-decoration: none;
}

.mg-int__card h3 {
  margin: 0 0 8px;
  font-size: clamp(22px, 2vw, 28px);
  font-weight: 700;
  letter-spacing: -0.03em;
  line-height: 1.15;
}

.mg-int__card p {
  margin: 0;
  font-size: clamp(15px, 1.5vw, 18px);
  font-weight: 600;
  letter-spacing: -0.02em;
  line-height: 1.35;
}

body.mg-site--v2b .mg-int a.mg-int__card:hover h3 {
  color: var(--mg-blue-link);
}

.mg-int__guides {
  margin: 0;
  padding: 0;
  list-style: none;
}

.mg-int__guides li + li {
  margin-top: 10px;
}

body.mg-site--v2b .mg-int a.mg2-textlink {
  color: var(--mg-blue-link);
}

body.mg-site--v2b .mg-int a.mg2-textlink:hover {
  color: var(--mg-blue-hover);
}

.mg-int__crumb {
  margin: 0 0 12px;
  font-weight: 600;
}

body.mg-site--v2b .mg-int__crumb a {
  color: var(--mg-black);
  text-decoration: none;
}

body.mg-site--v2b .mg-int__crumb a:hover {
  color: var(--mg-blue-link);
}

@media (max-width: 719px) {
  .mg-int .mg2-hero__title {
    font-size: clamp(36px, 10vw, 48px);
  }
}