.integrations-directory{max-width:1600px;margin:0 auto;padding:0 38px;font-family:"DM Sans",Arial,sans-serif}
.integrations-directory-eyebrow{margin:0;color:#8f5cff;font-size:11px;font-weight:800;letter-spacing:.16em;line-height:1.2;text-transform:uppercase}
.integrations-directory-hero{min-height:0;padding:56px 4.5% 54px;display:grid;grid-template-columns:minmax(0,1.28fr) minmax(320px,.72fr);gap:6%;align-items:center;border-bottom:1px solid var(--line);background:radial-gradient(circle at 82% 22%,rgba(143,92,255,.11),transparent 27%),linear-gradient(135deg,#fff 0%,#faf9fc 100%)}
.integrations-directory-hero h1{max-width:820px;margin:14px 0 0;font-size:clamp(50px,5vw,78px);font-weight:700;letter-spacing:-.07em;line-height:.96;text-wrap:balance}
.integrations-directory-intro{max-width:510px;padding:2px 0 2px 26px;border-left:2px solid #8f5cff}
.integrations-directory-intro p{margin:0 0 16px;color:#4e4e4e;font-size:17px;line-height:1.55}
.integrations-directory-intro span{color:#8f5cff;font-size:11px;font-weight:800;letter-spacing:.08em;text-transform:uppercase}
.integrations-directory-list{padding:56px 0 68px}
.integrations-directory-heading{display:grid;grid-template-columns:auto minmax(340px,1fr) minmax(420px,720px);align-items:end;gap:clamp(34px,4vw,70px);margin-bottom:30px}
.integrations-directory-heading h2{max-width:720px;margin:0;font-size:clamp(34px,3.2vw,52px);letter-spacing:-.055em;line-height:1}
.integrations-platform-proof{min-width:0;display:grid;grid-template-columns:auto 1fr;grid-template-areas:"count caption" "marks marks";column-gap:14px;align-items:end}
.integrations-platform-count{grid-area:count;color:#8f5cff;font-size:clamp(58px,5.2vw,82px);font-weight:750;letter-spacing:-.08em;line-height:.7}
.integrations-platform-caption{grid-area:caption;padding-bottom:2px;display:grid;gap:4px}
.integrations-platform-caption strong{font-size:12px;letter-spacing:.16em}
.integrations-platform-caption small{color:#6b6473;font-size:8px;font-weight:750;letter-spacing:.12em;white-space:nowrap}
.integrations-platform-marks{grid-area:marks;margin-top:16px;display:flex;align-items:center}
.integrations-platform-marks img,.integrations-platform-marks b{width:39px;height:39px;margin-right:-5px;display:grid;place-items:center;border:1px solid #e6e0ee;border-radius:50%;background:#fff;box-shadow:0 7px 18px rgba(63,39,94,.08)}
.integrations-platform-marks img{padding:9px;object-fit:contain}
.integrations-platform-marks b{background:#8f5cff;color:#fff;font-size:10px;letter-spacing:-.02em}
.integrations-directory-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border-top:1px solid var(--line);border-left:1px solid var(--line)}
.integration-directory-card{position:relative;min-height:150px;padding:24px;display:grid;grid-template-columns:48px 1fr auto;gap:17px;align-items:center;border-right:1px solid var(--line);border-bottom:1px solid var(--line);background:radial-gradient(circle at 18% 12%,rgba(143,92,255,.022),transparent 34%),linear-gradient(112deg,#fff 0%,#fefeff 38%,#f8f7fa 54%,#fefeff 72%,#fff 100%);box-shadow:inset 0 1px 0 rgba(255,255,255,.96),inset 0 -1px 0 rgba(105,82,135,.03),0 8px 22px rgba(69,49,94,.015);transition:background .2s ease,transform .2s ease}
.integration-directory-card:hover,.integration-directory-card:focus-visible{z-index:1;background:linear-gradient(135deg,rgba(255,255,255,.98),rgba(143,92,255,.10));transform:translateY(-3px);outline:1px solid #8f5cff}
.integration-directory-card img{width:42px;height:42px;display:block;object-fit:contain}
.integration-directory-card span{display:flex;min-width:0;flex-direction:column;gap:5px}
.integration-directory-card strong{font-size:19px;letter-spacing:-.03em;text-wrap:balance}
.integration-directory-card small{color:#666;font-size:12px;text-wrap:pretty}
.integration-directory-card b{color:#8f5cff;font-size:18px;font-weight:400}
.integrations-directory-cta{margin-bottom:70px;padding:52px 5%;display:grid;grid-template-columns:1fr 1fr;gap:10%;align-items:end;border:1px solid rgba(143,92,255,.28);background:linear-gradient(120deg,rgba(241,239,244,.9),rgba(247,244,253,.9) 52%,rgba(255,255,255,.98))}
.integrations-directory-cta h2{margin:14px 0 0;font-size:clamp(42px,4vw,68px);letter-spacing:-.065em;line-height:.95}
.integrations-directory-cta>div:last-child{max-width:520px}
.integrations-directory-cta>div:last-child p{margin:0 0 24px;color:#555;font-size:16px;line-height:1.65}
.integrations-directory-cta a{min-height:52px;padding:0 20px;display:inline-flex;align-items:center;justify-content:space-between;gap:45px;border:1px solid #8f5cff;background:#8f5cff;color:#fff;font-size:14px;font-weight:700;transition:background .2s ease,transform .2s ease}
.integrations-directory-cta a:hover,.integrations-directory-cta a:focus-visible{background:#7d4ce9;transform:translateY(-2px);outline:0}
@media(max-width:1100px){.integrations-directory-hero{grid-template-columns:minmax(0,1fr) 340px;padding-left:3%;padding-right:3%;gap:4%}.integrations-directory-hero h1{font-size:clamp(46px,5.6vw,62px)}.integrations-directory-heading{grid-template-columns:auto minmax(240px,1fr) minmax(340px,500px);gap:30px}.integrations-directory-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:820px){.integrations-directory{padding:0 20px}.integrations-directory-hero{min-height:0;padding:44px 0 40px;display:block;background:radial-gradient(circle at 90% 13%,rgba(143,92,255,.12),transparent 30%)}.integrations-directory-hero h1{margin-top:14px;font-size:clamp(44px,12vw,62px);line-height:.98}.integrations-directory-intro{margin-top:28px;padding-left:18px}.integrations-directory-intro p{font-size:16px;line-height:1.52}.integrations-directory-list{padding:42px 0 56px}.integrations-directory-heading{display:block}.integrations-platform-proof{display:none}.integrations-directory-heading h2{margin-top:13px;font-size:38px}.integrations-directory-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.integration-directory-card{min-height:128px;padding:18px;grid-template-columns:40px 1fr auto;gap:12px}.integration-directory-card img{width:36px;height:36px}.integration-directory-card strong{font-size:17px}.integrations-directory-cta{margin-bottom:40px;padding:36px 24px;display:block}.integrations-directory-cta>div:last-child{margin-top:28px}.integrations-directory-cta a{width:100%}}
@media(max-width:520px){.integrations-directory-hero h1{max-width:none;font-size:clamp(24px,7.4vw,32px);line-height:1.02;letter-spacing:-.045em;text-wrap:initial}.integrations-directory-hero h1 span{display:block;white-space:nowrap}.integrations-directory-grid{grid-template-columns:1fr}.integration-directory-card{min-height:104px}.integrations-directory-heading h2{font-size:34px}}
@media(prefers-reduced-motion:reduce){.integration-directory-card,.integrations-directory-cta a{transition:none}.integration-directory-card:hover,.integration-directory-card:focus-visible,.integrations-directory-cta a:hover,.integrations-directory-cta a:focus-visible{transform:none}}

/* Keep directory headlines composed and readable on phones. */
@media(min-width:521px) and (max-width:820px){
  .integrations-directory-hero h1{max-width:350px;font-size:clamp(33px,8.9vw,35px);line-height:1;letter-spacing:-.052em;text-wrap:balance}
}
