.page-integrations{background:var(--color-white);padding-bottom:4rem}.int-hero{padding-block:clamp(3rem,7vw,5rem)}.int-hero__grid{align-items:center;gap:2.5rem;display:grid}.int-hero__copy h1{letter-spacing:-.04em;color:var(--color-white);text-wrap:balance;max-width:14ch;margin:0 0 1rem;font-size:clamp(2.3rem,5vw,3.6rem);line-height:1.05}.int-hero__copy .segment-hero__lede{color:#c3cadb;max-width:42ch;font-size:1.125rem}.int-hero__stat{color:var(--color-muted-dark);margin:1.75rem 0 0;font-size:.95rem}.int-hero__stat strong{letter-spacing:-.02em;color:var(--color-white);margin-right:.3rem;font-size:1.6rem}.int-cloud{aspect-ratio:1.15;justify-self:center;width:100%;max-width:34rem;position:relative}.int-cloud:before{content:"";border:1px dashed color-mix(in srgb, var(--color-white) 14%, transparent);border-radius:50%;animation:60s linear infinite int-spin;position:absolute;inset:18%}.int-cloud:after{content:"";border:1px solid color-mix(in srgb, var(--color-cyan) 22%, transparent);border-radius:50%;position:absolute;inset:32%}@keyframes int-spin{to{transform:rotate(360deg)}}.int-cloud__core{z-index:1;background:var(--color-ink-raised);border:1px solid var(--color-ink-line);width:7rem;height:7rem;box-shadow:0 0 80px color-mix(in srgb, var(--color-mark-blue) 45%, transparent);border-radius:1.6rem;place-items:center;display:grid;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.int-cloud__core img{width:3.6rem;height:auto}.int-cloud__logo{left:var(--x);top:var(--y);width:var(--s);height:var(--s);background:var(--color-white);animation:6s ease-in-out infinite int-float;animation-delay:calc(var(--delay) * -1);border-radius:1.1rem;place-items:center;display:grid;position:absolute;transform:translate(-50%,-50%);box-shadow:0 18px 40px #00000059}.int-cloud__logo img{object-fit:contain;width:62%;height:62%}@keyframes int-float{0%,to{transform:translate(-50%,-50%)}50%{transform:translate(-50%,calc(-50% - 12px))}}@media (width>=960px){.int-hero__grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:3rem}}.int-section{padding-block:clamp(3.5rem,7vw,5.5rem)}.int-section--tint{background:var(--color-surface)}.int-head{max-width:46rem;margin:0 0 2.25rem}.int-head h2,.int-request h2{letter-spacing:-.035em;color:var(--color-deep-indigo);text-wrap:balance;margin:0;font-size:clamp(1.8rem,3.6vw,2.6rem);line-height:1.1}.int-head__lede{color:var(--color-text-2);max-width:60ch;margin:.9rem 0 0;font-size:1.05rem;line-height:1.6}.int-controls{gap:1rem;margin-bottom:1.25rem;display:grid}.int-search{background:var(--color-white);border:1px solid var(--color-cool-gray);max-width:28rem;color:var(--color-muted);border-radius:999px;align-items:center;gap:.6rem;padding:0 1rem;display:flex}.int-search:focus-within{border-color:var(--color-deep-indigo)}.int-search input{min-width:0;font:inherit;color:var(--color-deep-indigo);background:0 0;border:0;outline:none;flex:1;padding:.8rem 0;font-size:1rem}.int-chips{flex-wrap:wrap;gap:.5rem;display:flex}.int-chip{border:1px solid var(--color-cool-gray);background:var(--color-white);font:inherit;color:var(--color-text-2);cursor:pointer;transition:background .15s var(--ease-out), color .15s var(--ease-out), border-color .15s var(--ease-out);border-radius:999px;padding:.5rem .95rem;font-size:.88rem;font-weight:500}.int-chip:hover{border-color:var(--color-deep-indigo)}.int-chip.is-on{background:var(--color-deep-indigo);border-color:var(--color-deep-indigo);color:var(--color-white)}.int-legend{color:var(--color-muted);flex-wrap:wrap;gap:.5rem 1.25rem;margin:0 0 2rem;padding:0;font-size:.82rem;list-style:none;display:flex}.int-legend li{align-items:center;gap:.45rem;display:flex}.int-status{white-space:nowrap;border-radius:999px;align-items:center;height:1.4rem;padding:0 .55rem;font-size:.7rem;font-weight:600;display:inline-flex}.int-status--live{color:#0b6b3a;background:#dcf7e8}.int-status--buildable{color:#8a5300;background:#fff1d6}.int-status--stay-stack{color:#075e79;background:#dff7ff}.int-status--catalog{color:#4b5268;background:#eef1f6}.int-groups{gap:2.25rem;display:grid}.int-group__head{flex-wrap:wrap;align-items:baseline;gap:.25rem .9rem;margin-bottom:.9rem;display:flex}.int-group__head h3{letter-spacing:-.02em;color:var(--color-deep-indigo);margin:0;font-size:1.2rem}.int-group__head p{color:var(--color-muted);margin:0;font-size:.92rem}.int-grid{grid-template-columns:repeat(auto-fill,minmax(15.5rem,1fr));gap:.75rem;margin:0;padding:0;list-style:none;display:grid}.int-card{background:var(--color-white);border:1px solid var(--color-cool-gray);height:100%;color:var(--color-deep-indigo);transition:transform .18s var(--ease-out), box-shadow .18s var(--ease-out), border-color .18s var(--ease-out);border-radius:1rem;align-items:center;gap:.9rem;padding:.9rem 1rem;text-decoration:none;display:flex}a.int-card:hover{border-color:color-mix(in srgb, var(--color-deep-indigo) 35%, transparent);box-shadow:0 14px 30px color-mix(in srgb, var(--color-deep-indigo) 8%, transparent);color:var(--color-deep-indigo);transform:translateY(-2px)}.int-card__logo{background:var(--color-surface);border-radius:.8rem;flex-shrink:0;place-items:center;width:3.25rem;height:3.25rem;display:grid}.int-card__logo img{object-fit:contain;border-radius:.4rem;width:2.3rem;height:2.3rem}.int-card__copy{flex:1;gap:.1rem;min-width:0;display:grid}.int-card__copy strong{font-size:1rem;line-height:1.2}.int-card__copy>span:not(.int-status){color:var(--color-text-2);font-size:.84rem}.int-card__copy .int-status{justify-self:start;margin-top:.35rem}.int-empty{background:var(--color-white);border:1px dashed var(--color-cool-gray);color:var(--color-text-2);border-radius:1rem;margin:0;padding:1.5rem}.int-marks{gap:1rem;display:grid}.int-mark{background:var(--color-white);border:1px solid var(--color-cool-gray);border-radius:1.25rem;flex-direction:column;gap:.55rem;padding:1.5rem;scroll-margin-top:6rem;display:flex}.int-mark__top{justify-content:space-between;align-items:center;margin-bottom:.4rem;display:flex}.int-mark__logo{background:var(--color-surface);border-radius:1rem;place-items:center;width:4rem;height:4rem;display:grid}.int-mark__logo img{object-fit:contain;width:2.75rem;height:2.75rem}.int-mark__logo--dark{background:var(--color-ink)}.int-mark__role{font-family:var(--font-mono);letter-spacing:.1em;text-transform:uppercase;color:var(--color-muted);margin:0;font-size:.7rem}.int-mark h3{letter-spacing:-.02em;color:var(--color-deep-indigo);margin:0;font-size:1.35rem}.int-mark__line{color:var(--color-text-2);margin:0;font-size:.95rem;line-height:1.55}.int-mark__label{color:var(--color-deep-indigo);margin:.4rem 0 0;font-size:.8rem;font-weight:600}.int-mark__handoffs{gap:.4rem;margin:.4rem 0 .6rem;padding:0;list-style:none;display:grid}.int-mark__handoffs li{background:var(--color-surface);border-radius:.65rem;justify-content:space-between;align-items:center;gap:.75rem;padding:.55rem .7rem;font-size:.9rem;display:flex}.int-mark__handoffs a{color:var(--color-deep-indigo);font-weight:500;text-decoration:none}.int-mark__handoffs a:hover{text-decoration:underline}.int-mark__more{color:var(--color-deep-indigo);margin-top:auto;font-size:.9rem;font-weight:600}@media (width>=760px){.int-marks{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (width>=1180px){.int-marks{grid-template-columns:repeat(4,minmax(0,1fr))}}.int-request{align-items:center;gap:2rem;display:grid}.int-request .home-kicker{margin:0 0 1rem;font-size:.74rem}.int-request p:not(.home-kicker){color:var(--color-text-2);max-width:52ch;margin:.9rem 0 0;font-size:1.05rem;line-height:1.6}.int-request__actions{flex-wrap:wrap;gap:.7rem;margin-top:1.5rem;display:flex}.int-request__actions .btn{border-radius:999px}.int-request__waitlist{background:var(--color-white);border:1px solid var(--color-cool-gray);border-radius:1.25rem;padding:1.5rem}.int-request__waitlist p{margin:0 0 1rem;font-size:.95rem}@media (width>=900px){.int-request{grid-template-columns:1.2fr .8fr;gap:3rem}}.page-integrations .home-close{padding-top:3.5rem}@media (width<=640px){.int-cloud__logo:nth-child(n+8){display:none}}@media (prefers-reduced-motion:reduce){.int-cloud:before,.int-cloud__logo{animation:none}}.int-card--featured{border-color:var(--color-deep-indigo);box-shadow:0 0 0 1px var(--color-deep-indigo), 0 14px 30px color-mix(in srgb, var(--color-deep-indigo) 10%, transparent)}.int-grid li:has(.int-card--featured){grid-column:span 2}@media (width<=640px){.int-grid li:has(.int-card--featured){grid-column:auto}}