.integrations-page { padding-block:64px 55px; font-size:16px; }
.integrations-page h1,.integrations-page h2 { letter-spacing:-.04em; }
.integrations-page p,.integrations-page dd,.integrations-page li { line-height:1.75; }
.integrations-page a:focus-visible { outline:3px solid var(--blue); outline-offset:5px; }
.integrations-intro { padding-bottom:44px; }
.integrations-intro h1 { font-size:clamp(42px,5vw,68px); line-height:1.08; }
.integrations-intro p { max-width:52ch; margin-top:18px; font-size:18px; }
.integrations-list { display:grid; grid-template-columns:repeat(auto-fill,minmax(280px,1fr)); gap:20px; padding-bottom:64px; }
.integration-card { display:grid; grid-template-columns:44px 1fr; gap:4px 14px; padding:24px; background:white; border:1px solid var(--line); border-radius:10px; color:var(--ink); }
.integration-card:hover { border-color:#b9cbe2; background:#f7faff; }
.integration-mark { display:grid; place-items:center; grid-row:span 2; width:44px; height:44px; background:var(--sky); color:var(--blue); border-radius:8px; }
.integration-mark svg { width:22px; height:22px; }
.integration-name { font-size:20px; font-weight:700; letter-spacing:-.025em; }
.integration-kind { color:var(--slate); font-size:13px; font-weight:650; }
.integration-summary { grid-column:1 / -1; margin-top:12px; color:var(--slate); font-size:14px; line-height:1.65; }
.integration-detail { display:grid; grid-template-columns:.9fr 1.1fr; gap:28px 70px; padding-block:55px; border-top:1px solid var(--line); scroll-margin-top:110px; }
.integration-detail-head { grid-row:span 2; }
.integration-detail-head .integration-kind { margin-bottom:10px; }
.integration-detail h2 { font-size:38px; line-height:1.15; }
.integration-detail-head>p:last-child { margin-top:19px; max-width:48ch; }
.integration-steps { margin:0; padding:0; list-style:none; counter-reset:step; border-top:1px solid var(--line); }
.integration-steps li { display:grid; grid-template-columns:36px 1fr; gap:2px 13px; padding:17px 0; border-bottom:1px solid var(--line); counter-increment:step; }
.integration-steps li:before { content:counter(step); grid-row:span 2; color:#7185a0; font-size:14px; }
.integration-steps li strong { font-weight:700; }
.integration-steps li span { color:var(--slate); font-size:14px; }
.integration-facts { display:grid; grid-template-columns:1fr 1fr; gap:22px 32px; margin:0; padding:26px 28px; background:#f2f6fc; border-radius:9px; }
.integration-facts dt { font-weight:700; }
.integration-facts dd { margin:4px 0 0; color:var(--slate); font-size:14px; }
.integration-facts a { color:var(--blue); text-decoration:underline; text-underline-offset:4px; }
.integrations-request { display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:6px 35px; margin-top:20px; padding-top:28px; border-top:1px solid var(--line); }
.integrations-request h2 { font-size:24px; }
.integrations-request p { flex:1 1 30ch; color:var(--slate); }
.integrations-request .text-button { color:var(--blue); }
.integrations-request svg { width:17px; height:17px; }
@media(max-width:900px) {
  .integration-detail { gap:28px 34px; }
  .integration-facts { grid-template-columns:1fr; }
}
@media(max-width:750px) {
  .integrations-page { padding-block:36px; }
  .integrations-intro { padding-bottom:32px; }
  .integrations-intro h1 { font-size:clamp(38px,8vw,54px); }
  .integrations-intro p { font-size:16px; }
  .integrations-list { padding-bottom:42px; }
  .integration-detail { grid-template-columns:1fr; padding-block:42px; }
  .integration-detail-head { grid-row:auto; }
  .integration-detail h2 { font-size:32px; }
  .integration-facts { padding:22px; }
  .integrations-request { align-items:start; flex-direction:column; }
}