/* 2026-10-31: detailed vector/CSS reconstruction. All illustration detail is
   drawn by the browser; no pixels from the supplied reference are embedded. */
.ref-hero,.ref-services,.ref-customers,.ref-ticker{overflow:visible}
.ref-hero{z-index:1}
.ref-hero-stage{isolation:isolate}
.ref-mask-holder{z-index:2}
.ref-mask-holder img{image-rendering:auto;filter:drop-shadow(0 8px 8px #0006)}
.ref-hero h1{font-weight:600}
.ref-hero h1 strong{font-weight:600}
.ref-services{z-index:0}
.ref-service-visual{isolation:isolate}
.service-illustration{position:absolute;z-index:3;left:50%;top:7%;width:330px;height:235px;transform:translateX(-50%) scale(1.36);transform-origin:center top;pointer-events:none}
.service-illustration *{box-sizing:border-box}
.svc-glow{position:absolute;inset:35px 6px 0;background:radial-gradient(ellipse at 52% 74%,#f59b665e,transparent 65%);filter:blur(18px)}
.svc-monitor{position:absolute;left:72px;top:62px;width:212px;height:136px;border-radius:12px;background:linear-gradient(126deg,#f49dbd 5%,#e97ba5 55%,#f7ab90);border:4px solid #f4c1c7;box-shadow:0 10px 0 #d16b93,0 15px 28px #0804088a,inset 0 0 14px #fff6ce8a;transform:perspective(550px) rotateY(-7deg) rotateX(3deg);overflow:visible}
.svc-monitor:before{content:"";position:absolute;inset:6px;border-radius:6px;box-shadow:inset 0 0 15px #8b406d6e;pointer-events:none}
.svc-monitor-top{height:20px;display:flex;align-items:center;gap:4px;padding:0 12px;border-bottom:1px solid #fff5ee68;background:#d4699c8a;border-radius:8px 8px 0 0}
.svc-dot{width:5px;height:5px;border-radius:50%;background:#ffddbb;box-shadow:0 0 4px #fff1cc}
.svc-dot:nth-child(2){background:#fe9baf}.svc-dot:nth-child(3){background:#fff2a0}
.svc-monitor-top em{margin-left:8px;width:71px;height:4px;background:#ffd5d3a6;border-radius:6px}
.svc-monitor-top small{margin-left:auto;color:#ffead6;font-size:11px}
.svc-monitor-content{display:flex;height:105px;padding:9px 10px;gap:9px}
.svc-sidebar{display:flex;flex-direction:column;align-items:center;gap:7px;border-radius:6px;width:23px;padding:5px 1px;background:linear-gradient(180deg,#a34f94b7,#e98a9d9c);box-shadow:inset 1px 0 2px #fff4d47c;color:#fff0d9;font-size:11px}
.svc-cards{flex:1;min-width:0;display:grid;grid-template-columns:1fr 1.1fr;gap:7px}
.svc-card{min-width:0;border-radius:6px;background:linear-gradient(145deg,#efa1b6,#d9659b);border:1px solid #ffc8c18f;box-shadow:inset 0 1px 5px #fff3d881,0 3px 7px #87266549;position:relative;padding:5px}
.svc-card small{font-size:7px;font-weight:700;letter-spacing:.04em;color:#fff1ce}
.svc-bars{height:24px;display:flex;gap:4px;align-items:flex-end;padding:0 4px}
.svc-bars i{flex:1;min-width:2px;border-radius:2px 2px 0 0;background:linear-gradient(#ffefbb,#ffa5a2);height:35%;box-shadow:0 0 2px #ffdca9}
.svc-bars i:nth-child(2){height:68%}.svc-bars i:nth-child(3){height:55%}.svc-bars i:nth-child(4){height:88%}.svc-bars i:nth-child(5){height:64%}.svc-bars i:nth-child(6){height:100%}
.svc-line-card{background:linear-gradient(145deg,#f0a6b0,#ed86a0)}
.svc-line-card svg{position:absolute;left:7px;right:7px;top:13px;width:calc(100% - 14px);height:35px}
.svc-wide-card{grid-column:1/-1;height:29px;display:flex;align-items:center;justify-content:space-between;gap:6px;padding:4px 8px;background:linear-gradient(100deg,#d67ba5,#e9a4bb)}
.svc-wide-title{font-size:7px;font-weight:700;letter-spacing:.02em;color:#fff2e2}
.svc-mini-graph{width:85px;height:21px}
.svc-mini-graph svg{display:block;width:100%;height:100%}
.svc-monitor-base{position:absolute;top:100%;height:22px;width:100%;display:grid;place-items:center;pointer-events:none}
.svc-monitor-neck{height:12px;width:23px;background:linear-gradient(90deg,#b85494,#ffc9c2,#d372a0);box-shadow:0 3px 5px #0003}
.svc-monitor-foot{height:5px;width:165px;position:absolute;top:12px;background:linear-gradient(90deg,#e9a5b5,#ffead0 45%,#e49db6);border-radius:100%;box-shadow:0 5px 2px #0004}
.svc-float{position:absolute;border:2px solid #ffcdbbcc;box-shadow:0 8px 17px #2813227a,inset 0 2px 9px #ffe2cf8a;z-index:5;border-radius:10px;background:linear-gradient(145deg,#f1bfa7,#d875a2);color:#fff4d9}
.svc-left{left:28px;top:97px;width:63px;height:91px;padding:10px 11px;background:linear-gradient(135deg,#f6b4b9,#bc69ac);transform:rotate(-3deg)}
.svc-left i{display:block;height:5px;width:32px;background:#f7e6cfb8;border-radius:4px;margin-bottom:8px}
.svc-left i:nth-child(2){width:22px}.svc-left i:nth-child(3){width:37px}
.svc-left b{display:block;font-size:24px;color:#ffead4;text-align:center;line-height:1}
.svc-right{right:2px;top:56px;width:78px;height:83px;padding:12px 7px;background:linear-gradient(133deg,#ffd1a4,#f398a0 50%,#b9679f);transform:rotate(6deg)}
.svc-right strong{display:block;color:#f5fff0;font-weight:800;font-size:16px;letter-spacing:-.05em}
.svc-right span{display:block;color:#fff5d9;font-size:16px;white-space:nowrap;margin-top:9px}
.svc-right i{display:block;height:6px;width:52px;border-radius:5px;background:#fff1d0a6;margin-top:9px}
.svc-bottom{left:113px;top:173px;width:124px;height:36px;display:flex;gap:18px;align-items:center;justify-content:center;background:linear-gradient(105deg,#f5aa8d,#e375a6);border-radius:8px}
.svc-bottom span{font-size:17px}
.svc-gears{position:absolute;left:57px;top:16px;color:#d5d4f4;z-index:0;filter:drop-shadow(2px 3px 1px #080610);font-family:Arial,sans-serif}
.svc-gears span{display:inline-block;font-size:37px;line-height:1;animation:svc-rotate 20s linear infinite}
.svc-gears span+span{font-size:25px;margin-left:-7px;margin-bottom:17px;animation-direction:reverse}
.svc-spark{position:absolute;color:#ffbf70;text-shadow:0 0 9px #e9769a;font-size:14px}
.svc-spark-a{right:9px;top:29px}.svc-spark-b{left:10px;top:185px}
@keyframes svc-rotate{to{transform:rotate(360deg)}}
@media(max-width:980px) and (min-width:601px){
 .service-illustration{transform:translateX(-50%) scale(1.01);top:12%}
}
@media(max-width:600px){
 .ref-hero{overflow:hidden}
 .ref-hero h1{font-weight:600}
 .ref-hero h1 strong{font-weight:600}
 .ref-mask-holder img{filter:drop-shadow(0 3px 3px #0005)}
 .ref-services{overflow:visible}
 .ref-service-visual{overflow:visible}
 .service-illustration{position:absolute;left:0;top:0;width:330px;height:235px;transform:scale(.56);transform-origin:top left}
 .svc-glow{filter:blur(10px)}
 .ref-services-inner h2{font-weight:600}
}
@media(max-width:365px){
 .service-illustration{transform:scale(.53)}
}
@media(prefers-reduced-motion:reduce){.svc-gears span{animation:none}}

/* Market freshness label: local UI heartbeat is 1s, API is 60s. */
.market-sync {
  margin: -23px 0 18px;
  font-family: 'DM Sans', sans-serif;
  font-size: 11px;
  line-height: 1.7;
  color: #b5a6b0;
  letter-spacing: .015em;
}
.market-sync::before {
  content: '';
  display: inline-block;
  vertical-align: middle;
  height: 6px;
  width: 6px;
  margin-right: 9px;
  border-radius: 50%;
  background: #ee99ba;
  box-shadow: 0 0 9px #e47ea9a0;
}
@media(max-width:600px) {
  .market-sync { margin: -22px 0 15px; font-size: 10px; }
}