/* Enterprise integration map: blue/mint glass surfaces matching the home hero. */
.hhn{position:relative;isolation:isolate;overflow:hidden;padding:72px 24px 68px;color:#0d1936;background:radial-gradient(ellipse 45% 40% at 50% 52%,#d8f5ff85,transparent),linear-gradient(#f9fcff,#f5faff 80%,#fffcfc);font-family:"HH Inter",Inter,Arial,sans-serif;-webkit-font-smoothing:antialiased}
.hhn *{box-sizing:border-box}
main.gap-24>.hhn+.hhi{margin-block-start:calc(-24 * var(--spacing,.25rem))}
@media(min-width:768px){main.md\:gap-40>.hhn+.hhi{margin-block-start:calc(-40 * var(--spacing,.25rem))}}
.hhn::before{content:"";position:absolute;z-index:-1;inset:0;pointer-events:none;background:url('/assets/integrations-waves.svg') center/100% 100% no-repeat}
.hhn-wrap{position:relative;max-width:1360px;margin:auto}
.hhn-heading{text-align:center}
.hhn-eyebrow{display:inline-flex;align-items:center;gap:16px;margin:0;padding:9px 22px;border:1px solid #e4f1ff;border-radius:999px;background:linear-gradient(110deg,#fff,#f2fbff 55%,#deffe6);box-shadow:0 3px 8px #469ddb20;font-size:clamp(13px,1.15vw,17px);font-weight:600;line-height:1.3;letter-spacing:-.025em}
.hhn svg{display:block;flex:none;width:26px;height:26px}
.hhn-eyebrow svg{color:#087cff;width:29px;height:29px}
.hhn h2{margin:22px 0 0;font-size:clamp(32px,4.5vw,52px);font-weight:600;line-height:1.13;letter-spacing:-.04em;text-wrap:balance}
.hhn h2 span{background:linear-gradient(100deg,#0064ff,#058be2 45%,#08b338 95%);background-clip:text;-webkit-background-clip:text;color:transparent}
.hhn-lead{margin:16px auto 0;max-width:780px;color:#43547c;font-size:clamp(16px,1.35vw,20px);line-height:1.4;text-wrap:pretty}
.hhn-diagram{position:relative;display:grid;grid-template-columns:28% minmax(0,1fr) 28%;align-items:center;max-width:1200px;margin:104px auto 0;min-height:446px}
.hhn-column-label{position:absolute;top:-58px;display:inline-flex;align-items:center;justify-content:center;gap:9px;margin:0;padding:9px 20px;border-radius:999px;background:linear-gradient(120deg,#e7f7ff,#ddecff);box-shadow:0 3px 7px #298be315;font-size:16px;font-weight:600;letter-spacing:-.03em;line-height:1.2}.hhn-column-label svg{width:25px;height:25px;color:#008fc9}.hhn-channel-label{left:5%}.hhn-system-label{right:3%}
.hhn .hhn-connections{position:absolute;z-index:-1;inset:0;width:100%;height:100%;overflow:visible;color:#1dbcf5}
.hhn-wire{stroke:#39c8fa;stroke-width:1.5;opacity:.6}
.hhn-signal{stroke:#1289ff;stroke-width:3;stroke-dasharray:1 35;stroke-linecap:round;animation:hhn-data-flow 5s linear infinite;animation-play-state:paused;opacity:.7}
.hhn.is-active .hhn-signal{animation-play-state:running}
.hhn-connections circle{fill:currentColor;filter:drop-shadow(0 0 5px #01bfff77)}
.hhn-channels,.hhn-systems{display:grid;gap:10px;list-style:none;margin:0;padding:0}
.hhn-channels{grid-column:1}.hhn-systems{grid-column:3}
.hhn-node{display:flex;align-items:center;gap:18px;min-width:0;height:66px;padding:8px 18px;border:1px solid #ffffffed;border-radius:22px;background:linear-gradient(135deg,#fffffff2,#edf5ffbf);box-shadow:0 4px 11px #3a91ee1c,inset 0 0 0 1px #d7eaff80}
.hhn-icon{display:grid;place-items:center;flex:none;width:46px;height:43px;border-radius:14px;color:#0483ff;background:linear-gradient(145deg,#a2d7ff,#368ffc);box-shadow:inset 0 1px 3px #ffffff80}
.hhn-channels .hhn-icon{color:#fff}
.hhn-icon.is-green{background:linear-gradient(145deg,#78f19b,#06c650)}
.hhn-icon.is-purple{background:linear-gradient(145deg,#d4c2ff,#8e6bff)}
.hhn-icon.is-amber{background:linear-gradient(145deg,#ffe6ac,#ffbb5f)}
.hhn-icon.is-pink{background:linear-gradient(145deg,#ffc5e8,#f46fc6)}
.hhn-node strong{font-size:clamp(14px,1.2vw,17px);font-weight:650;line-height:1.15;letter-spacing:-.035em}
.hhn-mini{display:grid;place-items:center;flex:none;width:43px;height:30px;margin-left:auto;border-radius:999px;background:#e5f4ff;color:#0599fa}
.hhn-mini svg{width:25px;height:25px}
.hhn-systems .hhn-node{gap:16px}
.hhn-systems .hhn-icon{width:68px;background:linear-gradient(145deg,#ecf8ff,#d7f0ff)}
.hhn-systems .hhn-icon.is-purple{color:#8c4bff;background:linear-gradient(145deg,#faf6ff,#ede5ff)}
.hhn-systems .hhn-icon.is-cyan{color:#04b7e9;background:#e2faff}
.hhn-systems .hhn-icon.is-green{color:#0bce4a;background:#e7faec}
.hhn-systems .hhn-icon svg{width:33px;height:33px}
.hhn-node>div{min-width:0}
.hhn-node small{display:block;margin-top:5px;font-size:12px;line-height:1.2;color:#34446c;letter-spacing:-.015em}
.hhn-sap{padding:4px 12px 4px 5px;color:#fff;background:#039df5;clip-path:polygon(0 0,100% 0,65% 100%,0 100%);font-family:Arial,sans-serif;font-size:21px;font-weight:800;letter-spacing:-2px;line-height:1}
.hhn-center{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;grid-column:2;grid-row:1;min-height:446px;padding-top:0}
.hhn-orbit{display:grid;place-items:center;width:100%;height:304px;isolation:isolate}
.hhn-hub{position:relative;grid-area:1/1;display:flex;flex-direction:column;align-items:center;justify-content:center;width:242px;height:242px;padding:22px;overflow:hidden;isolation:isolate;border:0;border-radius:50%;background:#b7dbc7 url(/assets/agents/orb-meadow.webp) center/cover no-repeat;box-shadow:0 12px 24px -12px #244f4a42;text-align:center}
.hhn-hub::before{content:"";position:absolute;inset:0;z-index:0;pointer-events:none;opacity:.65;mix-blend-mode:overlay;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n' x='0' y='0' width='100%25' height='100%25'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='1.1' numOctaves='1' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3CfeComponentTransfer%3E%3CfeFuncR type='linear' slope='1.9' intercept='-.45'/%3E%3CfeFuncG type='linear' slope='1.9' intercept='-.45'/%3E%3CfeFuncB type='linear' slope='1.9' intercept='-.45'/%3E%3C/feComponentTransfer%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E") 0 0/180px 180px}
.hhn-hub>*{position:relative;z-index:1}
.hhn-hub>strong,.hhn-hub>span{text-shadow:0 1px 8px #ffffffa6}
.hhn-symbol{overflow:hidden;width:82px;height:82px;margin-bottom:12px}
.hhn-symbol img{display:block;max-width:none;width:auto;height:82px}
.hhn-hub>strong{position:relative;font-size:25px;font-weight:700;line-height:1.15;letter-spacing:-.04em}
.hhn-hub sup{position:absolute;top:0;right:-9px;font-size:9px;line-height:1;margin:0}
.hhn-hub>span{font-size:14px;font-weight:600;letter-spacing:-.03em}
.hhn-assurance{position:absolute;bottom:0;display:flex;align-items:center;justify-content:center;gap:10px;margin:0;padding:12px 20px;border:1px solid #fff;border-radius:999px;background:linear-gradient(115deg,#fff,#e0ffed);box-shadow:0 6px 14px #00b59324;color:#006b52;font-size:14px;font-weight:600;white-space:nowrap;letter-spacing:-.025em}
.hhn-assurance svg{width:24px;height:24px;color:#09c838}
.hhn-workflow{display:grid;grid-template-columns:1fr;gap:20px;align-items:center;margin-top:46px;padding:22px 24px;border:1px solid #dbeaff;border-radius:28px;background:linear-gradient(110deg,#ffffffcf,#f5faffcc);box-shadow:0 8px 20px #3a91ee12}
.hhn-workflow-title{display:flex;align-items:center;gap:16px;padding-left:4px}.hhn-workflow-title>svg{color:#0678ff;width:28px;height:28px}
.hhn-workflow-title h3{margin:0;font-size:17px;font-weight:650;letter-spacing:-.04em}
.hhn-workflow-title p{display:inline-flex;justify-content:center;margin:0;padding:7px 24px;border-radius:999px;background:linear-gradient(105deg,#d8f0ff,#deffe4);box-shadow:0 3px 8px #148ddb1a;color:#0055f4;font-size:16px;font-weight:650;letter-spacing:-.03em}
.hhn-workflow ol{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:28px;list-style:none;margin:0;padding:0}
.hhn-workflow ol li{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;min-width:0;min-height:116px;padding:14px 12px;text-align:center;border:1px solid #d6eaff;border-radius:24px;background:linear-gradient(135deg,#fff,#edf7ff);box-shadow:0 4px 10px #3a91ee20}
.hhn-workflow ol li>svg{width:28px;height:28px;color:#0584ff}
.hhn-workflow ol strong{display:block;font-size:14px;font-weight:650;line-height:1.2;letter-spacing:-.025em}
.hhn-workflow ol small{display:block;margin-top:5px;font-size:12px;line-height:1.2;color:#34446c}
.hhn-step-arrow{position:absolute;right:-24px;top:50%;transform:translateY(-50%);color:#00b9e8}
.hhn-step-arrow svg{width:20px;height:20px}
.hhn-workflow ol li:last-child .hhn-step-arrow{display:none}
.hhn-benefits{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px;list-style:none;margin:54px 0 0;padding:0 18px}
.hhn-benefits li{display:flex;align-items:center;gap:22px;min-width:0;padding:26px 28px;border:1px solid #eaf3ff;border-radius:28px;background:linear-gradient(120deg,#f0f5ff,#edf3ffbf)}
.hhn-benefits li:nth-child(2),.hhn-benefits li:nth-child(3){background:linear-gradient(120deg,#eafbf3,#effaf8);border-color:#e5f7ed}

.hhn-benefit-icon{display:grid;place-items:center;flex:none;width:76px;height:76px;border:1px solid #fff;border-radius:50%;background:linear-gradient(130deg,#fff,#e8f4ff);color:#087dff;box-shadow:0 4px 8px #3a91ee20}
.hhn-benefit-icon svg{width:39px;height:39px}
.hhn-benefit-icon.is-green{color:#00bb41;background:linear-gradient(130deg,#e8ffef,#fff)}
.hhn-benefits h3{margin:0;font-size:clamp(19px,2vw,23px);font-weight:650;line-height:1.2;letter-spacing:-.04em}
.hhn-benefits p{margin:7px 0 0;font-size:16px;line-height:1.4;color:#43547c;letter-spacing:-.015em}
@keyframes hhn-data-flow{to{stroke-dashoffset:-144}}
@media(max-width:1100px) and (min-width:901px){.hhn-node{padding-inline:12px;gap:12px}.hhn-systems .hhn-node{gap:10px}.hhn-systems .hhn-icon{width:48px}.hhn-mini{width:30px}.hhn-node strong{font-size:13px}.hhn-node small{font-size:10px}.hhn-hub{width:206px;height:206px}.hhn-assurance{font-size:12px;padding-inline:14px}.hhn-workflow{grid-template-columns:1fr;gap:18px}.hhn-workflow-title{display:flex;align-items:center;gap:20px}.hhn-workflow-title p{margin:0}.hhn-benefits li{padding:24px;gap:20px}.hhn-benefit-icon{width:64px;height:64px}.hhn-benefit-icon svg{width:34px;height:34px}.hhn-benefits p{font-size:15px}}
@media(max-width:900px){
 .hhn{padding:40px 20px 48px}.hhn-wrap{max-width:680px}.hhn-eyebrow{gap:10px;padding:8px 14px;font-size:12px}.hhn-eyebrow svg{width:23px;height:23px}
 .hhn h2{font-size:clamp(29px,5vw,40px)}.hhn-lead{font-size:16px}.hhn-desktop-break{display:none}
 .hhn-diagram{display:flex;flex-direction:column;min-height:0;margin-top:28px}.hhn .hhn-connections{display:none}
 .hhn-channel-label{order:0}.hhn-channels{order:1}.hhn-center{order:2}.hhn-system-label{order:3}.hhn-systems{order:4}
 .hhn-channels,.hhn-systems{grid-template-columns:repeat(2,minmax(0,1fr));width:100%;gap:10px}.hhn-node{height:66px;padding:10px 14px;gap:12px;border-radius:20px}.hhn-node strong{font-size:14px}.hhn-mini{width:30px}.hhn-mini svg{width:20px;height:20px}
 .hhn-column-label{position:static;align-self:center;margin:0 0 18px;font-size:15px}.hhn-system-label{margin-top:4px}.hhn-center{min-height:316px;width:100%;margin:16px 0 24px;padding-bottom:30px}.hhn-center::before{content:"";position:absolute;z-index:-1;top:-16px;bottom:-24px;left:50%;width:1px;background:linear-gradient(#b8e9ff,#4acffb,#b8e9ff)}.hhn-orbit{height:260px}.hhn-hub{width:206px;height:206px}.hhn-symbol{width:70px;height:70px}.hhn-symbol img{height:70px}.hhn-hub>strong{font-size:23px}.hhn-assurance{bottom:0;font-size:13px}
 .hhn-systems .hhn-icon{width:48px}.hhn-systems .hhn-node{gap:12px}.hhn-node small{font-size:10px}
 .hhn-workflow{grid-template-columns:1fr;gap:22px;margin-top:30px;padding:24px;border-radius:24px}.hhn-workflow-title{justify-content:center;flex-wrap:wrap;text-align:center;gap:10px}.hhn-workflow ol{grid-template-columns:1fr;gap:20px}.hhn-workflow ol li{flex-direction:row;justify-content:flex-start;text-align:left;min-height:66px;padding:14px 24px;border-radius:20px}.hhn-workflow ol strong{font-size:14px}.hhn-workflow ol small{font-size:12px}.hhn-step-arrow{right:50%;top:auto;bottom:-22px;transform:translateX(50%) rotate(90deg)}
 .hhn-benefits{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin-top:32px;padding:0}.hhn-benefits li{gap:14px;padding:22px 18px;border-radius:24px}.hhn-benefits h3{font-size:17px}.hhn-benefit-icon{width:44px;height:44px}.hhn-benefit-icon svg{width:27px;height:27px}.hhn-benefits p{font-size:13px}
}
@media(max-width:540px){.hhn-channels,.hhn-systems{grid-template-columns:1fr}.hhn-node{padding-inline:18px}.hhn-mini{width:40px}.hhn-node strong{font-size:15px}.hhn-node small{font-size:12px}.hhn-benefits{grid-template-columns:1fr;gap:22px}.hhn-benefits li{padding:24px;border-radius:24px}.hhn-benefit-icon{width:52px;height:52px}.hhn-benefits h3{font-size:18px}.hhn-benefits p{font-size:14px}}
@media(prefers-reduced-motion:reduce){.hhn .hhn-signal{animation:none}.hhn *{scroll-behavior:auto!important}}
