```json
{
"summary": "重新设计了专注于3D打印作品定制售卖的科技官网。保留绿色+蓝色+黑色赛博暗调配色,但彻底重构内容结构:1) Hero区突出'定制你的专属作品'售卖主题;2) 热卖作品展示区(含价格、材料、工艺标注);3) 售卖地点——LAB实验室沉浸式展示;4) 四步定制流程(需求沟通→建模设计→打印成型→交付质检);5) 打印机机型展示墙(Formlabs/Stratasys/拓竹/闪铸等);6) 耗材类型矩阵(光敏树脂/尼龙/碳纤维/TPU等);7) 三档价格方案(基础/进阶/尊享);8) CTA预约打印。使用illustration/17.png作为实验室视觉、abstract-9.jpg作为背景装饰,大量发光边框、玻璃拟态、滚动动画营造沉浸式购物体验。",
"widget": {
"type": "full-html",
"html": "<!DOCTYPE html>\n<html lang=\"zh-CN\">\n<head>\n <meta charset=\"UTF-8\">\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n <title>PRINTLAB · 3D打印定制工坊</title>\n <script src=\"https://cdn.tailwindcss.com\">\n </script>\n <link href=\"https://fonts.googleapis.com/css2?family=Orbitron:wght@400;500;600;700;…\" rel=\"stylesheet\">\n <link rel=\"stylesheet\" href=\"https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.1/css/all.min.c…\">\n <style>\n :root {\n --bg-primary: #06080a;\n --bg-secondary: #0b1016;\n --bg-card: #0f1923;\n --green: #00ff88;\n --green-dark: #00cc6a;\n --green-glow: rgba(0, 255, 136, 0.2);\n --blue: #0088ff;\n --blue-light: #00d4ff;\n --blue-glow: rgba(0, 136, 255, 0.2);\n --cyan: #00e5ff;\n --text: #e8eaed;\n --text-muted: #7a8a9a;\n --border: rgba(0, 255, 136, 0.10);\n --border-blue: rgba(0, 136, 255, 0.12);\n --card-bg: rgba(15, 25, 35, 0.6);\n }\n\n * {\n margin: 0;\n padding: 0;\n box-sizing: border-box;\n }\n\n html {\n scroll-behavior: smooth;\n }\n\n body {\n font-family: 'Space Grotesk', sans-serif;\n background: var(--bg-primary);\n color: var(--text);\n overflow-x: hidden;\n }\n\n h1,\n h2,\n h3,\n h4,\n h5,\n h6 {\n font-family: 'Orbitron', sans-serif;\n }\n\n /* 扫描线 */\n .scanlines {\n position: fixed;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n pointer-events: none;\n z-index: 9998;\n background: repeating-linear-gradient(0deg,\n transparent,\n transparent 2px,\n rgba(0, 255, 136, 0.012) 2px,\n rgba(0, 255, 136, 0.012) 4px);\n }\n\n .noise-overlay {\n position: fixed;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n pointer-events: none;\n z-index: 9997;\n opacity: 0.03;\n background-image: url(\"data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noise)' opacity='1'/%3E%3C/svg%3E\");\n background-repeat: repeat;\n background-size: 256px 256px;\n }\n\n /* Nav */\n .navbar {\n position: fixed;\n top: 0;\n left: 0;\n right: 0;\n z-index: 9999;\n padding: 0.9rem 0;\n transition: all 0.4s cubic-bezier(0.16, 1, 0.3, 1);\n background: transparent;\n }\n\n .navbar.scrolled {\n background: rgba(6, 8, 10, 0.85);\n backdrop-filter: blur(20px) saturate(1.2);\n -webkit-backdrop-filter: blur(20px) saturate(1.2);\n border-bottom: 1px solid var(--border);\n padding: 0.5rem 0;\n }\n\n .nav-link {\n position: relative;\n font-size: 0.82rem;\n font-weight: 500;\n letter-spacing: 0.04em;\n color: var(--text-muted);\n transition: color 0.3s ease;\n cursor: pointer;\n font-family: 'Space Grotesk', sans-serif;\n }\n\n .nav-link::after {\n content: '';\n position: absolute;\n bottom: -4px;\n left: 0;\n width: 0;\n height: 2px;\n background: linear-gradient(90deg, var(--green), var(--blue));\n transition: width 0.3s cubic-bezier(0.16, 1, 0.3, 1);\n border-radius: 2px;\n box-shadow: 0 0 10px var(--green-glow);\n }\n\n .nav-link:hover {\n color: var(--text);\n }\n .nav-link:hover::after {\n width: 100%;\n }\n\n .logo {\n font-family: 'Orbitron', sans-serif;\n font-weight: 800;\n font-size: 1.2rem;\n letter-spacing: 0.04em;\n color: var(--text);\n display: flex;\n align-items: center;\n gap: 0.5rem;\n }\n\n .logo-icon {\n width: 30px;\n height: 30px;\n display: flex;\n align-items: center;\n justify-content: center;\n border: 2px solid var(--green);\n border-radius: 6px;\n color: var(--green);\n font-size: 0.85rem;\n box-shadow: 0 0 14px var(--green-glow);\n }\n\n /* ===== HERO ===== */\n #hero {\n position: relative;\n min-height: 100vh;\n display: flex;\n align-items: center;\n overflow: hidden;\n background: var(--bg-primary);\n }\n\n .hero-grid {\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n background-image:\n linear-gradient(rgba(0, 255, 136, 0.025) 1px, transparent 1px),\n linear-gradient(90deg, rgba(0, 136, 255, 0.025) 1px, transparent 1px);\n background-size: 50px 50px;\n animation: gridPulse 8s ease-in-out infinite;\n }\n\n @keyframes gridPulse {\n 0%,\n 100% {\n opacity: 0.5;\n }\n 50% {\n opacity: 1;\n }\n }\n\n .hero-glow {\n position: absolute;\n top: -10%;\n left: -5%;\n width: 70%;\n height: 80%;\n background: radial-gradient(ellipse at center, rgba(0, 255, 136, 0.08) 0%, transparent 65%);\n pointer-events: none;\n animation: glowDrift 14s ease-in-out infinite alternate;\n }\n\n .hero-glow-2 {\n position: absolute;\n bottom: -10%;\n right: -5%;\n width: 60%;\n height: 70%;\n background: radial-gradient(ellipse at center, rgba(0, 136, 255, 0.07) 0%, transparent 65%);\n pointer-events: none;\n animation: glowDrift 14s ease-in-out infinite alternate-reverse;\n }\n\n @keyframes glowDrift {\n 0% {\n transform: translate(0, 0) scale(1);\n }\n 100% {\n transform: translate(4%, 4%) scale(1.08);\n }\n }\n\n .hero-shape {\n position: absolute;\n border-radius: 50%;\n pointer-events: none;\n opacity: 0.12;\n }\n\n .hero-shape-1 {\n top: 20%;\n right: 6%;\n width: 260px;\n height: 260px;\n border: 1px solid var(--green);\n animation: rotateShape 35s linear infinite;\n box-shadow: 0 0 50px var(--green-glow), inset 0 0 50px var(--green-glow);\n }\n\n .hero-shape-2 {\n bottom: 12%;\n left: 4%;\n width: 180px;\n height: 180px;\n border: 1px solid var(--blue);\n animation: rotateShape 28s linear infinite reverse;\n box-shadow: 0 0 30px var(--blue-glow), inset 0 0 30px var(--blue-glow);\n }\n\n .hero-shape-3 {\n top: 50%;\n right: 30%;\n width: 100px;\n height: 100px;\n border: 1px solid var(--cyan);\n animation: rotateShape 22s linear infinite;\n box-shadow: 0 0 20px rgba(0, 229, 255, 0.12);\n }\n\n @keyframes rotateShape {\n 0% {\n transform: rotate(0deg) scale(1);\n }\n 50% {\n transform: rotate(180deg) scale(1.04);\n }\n 100% {\n transform: rotate(360deg) scale(1);\n }\n }\n\n /* 粒子 */\n .particle {\n position: absolute;\n width: 3px;\n height: 3px;\n background: var(--green);\n border-radius: 50%;\n box-shadow: 0 0 8px var(--green-glow);\n animation: floatParticle 9s ease-in-out infinite;\n opacity: 0;\n }\n\n .particle:nth-child(1) {\n top: 25%;\n left: 12%;\n animation-delay: 0s;\n }\n .particle:nth-child(2) {\n top: 55%;\n left: 82%;\n animation-delay: 1.8s;\n background: var(--blue);\n box-shadow: 0 0 8px var(--blue-glow);\n }\n .particle:nth-child(3) {\n top: 35%;\n left: 52%;\n animation-delay: 3.5s;\n background: var(--cyan);\n width: 4px;\n height: 4px;\n }\n .particle:nth-child(4) {\n top: 70%;\n left: 22%;\n animation-delay: 5s;\n }\n .particle:nth-child(5) {\n top: 15%;\n left: 72%;\n animation-delay: 2.2s;\n background: var(--blue);\n }\n .particle:nth-child(6) {\n top: 80%;\n left: 62%;\n animation-delay: 6s;\n background: var(--cyan);\n }\n\n @keyframes floatParticle {\n 0% {\n transform: translateY(0) scale(0);\n opacity: 0;\n }\n 20% {\n opacity: 1;\n transform: translateY(-25px) scale(1);\n }\n 80% {\n opacity: 1;\n transform: translateY(-70px) scale(0.7);\n }\n 100% {\n transform: translateY(-110px) scale(0);\n opacity: 0;\n }\n }\n\n .hero-title {\n font-size: clamp(2.2rem, 7vw, 4.8rem);\n font-weight: 900;\n line-height: 1.05;\n letter-spacing: -0.02em;\n background: linear-gradient(135deg, #e8eaed 0%, var(--green) 35%, var(--blue-light) 65%, #e8eaed 100%);\n -webkit-background-clip: text;\n -webkit-text-fill-color: transparent;\n background-clip: text;\n animation: titleShimmer 7s ease-in-out infinite;\n background-size: 200% 200%;\n }\n\n @keyframes titleShimmer {\n 0%,\n 100% {\n background-position: 0% 50%;\n }\n 50% {\n background-position: 100% 50%;\n }\n }\n\n .hero-badge {\n display: inline-flex;\n align-items: center;\n gap: 0.5rem;\n padding: 0.35rem 1rem;\n font-size: 0.7rem;\n font-family: 'Orbitron', sans-serif;\n font-weight: 600;\n letter-spacing: 0.12em;\n text-transform: uppercase;\n color: var(--green);\n border: 1px solid rgba(0, 255, 136, 0.2);\n border-radius: 100px;\n background: rgba(0, 255, 136, 0.04);\n }\n\n /* ===== Buttons ===== */\n .btn-primary {\n position: relative;\n display: inline-flex;\n align-items: center;\n gap: 0.7rem;\n padding: 0.85rem 2.2rem;\n font-family: 'Orbitron', sans-serif;\n font-weight: 600;\n font-size: 0.8rem;\n letter-spacing: 0.06em;\n text-transform: uppercase;\n color: #06080a;\n background: linear-gradient(135deg, var(--green), var(--green-dark));\n border: none;\n border-radius: 4px;\n cursor: pointer;\n transition: all 0.4s cubic-bezier(0.16, 1, 0.3, 1);\n overflow: hidden;\n z-index: 1;\n }\n\n .btn-primary::before {\n content: '';\n position: absolute;\n top: 0;\n left: -100%;\n width: 100%;\n height: 100%;\n background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.18), transparent);\n transition: left 0.6s cubic-bezier(0.16, 1, 0.3, 1);\n z-index: -1;\n }\n\n .btn-primary:hover::before {\n left: 100%;\n }\n\n .btn-primary:hover {\n transform: translateY(-2px) scale(1.02);\n box-shadow: 0 8px 36px var(--green-glow);\n }\n\n .btn-secondary {\n display: inline-flex;\n align-items: center;\n gap: 0.7rem;\n padding: 0.85rem 2.2rem;\n font-family: 'Orbitron', sans-serif;\n font-weight: 500;\n font-size: 0.8rem;\n letter-spacing: 0.06em;\n text-transform: uppercase;\n color: var(--text);\n background: transparent;\n border: 1px solid var(--border);\n border-radius: 4px;\n cursor: pointer;\n transition: all 0.4s cubic-bezier(0.16, 1, 0.3, 1);\n }\n\n .btn-secondary:hover {\n border-color: var(--green);\n box-shadow: 0 0 24px var(--green-glow), inset 0 0 24px rgba(0, 255, 136, 0.04);\n transform: translateY(-2px);\n }\n\n /* ===== Section ===== */\n .section-label {\n font-family: 'Orbitron', sans-serif;\n font-size: 0.65rem;\n font-weight: 600;\n letter-spacing: 0.28em;\n text-transform: uppercase;\n color: var(--green);\n margin-bottom: 0.8rem;\n display: inline-block;\n position: relative;\n padding-left: 2.2rem;\n }\n\n .section-label::before {\n content: '';\n position: absolute;\n left: 0;\n top: 50%;\n transform: translateY(-50%);\n width: 1.5rem;\n height: 1px;\n background: var(--green);\n box-shadow: 0 0 8px var(--green-glow);\n }\n\n .section-title {\n font-size: clamp(1.6rem, 3.5vw, 2.8rem);\n font-weight: 700;\n line-height: 1.12;\n letter-spacing: -0.01em;\n color: var(--text);\n }\n\n .section-title .hl {\n background: linear-gradient(135deg, var(--green), var(--blue-light));\n -webkit-background-clip: text;\n -webkit-text-fill-color: transparent;\n background-clip: text;\n }\n\n .section-desc {\n color: var(--text-muted);\n font-size: 1rem;\n line-height: 1.7;\n }\n\n /* ===== Product Card ===== */\n .product-card {\n position: relative;\n background: var(--card-bg);\n border: 1px solid var(--border);\n border-radius: 12px;\n overflow: hidden;\n transition: all 0.5s cubic-bezier(0.16, 1, 0.3, 1);\n cursor: pointer;\n backdrop-filter: blur(4px);\n }\n\n .product-card:hover {\n transform: translateY(-8px);\n border-color: rgba(0, 255, 136, 0.2);\n box-shadow: 0 20px 60px rgba(0, 0, 0, 0.5), 0 0 40px rgba(0, 255, 136, 0.05);\n }\n\n .product-card .visual {\n aspect-ratio: 4/3;\n display: flex;\n align-items: center;\n justify-content: center;\n position: relative;\n overflow: hidden;\n background: linear-gradient(135deg, rgba(0, 255, 136, 0.03), rgba(0, 136, 255, 0.03));\n }\n\n .product-card .visual .shape {\n width: 55%;\n height: 55%;\n border-radius: 12px;\n opacity: 0.5;\n transition: all 0.6s ease;\n }\n\n .product-card:hover .visual .shape {\n opacity: 0.85;\n transform: scale(1.06) rotate(2deg);\n }\n\n .product-card .badge-top {\n position: absolute;\n top: 0.8rem;\n left: 0.8rem;\n padding: 0.2rem 0.7rem;\n font-size: 0.55rem;\n font-family: 'Orbitron', sans-serif;\n font-weight: 600;\n letter-spacing: 0.08em;\n text-transform: uppercase;\n color: #06080a;\n background: var(--green);\n border-radius: 4px;\n z-index: 2;\n }\n\n .product-card .badge-hot {\n position: absolute;\n top: 0.8rem;\n right: 0.8rem;\n padding: 0.2rem 0.6rem;\n font-size: 0.5rem;\n font-family: 'Orbitron', sans-serif;\n font-weight: 700;\n letter-spacing: 0.08em;\n color: #fff;\n background: rgba(255, 70, 70, 0.85);\n border-radius: 4px;\n z-index: 2;\n box-shadow: 0 0 16px rgba(255, 70, 70, 0.3);\n }\n\n .product-card .info {\n padding: 1.2rem 1.2rem 1.5rem;\n }\n\n .product-card .info .name {\n font-size: 1rem;\n font-weight: 600;\n letter-spacing: 0.02em;\n margin-bottom: 0.3rem;\n }\n\n .product-card .info .meta {\n display: flex;\n flex-wrap: wrap;\n gap: 0.4rem 0.8rem;\n font-size: 0.72rem;\n color: var(--text-muted);\n margin-bottom: 0.6rem;\n }\n\n .product-card .info .meta span {\n display: flex;\n align-items: center;\n gap: 0.3rem;\n }\n\n .product-card .info .meta i {\n font-size: 0.55rem;\n color: var(--green);\n }\n\n .product-card .info .price-row {\n display: flex;\n align-items: center;\n justify-content: space-between;\n padding-top: 0.7rem;\n border-top: 1px solid var(--border);\n }\n\n .product-card .info .price {\n font-family: 'Orbitron', sans-serif;\n font-size: 1.2rem;\n font-weight: 700;\n background: linear-gradient(135deg, var(--green), var(--blue-light));\n -webkit-background-clip: text;\n -webkit-text-fill-color: transparent;\n background-clip: text;\n }\n\n .product-card .info .price small {\n font-size: 0.6rem;\n font-weight: 400;\n -webkit-text-fill-color: var(--text-muted);\n color: var(--text-muted);\n }\n\n .product-card .info .btn-buy {\n padding: 0.4rem 1rem;\n font-size: 0.65rem;\n font-family: 'Orbitron', sans-serif;\n font-weight: 600;\n letter-spacing: 0.05em;\n color: var(--green);\n background: rgba(0, 255, 136, 0.06);\n border: 1px solid rgba(0, 255, 136, 0.15);\n border-radius: 4px;\n cursor: pointer;\n transition: all 0.3s ease;\n }\n\n .product-card .info .btn-buy:hover {\n background: rgba(0, 255, 136, 0.12);\n border-color: var(--green);\n box-shadow: 0 0 16px var(--green-glow);\n }\n\n /* ===== Lab Section ===== */\n .lab-banner {\n position: relative;\n border-radius: 16px;\n overflow: hidden;\n border: 1px solid var(--border);\n background: var(--bg-card);\n }\n\n .lab-banner .lab-bg {\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n background-image: url('/assets/images/illustration/17.png');\n background-size: cover;\n background-position: center;\n opacity: 0.08;\n pointer-events: none;\n }\n\n .lab-banner .glow-edge {\n position: absolute;\n top: -1px;\n left: -1px;\n right: -1px;\n bottom: -1px;\n border-radius: 17px;\n background: linear-gradient(135deg, var(--green), transparent, var(--blue), transparent);\n opacity: 0.15;\n pointer-events: none;\n animation: ctaBorderGlow 5s ease-in-out infinite;\n }\n\n @keyframes ctaBorderGlow {\n 0%,\n 100% {\n opacity: 0.1;\n }\n 50% {\n opacity: 0.3;\n }\n }\n\n .lab-stat {\n text-align: center;\n padding: 1.2rem;\n border: 1px solid var(--border);\n border-radius: 10px;\n background: rgba(15, 25, 35, 0.5);\n backdrop-filter: blur(4px);\n transition: all 0.4s ease;\n }\n\n .lab-stat:hover {\n border-color: rgba(0, 255, 136, 0.15);\n box-shadow: 0 0 20px rgba(0, 255, 136, 0.03);\n }\n\n .lab-stat .num {\n font-family: 'Orbitron', sans-serif;\n font-size: 1.8rem;\n font-weight: 800;\n background: linear-gradient(135deg, var(--green), var(--blue-light));\n -webkit-background-clip: text;\n -webkit-text-fill-color: transparent;\n background-clip: text;\n line-height: 1.2;\n }\n\n .lab-stat .lbl {\n font-size: 0.7rem;\n color: var(--text-muted);\n margin-top: 0.2rem;\n letter-spacing: 0.04em;\n }\n\n /* ===== Workflow ===== */\n .wf-step {\n display: flex;\n gap: 1.5rem;\n position: relative;\n padding-bottom: 2.5rem;\n }\n\n .wf-step:not(:last-child)::before {\n content: '';\n position: absolute;\n left: 21px;\n top: 46px;\n bottom: 0;\n width: 1px;\n background: linear-gradient(to bottom, var(--green), var(--blue), transparent);\n }\n\n .wf-step:last-child {\n padding-bottom: 0;\n }\n\n .wf-num {\n flex-shrink: 0;\n width: 44px;\n height: 44px;\n border-radius: 50%;\n display: flex;\n align-items: center;\n justify-content: center;\n font-family: 'Orbitron', sans-serif;\n font-weight: 700;\n font-size: 1rem;\n background: var(--bg-card);\n border: 1px solid var(--border);\n color: var(--green);\n transition: all 0.4s ease;\n }\n\n .wf-step:hover .wf-num {\n border-color: var(--green);\n box-shadow: 0 0 20px var(--green-glow);\n background: rgba(0, 255, 136, 0.04);\n }\n\n .wf-content h4 {\n font-size: 1.05rem;\n font-weight: 600;\n margin-bottom: 0.3rem;\n }\n\n .wf-content p {\n color: var(--text-muted);\n font-size: 0.85rem;\n line-height: 1.7;\n }\n\n /* ===== Printer Card ===== */\n .printer-card {\n background: var(--card-bg);\n border: 1px solid var(--border);\n border-radius: 10px;\n padding: 1.5rem;\n text-align: center;\n transition: all 0.4s cubic-bezier(0.16, 1, 0.3, 1);\n cursor: default;\n }\n\n .printer-card:hover {\n border-color: rgba(0, 255, 136, 0.2);\n transform: translateY(-4px);\n box-shadow: 0 12px 40px rgba(0, 0, 0, 0.4), 0 0 24px rgba(0, 255, 136, 0.04);\n }\n\n .printer-card .icon-box {\n width: 56px;\n height: 56px;\n margin: 0 auto 1rem;\n display: flex;\n align-items: center;\n justify-content: center;\n border-radius: 12px;\n font-size: 1.5rem;\n background: rgba(0, 255, 136, 0.06);\n border: 1px solid rgba(0, 255, 136, 0.1);\n color: var(--green);\n transition: all 0.4s ease;\n }\n\n .printer-card:hover .icon-box {\n background: rgba(0, 255, 136, 0.1);\n border-color: var(--green);\n box-shadow: 0 0 20px var(--green-glow);\n transform: scale(1.08);\n }\n\n .printer-card h4 {\n font-size: 0.95rem;\n font-weight: 600;\n margin-bottom: 0.2rem;\n }\n\n .printer-card .brand {\n font-size: 0.7rem;\n color: var(--text-muted);\n font-family: 'Space Grotesk', sans-serif;\n }\n\n .printer-card .specs {\n margin-top: 0.8rem;\n padding-top: 0.8rem;\n border-top: 1px solid var(--border);\n display: flex;\n flex-wrap: wrap;\n justify-content: center;\n gap: 0.3rem 0.7rem;\n font-size: 0.65rem;\n color: var(--text-muted);\n }\n\n .printer-card .specs span {\n display: flex;\n align-items: center;\n gap: 0.25rem;\n }\n\n /* ===== Material Card ===== */\n .material-card {\n background: var(--card-bg);\n border: 1px solid var(--border);\n border-radius: 10px;\n padding: 1.4rem;\n text-align: center;\n transition: all 0.4s ease;\n }\n\n .material-card:hover {\n border-color: rgba(0, 136, 255, 0.2);\n transform: translateY(-4px);\n box-shadow: 0 12px 40px rgba(0, 0, 0, 0.3), 0 0 20px rgba(0, 136, 255, 0.04);\n }\n\n .material-card .mat-icon {\n width: 48px;\n height: 48px;\n margin: 0 auto 0.8rem;\n display: flex;\n align-items: center;\n justify-content: center;\n border-radius: 50%;\n font-size: 1.2rem;\n transition: all 0.4s ease;\n }\n\n .material-card .mat-icon.green {\n background: rgba(0, 255, 136, 0.08);\n color: var(--green);\n border: 1px solid rgba(0, 255, 136, 0.12);\n }\n .material-card .mat-icon.blue {\n background: rgba(0, 136, 255, 0.08);\n color: var(--blue);\n border: 1px solid rgba(0, 136, 255, 0.12);\n }\n .material-card .mat-icon.cyan {\n background: rgba(0, 229, 255, 0.08);\n color: var(--cyan);\n border: 1px solid rgba(0, 229, 255, 0.12);\n }\n .material-card .mat-icon.purple {\n background: rgba(160, 80, 255, 0.08);\n color: #a050ff;\n border: 1px solid rgba(160, 80, 255, 0.12);\n }\n\n .material-card:hover .mat-icon {\n transform: scale(1.1) rotate(-5deg);\n }\n\n .material-card h4 {\n font-size: 0.9rem;\n font-weight: 600;\n margin-bottom: 0.2rem;\n }\n\n .material-card .desc {\n font-size: 0.7rem;\n color: var(--text-muted);\n line-height: 1.5;\n }\n\n /* ===== Pricing ===== */\n .pricing-card {\n background: var(--card-bg);\n border: 1px solid var(--border);\n border-radius: 14px;\n padding: 2.5rem 2rem;\n text-align: center;\n transition: all 0.5s cubic-bezier(0.16, 1, 0.3, 1);\n position: relative;\n overflow: hidden;\n }\n\n .pricing-card:hover {\n transform: translateY(-8px);\n border-color: rgba(0, 255, 136, 0.2);\n box-shadow: 0 24px 60px rgba(0, 0, 0, 0.5), 0 0 40px rgba(0, 255, 136, 0.04);\n }\n\n .pricing-card.featured {\n border-color: rgba(0, 255, 136, 0.2);\n box-shadow: 0 0 40px rgba(0, 255, 136, 0.06);\n }\n\n .pricing-card.featured::before {\n content: '推荐';\n position: absolute;\n top: 1.2rem;\n right: -2.2rem;\n padding: 0.15rem 3rem;\n font-family: 'Orbitron', sans-serif;\n font-size: 0.5rem;\n font-weight: 700;\n letter-spacing: 0.12em;\n color: #06080a;\n background: var(--green);\n transform: rotate(45deg);\n }\n\n .pricing-card .plan-name {\n font-size: 0.75rem;\n font-weight: 600;\n letter-spacing: 0.2em;\n text-transform: uppercase;\n color: var(--text-muted);\n margin-bottom: 1rem;\n }\n\n .pricing-card .plan-price {\n font-family: 'Orbitron', sans-serif;\n font-size: 2.4rem;\n font-weight: 800;\n background: linear-gradient(135deg, var(--green), var(--blue-light));\n -webkit-background-clip: text;\n -webkit-text-fill-color: transparent;\n background-clip: text;\n line-height: 1.2;\n }\n\n .pricing-card .plan-price small {\n font-size: 0.4em;\n font-weight: 400;\n -webkit-text-fill-color: var(--text-muted);\n color: var(--text-muted);\n }\n\n .pricing-card .plan-desc {\n font-size: 0.8rem;\n color: var(--text-muted);\n margin: 0.8rem 0 1.5rem;\n }\n\n .pricing-card ul {\n list-style: none;\n text-align: left;\n margin: 0 0 1.8rem;\n }\n\n .pricing-card ul li {\n padding: 0.4rem 0;\n font-size: 0.82rem;\n color: var(--text-muted);\n display: flex;\n align-items: center;\n gap: 0.6rem;\n border-bottom: 1px solid rgba(255, 255, 255, 0.03);\n }\n\n .pricing-card ul li i {\n color: var(--green);\n font-size: 0.6rem;\n width: 16px;\n text-align: center;\n }\n\n /* ===== CTA ===== */\n #cta {\n position: relative;\n overflow: hidden;\n }\n\n #cta::before {\n content: '';\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n background: radial-gradient(ellipse at 30% 50%, rgba(0, 255, 136, 0.05) 0%, transparent 60%),\n radial-gradient(ellipse at 70% 50%, rgba(0, 136, 255, 0.05) 0%, transparent 60%);\n pointer-events: none;\n }\n\n .cta-box {\n position: relative;\n border: 1px solid var(--border);\n border-radius: 16px;\n padding: 3.5rem 3rem;\n background: var(--bg-card);\n overflow: hidden;\n }\n\n .cta-box .glow-edge {\n position: absolute;\n top: -1px;\n left: -1px;\n right: -1px;\n bottom: -1px;\n border-radius: 17px;\n background: linear-gradient(135deg, var(--green), transparent, var(--blue), transparent);\n opacity: 0.2;\n animation: ctaBorderGlow 5s ease-in-out infinite;\n pointer-events: none;\n }\n\n /* ===== Footer ===== */\n #footer {\n border-top: 1px solid var(--border);\n }\n\n .f-link {\n color: var(--text-muted);\n font-size: 0.82rem;\n transition: color 0.3s ease;\n cursor: pointer;\n }\n\n .f-link:hover {\n color: var(--green);\n }\n\n .f-title {\n font-family: 'Orbitron', sans-serif;\n font-size: 0.65rem;\n font-weight: 600;\n letter-spacing: 0.14em;\n text-transform: uppercase;\n color: var(--text-muted);\n margin-bottom: 1rem;\n }\n\n /* ===== 滚动动画 ===== */\n .reveal {\n opacity: 0;\n transform: translateY(36px);\n transition: all 0.8s cubic-bezier(0.16, 1, 0.3, 1);\n }\n\n .reveal.visible {\n opacity: 1;\n transform: translateY(0);\n }\n\n .rd1 {\n transition-delay: 0.1s;\n }\n .rd2 {\n transition-delay: 0.2s;\n }\n .rd3 {\n transition-delay: 0.3s;\n }\n .rd4 {\n transition-delay: 0.4s;\n }\n .rd5 {\n transition-delay: 0.5s;\n }\n\n /* ===== 滚动条 ===== */\n ::-webkit-scrollbar {\n width: 5px;\n }\n ::-webkit-scrollbar-track {\n background: var(--bg-primary);\n }\n ::-webkit-scrollbar-thumb {\n background: var(--green);\n border-radius: 3px;\n }\n\n /* ===== Mobile ===== */\n .mobile-menu {\n position: fixed;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n background: rgba(6, 8, 10, 0.96);\n backdrop-filter: blur(30px);\n -webkit-backdrop-filter: blur(30px);\n z-index: 9998;\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n gap: 2rem;\n opacity: 0;\n pointer-events: none;\n transition: all 0.5s cubic-bezier(0.16, 1, 0.3, 1);\n }\n\n .mobile-menu.open {\n opacity: 1;\n pointer-events: all;\n }\n\n .mobile-menu a {\n font-family: 'Orbitron', sans-serif;\n font-size: 1.3rem;\n font-weight: 600;\n color: var(--text);\n text-decoration: none;\n letter-spacing: 0.05em;\n transition: color 0.3s ease;\n }\n\n .mobile-menu a:hover {\n color: var(--green);\n }\n\n .hamburger {\n width: 26px;\n height: 18px;\n position: relative;\n cursor: pointer;\n z-index: 9999;\n }\n\n .hamburger span {\n display: block;\n position: absolute;\n width: 100%;\n height: 2px;\n background: var(--text);\n border-radius: 2px;\n transition: all 0.4s cubic-bezier(0.16, 1, 0.3, 1);\n }\n\n .hamburger span:nth-child(1) {\n top: 0;\n }\n .hamburger span:nth-child(2) {\n top: 8px;\n }\n .hamburger span:nth-child(3) {\n top: 16px;\n }\n\n .hamburger.active span:nth-child(1) {\n top: 8px;\n transform: rotate(45deg);\n background: var(--green);\n }\n\n .hamburger.active span:nth-child(2) {\n opacity: 0;\n transform: scaleX(0);\n }\n\n .hamburger.active span:nth-child(3) {\n top: 8px;\n transform: rotate(-45deg);\n background: var(--green);\n }\n\n @media (max-width: 768px) {\n .navbar .nav-links {\n display: none;\n }\n .navbar .btn-primary {\n display: none;\n }\n .cta-box {\n padding: 2.2rem 1.2rem;\n }\n .pricing-card {\n padding: 2rem 1.2rem;\n }\n .lab-banner {\n border-radius: 12px;\n }\n }\n\n @media (min-width: 769px) {\n .hamburger {\n display: none;\n }\n .mobile-menu {\n display: none !important;\n }\n }\n </style>\n</head>\n<body>\n\n <div class=\"scanlines\"></div>\n <div class=\"noise-overlay\"></div>\n\n <!-- Mobile Menu -->\n <div class=\"mobile-menu\" id=\"mobileMenu\">\n <a href=\"#hero\" onclick=\"closeMobile()\">首页</a>\n <a href=\"#products\" onclick=\"closeMobile()\">热卖作品</a>\n <a href=\"#lab\" onclick=\"closeMobile()\">实验室</a>\n <a href=\"#process\" onclick=\"closeMobile()\">定制流程</a>\n <a href=\"#printers\" onclick=\"closeMobile()\">设备与耗材</a>\n <a href=\"#pricing\" onclick=\"closeMobile()\">价格方案</a>\n <a href=\"#cta\" onclick=\"closeMobile()\">预约打印</a>\n </div>\n\n <!-- Navbar -->\n <nav class=\"navbar\" id=\"navbar\">\n <div class=\"max-w-7xl mx-auto px-6 flex items-center justify-between\">\n <div class=\"logo\">\n <div class=\"logo-icon\">\n <i class=\"fa-solid fa-cube\"></i>\n </div>\n PRINTLAB\n </div>\n <div class=\"nav-links flex items-center gap-7\">\n <a href=\"#products\" class=\"nav-link\">热卖作品</a>\n <a href=\"#lab\" class=\"nav-link\">实验室</a>\n <a href=\"#process\" class=\"nav-link\">定制流程</a>\n <a href=\"#printers\" class=\"nav-link\">设备与耗材</a>\n <a href=\"#pricing\" class=\"nav-link\">价格</a>\n </div>\n <div class=\"flex items-center gap-3\">\n <button class=\"btn-primary !py-2 !px-4 !text-[0.7rem]\" onclick=\"document.getElementById('cta').scrollIntoView({behavior:'smooth'})\">\n 预约打印 <i class=\"fa-solid fa-cart-shopping\"></i>\n </button>\n <div class=\"hamburger\" id=\"hamburger\" onclick=\"toggleMobile()\">\n <span></span>\n <span></span>\n <span></span>\n </div>\n </div>\n </div>\n </nav>\n\n <!-- ===== HERO ===== -->\n <section id=\"hero\">\n <div class=\"hero-grid\"></div>\n <div class=\"hero-glow\"></div>\n <div class=\"hero-glow-2\"></div>\n <div class=\"hero-shape hero-shape-1\"></div>\n <div class=\"hero-shape hero-shape-2\"></div>\n <div class=\"hero-shape hero-shape-3\"></div>\n <div class=\"particle\"></div>\n <div class=\"particle\"></div>\n <div class=\"particle\"></div>\n <div class=\"particle\"></div>\n <div class=\"particle\"></div>\n <div class=\"particle\"></div>\n\n <div class=\"max-w-7xl mx-auto px-6 w-full relative z-10 pt-28 pb-20\">\n <div class=\"max-w-3xl\">\n <div class=\"reveal visible\">\n <span class=\"hero-badge\">\n <i class=\"fa-solid fa-circle text-[0.4rem] animate-pulse\"></i>\n 深圳 · 数字制造实验室\n </span>\n </div>\n <h1 class=\"hero-title mt-5 reveal visible rd1\">\n 你的想象<br>\n <span class=\"text-gradient-green-blue\">我们打印成真</span>\n </h1>\n <p class=\"text-[var(--text-muted)] text-base md:text-lg leading-relaxed mt-5 max-w-lg reveal visible rd2\">\n 专业3D打印定制工坊,提供从原型设计到小批量生产的全链路服务。\n 50+种耗材、工业级设备、极速交付——让定制触手可及。\n </p>\n <div class=\"flex flex-wrap gap-4 mt-9 reveal visible rd3\">\n <button class=\"btn-primary\" onclick=\"document.getElementById('products').scrollIntoView({behavior:'smooth'})\">\n 选购作品 <i class=\"fa-solid fa-arrow-right\"></i>\n </button>\n <button class=\"btn-secondary\" onclick=\"document.getElementById('process').scrollIntoView({behavior:'smooth'})\">\n <i class=\"fa-regular fa-compass\"></i> 定制流程\n </button>\n </div>\n <div class=\"flex items-center gap-6 mt-10 reveal visible rd4\">\n <div class=\"flex -space-x-2\">\n <div class=\"w-7 h-7 rounded-full border-2 border-[var(--bg-primary)] bg-gradient-to-br from-green-400 to-green-600 flex items-center justify-center text-[0.45rem] font-bold text-black\">A</div>\n <div class=\"w-7 h-7 rounded-full border-2 border-[var(--bg-primary)] bg-gradient-to-br from-blue-400 to-blue-600 flex items-center justify-center text-[0.45rem] font-bold text-white\">B</div>\n <div class=\"w-7 h-7 rounded-full border-2 border-[var(--bg-primary)] bg-gradient-to-br from-cyan-400 to-blue-500 flex items-center justify-center text-[0.45rem] font-bold text-black\">C</div>\n <div class=\"w-7 h-7 rounded-full border-2 border-[var(--bg-primary)] bg-gradient-to-br from-green-300 to-emerald-500 flex items-center justify-center text-[0.45rem] font-bold text-black\">D</div>\n </div>\n <span class=\"text-sm text-[var(--text-muted)]\">\n <span class=\"text-[var(--text)] font-semibold\">1,200+</span> 定制作品 · 客户好评率 <span class=\"text-[var(--green)] font-semibold\">99.2%</span>\n </span>\n </div>\n </div>\n </div>\n\n <div class=\"absolute bottom-7 left-1/2 -translate-x-1/2 flex flex-col items-center gap-2 z-10\">\n <span class=\"text-[0.5rem] font-[Orbitron] tracking-[0.3em] text-[var(--text-muted)]\">向下浏览</span>\n <div class=\"w-5 h-7 border border-[var(--border)] rounded-full flex justify-center pt-1.5\">\n <div class=\"w-1 h-1.5 bg-[var(--green)] rounded-full animate-bounce shadow-[0_0_6px_var(--green-glow)]\"></div>\n </div>\n </div>\n </section>\n\n <!-- ===== 热卖作品 ===== -->\n <section id=\"products\" class=\"py-24\" style=\"background: var(--bg-secondary);\">\n <div class=\"max-w-7xl mx-auto px-6\">\n <div class=\"text-center max-w-2xl mx-auto mb-14\">\n <div class=\"reveal\">\n <span class=\"section-label\">热卖作品</span>\n </div>\n <h2 class=\"section-title reveal rd1 mt-1\">\n 精选 <span class=\"hl\">定制佳作</span>\n </h2>\n <p class=\"section-desc mx-auto mt-3 reveal rd2\">\n 每一件均为匠心打印,支持颜色、尺寸、材质深度定制,亦可来图来样。\n </p>\n </div>\n\n <div class=\"grid sm:grid-cols-2 lg:grid-cols-3 gap-5\">\n <!-- 作品 1 -->\n <div class=\"product-card reveal rd1\">\n <div class=\"visual\">\n <div class=\"shape\" style=\"background: linear-gradient(135deg, rgba(0,255,136,0.25), rgba(0,136,255,0.15)); border: 1px solid rgba(0,255,136,0.12); clip-path: polygon(25% 0%, 75% 0%, 100% 50%, 75% 100%, 25% 100%, 0% 50%);\"></div>\n <span class=\"badge-top\">DLP</span>\n <span class=\"badge-hot\">热卖</span>\n </div>\n <div class=\"info\">\n <h3 class=\"name\">精密机械齿轮组</h3>\n <div class=\"meta\">\n <span><i class=\"fa-solid fa-cube\"></i> 光敏树脂</span>\n <span><i class=\"fa-solid fa-ruler\"></i> 120×80mm</span>\n <span><i class=\"fa-solid fa-layer-group\"></i> 0.02mm</span>\n </div>\n <div class=\"price-row\">\n <div class=\"price\">¥168 <small>起</small></div>\n <button class=\"btn-buy\" onclick=\"document.getElementById('cta').scrollIntoView({behavior:'smooth'})\">立即定制</button>\n </div>\n </div>\n </div>\n\n <!-- 作品 2 -->\n <div class=\"product-card reveal rd2\">\n <div class=\"visual\">\n <div class=\"shape\" style=\"background: linear-gradient(135deg, rgba(0,136,255,0.25), rgba(0,229,255,0.15)); border: 1px solid rgba(0,136,255,0.12); clip-path: polygon(50% 0%, 80% 25%, 80% 75%, 50% 100%, 20% 75%, 20% 25%);\"></div>\n <span class=\"badge-top\" style=\"background:var(--blue); color:#fff;\">SLS</span>\n </div>\n <div class=\"info\">\n <h3 class=\"name\">仿生晶格花瓶</h3>\n <div class=\"meta\">\n <span><i class=\"fa-solid fa-cube\"></i> 尼龙粉末</span>\n <span><i class=\"fa-solid fa-ruler\"></i> 150×150mm</span>\n <span><i class=\"fa-solid fa-layer-group\"></i> 0.08mm</span>\n </div>\n <div class=\"price-row\">\n <div class=\"price\">¥239 <small>起</small></div>\n <button class=\"btn-buy\" onclick=\"document.getElementById('cta').scrollIntoView({behavior:'smooth'})\">立即定制</button>\n </div>\n </div>\n </div>\n\n <!-- 作品 3 -->\n <div class=\"product-card reveal rd3\">\n <div class=\"visual\">\n <div class=\"shape\" style=\"background: linear-gradient(135deg, rgba(0,229,255,0.25), rgba(0,255,136,0.15)); border: 1px solid rgba(0,229,255,0.12); border-radius: 50%;\"></div>\n <span class=\"badge-top\" style=\"background:var(--cyan); color:#000;\">SLA</span>\n <span class=\"badge-hot\">热卖</span>\n </div>\n <div class=\"info\">\n <h3 class=\"name\">全透明艺术雕塑</h3>\n <div class=\"meta\">\n <span><i class=\"fa-solid fa-cube\"></i> 透明树脂</span>\n <span><i class=\"fa-solid fa-ruler\"></i> 200×120mm</span>\n <span><i class=\"fa-solid fa-layer-group\"></i> 0.05mm</span>\n </div>\n <div class=\"price-row\">\n <div class=\"price\">¥359 <small>起</small></div>\n <button class=\"btn-buy\" onclick=\"document.getElementById('cta').scrollIntoView({behavior:'smooth'})\">立即定制</button>\n </div>\n </div>\n </div>\n\n <!-- 作品 4 -->\n <div class=\"product-card reveal rd1\">\n <div class=\"visual\">\n <div class=\"shape\" style=\"background: linear-gradient(135deg, rgba(0,255,136,0.2), rgba(0,136,255,0.2)); border: 1px solid rgba(0,255,136,0.1); clip-path: polygon(0% 0%, 100% 0%, 100% 80%, 60% 100%, 0% 80%);\"></div>\n <span class=\"badge-top\">MJF</span>\n </div>\n <div class=\"info\">\n <h3 class=\"name\">无人机轻量框架</h3>\n <div class=\"meta\">\n <span><i class=\"fa-solid fa-cube\"></i> 碳纤维尼龙</span>\n <span><i class=\"fa-solid fa-ruler\"></i> 250×180mm</span>\n <span><i class=\"fa-solid fa-layer-group\"></i> 0.1mm</span>\n </div>\n <div class=\"price-row\">\n <div class=\"price\">¥520 <small>起</small></div>\n <button class=\"btn-buy\" onclick=\"document.getElementById('cta').scrollIntoView({behavior:'smooth'})\">立即定制</button>\n </div>\n </div>\n </div>\n\n <!-- 作品 5 -->\n <div class=\"product-card reveal rd2\">\n <div class=\"visual\">\n <div class=\"shape\" style=\"background: linear-gradient(135deg, rgba(0,136,255,0.2), rgba(0,229,255,0.15)); border: 1px solid rgba(0,136,255,0.1); border-radius: 20% 50% 20% 50%;\"></div>\n <span class=\"badge-top\" style=\"background:var(--blue); color:#fff;\">DLP</span>\n </div>\n <div class=\"info\">\n <h3 class=\"name\">个性化戒指套装</h3>\n <div class=\"meta\">\n <span><i class=\"fa-solid fa-cube\"></i> 珠宝铸蜡树脂</span>\n <span><i class=\"fa-solid fa-ruler\"></i> 定制尺寸</span>\n <span><i class=\"fa-solid fa-layer-group\"></i> 0.01mm</span>\n </div>\n <div class=\"price-row\">\n <div class=\"price\">¥299 <small>起</small></div>\n <button class=\"btn-buy\" onclick=\"document.getElementById('cta').scrollIntoView({behavior:'smooth'})\">立即定制</button>\n </div>\n </div>\n </div>\n\n <!-- 作品 6 -->\n <div class=\"product-card reveal rd3\">\n <div class=\"visual\">\n <div class=\"shape\" style=\"background: linear-gradient(135deg, rgba(0,229,255,0.2), rgba(0,255,136,0.15)); border: 1px solid rgba(0,229,255,0.1); clip-path: polygon(50% 0%, 100% 38%, 81% 100%, 19% 100%, 0% 38%);\"></div>\n <span class=\"badge-top\" style=\"background:var(--cyan); color:#000;\">FDM</span>\n </div>\n <div class=\"info\">\n <h3 class=\"name\">建筑概念模型</h3>\n <div class=\"meta\">\n <span><i class=\"fa-solid fa-cube\"></i> PLA+ 环保耗材</span>\n <span><i class=\"fa-solid fa-ruler\"></i> 300×200mm</span>\n <span><i class=\"fa-solid fa-layer-group\"></i> 0.12mm</span>\n </div>\n <div class=\"price-row\">\n <div class=\"price\">¥420 <small>起</small></div>\n <button class=\"btn-buy\" onclick=\"document.getElementById('cta').scrollIntoView({behavior:'smooth'})\">立即定制</button>\n </div>\n </div>\n </div>\n </div>\n\n <div class=\"text-center mt-12 reveal\">\n <button class=\"btn-secondary\" onclick=\"document.getElementById('cta').scrollIntoView({behavior:'smooth'})\">\n 来图定制 <i class=\"fa-solid fa-upload\"></i>\n </button>\n </div>\n </div>\n </section>\n\n <!-- ===== 售卖地点:LAB ===== -->\n <section id=\"lab\" class=\"py-24\" style=\"background: var(--bg-primary);\">\n <div class=\"max-w-7xl mx-auto px-6\">\n <div class=\"grid md:grid-cols-2 gap-10 items-center\">\n <div class=\"reveal\">\n <span class=\"section-label\">售卖地点</span>\n <h2 class=\"section-title mt-1\">\n PRINTLAB <span class=\"hl\">数字制造实验室</span>\n </h2>\n <p class=\"text-[var(--text-muted)] text-base leading-relaxed mt-4\">\n 位于深圳南山的线下体验与交付中心,配备 20+ 台工业级3D打印设备,\n 提供从设计咨询、现场建模到成品交付的一站式服务。欢迎预约到访。\n </p>\n <div class=\"flex flex-wrap gap-3 mt-5\">\n <div class=\"flex items-center gap-2 text-sm text-[var(--text-muted)] bg-[var(--bg-card)] border border-[var(--border)] rounded-lg px-3 py-1.5\">\n <i class=\"fa-solid fa-location-dot text-[var(--green)]\"></i>\n 深圳南山 · 科技园南区\n </div>\n <div class=\"flex items-center gap-2 text-sm text-[var(--text-muted)] bg-[var(--bg-card)] border border-[var(--border)] rounded-lg px-3 py-1.5\">\n <i class=\"fa-solid fa-clock text-[var(--blue)]\"></i>\n 周一至周六 09:00-20:00\n </div>\n </div>\n <div class=\"grid grid-cols-3 gap-3 mt-8\">\n <div class=\"lab-stat\">\n <div class=\"num\">20<small class=\"text-[0.4em] align-super -webkit-text-fill-color-[var(--text-muted)]\" style=\"-webkit-text-fill-color:var(--text-muted);color:var(--text-muted);\">+</small></div>\n <div class=\"lbl\">打印设备</div>\n </div>\n <div class=\"lab-stat\">\n <div class=\"num\">50<small class=\"text-[0.4em] align-super -webkit-text-fill-color-[var(--text-muted)]\" style=\"-webkit-text-fill-color:var(--text-muted);color:var(--text-muted);\">+</small></div>\n <div class=\"lbl\">耗材种类</div>\n </div>\n <div class=\"lab-stat\">\n <div class=\"num\">98<small class=\"text-[0.4em] align-super -webkit-text-fill-color-[var(--text-muted)]\" style=\"-webkit-text-fill-color:var(--text-muted);color:var(--text-muted);\">%</small></div>\n <div class=\"lbl\">准点交付</div>\n </div>\n </div>\n </div>\n <div class=\"reveal rd2\">\n <div class=\"lab-banner aspect-[4/3]\">\n <div class=\"lab-bg\"></div>\n <div class=\"glow-edge\"></div>\n <div class=\"relative z-10 p-8 md:p-10 h-full flex flex-col justify-end\">\n <div class=\"bg-[var(--bg-primary)]/80 backdrop-blur-md rounded-xl p-5 border border-[var(--border)]\">\n <div class=\"flex items-center gap-3 mb-3\">\n <div class=\"w-2 h-2 rounded-full bg-[var(--green)] shadow-[0_0_10px_var(--green-glow)] animate-pulse\"></div>\n <span class=\"text-xs font-[Orbitron] tracking-[0.15em] text-[var(--green)]\">实验室开放中</span>\n </div>\n <p class=\"text-sm text-[var(--text-muted)] leading-relaxed\">\n 欢迎携带3D模型文件到店打印,或现场挑选心仪作品。\n 工程师免费提供打印可行性评估与设计优化建议。\n </p>\n <button class=\"mt-4 text-xs font-[Orbitron] tracking-[0.05em] text-[var(--green)] hover:underline flex items-center gap-1.5\" onclick=\"document.getElementById('cta').scrollIntoView({behavior:'smooth'})\">\n 预约到访 <i class=\"fa-solid fa-arrow-right text-[0.6rem]\"></i>\n </button>\n </div>\n </div>\n </div>\n </div>\n </div>\n </div>\n </section>\n\n <!-- ===== 定制流程 ===== -->\n <section id=\"process\" class=\"py-24\" style=\"background: var(--bg-secondary);\">\n <div class=\"max-w-7xl mx-auto px-6\">\n <div class=\"text-center max-w-2xl mx-auto mb-16\">\n <div class=\"reveal\">\n <span class=\"section-label\">定制流程</span>\n </div>\n <h2 class=\"section-title reveal rd1 mt-1\">\n 四步轻松 <span class=\"hl\">定制专属作品</span>\n </h2>\n <p class=\"section-desc mx-auto mt-3 reveal rd2\">\n 从想法到实物,全程专业团队跟进,让你省心省力。\n </p>\n </div>\n\n <div class=\"grid md:grid-cols-2 gap-x-16 gap-y-3 max-w-4xl mx-auto\">\n <div class=\"wf-step reveal rd1\">\n <div class=\"wf-num\">01</div>\n <div class=\"wf-content\">\n <h4>需求沟通</h4>\n <p>告诉我们你的创意构想——提供草图、参考图或3D模型文件(STL/OBJ/STEP),我们的工程师免费评估可行性并给出报价。</p>\n </div>\n </div>\n <div class=\"wf-step reveal rd2\">\n <div class=\"wf-num\">02</div>\n <div class=\"wf-content\">\n <h4>建模与优化</h4>\n <p>专业建模师进行三维重构与拓扑优化,AI智能分析支撑结构与打印路径,确保成型效果最优、材料损耗最低。</p>\n </div>\n </div>\n <div class=\"wf-step reveal rd3\">\n <div class=\"wf-num\">03</div>\n <div class=\"wf-content\">\n <h4>打印成型</h4>\n <p>根据模型特征自动匹配最优打印工艺与耗材,全程温湿度监控,关键节点人工抽检,确保品质稳定。</p>\n </div>\n </div>\n <div class=\"wf-step reveal rd4\">\n <div class=\"wf-num\">04</div>\n <div class=\"wf-content\">\n <h4>交付与质检</h4>\n <p>经过清洗、固化、打磨、表面处理等工序,配合三维扫描尺寸检测,确认无误后精美包装,支持自提或快递到家。</p>\n </div>\n </div>\n </div>\n </div>\n </section>\n\n <!-- ===== 打印机机型 ===== -->\n <section id=\"printers\" class=\"py-24\" style=\"background: var(--bg-primary); border-bottom: 1px solid var(--border);\">\n <div class=\"max-w-7xl mx-auto px-6\">\n <div class=\"text-center max-w-2xl mx-auto mb-14\">\n <div class=\"reveal\">\n <span class=\"section-label\">设备与耗材</span>\n </div>\n <h2 class=\"section-title reveal rd1 mt-1\">\n 工业级 <span class=\"hl\">打印设备</span>\n </h2>\n <p class=\"section-desc mx-auto mt-3 reveal rd2\">\n 严选全球一线品牌,为每一件作品提供精度与效率的双重保障。\n </p>\n </div>\n\n <div class=\"grid sm:grid-cols-2 lg:grid-cols-4 gap-4\">\n <div class=\"printer-card reveal rd1\">\n <div class=\"icon-box\">\n <i class=\"fa-solid fa-print\"></i>\n </div>\n <h4>Form 3+</h4>\n <div class=\"brand\">Formlabs · 光固化</div>\n <div class=\"specs\">\n <span><i class=\"fa-solid fa-ruler\"></i> 145×145×185mm</span>\n <span><i class=\"fa-solid fa-microscope\"></i> 25μm</span>\n </div>\n </div>\n <div class=\"printer-card reveal rd2\">\n <div class=\"icon-box\" style=\"color:var(--blue);border-color:rgba(0,136,255,0.12);background:rgba(0,136,255,0.06);\">\n <i class=\"fa-solid fa-industry\"></i>\n </div>\n <h4>F370</h4>\n <div class=\"brand\">Stratasys · FDM</div>\n <div class=\"specs\">\n <span><i class=\"fa-solid fa-ruler\"></i> 355×254×355mm</span>\n <span><i class=\"fa-solid fa-microscope\"></i> 127μm</span>\n </div>\n </div>\n <div class=\"printer-card reveal rd3\">\n <div class=\"icon-box\" style=\"color:var(--cyan);border-color:rgba(0,229,255,0.12);background:rgba(0,229,255,0.06);\">\n <i class=\"fa-solid fa-cubes\"></i>\n </div>\n <h4>X1 Carbon</h4>\n <div class=\"brand\">Bambu Lab · 高速FDM</div>\n <div class=\"specs\">\n <span><i class=\"fa-solid fa-ruler\"></i> 256×256×256mm</span>\n <span><i class=\"fa-solid fa-microscope\"></i> 50μm</span>\n </div>\n </div>\n <div class=\"printer-card reveal rd4\">\n <div class=\"icon-box\" style=\"color:#a050ff;border-color:rgba(160,80,255,0.12);background:rgba(160,80,255,0.06);\">\n <i class=\"fa-solid fa-gem\"></i>\n </div>\n <h4>Guider 3 Ultra</h4>\n <div class=\"brand\">闪铸科技 · 大尺寸FDM</div>\n <div class=\"specs\">\n <span><i class=\"fa-solid fa-ruler\"></i> 350×350×500mm</span>\n <span><i class=\"fa-solid fa-microscope\"></i> 100μm</span>\n </div>\n </div>\n </div>\n </div>\n </section>\n\n <!-- ===== 耗材类型 ===== -->\n <section class=\"py-20\" style=\"background: var(--bg-secondary);\">\n <div class=\"max-w-7xl mx-auto px-6\">\n <div class=\"text-center max-w-2xl mx-auto mb-12\">\n <div class=\"reveal\">\n <span class=\"section-label\">耗材库</span>\n </div>\n <h2 class=\"section-title reveal rd1 mt-1\">\n 50<span class=\"text-[0.6em] align-super\">+</span> 种 <span class=\"hl\">专业耗材</span>\n </h2>\n <p class=\"section-desc mx-auto mt-3 reveal rd2\">\n 从工程塑料到柔性弹性体,从透明树脂到金属粉末,满足你的每一种需求。\n </p>\n </div>\n\n <div class=\"grid grid-cols-2 sm:grid-cols-3 lg:grid-cols-6 gap-3\">\n <div class=\"material-card reveal rd1\">\n <div class=\"mat-icon green\"><i class=\"fa-solid fa-droplet\"></i></div>\n <h4>光敏树脂</h4>\n <div class=\"desc\">高精度、表面光滑<br>适用:手板、手办</div>\n </div>\n <div class=\"material-card reveal rd2\">\n <div class=\"mat-icon blue\"><i class=\"fa-solid fa-layer-group\"></i></div>\n <h4>尼龙粉末</h4>\n <div class=\"desc\">高强度、耐冲击<br>适用:结构件、工具</div>\n </div>\n <div class=\"material-card reveal rd3\">\n <div class=\"mat-icon cyan\"><i class=\"fa-solid fa-bolt\"></i></div>\n <h4>碳纤维增强</h4>\n <div class=\"desc\">轻量高刚度<br>适用:无人机、支架</div>\n </div>\n <div class=\"material-card reveal rd1\">\n <div class=\"mat-icon purple\"><i class=\"fa-solid fa-hand\"></i></div>\n <h4>TPU 柔性</h4>\n <div class=\"desc\">弹性好、耐磨损<br>适用:密封件、护具</div>\n </div>\n <div class=\"material-card reveal rd2\">\n <div class=\"mat-icon green\"><i class=\"fa-solid fa-leaf\"></i></div>\n <h4>PLA+ 环保</h4>\n <div class=\"desc\">可降解、易打印<br>适用:原型、模型</div>\n </div>\n <div class=\"material-card reveal rd3\">\n <div class=\"mat-icon blue\"><i class=\"fa-solid fa-gem\"></i></div>\n <h4>铸蜡树脂</h4>\n <div class=\"desc\">精密铸造专用<br>适用:珠宝、牙科</div>\n </div>\n </div>\n </div>\n </section>\n\n <!-- ===== 价格方案 ===== -->\n <section id=\"pricing\" class=\"py-24\" style=\"background: var(--bg-primary);\">\n <div class=\"max-w-7xl mx-auto px-6\">\n <div class=\"text-center max-w-2xl mx-auto mb-14\">\n <div class=\"reveal\">\n <span class=\"section-label\">价格方案</span>\n </div>\n <h2 class=\"section-title reveal rd1 mt-1\">\n 透明定价 · <span class=\"hl\">按需选择</span>\n </h2>\n <p class=\"section-desc mx-auto mt-3 reveal rd2\">\n 以下为基础参考价,实际价格根据模型复杂度、尺寸与耗材浮动,免费报价。\n </p>\n </div>\n\n <div class=\"grid md:grid-cols-3 gap-6 max-w-5xl mx-auto\">\n <div class=\"pricing-card reveal rd1\">\n <div class=\"plan-name\">基础方案</div>\n <div class=\"plan-price\">¥99 <small>/件起</small></div>\n <div class=\"plan-desc\">小型原型与创意验证</div>\n <ul>\n <li><i class=\"fa-solid fa-check\"></i> FDM/基础树脂打印</li>\n <li><i class=\"fa-solid fa-check\"></i> 最大 120×120×120mm</li>\n <li><i class=\"fa-solid fa-check\"></i> 3 种基础耗材可选</li>\n <li><i class=\"fa-solid fa-check\"></i> 标准后处理(去支撑打磨)</li>\n <li><i class=\"fa-solid fa-check\"></i> 7 个工作日内交付</li>\n </ul>\n <button class=\"btn-primary !py-2.5 !px-8 !text-[0.7rem] w-full justify-center\" onclick=\"document.getElementById('cta').scrollIntoView({behavior:'smooth'})\">\n 立即下单\n </button>\n </div>\n\n <div class=\"pricing-card featured reveal rd2\">\n <div class=\"plan-name\">进阶方案</div>\n <div class=\"plan-price\">¥399 <small>/件起</small></div>\n <div class=\"plan-desc\">工业级精度与工程应用</div>\n <ul>\n <li><i class=\"fa-solid fa-check\"></i> DLP/SLA/SLS 工业打印</li>\n <li><i class=\"fa-solid fa-check\"></i> 最大 250×250×300mm</li>\n <li><i class=\"fa-solid fa-check\"></i> 15 种工程耗材可选</li>\n <li><i class=\"fa-solid fa-check\"></i> 精抛光+表面处理</li>\n <li><i class=\"fa-solid fa-check\"></i> 5 个工作日内交付</li>\n <li><i class=\"fa-solid fa-check\" style=\"color:var(--green);\"></i> 免费设计优化建议</li>\n </ul>\n <button class=\"btn-primary !py-2.5 !px-8 !text-[0.7rem] w-full justify-center\" onclick=\"document.getElementById('cta').scrollIntoView({behavior:'smooth'})\">\n 推荐选择\n </button>\n </div>\n\n <div class=\"pricing-card reveal rd3\">\n <div class=\"plan-name\">尊享方案</div>\n <div class=\"plan-price\">¥999 <small>/件起</small></div>\n <div class=\"plan-desc\">小批量生产与高端定制</div>\n <ul>\n <li><i class=\"fa-solid fa-check\"></i> 全工艺支持(含MJF/Metal)</li>\n <li><i class=\"fa-solid fa-check\"></i> 最大 500×500×500mm</li>\n <li><i class=\"fa-solid fa-check\"></i> 全耗材库任意选用</li>\n <li><i class=\"fa-solid fa-check\"></i> 全流程精加工+染色电镀</li>\n <li><i class=\"fa-solid fa-check\"></i> 3 个工作日内交付</li>\n <li><i class=\"fa-solid fa-check\" style=\"color:var(--green);\"></i> 1对1专属工程师服务</li>\n </ul>\n <button class=\"btn-primary !py-2.5 !px-8 !text-[0.7rem] w-full justify-center\" onclick=\"document.getElementById('cta').scrollIntoView({behavior:'smooth'})\">\n 联系报价\n </button>\n </div>\n </div>\n\n <p class=\"text-center text-xs text-[var(--text-muted)] mt-8 reveal\">\n <i class=\"fa-regular fa-circle-check text-[var(--green)] mr-1\"></i>\n 所有方案均包含免费可行性评估 · 批量订单享阶梯折扣 · 支持企业月结\n </p>\n </div>\n </section>\n\n <!-- ===== CTA ===== -->\n <section id=\"cta\" class=\"py-24\" style=\"background: var(--bg-secondary);\">\n <div class=\"max-w-7xl mx-auto px-6\">\n <div class=\"cta-box reveal\">\n <div class=\"glow-edge\"></div>\n <div class=\"relative z-10 flex flex-col md:flex-row items-center justify-between gap-8\">\n <div class=\"max-w-xl\">\n <h2 class=\"section-title text-2xl md:text-3xl\">\n 现在就开启你的 <span class=\"hl\">3D打印定制之旅</span>\n </h2>\n <p class=\"text-[var(--text-muted)] text-base leading-relaxed mt-4\">\n 上传你的模型文件或描述你的创意,工程师将在 2 小时内为你提供免费报价与工艺方案。\n 首次下单享 <span class=\"text-[var(--green)] font-semibold\">8折优惠</span>!\n </p>\n <div class=\"flex flex-wrap gap-3 mt-5\">\n <div class=\"flex items-center gap-2 text-xs text-[var(--text-muted)] bg-[var(--bg-primary)]/50 px-3 py-1.5 rounded-lg border border-[var(--border)]\">\n <i class=\"fa-regular fa-message text-[var(--green)]\"></i> 微信:printlab_sz\n </div>\n <div class=\"flex items-center gap-2 text-xs text-[var(--text-muted)] bg-[var(--bg-primary)]/50 px-3 py-1.5 rounded-lg border border-[var(--border)]\">\n <i class=\"fa-solid fa-phone text-[var(--blue)]\"></i> 400-888-3DP\n </div>\n </div>\n </div>\n <div class=\"flex flex-col sm:flex-row gap-4 shrink-0\">\n <button class=\"btn-primary whitespace-nowrap\">\n 上传模型报价 <i class=\"fa-solid fa-upload\"></i>\n </button>\n <button class=\"btn-secondary whitespace-nowrap\">\n <i class=\"fa-brands fa-weixin\"></i> 联系客服\n </button>\n </div>\n </div>\n </div>\n </div>\n </section>\n\n <!-- ===== Footer ===== -->\n <footer id=\"footer\" class=\"pt-14 pb-8\" style=\"background: var(--bg-primary);\">\n <div class=\"max-w-7xl mx-auto px-6\">\n <div class=\"grid grid-cols-2 md:grid-cols-5 gap-8 pb-10\">\n <div class=\"col-span-2 md:col-span-1\">\n <div class=\"logo mb-3\">\n <div class=\"logo-icon\">\n <i class=\"fa-solid fa-cube\"></i>\n </div>\n PRINTLAB\n </div>\n <p class=\"text-xs text-[var(--text-muted)] leading-relaxed max-w-[180px]\">\n 以数字之力塑造实体世界,让每一次定制都精准呈现。\n </p>\n <div class=\"flex gap-2.5 mt-4\">\n <a class=\"w-8 h-8 rounded-lg border border-[var(--border)] flex items-center justify-center text-[var(--text-muted)] hover:text-[var(--green)] hover:border-[var(--green)] transition-all duration-300 cursor-pointer\" aria-label=\"微信\">\n <i class=\"fa-brands fa-weixin text-sm\"></i>\n </a>\n <a class=\"w-8 h-8 rounded-lg border border-[var(--border)] flex items-center justify-center text-[var(--text-muted)] hover:text-[var(--blue)] hover:border-[var(--blue)] transition-all duration-300 cursor-pointer\" aria-label=\"小红书\">\n <i class=\"fa-brands fa-x-twitter text-sm\"></i>\n </a>\n <a class=\"w-8 h-8 rounded-lg border border-[var(--border)] flex items-center justify-center text-[var(--text-muted)] hover:text-[var(--green)] hover:border-[var(--green)] transition-all duration-300 cursor-pointer\" aria-label=\"抖音\">\n <i class=\"fa-brands fa-tiktok text-sm\"></i>\n </a>\n </div>\n </div>\n <div>\n <div class=\"f-title\">作品</div>\n <ul class=\"space-y-2\">\n <li><a class=\"f-link\">热卖推荐</a></li>\n <li><a class=\"f-link\">最新上架</a></li>\n <li><a class=\"f-link\">定制案例</a></li>\n <li><a class=\"f-link\">来图定制</a></li>\n </ul>\n </div>\n <div>\n <div class=\"f-title\">服务</div>\n <ul class=\"space-y-2\">\n <li><a class=\"f-link\">快速原型</a></li>\n <li><a class=\"f-link\">小批量生产</a></li>\n <li><a class=\"f-link\">逆向工程</a></li>\n <li><a class=\"f-link\">后处理服务</a></li>\n </ul>\n </div>\n <div>\n <div class=\"f-title\">技术</div>\n <ul class=\"space-y-2\">\n <li><a class=\"f-link\">DLP 光固化</a></li>\n <li><a class=\"f-link\">SLA 立体光刻</a></li>\n <li><a class=\"f-link\">SLS 烧结</a></li>\n <li><a class=\"f-link\">FDM 熔融沉积</a></li>\n </ul>\n </div>\n <div>\n <div class=\"f-title\">联系</div>\n <ul class=\"space-y-2\">\n <li><a class=\"f-link\">关于我们</a></li>\n <li><a class=\"f-link\">实验室预约</a></li>\n <li><a class=\"f-link\">隐私政策</a></li>\n <li><a class=\"f-link\">合作洽谈</a></li>\n </ul>\n </div>\n </div>\n\n <div class=\"border-t border-[var(--border)] pt-6 flex flex-col md:flex-row items-center justify-between gap-3\">\n <p class=\"text-xs text-[var(--text-muted)]\">\n © 2026 PRINTLAB · 深圳数字制造实验室\n </p>\n <div class=\"flex items-center gap-5 text-xs text-[var(--text-muted)]\">\n <span class=\"flex items-center gap-1.5\">\n <i class=\"fa-regular fa-envelope text-[0.55rem]\"></i> hello@printlab.tech\n </span>\n <span class=\"flex items-center gap-1.5\">\n <i class=\"fa-solid fa-phone text-[0.55rem]\"></i> 400-888-3DP\n </span>\n <span class=\"flex items-center gap-1.5\">\n <i class=\"fa-solid fa-location-dot text-[0.55rem] text-[var(--green)]\"></i> 深圳南山\n </span>\n </div>\n </div>\n </div>\n </footer>\n\n <script>\n // 导航滚动\n const navbar = document.getElementById('navbar');\n window.addEventListener('scroll', () => {\n if (window.pageYOffset > 60) {\n navbar.classList.add('scrolled');\n } else {\n navbar.classList.remove('scrolled');\n }\n });\n\n // 滚动出现动画\n const reveals = document.querySelectorAll('.reveal');\n const observer = new IntersectionObserver((entries) => {\n entries.forEach(entry => {\n if (entry.isIntersecting) {\n entry.target.classList.add('visible');\n }\n });\n }, { threshold: 0.1, rootMargin: '0px 0px -40px 0px' });\n reveals.forEach(el => observer.observe(el));\n\n // 移动端菜单\n function toggleMobile() {\n const menu = document.getElementById('mobileMenu');\n const ham = document.getElementById('hamburger');\n menu.classList.toggle('open');\n ham.classList.toggle('active');\n document.body.style.overflow = menu.classList.contains('open') ? 'hidden' : '';\n }\n\n function closeMobile() {\n const menu = document.getElementById('mobileMenu');\n const ham = document.getElementById('hamburger');\n menu.classList.remove('open');\n ham.classList.remove('active');\n document.body.style.overflow = '';\n }\n\n // 平滑滚动\n document.querySelectorAll('a[href^=\"#\"]').forEach(a => {\n a.addEventListener('click', function(e) {\n e.preventDefault();\n const target = document.querySelector(this.getAttribute('href'));\n if (target) target.scrollIntoView({ behavior: 'smooth' });\n });\n });\n\n // 可访问性\n document.querySelectorAll('button, a, .footer-link, .product-card, .printer-card, .material-card').forEach(el => {\n el.setAttribute('tabindex', '0');\n });\n\n console.log('%c PRINTLAB ', 'background: #00ff88; color: #06080a; font-family: Orbitron; font-size: 16px; font-weight: bold; padding: 6px 14px; border-radius: 4px;');\n console.log('%c 你的想象,我们打印成真 ', 'color: #7a8a9a; font-size: 12px;');\n </script>\n\n</body>\n</html>"
},
"next": [
"添加在线3D模型预览器",
"增加作品评分与评论",
"接入在线支付系统",
"添加打印进度查询",
"增加设计师入驻模块"
],
"breakpoint": "none"
}
```
推理
The user wants me to redesign the page with a focus on:
1. 3D printing works for sale (售卖)
2. Customization as the main theme (定制为主)
3. Include: material introductions, printer models
4. Layout should include:
- Work introductions (作品介绍)
- Selling location: lab (售卖地点:实验室)
- Pricing (价格)
- Customization process (定制流程)
- Printer models (打印机机型)
- Material types (耗材类型)
Keep the same color scheme (green, blue, black/dark background).
Let me redesign the page with these specific requirements in mind. I'll create a more product/sales-oriented layout while keeping the tech aesthetic.Now I have a good understanding. Let me design a comprehensive 3D printing sales/customization landing page with:
1. **作品介绍 (Work Showcase)** - Products for sale with prices
2. **售卖地点:实验室 (Selling Location: Lab)** - Show the lab as the selling point
3. **价格 (Pricing)** - Different pricing tiers
4. **定制流程 (Customization Process)** - Step by step
5. **打印机机型 (Printer Models)** - Available printer models
6. **耗材类型 (Material Types)** - Material options
I'll keep the green, blue, black color scheme from before but completely rework the content and layout to focus on selling 3D printed works.
Let me design a more commercial/product-focused page now.The assets found aren't very relevant to 3D printing. Let me use abstract geometrical shapes and placeholder designs instead, similar to what I did before. The key now is to redesign the content to focus on:
1. **Hero** - 3D打印定制售卖平台
2. **作品展示 (Products for Sale)** - With prices, materials used
3. **实验室介绍 (Lab/Selling Location)**
4. **定制流程 (Customization Process)**
5. **打印机机型与耗材 (Printers & Materials)**
6. **价格方案 (Pricing)**
7. **CTA**
Let me build this now with all the specific content requirements.Let me now build the complete page with the required content focus. I'll use abstract-9.jpg as a background visual and keep the green/blue/black color scheme. The content will be completely reoriented around selling 3D printed custom works.Good, I have abstract-9.jpg. Now let me build the comprehensive page with all the requested content sections. Let me design a fantastic 3D printing marketplace/customization page.The assets aren't great for 3D printing specifically. I'll use abstract-9.jpg as a decorative background element and create the rest with pure CSS design. Let me now build the complete page.
The page structure will be:
1. **Hero** - "定制你的3D打印作品" with the lab branding
2. **热卖作品展示** - Products grid with prices, materials, printer info
3. **售卖地点:实验室** - Lab introduction
4. **定制流程** - 4-step customization process
5. **打印机机型** - Available printer models
6. **耗材类型** - Material types
7. **价格方案** - Pricing tiers
8. **CTA / 联系**
Let me create this now with the full code.Now I have all the info I need. Let me build the complete page.Let me build the full page now with all the requested content. I'll use illustration/17.png as the lab/tech visual.
1. 3D printing works for sale (售卖)
2. Customization as the main theme (定制为主)
3. Include: material introductions, printer models
4. Layout should include:
- Work introductions (作品介绍)
- Selling location: lab (售卖地点:实验室)
- Pricing (价格)
- Customization process (定制流程)
- Printer models (打印机机型)
- Material types (耗材类型)
Keep the same color scheme (green, blue, black/dark background).
Let me redesign the page with these specific requirements in mind. I'll create a more product/sales-oriented layout while keeping the tech aesthetic.Now I have a good understanding. Let me design a comprehensive 3D printing sales/customization landing page with:
1. **作品介绍 (Work Showcase)** - Products for sale with prices
2. **售卖地点:实验室 (Selling Location: Lab)** - Show the lab as the selling point
3. **价格 (Pricing)** - Different pricing tiers
4. **定制流程 (Customization Process)** - Step by step
5. **打印机机型 (Printer Models)** - Available printer models
6. **耗材类型 (Material Types)** - Material options
I'll keep the green, blue, black color scheme from before but completely rework the content and layout to focus on selling 3D printed works.
Let me design a more commercial/product-focused page now.The assets found aren't very relevant to 3D printing. Let me use abstract geometrical shapes and placeholder designs instead, similar to what I did before. The key now is to redesign the content to focus on:
1. **Hero** - 3D打印定制售卖平台
2. **作品展示 (Products for Sale)** - With prices, materials used
3. **实验室介绍 (Lab/Selling Location)**
4. **定制流程 (Customization Process)**
5. **打印机机型与耗材 (Printers & Materials)**
6. **价格方案 (Pricing)**
7. **CTA**
Let me build this now with all the specific content requirements.Let me now build the complete page with the required content focus. I'll use abstract-9.jpg as a background visual and keep the green/blue/black color scheme. The content will be completely reoriented around selling 3D printed custom works.Good, I have abstract-9.jpg. Now let me build the comprehensive page with all the requested content sections. Let me design a fantastic 3D printing marketplace/customization page.The assets aren't great for 3D printing specifically. I'll use abstract-9.jpg as a decorative background element and create the rest with pure CSS design. Let me now build the complete page.
The page structure will be:
1. **Hero** - "定制你的3D打印作品" with the lab branding
2. **热卖作品展示** - Products grid with prices, materials, printer info
3. **售卖地点:实验室** - Lab introduction
4. **定制流程** - 4-step customization process
5. **打印机机型** - Available printer models
6. **耗材类型** - Material types
7. **价格方案** - Pricing tiers
8. **CTA / 联系**
Let me create this now with the full code.Now I have all the info I need. Let me build the complete page.Let me build the full page now with all the requested content. I'll use illustration/17.png as the lab/tech visual.
角色
assistant
content
total_tokens
49187
summary
重新设计了专注于3D打印作品定制售卖的科技官网。保留绿色+蓝色+黑色赛博暗调配色,但彻底重构内容结构:1) Hero区突出'定制你的专属作品'售卖主题;2) 热卖作品展示区(含价格、材料、工艺标注);3) 售卖地点——LAB实验室沉浸式展示;4) 四步定制流程(需求沟通→建模设计→打印成型→交付质检);5) 打印机机型展示墙(Formlabs/Stratasys/拓竹/闪铸等);6) 耗材类型矩阵(光敏树脂/尼龙/碳纤维/TPU等);7) 三档价格方案(基础/进阶/尊享);8) CTA预约打印。使用illustration/17.png作为实验室视觉、abstract-9.jpg作为背景装饰,大量发光边框、玻璃拟态、滚动动画营造沉浸式购物体验。
uiParsing
关闭