/* Integrations and workflows: connected, governed execution. */
.hho{position:relative;isolation:isolate;overflow:hidden;padding:76px 32px 80px;scroll-margin-top:96px;background:linear-gradient(90deg,#f7faff,#fff 47%,#f1f8ff);color:#0a1438;font-family:"HH Inter",Inter,Arial,sans-serif;-webkit-font-smoothing:antialiased}
.hho *{box-sizing:border-box}
.hho::before{content:"";position:absolute;z-index:-1;inset:0;background:url('/assets/integrations-waves.svg') center/100% 100% no-repeat;opacity:.8;pointer-events:none;-webkit-mask-image:linear-gradient(transparent,#000 160px,#000 calc(100% - 120px),transparent);mask-image:linear-gradient(transparent,#000 160px,#000 calc(100% - 120px),transparent)}
.hhu:has(+.hho)::before{-webkit-mask-image:linear-gradient(transparent,#000 160px,#000 calc(100% - 160px),transparent);mask-image:linear-gradient(transparent,#000 160px,#000 calc(100% - 160px),transparent)}
main.gap-24>.hhu+.hho{margin-block-start:calc(-24 * var(--spacing,.25rem))}
@media(min-width:768px){main.md\:gap-40>.hhu+.hho{margin-block-start:calc(-40 * var(--spacing,.25rem))}}
.hho svg{display:block;flex:none;width:28px;height:28px}
.hho ul{margin:0;padding:0;list-style:none}
.hho-wrap{display:grid;grid-template-columns:minmax(0,.47fr) minmax(0,1fr);align-items:center;gap:30px;width:100%;max-width:1600px;margin:auto}
.hho-intro{min-width:0}
.hho-eyebrow{display:inline-flex;align-items:center;gap:14px;margin:0;padding:11px 21px;border-radius:999px;background:linear-gradient(110deg,#ddf8ed,#ddf6df);font-size:clamp(13px,1.3vw,21px);font-weight:600;line-height:1.3;letter-spacing:-.035em;white-space:nowrap}
.hho-eyebrow svg{width:28px;height:28px;color:#08b72a}
.hho h2{margin:46px 0 0;font-size:clamp(34px,3.5vw,56px);font-weight:700;line-height:1.08;letter-spacing:-.05em}
.hho h2 em{display:inline-block;margin-top:7px;font-style:italic;white-space:nowrap;background:linear-gradient(105deg,#0067ff,#008fdf 42%,#00bf2e 95%);background-clip:text;-webkit-background-clip:text;color:transparent}
.hho-lead{margin:28px 0 0;font-size:clamp(16px,1.3vw,21px);font-weight:400;line-height:1.4;letter-spacing:-.025em;color:#41547c;text-wrap:pretty}
.hho-highlights{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0;margin:34px 0 0!important;padding:17px 12px!important;border:1px solid #e3efff;border-radius:999px;background:linear-gradient(115deg,#ffffffed,#f5faffd9);box-shadow:0 6px 14px #398cdb1a}
.hho-highlights .hho-tile{display:flex;align-items:center;justify-content:center;gap:10px;padding:0 9px;font-size:clamp(10px,.95vw,15px);font-weight:600;line-height:1.25;letter-spacing:-.04em}
.hho-highlights li+li{border-left:1px solid #8cafe0}
.hho-highlights svg{width:29px;height:29px;color:#0084ff}
.hho-cta{display:inline-flex;align-items:center;justify-content:center;gap:14px;margin-top:40px;padding:15px 30px;border-radius:999px;background:linear-gradient(105deg,#0065ff,#009fc5 50%,#00ca1c);color:#fff;font-size:clamp(16px,1.4vw,23px);font-weight:600;line-height:1.3;letter-spacing:-.03em;text-decoration:none;white-space:nowrap;box-shadow:0 8px 18px #00a0ca1a;transition:transform .2s,filter .2s}
.hho-cta svg{width:25px;height:25px}
.hho-cta:hover{transform:translateY(-2px);filter:brightness(1.04)}
.hho-cta:focus-visible{outline:3px solid #087dff;outline-offset:4px}
.hho-diagram{min-width:0;padding:38px 26px 28px;border:1px solid #fff;border-radius:40px;background:linear-gradient(130deg,#f8fcff9e,#e4f5ffd1);box-shadow:0 18px 32px #158ce42b,inset 0 0 0 1px #e4f2ff80}
.hho-channels{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0;margin-inline:7%!important}
.hho-channels .hho-tile{display:flex;margin-inline:9px;align-items:center;justify-content:center;gap:18px;min-height:62px;padding:11px;border:1px solid #b8ddff;border-radius:23px;background:linear-gradient(130deg,#fff,#edf7ff);box-shadow:0 6px 12px #0783dc21;font-size:clamp(12px,1.2vw,19px);font-weight:650;letter-spacing:-.04em;line-height:1.2;white-space:nowrap}
.hho-channels svg{width:32px;height:32px;color:#0084ff}
.hho-channels .is-whatsapp svg{color:#00bf16}
.hho-links{height:64px;color:#008dff}
.hho-links svg{width:100%;height:100%;overflow:visible;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round;vector-effect:non-scaling-stroke}
.hho-links path{vector-effect:non-scaling-stroke}
.hho-links .hho-signal{stroke:#80f7ff;stroke-width:3;stroke-dasharray:7 360;animation:hho-flow 7s linear infinite;animation-play-state:paused}
.hho.is-active .hho-signal{animation-play-state:running}
.hho-engine{padding:26px 28px;border:1px solid #83ea70;border-radius:34px;background:linear-gradient(110deg,#e5ffe5,#dffbf8 50%,#e6ffdd);box-shadow:0 9px 22px #00cb7a26,inset 0 0 14px #ffffffd9}
.hho-engine ul{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px}
.hho-engine .hho-tile{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;min-width:0;min-height:120px;padding:12px 8px;border:1px solid #ffffffd9;border-radius:22px;background:linear-gradient(125deg,#ffffffed,#eaf6ffde);box-shadow:0 7px 12px #067c9c1f;text-align:center;font-size:clamp(12px,1.2vw,19px);font-weight:600;line-height:1.12;letter-spacing:-.045em}
.hho-engine .hho-tile+.hho-tile::before{content:"";position:absolute;left:-8px;top:42%;height:26%;width:1px;background:#8dd4e8;box-shadow:3px 0 #bbe8ef}
.hho-engine svg{width:38px;height:38px;color:#0086ff}
.hho-links-branches{height:56px}
.hho-branches{display:grid;grid-template-columns:1.16fr 1fr;align-items:start;gap:18px;min-width:0}
.hho-systems,.hho-models{display:grid;gap:6px;padding:16px 12px!important;border:1px solid #b5ddff;border-radius:26px;background:linear-gradient(120deg,#ffffffa6,#e7f6ffab);box-shadow:0 6px 12px #198de521,inset 0 0 0 1px #ffffffb3}
.hho-systems{grid-template-columns:repeat(7,minmax(0,1fr))}
.hho-systems .hho-tile,.hho-models .hho-tile{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;min-width:0;min-height:84px;padding:9px 3px;border:1px solid #d8edff;border-radius:15px;background:linear-gradient(130deg,#fff,#eef8ff);box-shadow:0 5px 9px #0384ca1c;text-align:center;font-size:clamp(9px,.85vw,13px);font-weight:600;line-height:1.1;letter-spacing:-.04em}
.hho-systems svg{width:27px;height:27px;color:#0087ff}
.hho-model-group{min-width:0}
.hho-models{grid-template-columns:repeat(4,minmax(0,1fr))}
.hho-models .hho-tile{gap:8px;font-size:clamp(10px,.95vw,15px)}
.hho-models .is-private{border-color:#9aeba6;background:linear-gradient(130deg,#f3fff1,#d2f7d9);box-shadow:0 5px 12px #04c66a26}
.hho-models svg{width:30px;height:30px;color:#0088ff}
.hho-model-notes{display:grid;grid-template-columns:1fr 1fr;gap:16px;min-height:73px;padding:20px 0 0 10px}
.hho-model-notes p{position:relative;align-self:start;justify-self:end;margin:0;padding:10px 12px;border:1px solid #cbf4cb;border-radius:16px;background:linear-gradient(120deg,#eaffdf,#e0fbe1);color:#183559;text-align:center;font-size:clamp(10px,.85vw,13px);line-height:1.25;letter-spacing:-.02em}
.hho-model-notes p::before{content:"";position:absolute;left:65%;bottom:100%;height:24px;width:2px;background:#008cff}
.hho-model-notes p::after{content:"";position:absolute;left:calc(65% - 4px);top:-25px;width:10px;height:10px;border-top:2px solid #008cff;border-left:2px solid #008cff;transform:rotate(45deg)}
.hho-links-foundation{height:44px}
.hho-links-foundation path:last-child{stroke-width:2.8}
.hho-controls{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));padding:20px 15px!important;border:1px solid #acd9ff;border-radius:25px;background:linear-gradient(120deg,#eff9ff,#e1f3ff);box-shadow:0 6px 13px #0786d929,inset 0 0 0 1px #ffffffc9}
.hho-controls .hho-tile{display:flex;align-items:center;justify-content:center;gap:12px;min-width:0;padding:0 12px;font-size:clamp(10px,.95vw,15px);font-weight:600;line-height:1.2;letter-spacing:-.04em}
.hho-controls li+li{border-left:1px solid #5299eb}
.hho-controls svg{width:30px;height:30px;color:#0088ff}
@keyframes hho-flow{to{stroke-dashoffset:-734}}
@media(min-width:1700px){.hho{padding-block:88px}.hho-wrap{max-width:1680px;gap:38px}}
@media(min-width:1101px) and (max-width:1390px){.hho{padding-inline:24px}.hho-wrap{grid-template-columns:minmax(0,.43fr) minmax(0,1fr);gap:24px}.hho-eyebrow{font-size:14px;padding-inline:15px;gap:10px}.hho h2{font-size:clamp(32px,3.35vw,46px)}.hho-lead{font-size:17px}.hho-highlights{padding-inline:5px!important}.hho-highlights .hho-tile{gap:5px;padding-inline:5px;font-size:10px}.hho-highlights svg{width:24px;height:24px}.hho-diagram{padding:28px 20px 24px;border-radius:32px}.hho-channels .hho-tile{margin-inline:5px}.hho-channels .hho-tile{gap:10px;font-size:13px;min-height:56px;border-radius:18px}.hho-channels svg{width:26px;height:26px}.hho-engine{padding:22px 18px;border-radius:28px}.hho-engine ul{gap:9px}.hho-engine .hho-tile{font-size:13px;min-height:108px;border-radius:18px}.hho-engine svg{width:32px;height:32px}.hho-branches{gap:12px}.hho-systems,.hho-models{padding:12px 8px!important;gap:4px;border-radius:20px}.hho-systems .hho-tile{font-size:9px}.hho-models .hho-tile{font-size:11px}.hho-model-notes{gap:10px;padding-left:0}.hho-model-notes p{font-size:10px;padding-inline:8px}.hho-controls{padding-inline:8px!important}.hho-controls .hho-tile{gap:6px;padding-inline:6px;font-size:10px}.hho-controls svg{width:25px;height:25px}}
@media(max-width:1100px){.hho{padding:56px 24px 64px}.hho-wrap{grid-template-columns:1fr;gap:36px;max-width:1000px}.hho-intro{text-align:center;max-width:740px;margin:auto}.hho-eyebrow{font-size:16px}.hho h2{margin-top:26px;font-size:clamp(36px,5vw,50px)}.hho h2 br:first-child{display:none}.hho h2 em{margin-top:6px}.hho-lead{margin-top:22px;font-size:19px}.hho-highlights{max-width:560px;margin:26px auto 0!important}.hho-highlights .hho-tile{font-size:14px}.hho-cta{margin-top:28px;font-size:19px}.hho-diagram{padding:30px 22px 24px}.hho-channels .hho-tile{font-size:16px;gap:12px}.hho-engine .hho-tile{font-size:16px}.hho-systems .hho-tile{font-size:11px}.hho-models .hho-tile{font-size:13px}.hho-controls .hho-tile{font-size:12px;gap:9px}.hho-model-notes p{font-size:11px}}
@media(max-width:700px){.hho{padding:40px 20px 52px}.hho-wrap{max-width:560px;gap:30px}.hho-eyebrow{font-size:13px;gap:10px;padding:10px 16px}.hho-eyebrow svg{width:24px;height:24px}.hho h2{font-size:clamp(31px,6vw,40px);margin-top:24px}.hho-lead{font-size:16px;line-height:1.45;margin-top:20px}.hho-highlights{margin-top:24px!important;padding:13px 8px!important;border-radius:22px}.hho-highlights .hho-tile{flex-direction:column;gap:7px;font-size:11px;padding-inline:6px;letter-spacing:-.025em}.hho-highlights svg{width:25px;height:25px}.hho-cta{font-size:17px;padding:13px 24px;margin-top:25px}.hho-diagram{padding:22px 14px 20px;border-radius:28px}.hho-channels{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin:0!important}.hho-channels .hho-tile{margin-inline:0;font-size:14px;min-height:54px;border-radius:17px;gap:11px}.hho-channels svg{width:27px;height:27px}.hho-links{position:relative;height:35px}.hho-links svg{display:none}.hho-links::before{content:"";position:absolute;left:calc(50% - 1px);top:0;bottom:5px;width:2px;background:#008dff}.hho-links::after{content:"";position:absolute;left:calc(50% - 5px);bottom:6px;width:10px;height:10px;border-right:2px solid #008dff;border-bottom:2px solid #008dff;transform:rotate(45deg)}.hho-engine{padding:16px;border-radius:24px}.hho-engine ul{grid-template-columns:repeat(2,minmax(0,1fr));gap:11px}.hho-engine .hho-tile{font-size:14px;min-height:106px;border-radius:18px;gap:10px}.hho-engine .hho-tile:last-child{grid-column:1/-1;justify-self:center;width:calc(50% - 5px)}.hho-engine .hho-tile+.hho-tile::before{display:none}.hho-engine svg{width:31px;height:31px}.hho-branches{grid-template-columns:1fr;gap:25px}.hho-systems{grid-template-columns:repeat(4,minmax(0,1fr));padding:13px 10px!important;gap:8px;border-radius:22px}.hho-systems .hho-tile{min-height:76px;font-size:11px;border-radius:13px}.hho-systems svg{width:25px;height:25px}.hho-models{padding:13px 10px!important;gap:7px;border-radius:22px}.hho-models .hho-tile{min-height:90px;font-size:12px;border-radius:14px;letter-spacing:-.035em}.hho-models svg{width:27px;height:27px}.hho-model-notes{min-height:0;gap:18px;padding:20px 1px 0}.hho-model-notes p{justify-self:stretch;font-size:11px;padding:9px 5px}.hho-links-foundation{height:36px;margin-top:6px}.hho-controls{grid-template-columns:repeat(3,minmax(0,1fr));gap:18px 0;padding:18px 8px!important;border-radius:22px}.hho-controls .hho-tile{font-size:11px;gap:7px;padding-inline:7px}.hho-controls svg{width:25px;height:25px}.hho-controls li:nth-child(4){border-left:0}}
@media(max-width:380px){.hho{padding-inline:16px}.hho h2{font-size:30px}.hho-diagram{padding-inline:11px}.hho-models .hho-tile{font-size:10px}.hho-models svg{width:24px;height:24px}.hho-systems .hho-tile{font-size:10px}.hho-controls .hho-tile{font-size:10px;gap:5px;padding-inline:5px}.hho-controls svg{width:23px;height:23px}}
@media(max-width:700px){.hho-links-foundation::before{top:5px;bottom:0}.hho-links-foundation::after{top:5px;bottom:auto;transform:rotate(225deg)}}
@media(prefers-reduced-motion:reduce){.hho *{animation:none!important;transition:none!important}.hho .hho-signal{display:none}.hho-cta:hover{transform:none}}