.integrations-page{background:var(--hoop-paper);min-height:100vh;color:var(--hoop-ink);overflow-x:clip}.integrations-page main{background:var(--hoop-paper)}.integrations-shell{width:min(1180px,100% - 48px);margin-inline:auto}.integrations-hero{background:radial-gradient(circle 760px at 78% 8%,color-mix(in oklch,var(--hoop-atmosphere-amber)16%,transparent)0%,color-mix(in oklch,var(--hoop-atmosphere-amber)5.5%,transparent)44%,transparent 78%),linear-gradient(180deg,var(--hoop-paper)0%,var(--hoop-atmosphere-green)100%);padding:172px 0 116px;position:relative;overflow:hidden}.integrations-hero .integrations-shell{width:min(1360px,100% - 64px)}.integrations-hero-layout{grid-template-columns:minmax(420px,.78fr) minmax(680px,1.22fr);align-items:center;gap:clamp(56px,5vw,80px);display:grid}.integrations-hero-copy{max-width:560px}.integrations-hero-copy .hoop-eyebrow-chip{margin-bottom:24px}.integrations-hero-copy .hoop-display{max-width:10.5ch;margin:0}.integrations-hero-copy .hoop-lead{max-width:55ch;margin:28px 0 0}.integrations-hero-actions{align-items:center;gap:10px;margin-top:32px;display:flex}.integrations-hero-actions .hoop-btn-primary,.integrations-hero-actions .hoop-btn-ghost{height:auto;min-height:48px}.integrations-hero-proof{gap:14px;margin-top:24px}.integrations-stack-map{justify-self:end;width:min(100%,840px);min-width:0;margin:0}.integrations-story-stage{--integrations-flow-line:color-mix(in oklch,var(--hoop-sage)22%,var(--hoop-cloud));--integrations-story-core-height:414px;--integrations-story-side-height:294px;grid-template-columns:minmax(176px,1fr) minmax(52px,.34fr) minmax(210px,1.16fr) minmax(52px,.34fr) minmax(176px,1fr);grid-template-rows:56px 28px var(--integrations-story-core-height)112px;align-items:end;min-width:0;display:grid}.integrations-story-card{min-width:0;height:var(--integrations-story-side-height);color:var(--hoop-ink);background:var(--hoop-cream);border:1px solid color-mix(in oklch,var(--hoop-cloud)78%,var(--hoop-mist));border-radius:var(--hoop-r-lg);grid-row:3;align-self:center;gap:0;padding:0;overflow:hidden;box-shadow:0 10px 28px #101b1412;box-shadow:0 10px 28px lab(8.39433% -6.05644 3.05834/.07)}.integrations-story-card--helpdesk{z-index:2;grid-column:1}.integrations-story-card--billing{z-index:2;grid-column:5}.integrations-story-card-header{border-bottom:1px solid var(--hoop-cloud);flex-direction:column;justify-content:space-between;gap:10px;min-height:84px;padding:22px 22px 18px;display:flex}.integrations-story-card-header strong{font-family:var(--hoop-font-sans);letter-spacing:-.012em;font-size:.9375rem;font-weight:600;line-height:1.3}.integrations-story-step,.integrations-story-card-header>span,.integrations-story-message>span,.integrations-story-outcome>span,.integrations-story-card-footer,.integrations-story-context>span,.integrations-story-return>span{font-family:var(--hoop-font-sans)}.integrations-story-step,.integrations-story-card-header>span,.integrations-story-message>span,.integrations-story-outcome>span{color:var(--hoop-stone);letter-spacing:.075em;text-transform:uppercase;font-size:.6875rem;font-weight:600;line-height:1.35}.integrations-story-message,.integrations-story-outcome{flex-direction:column;flex:1;justify-content:center;gap:11px;padding:24px 22px;display:flex}.integrations-story-message p{font-family:var(--hoop-font-serif);letter-spacing:-.02em;text-wrap:balance;margin:0;font-size:clamp(1rem,1.3vw,1.2rem);font-weight:700;line-height:1.42}.integrations-story-card-footer{min-height:44px;color:var(--hoop-stone);border-top:1px solid var(--hoop-cloud);justify-content:center;align-items:center;gap:13px;padding:10px 16px;font-size:.6875rem;font-weight:500;line-height:1.35;display:flex}.integrations-story-card-footer .integrations-logo{filter:brightness(0)saturate();opacity:.54;width:54px;height:14px}.integrations-story-card-footer .integrations-logo--gorgias{width:58px;height:16px;transform:translateY(1px)}.integrations-story-card-footer .integrations-logo--zendesk{width:56px;height:14px}.integrations-story-card-footer .integrations-logo--kustomer{width:55px;height:15px}.integrations-story-card-footer .integrations-logo--recharge{width:62px;height:14px}.integrations-story-card-footer .integrations-logo--skio{width:40px;height:13px}.integrations-story-card-footer .integrations-logo img,.integrations-story-context .integrations-logo img{object-position:center!important}.integrations-story-context{width:196px;min-height:56px;color:var(--hoop-ink-soft);background:var(--hoop-sage-pale);border:1px solid color-mix(in oklch,var(--hoop-sage)20%,var(--hoop-cloud));border-radius:var(--hoop-r-sm);grid-area:1/3;grid-template-columns:76px minmax(0,1fr);justify-self:center;align-items:center;gap:12px;padding:10px 12px;display:grid;box-shadow:0 5px 16px #101b140e;box-shadow:0 5px 16px lab(8.39433% -6.05644 3.05834/.055)}.integrations-story-context .integrations-logo{width:76px;height:23px}.integrations-story-context>span{color:var(--hoop-ink-soft);font-size:.6875rem;font-weight:550;line-height:1.3}.integrations-story-context-line{background:var(--integrations-flow-line);grid-area:2/3;justify-self:center;width:1px;height:28px;position:relative}.integrations-story-context-line:after{border-right:1px solid var(--integrations-flow-line);border-bottom:1px solid var(--integrations-flow-line);content:"";width:7px;height:7px;position:absolute;bottom:1px;right:-3px;transform:rotate(45deg)}.integrations-story-card--hoop{z-index:2;width:100%;height:var(--integrations-story-core-height);color:var(--hoop-paper);background:var(--hoop-night);border-color:var(--hoop-night-border);grid-column:3;align-self:stretch;position:relative;box-shadow:0 14px 34px #101b1429;box-shadow:0 14px 34px lab(8.39433% -6.05644 3.05834/.16)}.integrations-story-card--hoop .integrations-story-card-header{border-bottom-color:var(--hoop-night-border)}.integrations-story-card--hoop .integrations-story-card-header img{width:96px;height:auto}.integrations-story-card--hoop .integrations-story-card-header>span{color:var(--hoop-night-muted)}.integrations-story-card--hoop .integrations-story-card-header>.integrations-story-hoop-summary{letter-spacing:0;text-transform:none;font-size:.75rem;font-weight:500;line-height:1.4}.integrations-story-message--hoop p{color:var(--hoop-paper);font-size:clamp(1.02rem,1.42vw,1.24rem)}.integrations-story-hoop-footer{background:color-mix(in oklch,var(--hoop-night-card)82%,var(--hoop-night));border-top:1px solid var(--hoop-night-border);gap:16px;padding:18px 20px 20px;display:grid}.integrations-story-hoop-guidance{gap:4px;display:grid}.integrations-story-hoop-guidance--policy{border-top:1px solid var(--hoop-night-border);padding-top:14px}.integrations-story-hoop-guidance strong,.integrations-story-hoop-guidance span{font-family:var(--hoop-font-sans);line-height:1.35}.integrations-story-hoop-guidance strong{color:var(--hoop-sage-soft);letter-spacing:.04em;font-size:.6875rem;font-weight:550}.integrations-story-hoop-guidance span{color:var(--hoop-night-text);font-size:.75rem;font-weight:400}.integrations-story-outcome p{color:var(--hoop-forest);font-family:var(--hoop-font-serif);letter-spacing:-.02em;flex-wrap:wrap;align-items:center;gap:7px 9px;margin:0;font-size:clamp(.96rem,1.2vw,1.1rem);font-weight:700;line-height:1.35;display:flex}.integrations-story-outcome svg{width:14px;height:14px;color:var(--hoop-sage);stroke-width:1.7px;flex:none}.integrations-story-link{min-width:0;height:var(--integrations-story-side-height);color:var(--hoop-stone);text-align:center;text-wrap:balance;flex-direction:column;grid-row:3;justify-content:center;align-self:center;padding:0;font-size:.6875rem;font-weight:550;line-height:1.25;display:flex}.integrations-story-link--exchange{grid-column:2}.integrations-story-link--action{grid-column:4}.integrations-story-exchange-lines{flex-direction:column;gap:10px;width:100%;display:flex}.integrations-story-link i,.integrations-story-return i{background:var(--integrations-flow-line);width:100%;height:1px;display:block;position:relative}.integrations-story-link i:after{border-top:1px solid var(--integrations-flow-line);border-right:1px solid var(--integrations-flow-line);content:"";width:7px;height:7px;position:absolute;top:50%;right:0;transform:translateY(-50%)rotate(45deg)}.integrations-story-link--exchange i:last-child:after{display:none}.integrations-story-link--exchange i:last-child:before{border-bottom:1px solid var(--integrations-flow-line);border-left:1px solid var(--integrations-flow-line);content:"";width:7px;height:7px;position:absolute;top:50%;left:0;transform:translateY(-50%)rotate(45deg)}.integrations-story-return{z-index:1;pointer-events:none;grid-area:3/3/5/6;align-self:stretch;min-width:0;height:100%;position:relative}.integrations-story-return i{top:calc((var(--integrations-story-core-height) - var(--integrations-story-side-height))/2 + var(--integrations-story-side-height));border-left:1px solid var(--integrations-flow-line);border-right:1px solid var(--integrations-flow-line);border-bottom:1px solid var(--integrations-flow-line);border-radius:0 0 var(--hoop-r-lg)var(--hoop-r-lg);background:0 0;width:auto;height:112px;position:absolute;left:24%;right:20%}.integrations-story-return i:before{display:none}.integrations-story-return i:after{border-top:1px solid var(--integrations-flow-line);border-left:1px solid var(--integrations-flow-line);content:"";width:7px;height:7px;position:absolute;top:56px;bottom:auto;left:-4px;transform:rotate(45deg)}.integrations-story-return>span{top:calc((var(--integrations-story-core-height) - var(--integrations-story-side-height))/2 + var(--integrations-story-side-height) + 112px);width:max-content;max-width:180px;color:var(--hoop-ink-soft);background:var(--hoop-sage-pale);border:1px solid var(--integrations-flow-line);text-align:center;border-radius:999px;padding:5px 9px;font-size:.6875rem;font-weight:550;line-height:1.35;position:absolute;left:52%;right:auto;transform:translate(-50%,-50%)}.integrations-catalog-intro{background:var(--hoop-paper);border-top:1px solid var(--hoop-cloud);padding:96px 0 72px;scroll-margin-top:96px}.integrations-catalog-intro-layout{grid-template-columns:minmax(220px,.68fr) minmax(0,1.32fr);align-items:start;gap:clamp(48px,8vw,124px);display:grid}.integrations-catalog-intro .hoop-section-title{margin:0}.integrations-catalog-intro .hoop-lead{max-width:61ch;margin:24px 0 0}.integrations-catalog{background:var(--hoop-paper)}.integrations-group{padding:0}.integrations-group-layout{grid-template-columns:minmax(220px,.68fr) minmax(0,1.32fr);align-items:start;gap:clamp(48px,8vw,124px);padding-block:80px;display:grid}.integrations-group-header{position:sticky;top:112px}.integrations-group-header h3{color:var(--hoop-ink);font-family:var(--hoop-font-serif);letter-spacing:-.02em;text-wrap:balance;margin:0;font-size:clamp(1.75rem,2.4vw,2.35rem);font-weight:700;line-height:1.15}.integrations-group-header p{max-width:32ch;color:var(--hoop-ink-soft);margin:18px 0 0;font-size:1rem;line-height:1.6}.integrations-list{border-top:1px solid var(--hoop-cloud)}.integrations-row{border-bottom:1px solid var(--hoop-cloud);grid-template-columns:150px minmax(0,1fr) minmax(220px,.76fr);align-items:start;gap:clamp(26px,3.4vw,48px);padding:34px 0 36px;display:grid}.integrations-row-brand{align-items:center;min-height:36px;display:flex}.integrations-logo{width:150px;height:28px;display:block;position:relative}.integrations-row-brand .integrations-logo{filter:brightness(0)saturate();opacity:.76}.integrations-row-description{max-width:57ch;color:var(--hoop-ink-soft);margin:0;font-size:1rem;line-height:1.62}.integrations-capabilities{flex-direction:column;gap:10px;margin:0;padding:0;list-style:none;display:flex}.integrations-capabilities li{color:var(--hoop-ink-soft);grid-template-columns:16px minmax(0,1fr);align-items:start;gap:9px;font-size:.875rem;line-height:1.45;display:grid}.integrations-capabilities svg{width:15px;height:15px;color:var(--hoop-sage);stroke-width:2px;margin-top:2px}.integrations-setup{border-top:1px solid var(--hoop-cloud);border-bottom:1px solid var(--hoop-cloud);background:#fff;padding:112px 0}.integrations-setup-layout{grid-template-columns:minmax(280px,.78fr) minmax(0,1.22fr);align-items:start;gap:clamp(64px,9vw,140px);display:grid}.integrations-setup-header{position:sticky;top:112px}.integrations-setup-header .hoop-eyebrow-chip{margin-bottom:24px}.integrations-setup-header .hoop-section-title{max-width:10ch;margin:0}.integrations-steps{border-top:1px solid color-mix(in oklch,var(--hoop-forest)18%,transparent);margin:0;padding:0;list-style:none}.integrations-step{border-bottom:1px solid color-mix(in oklch,var(--hoop-forest)18%,transparent);grid-template-columns:72px minmax(0,1fr);gap:26px;padding:28px 0 30px;display:grid}.integrations-step>.hoop-process-marker{align-self:start;align-items:center;min-block-size:1.7875rem}.integrations-step h3{color:var(--hoop-ink);font-family:var(--hoop-font-sans);letter-spacing:-.015em;text-wrap:balance;margin:0;font-size:1.375rem;font-weight:600;line-height:1.3}.integrations-step p{max-width:55ch;color:var(--hoop-ink-soft);margin:10px 0 0;font-size:1rem;line-height:1.6}.integrations-faq{padding:120px 0}.integrations-faq-layout{grid-template-columns:minmax(260px,.82fr) minmax(0,1.18fr);align-items:start;gap:clamp(64px,9vw,140px);display:grid}.integrations-faq header .hoop-eyebrow-chip{margin-bottom:24px}.integrations-faq header .hoop-section-title{max-width:10ch;margin:0}.integrations-faq-list{border-top:1px solid var(--hoop-cloud)}.integrations-faq-item{border-color:var(--hoop-cloud)}.integrations-faq-trigger{color:var(--hoop-ink);font-family:var(--hoop-font-sans);letter-spacing:-.01em;padding:25px 4px 25px 0;font-size:1.0625rem;font-weight:600;line-height:1.45;text-decoration:none}.integrations-faq-trigger:hover{color:var(--hoop-forest);text-decoration:none}.integrations-faq-trigger:focus-visible{box-shadow:0 0 0 2px var(--hoop-paper),0 0 0 4px var(--hoop-sage);border-color:#0000}.integrations-faq-trigger svg{width:18px;height:18px;color:var(--hoop-stone);margin-top:3px}.integrations-faq-content{padding:0 52px 26px 0}.integrations-faq-content p{max-width:65ch;color:var(--hoop-ink-soft);margin:0;font-size:1rem;line-height:1.62}.integrations-cta{padding:0 0 112px}.integrations-cta-panel{border-radius:var(--hoop-r-xl);grid-template-columns:minmax(0,1.12fr) minmax(320px,.88fr);align-items:center;gap:clamp(48px,8vw,112px);padding:clamp(44px,6vw,72px);display:grid}.integrations-cta-panel .hoop-section-title{max-width:15ch;margin:0}.integrations-cta-action{flex-direction:column;align-items:flex-start;gap:24px;display:flex}.integrations-cta-action p{max-width:39ch;color:var(--hoop-night-text);margin:0;font-size:1.0625rem;line-height:1.6}.integrations-cta-action .hoop-btn-amber svg{width:16px;height:16px;transition:transform .22s cubic-bezier(.16,1,.3,1)}.integrations-cta-action .hoop-btn-amber:hover svg{transform:translate(3px)}@media (max-width:1230px){.integrations-hero-layout{grid-template-columns:1fr;gap:64px}.integrations-hero-copy{max-width:720px}.integrations-hero-copy .hoop-display{max-width:12ch}.integrations-stack-map{justify-self:center;max-width:820px}}@media (max-width:1080px){.integrations-stack-map{justify-self:center}.integrations-row{grid-template-columns:130px minmax(0,1fr)}.integrations-capabilities{grid-column:2;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px 22px;display:grid}}@media (max-width:820px){.integrations-shell,.integrations-hero .integrations-shell{width:min(100% - 40px,720px)}.integrations-hero{padding:150px 0 88px}.integrations-catalog-intro-layout,.integrations-group-layout,.integrations-setup-layout,.integrations-faq-layout,.integrations-cta-panel{grid-template-columns:1fr}.integrations-catalog-intro-layout,.integrations-group-layout{gap:38px}.integrations-catalog-intro{padding:88px 0 56px}.integrations-group-layout{padding-block:64px}.integrations-group-header,.integrations-setup-header{position:static}.integrations-group-header p{max-width:52ch}.integrations-setup,.integrations-faq{padding:88px 0}.integrations-setup-layout,.integrations-faq-layout{gap:48px}.integrations-setup-header .hoop-section-title,.integrations-faq header .hoop-section-title{max-width:14ch}.integrations-cta-panel{gap:30px}}@media (max-width:720px){.integrations-shell,.integrations-hero .integrations-shell{width:calc(100% - 32px)}.integrations-hero{padding:96px 0 64px}.integrations-hero-layout{gap:28px}.integrations-hero-copy .hoop-eyebrow-chip{margin-bottom:16px}.integrations-hero-copy .hoop-lead{margin-top:18px;font-size:1rem;line-height:1.5}.integrations-hero-actions{flex-direction:column;align-items:stretch;margin-top:24px}.integrations-hero-actions .hoop-btn-primary,.integrations-hero-actions .hoop-btn-ghost{justify-content:center;min-height:48px}.integrations-hero-proof{flex-direction:row;align-items:center;gap:4px 0;margin-top:20px;font-size:.75rem;line-height:1.4}.integrations-hero-proof>span:not(.hoop-dot-sep){white-space:nowrap}.integrations-hero-proof>span:not(.hoop-dot-sep):not(:first-child):before{color:var(--hoop-mist);content:"·";margin-inline:8px}.integrations-hero-proof .hoop-dot-sep{display:none}.integrations-story-stage{grid-template-rows:auto;grid-template-columns:1fr;justify-items:stretch;width:min(100%,430px);margin-inline:auto}.integrations-story-card,.integrations-story-card--helpdesk,.integrations-story-card--billing,.integrations-story-card--hoop,.integrations-story-context,.integrations-story-context-line,.integrations-story-link,.integrations-story-return{grid-area:auto/1}.integrations-story-card{height:auto;min-height:0}.integrations-story-card-header{gap:8px;min-height:72px;padding:18px 20px 14px}.integrations-story-message,.integrations-story-outcome{gap:8px;padding:20px}.integrations-story-card-footer{min-height:40px;padding:8px 14px}.integrations-story-card--helpdesk{order:1}.integrations-story-link--exchange{order:2}.integrations-story-context{order:3;justify-self:center}.integrations-story-context-line{order:4;justify-self:center}.integrations-story-card--hoop{order:5;min-height:0}.integrations-story-card--hoop .integrations-story-card-header{padding:18px 20px 16px}.integrations-story-message--hoop{padding:22px 20px}.integrations-story-hoop-footer{gap:12px;padding:14px 20px 16px}.integrations-story-hoop-guidance--policy{padding-top:12px}.integrations-story-link--action{order:6}.integrations-story-card--billing{order:7}.integrations-story-return{order:8}.integrations-story-context{width:min(218px,76%)}.integrations-story-context-line{height:16px}.integrations-story-link{width:1px;height:32px;margin-inline:auto;padding:0}.integrations-story-link i{width:1px;height:30px;margin-inline:auto}.integrations-story-exchange-lines{width:1px;height:30px;display:block}.integrations-story-link--exchange i:last-child{display:none}.integrations-story-link i:after{border-top:0;border-right:1px solid var(--integrations-flow-line);border-bottom:1px solid var(--integrations-flow-line);inset:auto auto 0 50%;transform:translate(-50%)rotate(45deg)}.integrations-story-link--exchange i:last-child:before{border-top:1px solid var(--integrations-flow-line);border-bottom:0;border-right:0;border-left:1px solid var(--integrations-flow-line);top:0;left:50%;transform:translate(-50%)rotate(45deg)}.integrations-story-return{justify-content:center;height:auto;margin-top:12px;display:flex}.integrations-story-return i{display:none}.integrations-story-return>span{max-width:82%;position:static;top:auto;left:auto;right:auto;transform:none}.integrations-row{grid-template-columns:1fr;gap:22px;padding:30px 0 32px}.integrations-row-brand{min-height:30px}.integrations-row-description{font-size:.9375rem}.integrations-capabilities{grid-column:auto;grid-template-columns:1fr}.integrations-step{grid-template-columns:60px minmax(0,1fr);gap:18px}.integrations-faq-trigger{padding-block:22px;font-size:1rem}.integrations-faq-content{padding-right:24px}.integrations-cta{padding-bottom:80px}.integrations-cta-panel{border-radius:var(--hoop-r-lg);padding:34px 26px}}@media (prefers-reduced-motion:reduce){.integrations-cta-action .hoop-btn-amber svg{transition:none}}
