:root{--bg:#080f17;--bg2:#0c1723;--panel:#111f2b;--line:#263849;--ink:#eef5fa;--muted:#a3b3c2;--accent:#aee94a;--blue:#69c7e6;--max:1200px}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:88px}body{margin:0;background:var(--bg);color:var(--ink);font-family:Inter,-apple-system,BlinkMacSystemFont,"PingFang SC","Microsoft YaHei",sans-serif;line-height:1.7}a{color:inherit;text-decoration:none}button,input,textarea,select{font:inherit}button{cursor:pointer}img{display:block;max-width:100%}.wrap{width:min(var(--max),calc(100% - 44px));margin:0 auto}.eyebrow{font-size:12px;letter-spacing:2.5px;color:var(--accent);font-weight:800;text-transform:uppercase}.nav{position:sticky;top:0;z-index:80;background:rgba(8,15,23,.92);backdrop-filter:blur(18px);border-bottom:1px solid #203040}.navin{display:flex;justify-content:space-between;align-items:center;min-height:76px;gap:20px}.logo{font-size:25px;font-weight:900;letter-spacing:-1px;white-space:nowrap}.logo i{font-style:normal;color:var(--accent)}.links{display:flex;gap:28px;font-size:14px;color:#c2d1dc}.links a:hover{color:var(--accent)}.links a.is-active{color:var(--accent)}.btn{border:0;padding:12px 21px;border-radius:9px;background:var(--accent);color:#0c1a12;font-weight:850;display:inline-flex;gap:8px;align-items:center;justify-content:center;line-height:1.4}.btn:hover{filter:brightness(1.08)}.btn.outline{background:transparent;color:var(--ink);border:1px solid #527086}.btn.dark{background:#193040;color:#e6f6ff}.hero{background:radial-gradient(ellipse at 80% 19%,#1c3c46 0%,transparent 44%),linear-gradient(180deg,#0b1520,#09121b);padding:90px 0 70px;border-bottom:1px solid var(--line)}.hero-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:55px;align-items:center}.hero h1{font-size:clamp(40px,5vw,69px);line-height:1.16;letter-spacing:-2px;margin:18px 0 22px}.hero h1 em{font-style:normal;color:var(--accent)}.lead{color:#becbd4;font-size:17px;max-width:580px}.actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:27px}.proof{display:flex;gap:30px;margin-top:48px;flex-wrap:wrap}.proof strong{font-size:24px;display:block}.proof small{color:#9aafbf}.visual{position:relative;min-height:424px;background:linear-gradient(155deg,#183141,#091620 70%);border:1px solid #426075;border-radius:22px;overflow:hidden;padding:28px;display:flex;flex-direction:column;justify-content:space-between;box-shadow:0 22px 70px #0005}.visual:before{content:"";position:absolute;inset:5%;border:1px solid #5a77813d;border-radius:50%;transform:scale(1.35)}.visual .media{z-index:1;position:relative;display:grid;place-items:center;min-height:240px;border:1px dashed #6f919e83;border-radius:14px;background:#132c3c75;overflow:hidden;color:#a6c4d3;text-align:center}.visual .media img,.photo img{width:100%;height:100%;position:absolute;inset:0;object-fit:cover}.placeholder{padding:18px;position:relative;z-index:1}.visual b{font-size:26px;z-index:1}.visual .flag{z-index:1;color:var(--accent);font-size:13px}.band{padding:21px 0;border-bottom:1px solid var(--line);background:#0a151d}.band .wrap{display:flex;justify-content:space-between;gap:15px;flex-wrap:wrap;color:#b6c6d2;font-size:13px}.section{padding:92px 0;border-bottom:1px solid var(--line)}.soft{background:#0d1925}.heading{max-width:820px;margin-bottom:36px}.heading h2{font-size:clamp(29px,3.2vw,43px);line-height:1.28;margin:12px 0}.heading p{color:var(--muted);margin:0}.grid3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}.grid2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px}.card{background:linear-gradient(170deg,#142532,#0e1b27);border:1px solid #2a4050;border-radius:16px;padding:26px}.card h3{font-size:21px;margin:8px 0}.card p{color:#a9bdc9;font-size:14px;margin:0 0 14px}.card .no{color:var(--accent);font-size:13px;font-weight:850}.tag{display:inline-block;border:1px solid #4e7182;color:#a9d6e4;font-size:12px;border-radius:30px;padding:4px 11px;margin:8px 7px 0 0}.cardlink{font-size:13px;color:var(--accent);font-weight:800}.products{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px}.product{background:#122332;border:1px solid #365166;border-radius:18px;overflow:hidden}.product.featured{border-color:#9fcf65}.productimg{height:280px;background:radial-gradient(circle at center,#315368,#0c1c28 73%);position:relative;display:grid;place-items:center}.photo{position:relative;border:1px dashed #7293a4aa;border-radius:12px;background:#1c374770;display:grid;place-items:center;text-align:center;color:#a4bece;overflow:hidden;width:85%;height:76%}.productbody{padding:27px}.productbody h3{font-size:28px;margin:5px 0}.productbody p{color:var(--muted);font-size:14px}.productbody .features{display:flex;gap:9px;flex-wrap:wrap;margin:22px 0}.feature{padding:6px 10px;border-radius:7px;background:#223b4b;font-size:12px;color:#d3e1e9}.ribbon{display:inline-block;font-size:12px;font-weight:800;background:#2e5443;color:#d9ffab;border-radius:5px;padding:4px 10px}.compare{width:100%;border-collapse:collapse;background:#10202d;border-radius:12px;overflow:hidden}.compare th,.compare td{text-align:left;padding:15px;border-bottom:1px solid #284253;font-size:14px}.compare th{color:#dceeea;background:#1a3040}.compare td:first-child{color:#a6c0cf;width:28%}.comparewrap{overflow:auto;border-radius:12px;border:1px solid #2b4657}.cases .photo{height:175px;width:100%;margin-bottom:20px}.steps{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:15px}.step{border-top:2px solid #668a90;background:#122433;padding:21px;border-radius:4px 4px 12px 12px}.step b{color:var(--accent);font-size:14px}.step h3{margin:10px 0}.step p{color:var(--muted);font-size:13px;margin:0}.about{display:grid;grid-template-columns:1fr 1fr;gap:50px;align-items:center}.about .photo{min-height:310px;width:100%}.faq details{border:1px solid #284154;background:#10202e;padding:17px 22px;border-radius:11px;margin:10px 0}.faq summary{cursor:pointer;font-weight:750}.faq p{color:#b1c3cd;font-size:14px}.contact{background:linear-gradient(125deg,#142b35,#0b1823);display:grid;grid-template-columns:1fr 1fr;gap:50px;padding:35px;border:1px solid #355264;border-radius:20px}.contact h2{font-size:37px;margin:14px 0}.contact p{color:var(--muted)}label{display:block;color:#c2d5df;font-size:13px;margin-bottom:9px}input,select,textarea{display:block;width:100%;padding:12px 14px;border-radius:8px;background:#081721;border:1px solid #426072;color:#eef6fa;margin-top:7px;outline:none}input:focus,select:focus,textarea:focus{border-color:var(--accent)}textarea{resize:vertical;min-height:100px}.formnote{font-size:12px;color:#9eb1bd}.footer{padding:58px 0 22px;background:#070d14}.footercols{display:grid;grid-template-columns:1.2fr repeat(4,1fr);gap:30px}.footer h4{margin:0 0 15px;font-size:14px}.footer p,.footer a{font-size:13px;color:#96a9b7}.footer a{display:block;margin-bottom:12px}.footerbottom{padding-top:35px;margin-top:32px;border-top:1px solid #213340;font-size:12px;color:#8498a6}.floatbar{position:fixed;right:18px;top:38%;z-index:65;background:rgba(17,31,43,.78);border:1px solid rgba(105,199,230,.22);border-radius:16px;padding:0;display:block;gap:0;box-shadow:inset 0 0 18px rgba(255,255,255,.08),0 10px 28px rgba(0,0,0,.38)}.floatbar button,.floatbar a{font-size:0;background:transparent;color:inherit;border:0;border-radius:0;padding:0;text-align:center}.floatbar button:hover,.floatbar a:hover{background:transparent}.editbtn{position:fixed;left:18px;bottom:20px;z-index:150;background:var(--accent);color:#102016;border:0;border-radius:60px;padding:14px 19px;box-shadow:0 12px 30px #0007;font-weight:900}.editor{position:fixed;z-index:149;left:16px;bottom:82px;background:#e8f0f2;color:#14212a;border-radius:15px;border:1px solid #b5cacf;width:min(354px,calc(100vw - 32px));box-shadow:0 12px 50px #000a;padding:19px;display:none}.editor.open{display:block}.editor h3{margin:0 0 7px;color:#14252f}.editor p{font-size:13px;color:#506575;margin:0 0 13px}.editor button{background:#18394b;color:white;border:0;border-radius:7px;padding:9px 11px;font-size:12px;margin:3px}.editor button.alt{background:#d2dfe5;color:#102533}.editor .status{font-size:12px;color:#305663;margin-top:9px}.editing [data-edit]{outline:1px dashed #add65a;outline-offset:3px;cursor:text;border-radius:2px}.editing [data-image-slot]{outline:2px dashed var(--accent);outline-offset:3px;cursor:pointer}.editing [data-edit]:focus{outline:2px solid var(--accent);background:#213b31}.editablehint{font-size:12px;color:#c3f487;margin-top:12px;display:none}.editing .editablehint{display:block}.modalbg{position:fixed;inset:0;background:#000b;display:none;align-items:center;justify-content:center;padding:15px;z-index:120}.modalbg.active{display:flex}.modal{position:relative;background:#112332;border:1px solid #5c7a8c;border-radius:15px;padding:30px;max-width:500px;width:100%}.modal h3{margin-top:0}.modal p{color:#b7c9d2}.close{position:absolute;right:15px;top:11px;background:transparent;color:white;border:0;font-size:26px}.note{font-size:12px;color:#99b5c1}.topnote{font-size:12px;background:#29404a;padding:7px 14px;border-radius:7px;color:#d2e9ee;margin:12px 0;display:inline-block}.mobilemenu{display:none}.edit-alert{background:#273d22;border:1px solid #749a40;color:#e5ffc2;padding:11px 13px;border-radius:9px;margin-top:12px;font-size:13px}
@media(max-width:950px){.links{gap:13px}.hero-grid,.about,.contact{grid-template-columns:1fr}.footercols{grid-template-columns:repeat(3,1fr)}.steps{grid-template-columns:repeat(2,1fr)}.visual{min-height:330px}}@media(max-width:650px){.wrap{width:calc(100% - 30px)}.navin{min-height:69px}.links{display:none}.mobilemenu{display:block;border:1px solid #385267;background:transparent;color:white;padding:9px;border-radius:7px}.links.open{display:flex;position:absolute;top:69px;left:0;right:0;background:#0d1b28;padding:22px;flex-direction:column}.navin>.btn{display:none}.hero{padding:50px 0}.hero h1{font-size:39px}.section{padding:62px 0}.grid3,.grid2,.products{grid-template-columns:1fr}.proof{gap:18px}.productimg{height:225px}.footercols{grid-template-columns:repeat(2,1fr)}.floatbar{top:auto;bottom:0;left:0;right:0;border-radius:0;display:flex;justify-content:space-around;padding:4px;z-index:65}.floatbar button,.floatbar a{padding:9px 4px}.editbtn{bottom:66px;left:12px}.editor{bottom:126px}.steps{grid-template-columns:1fr 1fr}.contact{padding:20px}.about .photo{min-height:220px}.hero .visual{min-height:310px}.band .wrap{gap:9px}.compare th,.compare td{padding:11px;font-size:12px}}

/* V3 scoped refinements */
.carousel-hero{padding:55px 0 32px}.carousel-shell{position:relative;min-height:530px}.hero-slide{display:none;animation:slideShow .4s ease}.hero-slide.active{display:block}.hero-slide .hero-grid{min-height:505px}.hero-slide .visual{min-height:410px}.slide-title{font-size:clamp(38px,4.6vw,64px);line-height:1.2;margin:18px 0 24px}.carousel-controls{display:flex;align-items:center;justify-content:center;gap:24px;margin-top:12px}.carousel-controls>button{border:1px solid #476474;background:#142b3c;color:#edf6ff;border-radius:50%;font-size:24px;width:42px;height:42px}.carousel-dots{display:flex;gap:10px}.dot{border-radius:20px;border:0;background:#486170;width:9px;height:9px;padding:0}.dot.active{background:var(--accent);width:32px}.benefit-card{padding:0;overflow:hidden}.benefit-card .tile-photo{border:0;border-radius:0;width:100%;height:180px;background:linear-gradient(135deg,#1e3f51,#10212e);}.benefit-content{padding:23px}.benefit-card h3{font-size:19px}.tile-photo{width:100%;min-height:170px;height:190px;margin-bottom:17px}.materials .material-card{padding:16px}.materials .tile-photo{height:180px}.material-card h3{font-size:19px}.xmaker-media{display:grid;grid-template-columns:1.25fr 1fr;gap:22px;margin-bottom:36px}.xmaker-video,.xmaker-explain{background:#132432;border:1px solid #365063;padding:23px;border-radius:16px}.video-placeholder{aspect-ratio:16/9;background:linear-gradient(135deg,#203d50,#0b1927);border:1px dashed #6c8796;border-radius:13px;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:10px;text-align:center;padding:18px}.video-placeholder span{font-size:38px;color:var(--accent)}.video-placeholder small{color:#99adbc}.video-input{display:flex;gap:10px}.video-input input{min-width:0}.video-input button{margin-top:7px}.xmaker-video label{margin-top:15px}.xmaker-explain h3{font-size:24px}.xmaker-explain p{color:#aebfca}.xmaker-explain .tile-photo{height:190px}.flow-heading{font-size:24px;margin:20px 0}.flow-grid{grid-template-columns:repeat(4,1fr)}.flow-step{min-width:0}.flow-image{height:115px;display:grid;place-items:center;position:relative;overflow:hidden;border-radius:10px;background:#193344;margin:0 0}.flow-image img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}.flow-step h3{font-size:17px}.article-card,.about-card{overflow:hidden;border:1px solid #294456;border-radius:16px;background:#132534}.article-card .tile-photo,.about-card .tile-photo{border:0;border-radius:0;height:176px;margin:0}.article-body,.about-card h3,.about-card p{padding-left:21px;padding-right:21px}.article-body{padding-top:18px;padding-bottom:24px}.article-body h3{font-size:19px;line-height:1.5;margin:13px 0}.article-body p,.about-card p{color:#a9bbc8;font-size:14px}.about-card h3{margin:20px 0 8px}.about-card p{padding-bottom:20px;margin:0}.compare td:first-child{width:30%}.compare td[data-edit]{cursor:text}.editing .video-placeholder{outline:2px dashed var(--accent)}@keyframes slideShow{from{opacity:.65}to{opacity:1}}@media(max-width:950px){.flow-grid{grid-template-columns:repeat(2,1fr)}}@media(max-width:650px){.carousel-shell{min-height:0}.hero-slide .hero-grid{min-height:0}.hero-slide .visual{min-height:300px}.xmaker-media{grid-template-columns:1fr}.flow-grid{grid-template-columns:repeat(2,1fr)}.video-input{flex-direction:column}.carousel-hero{padding-top:35px}.hero-slide .slide-title{font-size:37px}}@media(prefers-reduced-motion:reduce){.hero-slide{animation:none}}

/* V5: only requested refinements */
.navin{justify-content:flex-start;gap:13px}.brand-subtitle{font-size:14px;color:#c7d8e5;white-space:nowrap;border-left:1px solid #506170;padding-left:13px;margin-right:auto}.navin .links{margin-left:auto}.carousel-hero{padding:0 0 12px;background:#071320}.wide-carousel{position:relative;max-width:1920px;margin:auto}.wide-banner{width:100%;aspect-ratio:12/5;position:relative;overflow:hidden;background:#0a1a26}.wide-banner img{width:100%;height:100%;object-fit:contain;position:absolute;inset:0}.hero-cta{position:absolute;bottom:42px;left:max(24px,calc((100vw - 1200px)/2));display:flex;gap:12px;z-index:3}.hero-cta .btn{box-shadow:0 5px 17px #0009;font-size:14px;padding:11px 19px}.hero-cta .btn.outline{background:#071623d9}.carousel-controls{margin-top:14px}.square-product{height:auto;aspect-ratio:1/1;padding:20px}.square-product .photo{width:100%;height:100%;background:#152b3b}.square-product .photo img{object-fit:contain}.consult-float{max-width:none}.modal .photo img{max-height:none}
@media(max-width:950px){.navin{gap:9px}.brand-subtitle{font-size:12px}.links{gap:11px}}
@media(max-width:650px){.navin{gap:8px}.brand-subtitle{font-size:10px;white-space:normal;max-width:104px;line-height:1.35;padding-left:8px}.logo{font-size:22px}.carousel-hero{padding:0 0 14px}.wide-banner{aspect-ratio:12/5}.hero-cta{position:relative;left:auto;bottom:auto;padding:12px 14px 0;justify-content:center;gap:8px}.hero-cta .btn{font-size:12px;padding:10px 12px}.square-product{height:auto}.carousel-controls{margin-top:12px}}

/* V7: only make the two buttons printed on the second banner interactive. */
.hero-slide[data-slide="1"]{position:relative}
.hero-slide[data-slide="1"] .banner-link{position:absolute;display:block;z-index:4;top:84.2%;height:8.2%;border-radius:6px;outline-offset:3px;transition:box-shadow .16s ease}
.hero-slide[data-slide="1"] .banner-link-product{left:5.5%;width:11.9%}
.hero-slide[data-slide="1"] .banner-link-demo{left:18.5%;width:12.6%}
.hero-slide[data-slide="1"] .banner-link:hover{box-shadow:0 0 0 2px #baf161aa}
.hero-slide[data-slide="1"] .banner-link:focus-visible{outline:3px solid #baf161;background:#ffffff17}
@media(max-width:650px){.hero-slide[data-slide="1"] .banner-link{min-height:0}}

/* V8: CTA buttons on slides 1 and 3; natural 4:3 images in service cards. */
.hero-slide[data-slide="0"],.hero-slide[data-slide="2"]{position:relative}
.hero-slide[data-slide="0"] .hero-cta,.hero-slide[data-slide="2"] .hero-cta{bottom:clamp(14px,3.1vw,52px);left:clamp(18px,5.5vw,95px)}
.hero-slide[data-slide="0"] .hero-cta .btn,.hero-slide[data-slide="2"] .hero-cta .btn{background:#b5ed59;color:#0d1d20;border:1px solid #c9ff79;border-radius:7px;box-shadow:0 6px 22px #000a;transition:transform .15s ease,filter .15s ease}
.hero-slide[data-slide="0"] .hero-cta .btn.outline,.hero-slide[data-slide="2"] .hero-cta .btn.outline{background:#102937e8;color:#f4faff;border-color:#99bed0}
.hero-slide[data-slide="0"] .hero-cta .btn:hover,.hero-slide[data-slide="2"] .hero-cta .btn:hover{transform:translateY(-2px);filter:brightness(1.08)}
#about .about-grid .tile-photo{height:auto;min-height:0;aspect-ratio:4/3;overflow:hidden;background:#132534}
#about .about-grid .tile-photo img{object-fit:contain}
@media(max-width:650px){.hero-slide[data-slide="0"] .hero-cta,.hero-slide[data-slide="2"] .hero-cta{position:relative;left:auto;bottom:auto;padding:12px 14px 0;justify-content:center;gap:9px}.hero-slide[data-slide="0"] .hero-cta .btn,.hero-slide[data-slide="2"] .hero-cta .btn{font-size:12px;padding:10px 14px}}

/* 仅适配 XMakerHub 八步流程配图，其他部分不变 */
.flow-step .flow-image{width:100%;height:auto;min-height:0;aspect-ratio:16/9;background:#193344}
.flow-step .flow-image img{width:100%;height:100%;object-fit:contain;position:absolute;inset:0}

/* Footer social media horizontal QR links (scoped) */
.footercols{grid-template-columns:1.3fr repeat(3,minmax(0,1fr))}
.footer-social-row{margin-top:30px;padding-top:22px;border-top:1px solid #243747}
.footer-social-row h4{margin:0 0 13px;font-size:14px}
.footer-social-links{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.footer-social-links .social-link{display:inline-flex;align-items:center;justify-content:center;min-width:110px;margin:0;padding:10px 20px;border-radius:9px;border:1px solid #3f5c6c;background:#132735;color:#d1e3ef;font-size:14px;transition:background .2s,border-color .2s}
.footer-social-links .social-link:hover{background:#244253;border-color:#b1e65a;color:#fff}
.social-qr-modal{text-align:center;max-width:420px}.social-qr-image{width:min(260px,100%);aspect-ratio:1/1;border:1px dashed #5c8393;border-radius:14px;background:#172f3d;margin:12px auto;display:grid;place-items:center;position:relative;overflow:hidden;padding:12px;color:#aabeca;font-size:13px}
.social-qr-image[hidden]{display:none}.social-qr-image img{width:100%;height:100%;object-fit:contain;position:absolute;inset:0}.social-qr-note{margin:5px auto 0}
.editing .social-qr-image{outline:2px dashed var(--accent);cursor:pointer}
@media(max-width:650px){.footercols{grid-template-columns:repeat(2,minmax(0,1fr))}.footer-social-links{gap:9px}.footer-social-links .social-link{min-width:calc(50% - 5px);padding:10px 14px}}
/* ===== Interactions polish ===== */
html.modal-open, body.modal-open { overflow: hidden; }

/* ===== Floatbar（原版：深色圆角竖排快捷面板，容器基础样式见顶部压缩规则） ===== */
/* ===== 右侧快捷栏：玻璃卡片 + 等距投影悬停 ===== */
.floatbar {
  --fb-accent: var(--accent, #aee94a);
  --fb-blue: var(--blue, #69c7e6);
  --fb-glass: rgba(17, 31, 43, .72);
  width: auto;
  max-width: fit-content;
  padding: 0;
  gap: 0;
  display: block;
  border-radius: 16px;
  background: var(--fb-glass);
  backdrop-filter: blur(16px) saturate(140%);
  -webkit-backdrop-filter: blur(16px) saturate(140%);
  box-shadow:
    inset 0 0 18px rgba(255, 255, 255, .08),
    inset 0 0 4px rgba(105, 199, 230, .18),
    0 8px 24px rgba(0, 0, 0, .35);
  border: 1px solid rgba(105, 199, 230, .16);
  transition: background .35s ease, box-shadow .35s ease, border-color .35s ease;
}
.floatbar:hover {
  background: rgba(22, 40, 54, .78);
  border-color: rgba(174, 233, 74, .28);
  box-shadow:
    inset 0 0 20px rgba(255, 255, 255, .1),
    inset 0 0 6px rgba(174, 233, 74, .12),
    0 10px 28px rgba(0, 0, 0, .4);
}
.floatbar-list {
  margin: 0 !important;
  padding: 14px 12px !important;
  list-style: none !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 14px !important;
}
.floatbar-list > li {
  list-style: none !important;
}
.floatbar-list > li::marker {
  content: none !important;
}
.floatbar .iso-pro {
  position: relative;
  width: 56px;
  height: 56px;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: transform .35s ease;
}
.floatbar .iso-pro-hit {
  position: relative;
  z-index: 2;
  display: grid;
  place-items: center;
  width: 56px;
  height: 56px;
  padding: 0;
  margin: 0;
  border: 0;
  background: transparent;
  color: inherit;
  text-decoration: none;
  cursor: pointer;
  appearance: none;
  -webkit-tap-highlight-color: transparent;
}
.floatbar .iso-pro-icon {
  display: grid;
  place-items: center;
  width: 56px;
  height: 56px;
  border-radius: 50%;
  color: var(--fb-accent);
  background: rgba(12, 24, 34, .55);
  box-shadow:
    inset 0 0 16px rgba(255, 255, 255, .14),
    inset 0 0 4px rgba(105, 199, 230, .22),
    0 4px 10px rgba(0, 0, 0, .28);
  transition: transform .35s ease, box-shadow .35s ease, background .35s ease;
}
.floatbar-icon {
  width: 28px;
  height: 28px;
  object-fit: contain;
  display: block;
  margin: 0;
  pointer-events: none;
}
.floatbar .iso-pro-text {
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
  position: absolute !important;
  right: calc(100% + 10px) !important;
  top: 50% !important;
  left: auto !important;
  transform: translate(8px, -50%) skewX(-4deg) !important;
  z-index: 5 !important;
  width: max-content !important;
  white-space: nowrap !important;
  writing-mode: horizontal-tb !important;
  padding: 6px 10px !important;
  border-radius: 6px !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  line-height: 1.3 !important;
  letter-spacing: .02em !important;
  color: #0c1410 !important;
  background: var(--fb-accent) !important;
  box-shadow:
    0 4px 14px rgba(0, 0, 0, .28),
    inset 0 0 10px rgba(255, 255, 255, .25);
  transition: opacity .28s ease, transform .28s ease, visibility .28s ease !important;
}
.floatbar .iso-pro:hover .iso-pro-text,
.floatbar .iso-pro:focus-within .iso-pro-text {
  opacity: 1 !important;
  visibility: visible !important;
  transform: translate(0, -50%) skewX(-4deg) !important;
}
.floatbar .iso-pro > span {
  opacity: 0;
  position: absolute;
  inset: 0;
  margin: auto;
  width: 56px;
  height: 56px;
  border-radius: 50%;
  border: 1px solid rgba(105, 199, 230, .45);
  box-shadow:
    inset 0 0 14px rgba(255, 255, 255, .12),
    0 4px 10px rgba(0, 0, 0, .2);
  transition: opacity .28s ease, transform .28s ease;
  pointer-events: none;
}
.floatbar .iso-pro:hover .iso-pro-icon,
.floatbar .iso-pro:focus-within .iso-pro-icon {
  transform: translate(8px, -8px);
  background: rgba(174, 233, 74, .12);
  box-shadow:
    inset 0 0 18px rgba(255, 255, 255, .18),
    inset 0 0 6px rgba(174, 233, 74, .28),
    0 8px 16px rgba(0, 0, 0, .32);
}
.floatbar .iso-pro:hover > span,
.floatbar .iso-pro:focus-within > span {
  opacity: 1;
}
.floatbar .iso-pro:hover > span:nth-child(1),
.floatbar .iso-pro:focus-within > span:nth-child(1) {
  opacity: .22;
  border-color: rgba(105, 199, 230, .35);
}
.floatbar .iso-pro:hover > span:nth-child(2),
.floatbar .iso-pro:focus-within > span:nth-child(2) {
  opacity: .4;
  transform: translate(5px, -5px);
  border-color: rgba(174, 233, 74, .4);
}
.floatbar .iso-pro:hover > span:nth-child(3),
.floatbar .iso-pro:focus-within > span:nth-child(3) {
  opacity: .62;
  transform: translate(10px, -10px);
  border-color: rgba(174, 233, 74, .55);
}
.floatbar .floatbar-top {
  opacity: .5;
  pointer-events: none;
}
.floatbar.is-scrolled .floatbar-top {
  opacity: 1;
  pointer-events: auto;
}

.carousel-controls { position: relative; gap: 16px; flex-wrap: wrap; }
.carousel-pause {
  border: 1px solid #476474;
  background: #142b3c;
  color: #edf6ff;
  border-radius: 50%;
  width: 36px;
  height: 36px;
  font-size: 11px;
  line-height: 1;
}
.carousel-progress {
  height: 3px;
  width: min(420px, 70%);
  margin: 10px auto 0;
  background: #1a3040;
  border-radius: 99px;
  overflow: hidden;
}
.carousel-progress i {
  display: block;
  height: 100%;
  width: 0;
  background: linear-gradient(90deg, #8fd63d, var(--accent));
  border-radius: inherit;
}

.modalbg[hidden] { display: none !important; }
.modalbg.active { display: flex; }
.contact-qr-box {
  width: 100%;
  height: auto;
  border: 0;
  background: #fff;
  overflow: hidden;
  border-radius: 12px;
}
.contact-qr-box img {
  width: 100%;
  height: auto;
  position: static !important;
  object-fit: contain;
}
.modal-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 16px;
}
.modal-actions .btn { flex: 1 1 160px; }
.social-qr-lead { color: #a9bec9; font-size: 13px; margin: 0 0 4px; }
.social-qr-image.is-empty img { display: none; }
.social-qr-empty {
  position: relative;
  z-index: 1;
  padding: 12px;
  text-align: center;
  color: #aabeca;
  line-height: 1.5;
}
.social-qr-empty small { color: #7f96a5; font-size: 11px; }
.social-qr-image:not(.is-empty) .social-qr-empty { display: none; }

#leadForm label { margin-bottom: 14px; }
#leadForm input.is-invalid,
#leadForm textarea.is-invalid {
  border-color: #e07a7a !important;
  box-shadow: 0 0 0 1px #e07a7a55;
}
.field-tip {
  display: block;
  margin-top: 6px;
  font-size: 12px;
  color: #f0a8a8;
  line-height: 1.4;
}
.field-tip[hidden] { display: none !important; }
.consent-row {
  display: flex !important;
  align-items: flex-start;
  gap: 9px;
}
.consent-row input[type="checkbox"] {
  width: auto !important;
  margin: 4px 0 0 !important;
}
.formnote {
  min-height: 1.4em;
  margin-top: 12px;
  font-size: 13px;
}
.formnote.is-ok { color: #b7e57a; }
.formnote.is-error { color: #f0a8a8; }
.formnote.is-info { color: #9eb1bd; }
#leadSubmit:disabled { opacity: .7; cursor: wait; }

.floatbar .iso-pro-hit::before,
.floatbar .iso-pro-hit::after {
  content: none !important;
  display: none !important;
}

@media (max-width: 650px) {
  .floatbar {
    display: flex;
    width: auto;
    max-width: none;
    border-radius: 0;
    padding: 6px 4px calc(6px + env(safe-area-inset-bottom, 0px));
    background: rgba(8, 15, 23, .94);
  }
  .floatbar-list {
    flex-direction: row;
    justify-content: space-around;
    gap: 0;
    padding: 0;
    width: 100%;
  }
  .floatbar .iso-pro {
    flex: 1;
    height: auto;
    min-height: 52px;
  }
  .floatbar .iso-pro-hit,
  .floatbar .iso-pro-icon {
    width: 100%;
    height: auto;
    min-height: 44px;
    border-radius: 8px;
    background: transparent;
    box-shadow: none;
  }
  .floatbar .iso-pro-icon { padding: 4px 0; }
  .floatbar-icon { width: 24px; height: 24px; }
  .floatbar .iso-pro > span,
  .floatbar .iso-pro-text { display: none !important; }
  .floatbar .iso-pro:hover .iso-pro-icon,
  .floatbar .iso-pro:focus-within .iso-pro-icon {
    transform: none;
    background: rgba(174, 233, 74, .1);
  }
  .floatbar .floatbar-top { opacity: 1 !important; pointer-events: auto !important; }
  .floatbar .iso-pro-hit {
    display: flex;
    flex-direction: column;
    gap: 2px;
    font-size: 10px;
    color: #e2f0f6;
  }
  .floatbar .iso-pro-hit::after {
    content: attr(aria-label) !important;
    display: block !important;
    font-size: 10px;
    font-weight: 600;
    line-height: 1.2;
    color: #c5d7e2;
  }
  .carousel-progress { width: 80%; }
}

/* ===== SEO intro block ===== */
.seo-intro{
  padding:28px 0 8px;
  border-bottom:1px solid var(--line);
  background:linear-gradient(180deg,#0b1622,#09121b);
}
.seo-intro h1{
  font-size:clamp(26px,3vw,38px);
  line-height:1.25;
  letter-spacing:-.5px;
  margin:0 0 10px;
}
.seo-intro-lead{
  margin:0;
  max-width:820px;
  color:#b7c7d3;
  font-size:15px;
}
.seo-intro-lead strong{color:#eef5fa;font-weight:750}
.sr-only{
  position:absolute!important;
  width:1px;height:1px;
  padding:0;margin:-1px;
  overflow:hidden;clip:rect(0,0,0,0);
  white-space:nowrap;border:0;
}

/* ===== SEO intro ===== */
.seo-intro{
  padding:34px 0 10px;
  border-bottom:1px solid var(--line);
  background:linear-gradient(180deg,#0b1520,#09121b);
}
.seo-intro h1{
  font-size:clamp(26px,3vw,38px);
  line-height:1.25;
  letter-spacing:-.6px;
  margin:0 0 12px;
}
.seo-intro-lead{
  margin:0;
  max-width:820px;
  color:#b7c7d2;
  font-size:16px;
}
.seo-intro-lead strong{color:var(--accent);font-weight:800}
.sr-only{
  position:absolute!important;
  width:1px;height:1px;
  padding:0;margin:-1px;
  overflow:hidden;clip:rect(0,0,0,0);
  white-space:nowrap;border:0;
}


/* ===== Contact 区：像素抖动(dither)表单 · 固定米白/墨黑 · 疏朗点阵 · 两列布局 =====
   - 颜色固定不再循环：#f2ead9 米白 / #141008 墨黑；
   - 点阵全面疏化：基础间距 4px/2px → 8px/6px，点用半透明，观感更干净；
   - 表单字段一行两列（称呼+联系方式 / 产品+咨询类型），描述与勾选占整行。 */
#contact .wrap { max-width: 980px; }
#contact .contact {
  grid-template-columns: 1fr;
  gap: 30px;
}
#contact .contact > div:first-child { text-align: center; }
#contact .contact > div:first-child h2 { font-size: clamp(28px, 3.4vw, 40px); }
#contact .contact > div:first-child p:first-of-type { color: var(--muted); max-width: 620px; margin-left: auto; margin-right: auto; }
#contact .contact > div:first-child .eyebrow { text-align: center; }
.contact-form-wrap {
  --light: #f2ead9;
  --dark: #141008;
  /* 点：1px 半透明，间距疏化（4px/2px → 8px/6px） */
  --gl: radial-gradient(circle 1px at 0px 0px, rgba(20, 16, 8, .55) 1px, transparent 0);
  --gd: radial-gradient(circle 1px at 0px 0px, rgba(242, 234, 217, .6) 1px, transparent 0);
  --bg-0: var(--light);
  --bg-1: var(--gl) 0px 0px / 8px 8px, var(--light);
  --bg-2: var(--gl) 0px 0px / 8px 8px, var(--gl) 4px 4px / 8px 8px, var(--light);
  --bg-3: var(--gl) 0px 0px / 6px 6px, var(--light);
  --bg-4: var(--gl) 0px 0px / 6px 6px, var(--gl) 3px 3px / 6px 6px, var(--light);
  --bg-5: var(--gd) 0px 0px / 6px 6px, var(--dark);
  --bg-6: var(--gd) 0px 0px / 8px 8px, var(--gd) 4px 4px / 8px 8px, var(--dark);
  --bg-7: var(--gd) 0px 0px / 8px 8px, var(--dark);
  --bg-8: var(--dark);
  --l-shadow:
    -1px -1px 0 var(--light), 0 -1px 0 var(--light), 1px -1px 0 var(--light),
    1px 0 0 var(--light), 1px 1px 0 var(--light), 0 1px 0 var(--light),
    -1px 1px 0 var(--light), -1px 0 0 var(--light);
  --d-shadow:
    -1px -1px 0 var(--dark), 0 -1px 0 var(--dark), 1px -1px 0 var(--dark),
    1px 0 0 var(--dark), 1px 1px 0 var(--dark), 0 1px 0 var(--dark),
    -1px 1px 0 var(--dark), -1px 0 0 var(--dark);
  --drop-shadow:
    drop-shadow(-1px -1px 0 var(--dark)) drop-shadow(0 -1px 0 var(--dark))
    drop-shadow(1px -1px 0 var(--dark)) drop-shadow(1px 0 0 var(--dark))
    drop-shadow(1px 1px 0 var(--dark)) drop-shadow(0 1px 0 var(--dark))
    drop-shadow(-1px 1px 0 var(--dark)) drop-shadow(-1px 0 0 var(--dark));
  display: flex;
  flex-direction: column;
  gap: 22px;
  min-width: 0;
}
/* 9 阶色度圆 */
.contact-form-wrap .shades {
  display: inline-flex;
  gap: 10px;
  align-self: center;
}
.contact-form-wrap .shade {
  height: 44px;
  width: 44px;
  border-radius: 50%;
  border: 3px solid var(--dark);
  flex: none;
}
.contact-form-wrap .shade:nth-child(1) { background: var(--bg-0); }
.contact-form-wrap .shade:nth-child(2) { background: var(--bg-1); }
.contact-form-wrap .shade:nth-child(3) { background: var(--bg-2); }
.contact-form-wrap .shade:nth-child(4) { background: var(--bg-3); }
.contact-form-wrap .shade:nth-child(5) { background: var(--bg-4); }
.contact-form-wrap .shade:nth-child(6) { background: var(--bg-5); }
.contact-form-wrap .shade:nth-child(7) { background: var(--bg-6); }
.contact-form-wrap .shade:nth-child(8) { background: var(--bg-7); }
.contact-form-wrap .shade:nth-child(9) { background: var(--bg-8); }
/* 表单卡片 */
#leadForm {
  background: var(--gl) 0px 0px / 10px 10px, var(--light); /* 更稀疏的单层 10px 点阵 */
  padding: 26px;
  border-radius: 22px;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
  border: 3px var(--dark) solid;
  color: var(--dark);
  font-family: "SFMono-Regular", Menlo, Consolas, "PingFang SC", monospace;
  width: min(680px, 100%);
  align-self: center;
  box-shadow: 0 24px 60px #000a;
}
#leadForm label {
  background: var(--bg-1);
  display: flex;
  flex-direction: column;
  gap: 7px;
  padding: 12px;
  border-radius: 12px;
  text-shadow: var(--l-shadow);
  border: 1px var(--dark) solid;
  color: var(--dark);
  margin-bottom: 0;
  font-weight: 700;
  min-width: 0;
}
/* 整行字段：描述、勾选、提示、按钮、状态 */
#leadForm label:nth-of-type(4),
#leadForm .consent-row,
#leadForm > .field-tip,
#leadForm #leadSubmit,
#leadForm .formnote { grid-column: 1 / -1; }
#leadForm input,
#leadForm select,
#leadForm textarea {
  background: var(--bg-0);
  border: 1px var(--dark) solid;
  outline: 0;
  border-radius: 12px;
  padding: 12px;
  text-shadow: var(--l-shadow);
  color: var(--dark);
  margin-top: 0;
  font-weight: 400;
  width: 100%;
  min-width: 0;
}
#leadForm textarea { resize: vertical; min-height: 100px; }
#leadForm input::placeholder,
#leadForm textarea::placeholder { color: color-mix(in srgb, var(--dark) 45%, var(--light)); }
#leadForm input:focus-visible,
#leadForm select:focus-visible,
#leadForm textarea:focus-visible {
  outline: 2px solid var(--dark);
  outline-offset: 1px;
}
#leadForm .consent-row {
  flex-direction: row;
  align-items: flex-start;
}
#leadForm .consent-row input[type="checkbox"] {
  width: 18px;
  height: 18px;
  min-width: 18px;
  margin: 2px 8px 0 0;
  accent-color: var(--dark);
  box-shadow: var(--drop-shadow);
}
#leadForm .consent-row span {
  font-weight: 400;
  text-shadow: none;
  font-size: 12px;
  line-height: 1.6;
}
#leadForm .consent-row a {
  color: #2f6b14;
  text-decoration: underline;
  text-underline-offset: 2px;
  font-weight: 700;
}
#leadForm .consent-row a:hover,
#leadForm .consent-row a:focus-visible {
  color: var(--dark);
}
/* 提交按钮 */
#leadForm #leadSubmit {
  background: var(--bg-0);
  border: 1px var(--dark) solid;
  outline: 0;
  border-radius: 12px;
  padding: 13px;
  font-weight: bold;
  font-family: inherit;
  text-shadow: var(--l-shadow);
  cursor: pointer;
  color: var(--dark);
  animation: dith-dark-to-light 400ms ease-out forwards;
  transition: 200ms ease-out;
}
#leadForm #leadSubmit:hover {
  animation: dith-light-to-dark 200ms linear forwards;
  color: var(--light);
  text-shadow: var(--d-shadow);
}
#leadForm .field-tip { color: #7c2418; text-shadow: var(--l-shadow); }
#leadForm .formnote { text-shadow: var(--l-shadow); font-weight: 700; }
#leadForm .formnote.is-ok { color: #2e5e1e; }
#leadForm .formnote.is-error { color: #7c2418; }
#leadForm .formnote.is-info { color: var(--dark); }
/* 旋转 3D 像素立方体 */
.contact-form-wrap .cube-wrapper {
  --size: 68px;
  margin: 4px auto 0;
  perspective: 200px;
  perspective-origin: 50% 0%;
  filter: var(--drop-shadow);
  width: var(--size);
}
.contact-form-wrap .cube {
  height: var(--size);
  width: var(--size);
  position: relative;
  transform-style: preserve-3d;
  transform-origin: 50% 50% calc(var(--size) * .5);
  animation: dith-rotate 10s linear infinite;
}
.contact-form-wrap .face {
  position: absolute;
  height: var(--size);
  width: var(--size);
  transform-style: preserve-3d;
  transform-origin: 50% 50% calc(var(--size) * .5);
}
.contact-form-wrap .face:nth-child(1) { transform: rotateY(90deg); background: var(--bg-2); }
.contact-form-wrap .face:nth-child(2) { transform: rotateY(180deg); background: var(--bg-3); }
.contact-form-wrap .face:nth-child(3) { transform: rotateY(-90deg); background: var(--bg-4); }
.contact-form-wrap .face:nth-child(4) { transform: rotateX(90deg); background: var(--bg-5); }
.contact-form-wrap .face:nth-child(5) { transform: rotateX(-90deg); background: var(--bg-6); }
.contact-form-wrap .face:nth-child(6) { background: var(--bg-7); }
@keyframes dith-light-to-dark {
  0% { background: var(--bg-0); } 12.5% { background: var(--bg-1); }
  25% { background: var(--bg-2); } 37.5% { background: var(--bg-3); }
  50% { background: var(--bg-4); } 62.5% { background: var(--bg-5); }
  75% { background: var(--bg-6); } 87.5% { background: var(--bg-7); }
  100% { background: var(--bg-8); }
}
@keyframes dith-dark-to-light {
  0% { background: var(--bg-8); } 12.5% { background: var(--bg-7); }
  25% { background: var(--bg-6); } 37.5% { background: var(--bg-5); }
  50% { background: var(--bg-4); } 62.5% { background: var(--bg-3); }
  75% { background: var(--bg-2); } 87.5% { background: var(--bg-1); }
  100% { background: var(--bg-0); }
}
@keyframes dith-rotate {
  from { transform: rotateY(0) rotateX(1turn) rotateZ(0) }
  to { transform: rotateY(1turn) rotateX(0) rotateZ(1turn) }
}
@media (max-width: 650px) {
  .contact-form-wrap .shade { height: 32px; width: 32px; border-width: 2px; }
  .contact-form-wrap .shades { gap: 7px; }
  #leadForm { grid-template-columns: 1fr; padding: 16px; border-radius: 16px; }
  .contact-form-wrap .cube-wrapper { --size: 52px; }
}