/* Pearl surfaces and a single interactive map of the four services. */
.renewal .gloss-section{background:linear-gradient(180deg,#fff 0%,#f6f7fa 24%,#eef1f5 62%,#fff 100%);overflow:hidden;padding:110px 0 90px}
.gloss-heading{display:flex;justify-content:space-between;align-items:end;gap:60px;margin-bottom:38px}
.gloss-heading>p{max-width:390px;font-size:17px;margin-bottom:6px}
.gloss-heading h2{max-width:760px}
.gloss-heading h2 em{background:linear-gradient(110deg,#265bea,#6997ff 60%,#2e69ff);background-clip:text;-webkit-background-clip:text;color:transparent}
.gloss-stage{position:relative;height:490px;border:1px solid #fff;border-radius:32px;isolation:isolate;background:radial-gradient(ellipse at 50% 44%,#fff 0%,#fafbfd 34%,#e9edf3 100%);box-shadow:inset 0 2px 2px #fff,0 28px 55px -40px #74839c65;overflow:hidden}
.gloss-stage:before{content:'';position:absolute;inset:0;background:linear-gradient(120deg,transparent 25%,#fff9 42%,transparent 58%);transform:translateX(-110%);animation:gloss-sheen 14s ease-in-out infinite;pointer-events:none;z-index:3}
.gloss-stage:after{content:'';position:absolute;width:440px;height:110px;left:50%;top:64%;transform:translateX(-50%);border-radius:50%;background:radial-gradient(ellipse,#9facbf35,transparent 70%);filter:blur(14px);z-index:-1}
.gloss-connections{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;overflow:visible}
.gloss-rail{stroke:#d5deec;stroke-width:1.6;fill:none;vector-effect:non-scaling-stroke}
.gloss-current{stroke:#2e69ff;stroke-width:2.5;fill:none;stroke-linecap:round;stroke-dasharray:24 280;animation:gloss-travel 5s linear infinite;opacity:0;transition:opacity .35s;vector-effect:non-scaling-stroke}
.gloss-current.is-selected{opacity:.65}
.gloss-core{position:absolute;left:50%;top:50%;width:210px;height:210px;transform:translate(-50%,-50%);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:9px;border:1px solid #fff;border-radius:55px;background:linear-gradient(135deg,#fff 4%,#f7f9fc 37%,#dce4ef 68%,#fff 100%);box-shadow:inset 2px 2px 3px #fff,inset -3px -4px 8px #b3bed133,0 22px 36px -20px #7285a678;z-index:2}
.gloss-core:before{content:'';position:absolute;inset:7px;border:1px solid #ffffffbd;border-radius:49px;pointer-events:none}
.gloss-core-mark{display:block;width:64px;height:45px;object-fit:contain;filter:drop-shadow(0 3px 2px #b9ccec)}
.gloss-core strong{font-family:Manrope,sans-serif;font-size:22px;letter-spacing:-1px;font-weight:800;color:#1b2b45}
.gloss-core strong span{font-weight:400}
.gloss-core small{font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:#70839f}
.gloss-node{position:absolute;width:255px;min-height:110px;display:flex;align-items:center;text-align:left;gap:16px;padding:22px;border:1px solid #fff;border-radius:22px;color:#182b48;background:linear-gradient(140deg,#fff 3%,#ffffffd9 50%,#e7edf5 100%);box-shadow:inset 0 1px 1px #fff,0 17px 30px -21px #60779e80;cursor:pointer;z-index:4;transition:box-shadow .25s,border-color .25s,background .25s;animation:gloss-float 7s ease-in-out infinite}
.gloss-node:hover{border-color:#c0d1f6;box-shadow:inset 0 1px 1px #fff,0 20px 35px -18px #60779e85}
.gloss-node[aria-pressed=true]{border-color:#98b8ff;background:linear-gradient(135deg,#fff 0%,#f7faff 55%,#e1ebff 100%);box-shadow:inset 0 1px 2px #fff,0 15px 32px -20px #2e69ff80}
.gloss-node:focus-visible{outline:3px solid #2e69ff;outline-offset:5px}
.gloss-node-icon{display:grid;place-items:center;flex-shrink:0;width:47px;height:47px;border-radius:14px;color:#5b759c;background:linear-gradient(135deg,#fff,#e0e7f1);box-shadow:inset 0 1px #fff,0 3px 5px #b7c3d126}
.gloss-node-icon svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.65;stroke-linecap:round;stroke-linejoin:round}
.gloss-node[aria-pressed=true] .gloss-node-icon{color:#2e69ff}
.gloss-node strong{display:block;font-size:19px;font-weight:600;letter-spacing:-.035em}
.gloss-node small{display:block;margin-top:5px;font-size:12px;color:#647792;line-height:1.4}
.gloss-node[data-module=crm]{left:6%;top:15%}
.gloss-node[data-module=social]{right:6%;top:15%;animation-delay:-2s}
.gloss-node[data-module=voip]{left:9%;bottom:15%;animation-delay:-4s}
.gloss-node[data-module=hosting]{right:9%;bottom:15%;animation-delay:-1s}
.gloss-caption{position:absolute;inset:auto 22px 19px;text-align:center;font-size:11px;color:#7988a0;letter-spacing:.02em}
.gloss-tools{display:flex;justify-content:flex-end;margin-top:16px}
.gloss-pause{border:0;background:transparent;padding:7px 0 7px 14px;color:#667a97;font-size:12px;cursor:pointer;display:flex;align-items:center;gap:7px}
.gloss-pause svg{width:12px;height:12px;fill:currentColor}
.gloss-detail{display:grid;grid-template-columns:210px 1fr auto;align-items:center;gap:32px;min-height:117px;padding:24px 0;border-bottom:1px solid #dbe3ef}
.gloss-detail h3{font-size:24px;margin:0;color:#182b48}
.gloss-detail p{font-size:16px;max-width:610px;line-height:1.65;margin:0}
.gloss-detail .text-link{white-space:nowrap;color:#2e69ff;font-size:14px}
.gloss-section .workflow{margin-top:45px;gap:45px}
.gloss-section .workflow li{border-top:0;padding:0}
.gloss-section .workflow h3{font-size:22px;margin:12px 0 10px}
.gloss-section .workflow p{font-size:14px}
.gloss-section .workflow b{font-size:11px;margin-top:15px}
.gloss-section:not(.is-in-view) *,.gloss-section:not(.is-in-view) *:before,.gloss-section.is-paused *,.gloss-section.is-paused *:before,.paused .gloss-section *,.paused .gloss-section *:before{animation-play-state:paused!important}
@keyframes gloss-float{0%,100%{transform:translateY(0)}50%{transform:translateY(-7px)}}
@keyframes gloss-travel{to{stroke-dashoffset:-608}}
@keyframes gloss-sheen{0%,55%{transform:translateX(-110%)}80%,100%{transform:translateX(110%)}}
@media(max-width:1100px){.gloss-node{width:225px;padding:18px;gap:12px}.gloss-core{width:180px;height:180px;border-radius:45px}.gloss-core:before{border-radius:39px}.gloss-node[data-module=crm],.gloss-node[data-module=voip]{left:3%}.gloss-node[data-module=social],.gloss-node[data-module=hosting]{right:3%}.gloss-detail{grid-template-columns:160px 1fr;gap:14px 25px}.gloss-detail .text-link{grid-column:2}}
@media(max-width:800px){.renewal .gloss-section{padding:72px 0}.gloss-heading{display:block;margin-bottom:30px}.gloss-heading>p{max-width:540px;margin-top:24px;font-size:16px}.gloss-stage{height:530px}.gloss-node{width:210px;min-height:96px;padding:16px}.gloss-node[data-module=crm],.gloss-node[data-module=social]{top:9%}.gloss-node[data-module=voip],.gloss-node[data-module=hosting]{bottom:11%}.gloss-core{width:150px;height:150px;border-radius:38px}.gloss-core:before{border-radius:32px}.gloss-core strong{font-size:19px}.gloss-core-mark{width:48px;height:34px}.gloss-core small{font-size:8px}.gloss-node strong{font-size:17px}.gloss-caption{font-size:10px;bottom:16px}}
@media(max-width:520px){.renewal .gloss-section{padding:60px 0}.gloss-stage{height:460px;border-radius:22px}.gloss-node{width:44%;min-height:100px;padding:13px 10px;gap:9px;flex-direction:column;align-items:flex-start;border-radius:17px}.gloss-node-icon{width:30px;height:30px;border-radius:9px}.gloss-node-icon svg{width:19px;height:19px}.gloss-node strong{font-size:15px;letter-spacing:-.02em}.gloss-node small{font-size:10px;margin-top:3px}.gloss-node[data-module=crm],.gloss-node[data-module=social]{top:6%}.gloss-node[data-module=voip],.gloss-node[data-module=hosting]{bottom:9%}.gloss-core{width:133px;height:133px;border-radius:33px;gap:6px}.gloss-core:before{border-radius:27px}.gloss-core strong{font-size:17px}.gloss-core small{font-size:7px}.gloss-core-mark{width:42px;height:30px}.gloss-stage:after{width:230px;height:60px;top:60%}.gloss-detail{grid-template-columns:1fr;gap:12px;min-height:215px;padding:20px 0}.gloss-detail h3{font-size:23px}.gloss-detail p{font-size:14px}.gloss-detail .text-link{grid-column:1;margin-top:4px}.gloss-section .workflow{margin-top:30px;gap:28px}.gloss-section .workflow h3{font-size:22px}.gloss-section .workflow p{max-width:none}}
@media(prefers-reduced-motion:reduce){.gloss-section *,.gloss-section *:before{animation:none!important;transition:none!important}.gloss-stage:before{display:none}.gloss-current{stroke-dasharray:none;opacity:0}.gloss-current.is-selected{opacity:.4}.gloss-pause{display:none}}
