/* ================= /integrations/ ================= */
.ey-m{background:var(--t-mint);color:#1F6B44}
.ig-hero{isolation:isolate;padding-bottom:64px}
.ig-hero .mesh .b1{width:50vw;height:50vw;left:-12vw;top:-10%;background:radial-gradient(closest-side,rgba(142,197,255,.7),rgba(142,197,255,0));animation:drift1 22s ease-in-out infinite alternate}
.ig-hero .mesh .b2{width:46vw;height:46vw;right:-12vw;top:-6%;background:radial-gradient(closest-side,rgba(127,211,166,.6),rgba(127,211,166,0));animation:drift2 26s ease-in-out infinite alternate}
.ig-hero .mesh .b3{width:40vw;height:40vw;left:30vw;top:40%;background:radial-gradient(closest-side,rgba(107,79,160,.35),rgba(107,79,160,0));animation:drift3 20s ease-in-out infinite alternate}
.ig-hero .mesh .fade{position:absolute;inset:0;background:linear-gradient(180deg,rgba(251,248,243,.3) 0%,rgba(251,248,243,0) 40%,rgba(251,248,243,.6) 80%,var(--bg) 100%)}
.ig-hero h1{max-width:15ch}
.ig-stats{display:flex;justify-content:center;gap:12px;margin-top:32px;flex-wrap:wrap}
.ig-stats span{display:inline-flex;align-items:center;gap:10px;padding:8px 16px 8px 8px;border-radius:999px;background:rgba(255,255,255,.85);border:1px solid var(--line);box-shadow:var(--sh-1)}
.ig-stats b{display:grid;place-items:center;width:34px;height:34px;border-radius:50%;font:800 15px/1 var(--fd);background:var(--t-mint);color:#1F6B44}
.ig-stats span:last-child b{background:var(--t-lilac);color:#4E3585}
.ig-stats em{font-style:normal;font-weight:600;font-size:14.5px}

.ig-sec{padding-top:24px}
.ig-bar{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-bottom:28px}
.ig-filters{display:flex;gap:8px;flex-wrap:wrap}
.ig-filters button{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:0 14px 0 16px;border-radius:999px;border:1.5px solid var(--line);background:#fff;font:600 14.5px/1 var(--fb);color:var(--ink2);cursor:pointer;transition:background .2s,color .2s,border-color .2s}
.ig-filters button em{font-style:normal;font-size:12px;font-weight:700;min-width:24px;height:22px;padding:0 6px;border-radius:999px;display:grid;place-items:center;background:var(--bg2);color:var(--ink2)}
.ig-filters button:hover{border-color:rgba(23,19,15,.3)}
.ig-filters button[aria-pressed="true"]{background:var(--ink);border-color:var(--ink);color:#fff}
.ig-filters button[aria-pressed="true"] em{background:rgba(255,255,255,.18);color:#fff}
.ig-count{font-size:14px;color:var(--muted);font-weight:500}

.ig-grid{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
.ig{position:relative;display:flex;flex-direction:column;gap:12px;padding:20px;border-radius:var(--r-md);background:#fff;border:1px solid var(--line2);box-shadow:var(--sh-1);transition:transform .25s cubic-bezier(.2,.8,.2,1),box-shadow .25s;animation:igIn .45s cubic-bezier(.2,.8,.2,1) both}
.ig:hover{transform:translateY(-3px);box-shadow:0 22px 44px -24px rgba(46,26,70,.4)}
@keyframes igIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.ig-top{display:flex;align-items:center;justify-content:space-between;gap:8px;flex-wrap:wrap}
.ig-cat{display:inline-flex;align-items:center;gap:6px;font-size:11.5px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.ig-cat i{width:9px;height:9px;border-radius:3px;background:var(--muted)}
.ig-channels .ig-cat i{background:#D2557F}.ig-crm .ig-cat i{background:var(--terra)}.ig-cal .ig-cat i{background:#3E8FD8}.ig-commerce .ig-cat i{background:#C99016}
.ig-name{font:800 23px/1.12 var(--fd);letter-spacing:-.03em;color:var(--ink)}
.ig-d{font-size:14px;line-height:1.5;color:var(--ink2)}
.ig-st{display:inline-flex;align-items:center;gap:6px;height:24px;padding:0 9px;border-radius:999px;font-size:11.5px;font-weight:700;white-space:nowrap}
.ig-st::before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor}
.st-l{background:var(--t-mint);color:#1F6B44}
.st-r{background:var(--t-lilac);color:#4E3585}
.ig[data-status="r"]{background:#FDFBF8}

.ig-legend{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:28px}
.lg{display:flex;flex-direction:column;align-items:flex-start;gap:10px;padding:22px 24px;border-radius:var(--r-md)}
.lg-l{background:var(--t-mint)}.lg-r{background:var(--t-lilac)}
.lg .ig-st{background:#fff}
.lg p{font-size:15.5px;line-height:1.55;color:var(--ink2)}

.ig-how{background:linear-gradient(180deg,var(--bg) 0%,var(--bg2) 50%,var(--bg) 100%)}
.ig-points{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.igp{background:#fff;border-radius:var(--r-md);padding:26px 24px;box-shadow:var(--sh-1)}
.igp-ic{width:46px;height:46px;border-radius:14px;display:grid;place-items:center;color:#fff}
.igp-v{background:var(--violet)}.igp-s{background:#3E8FD8}.igp-t{background:var(--terra)}.igp-m{background:#2E9E62}
.igp h3{margin-top:18px;font-size:22px;letter-spacing:-.03em;line-height:1.15}
.igp p{margin-top:8px;font-size:15px;line-height:1.55;color:var(--ink2)}

.ig-cta-sec{padding-top:40px}
.ig-cta{position:relative;overflow:hidden;isolation:isolate;border-radius:48px;padding:76px 48px;text-align:center;background:#2C1F3A;color:#fff;display:flex;flex-direction:column;align-items:center}
.ig-cta h2{font-size:clamp(34px,4.4vw,58px);letter-spacing:-.035em;max-width:18ch;text-wrap:balance}
.ig-cta p{margin-top:18px;font-size:18px;color:rgba(255,255,255,.85);max-width:34em}
.ig-cta-btns{display:flex;gap:12px;flex-wrap:wrap;justify-content:center;margin-top:30px}
.btn-glass{background:rgba(255,255,255,.12);border-color:rgba(255,255,255,.35);color:#fff}
.btn-glass:hover{background:rgba(255,255,255,.2)}

@media (max-width:1100px){
  .ig-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .ig-points{grid-template-columns:1fr 1fr}
}
@media (max-width:760px){
  .ig-hero{padding-bottom:44px}
  .ig-bar{margin-bottom:20px}
  .ig-filters{flex-wrap:nowrap;overflow-x:auto;margin:0 -20px;padding:2px 20px 6px;scrollbar-width:none;width:calc(100% + 40px)}
  .ig-filters::-webkit-scrollbar{display:none}
  .ig-filters button{flex:none}
  .ig-grid{grid-template-columns:1fr 1fr;gap:10px}
  .ig{padding:16px 14px;gap:10px;border-radius:20px}
  .ig-top{flex-direction:column;align-items:flex-start;gap:8px}
  .ig-name{font-size:19px}
  .ig-d{font-size:13.5px}
  .ig-legend{grid-template-columns:1fr}
  .ig-points{grid-template-columns:1fr;gap:12px}
  .ig-cta{padding:52px 22px;border-radius:32px}
  .ig-cta p{font-size:16.5px}
}
@media (max-width:380px){.ig-grid{grid-template-columns:1fr}}
@media (prefers-reduced-motion:reduce){.ig{animation:none}}
/* consistent card anatomy: category, name, description, status pinned to the bottom */
.ig-top{display:contents}
.ig-cat{order:1}
.ig-name{order:2}
.ig-d{order:3}
.ig .ig-st{order:4;margin-top:auto;align-self:flex-start}
@media (max-width:760px){
  .ig-stats{flex-wrap:nowrap;gap:8px}
  .ig-stats span{padding:6px 12px 6px 6px;gap:8px}
  .ig-stats b{width:28px;height:28px;font-size:13px}
  .ig-stats em{font-size:13px;white-space:nowrap}
}
