/* Integration logos replace the service ticker and the separate card grid. */
.home-current { --ticker-height: 62.4px; }
.home-current .tools-scroller {
  position: relative;
  z-index: 5;
  display: grid;
  grid-template-columns: 160px minmax(0, 1fr) 44px;
  align-items: center;
  height: var(--ticker-height);
  padding: 0 24px 0 max(24px, calc((100vw - 1210px) / 2));
  border-block: 1px solid #17171918;
  background: var(--green, #8bea4d);
  color: #171719;
  scroll-margin-top: 90px;
}
.tools-scroller-heading { position:relative; z-index:1; padding:0 16px 0 0; }
.tools-scroller-heading h2 { margin:0; font-size:13px; font-weight:600; line-height:1.15; letter-spacing:-.025em; }
.tools-scroller-heading h2 span { color:#263b1a; }
.tools-scroller-heading a { display:block; color:inherit; font:inherit; text-decoration:none; }
.tools-scroller-heading a:hover { text-decoration:underline; text-underline-offset:4px; }
.tools-scroller-window {
  min-width:0;
  overflow-x:auto;
  scrollbar-width:none;
  mask-image:linear-gradient(90deg,transparent,#000 24px,#000 calc(100% - 24px),transparent);
}
.tools-scroller-window::-webkit-scrollbar { display:none; }
.tools-scroller.is-enhanced .tools-scroller-window { overflow:hidden; }
.tools-scroller-track { display:flex; width:max-content; align-items:center; }
.tools-scroller-group { display:flex; flex:none; align-items:center; gap:0; margin:0; padding:0; list-style:none; }
.tools-scroller-group > li { display:flex; flex:none; align-items:center; justify-content:center; height:56px; padding:0 5px; white-space:nowrap; }
.tools-scroller-group a { display:flex; align-items:center; justify-content:center; gap:8px; height:46px; padding:4px 15px; border-radius:6px; background:transparent; color:#171719; text-decoration:none; transition:background-color .18s; }
.tools-scroller-group img { display:block; flex:none; width:26px; height:26px; object-fit:contain; filter:grayscale(1) brightness(.28) contrast(1.2); transition:filter .18s; }
.tools-scroller-group a:is(:hover,:focus-visible) { background:#fff; }
.tools-scroller-group a:is(:hover,:focus-visible) img { filter:none; }
.tools-scroller-group span { font-size:13px; font-weight:600; letter-spacing:-.025em; }
.tools-scroller-group .tools-wordmark img { width:var(--logo-width,90px); height:var(--logo-height,24px); max-width:none; }
.tools-scroller-group .tools-logo-payfast { --logo-width:95px; --logo-height:34px; }
.tools-scroller-group .tools-logo-quickbooks { --logo-width:128px; --logo-height:29px; }
.tools-scroller-group .tools-logo-hubspot { --logo-width:100px; --logo-height:29px; }
.tools-scroller-group .tools-logo-twilio { --logo-width:97px; --logo-height:29px; }
.tools-scroller-group .tools-logo-sendgrid { --logo-width:120px; --logo-height:29px; }
.tools-scroller-toggle {
  display:grid; place-items:center; justify-self:end;
  width:30px; height:30px; padding:0;
  border:1px solid #17171922; border-radius:50%;
  background:transparent; color:#263b1a; cursor:pointer;
}
.tools-scroller-toggle[hidden] { display:none; }
.tools-scroller-toggle:hover { background:#fff; border-color:#263b1a; }
.tools-scroller-toggle svg { width:14px; height:14px; fill:currentColor; }
.tools-scroller-toggle .tools-play { display:none; }
.tools-scroller-toggle[aria-pressed=true] .tools-play { display:block; }
.tools-scroller-toggle[aria-pressed=true] .tools-pause { display:none; }
.tools-scroller :is(a,button):focus-visible { outline:2px solid #597454; outline-offset:2px; }
.tools-scroller.is-enhanced .tools-scroller-track { animation:tools-scroll 86s linear infinite; }
.tools-scroller.is-paused .tools-scroller-track,
.tools-scroller:focus-within .tools-scroller-track { animation-play-state:paused; }
@media (hover:hover) { .tools-scroller:hover .tools-scroller-track { animation-play-state:paused; } }
@keyframes tools-scroll { to { transform:translateX(-50%); } }
@media (max-width:800px) {
  .home-current .tools-scroller { grid-template-columns:130px minmax(0,1fr) 36px; padding-inline:16px; }
  .tools-scroller-heading { padding-right:10px; }
  .tools-scroller-heading h2 { font-size:12px; }
  .tools-scroller-window { mask-image:linear-gradient(90deg,transparent,#000 10px,#000 calc(100% - 10px),transparent); }
  .tools-scroller-group > li { padding-inline:3px; }
  .tools-scroller-group a { padding-inline:12px; }
}
@media (max-width:600px) {
  .home-current { --ticker-height:57.2px; }
  .home-current .tools-scroller { grid-template-columns:116px minmax(0,1fr) 32px; padding-inline:12px; }
  .tools-scroller-group > li { height:52px; }
  .tools-scroller-group a { height:44px; padding-block:3px; }
}
@media (prefers-reduced-motion:reduce) {
  .tools-scroller.is-enhanced .tools-scroller-track { animation:none; }
  .tools-scroller.is-enhanced .tools-scroller-window { overflow-x:auto; }
  .tools-scroller-group[aria-hidden=true],.tools-scroller-toggle { display:none; }
  .tools-scroller-group a,.tools-scroller-group img { transition:none; }
}