<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <title>森格光电科技（西安）有限公司 - 专业激光传感器制造商</title>
    <!-- Bootstrap 5 CSS -->
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/css/bootstrap.min.css" rel="stylesheet">
    <!-- 自定义样式 -->
    <link href=" /css/style.css" rel="stylesheet">
</head>
<body>
    <!-- 导航栏占位符 -->
    <div id="navbar-placeholder"></div>

    <!-- 头部区域 -->
    <section class="hero">
        <div class="hero-bg"></div>
        <div id="particles-js"></div>
        <div class="hero-content">
            <h2 class="hero-company">森格光电科技（西安）有限公司</h2>
            <h1 class="hero-title">专业的激光传感解决方案</h1>
            <p class="hero-subtitle">高精度 · 高可靠 · 高性能</p>
            <p class="hero-text">为工业自动化提供先进的测量与检测技术</p>
            <div class="laser-scan">
                <div class="laser-line"></div>
                <div class="measure-points"></div>
            </div>
        </div>
    </section>

    <!-- 产品优势 -->
    <section class="advantages">
        <div class="container">
            <h2 class="section-title text-center mb-2">产品优势</h2>
            <p class="section-subtitle text-center mb-5">专业的技术，卓越的品质</p>
            <div class="row">
                <div class="col-md-3 mb-4">
                    <div class="advantage-item text-center">
                        <i class="bi bi-rulers"></i>
                        <h3>高精度</h3>
                        <p>纳米级测量精度<br>稳定可靠的测量结果<br>精密校准系统</p>
                    </div>
                </div>
                <div class="col-md-3 mb-4">
                    <div class="advantage-item text-center">
                        <i class="bi bi-shield-check"></i>
                        <h3>高稳定性</h3>
                        <p>工业级防护设计<br>IP67防护等级<br>抗干扰性能强</p>
                    </div>
                </div>
                <div class="col-md-3 mb-4">
                    <div class="advantage-item text-center">
                        <i class="bi bi-lightning"></i>
                        <h3>高速响应</h3>
                        <p>最高100kHz采样率<br>实时数据处理<br>快速反馈控制</p>
                    </div>
                </div>
                <div class="col-md-3 mb-4">
                    <div class="advantage-item text-center">
                        <i class="bi bi-tools"></i>
                        <h3>易于集成</h3>
                        <p>多种接口支持<br>完善的二次开发SDK<br>丰富的应用案例</p>
                    </div>
                </div>
            </div>
        </div>
    </section>

    <!-- 产品中心 -->
    <section class="products py-5">
        <div class="container">
            <h2 class="section-title text-center mb-2">产品中心</h2>
            <p class="section-subtitle text-center mb-5">专业的激光传感测量解决方案</p>
            
            <div class="row g-4">
                <!-- 激光位移传感器 -->
                <div class="col-md-4 mb-4">
                    <div class="product-card">
                        <div class="product-header">
                            <div class="product-image">
                                <img src=" /images/products/displacement.svg" alt="激光位移传感器">
                            </div>
                            <div class="product-title">
                                <h3>激光位移传感器</h3>
                            </div>
                        </div>
                        <div class="product-content">
                            <div class="product-features">
                                <p>高精度非接触式测量，适用于各类工业场景的精密位移测量</p>
                                <ul>
                                    <li>测量范围：0.5mm-1000mm</li>
                                    <li>分辨率：最高0.01μm</li>
                                    <li>采样率：100kHz</li>
                                </ul>
                            </div>
                        </div>
                        <div class="product-footer">
                            <a href=" /products/displacement/" class="btn">了解详情</a>
                        </div>
                    </div>
                </div>

                <!-- 光谱共焦传感器 -->
                <div class="col-md-4 mb-4">
                    <div class="product-card">
                        <div class="product-header">
                            <div class="product-image">
                                <img src=" /images/products/confocal.svg" alt="光谱共焦传感器">
                            </div>
                            <div class="product-title">
                                <h3>光谱共焦传感器</h3>
                            </div>
                        </div>
                        <div class="product-content">
                            <div class="product-features">
                                <p>超高精度表面测量，特别适用于透明材料和微小结构测量</p>
                                <ul>
                                    <li>测量范围：0.1mm-30mm</li>
                                    <li>分辨率：3nm</li>
                                    <li>适用透明材料测量</li>
                                </ul>
                            </div>
                        </div>
                        <div class="product-footer">
                            <a href=" /products/confocal/" class="btn">了解详情</a>
                        </div>
                    </div>
                </div>

                <!-- 激光轮廓仪 -->
                <div class="col-md-4 mb-4">
                    <div class="product-card">
                        <div class="product-header">
                            <div class="product-image">
                                <img src=" /images/products/profile.svg" alt="激光轮廓仪">
                            </div>
                            <div class="product-title">
                                <h3>激光轮廓仪</h3>
                            </div>
                        </div>
                        <div class="product-content">
                            <div class="product-features">
                                <p>高精度轮廓扫描测量，实现快速2D/3D轮廓检测</p>
                                <ul>
                                    <li>扫描宽度：最大2000mm</li>
                                    <li>分辨率：2μm</li>
                                    <li>扫描速率：4000Hz</li>
                                </ul>
                            </div>
                        </div>
                        <div class="product-footer">
                            <a href=" /products/profile/" class="btn">了解详情</a>
                        </div>
                    </div>
                </div>

                <!-- 激光测距传感器 -->
                <div class="col-md-4 mb-4">
                    <div class="product-card">
                        <div class="product-header">
                            <div class="product-image">
                                <img src=" /images/products/distance.svg" alt="激光测距传感器">
                            </div>
                            <div class="product-title">
                                <h3>激光测距传感器</h3>
                            </div>
                        </div>
                        <div class="product-content">
                            <div class="product-features">
                                <p>远距离精确测量，适用于大尺寸工件和长距离场景</p>
                                <ul>
                                    <li>测量范围：0.2m-100m</li>
                                    <li>精度：±1mm</li>
                                    <li>响应时间：≤0.5ms</li>
                                </ul>
                            </div>
                        </div>
                        <div class="product-footer">
                            <a href=" /products/distance/" class="btn">了解详情</a>
                        </div>
                    </div>
                </div>

                <!-- 3D-TOF传感器 -->
                <div class="col-md-4 mb-4">
                    <div class="product-card">
                        <div class="product-header">
                            <div class="product-image">
                                <img src=" /images/products/3d-sensor.svg" alt="3D-TOF传感器">
                            </div>
                            <div class="product-title">
                                <h3>3D-TOF传感器</h3>
                            </div>
                        </div>
                        <div class="product-content">
                            <div class="product-features">
                                <p>实时3D场景感知，为智能制造提供空间数据支持</p>
                                <ul>
                                    <li>视场角：最大90°</li>
                                    <li>帧率：最高30fps</li>
                                    <li>深度分辨率：±5mm</li>
                                </ul>
                            </div>
                        </div>
                        <div class="product-footer">
                            <a href=" /products/tof/" class="btn">了解详情</a>
                        </div>
                    </div>
                </div>

                <!-- 激光雷达 -->
                <div class="col-md-4 mb-4">
                    <div class="product-card">
                        <div class="product-header">
                            <div class="product-image">
                                <img src=" /images/products/lidar.svg" alt="激光雷达">
                            </div>
                            <div class="product-title">
                                <h3>激光雷达</h3>
                            </div>
                        </div>
                        <div class="product-content">
                            <div class="product-features">
                                <p>大范围环境扫描，为自动化导航和场景重建提供解决方案</p>
                                <ul>
                                    <li>扫描范围：360°</li>
                                    <li>测量距离：0.1m-30m</li>
                                    <li>扫描频率：15-30Hz</li>
                                </ul>
                            </div>
                        </div>
                        <div class="product-footer">
                            <a href=" /products/lidar/" class="btn">了解详情</a>
                        </div>
                    </div>
                </div>
            </div>

            <div class="text-center mt-5">
                <a href=" /products/" class="btn btn-primary btn-lg">查看更多产品</a>
            </div>
        </div>
    </section>

    <!-- 应用案例 -->
    <section class="cases py-5">
        <div class="container">
            <h2 class="section-title text-center mb-2">应用案例</h2>
            <p class="section-subtitle text-center mb-5">为不同行业提供专业的激光测量解决方案</p>
            
            <div class="row g-4">
                <!-- 汽车制造 -->
                <div class="col-md-3">
                    <div class="case-card">
                        <div class="case-image">
                            <img src=" /images/cases/automotive.jpg" alt="汽车制造" class="img-fluid">
                            <div class="case-overlay">
                                <div class="case-content">
                                    <h3>汽车制造</h3>
                                    <p>高精度测量解决方案，助力汽车智能制造</p>
                                    <ul class="case-features">
                                        <li>车身尺寸测量</li>
                                        <li>零部件检测</li>
                                        <li>装配控制</li>
                                    </ul>
                                    <a href=" /cases/automotive/" class="btn btn-light">了解更多</a>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>

                <!-- 半导体制造 -->
                <div class="col-md-3">
                    <div class="case-card">
                        <div class="case-image">
                            <img src=" /images/cases/steel.png" alt="半导体制造" class="img-fluid">
                            <div class="case-overlay">
                                <div class="case-content">
                                    <h3>半导体制造</h3>
                                    <p>纳米级精度测量，保障芯片制造品质</p>
                                    <ul class="case-features">
                                        <li>晶圆测量</li>
                                        <li>芯片封装</li>
                                        <li>光刻对准</li>
                                    </ul>
                                    <a href=" /cases/semiconductor/" class="btn btn-light">了解更多</a>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>

                <!-- 3C电子 -->
                <div class="col-md-3">
                    <div class="case-card">
                        <div class="case-image">
                            <img src=" /images/cases/electronics.jpg" alt="3C电子" class="img-fluid">
                            <div class="case-overlay">
                                <div class="case-content">
                                    <h3>3C电子</h3>
                                    <p>微米级精密检测，提升生产效率</p>
                                    <ul class="case-features">
                                        <li>手机制造</li>
                                        <li>PCB检测</li>
                                        <li>自动化装配</li>
                                    </ul>
                                    <a href=" /cases/electronics/" class="btn btn-light">了解更多</a>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>

                <!-- 新能源 -->
                <div class="col-md-3">
                    <div class="case-card">
                        <div class="case-image">
                            <img src=" /images/cases/energy.jpg" alt="新能源" class="img-fluid">
                            <div class="case-overlay">
                                <div class="case-content">
                                    <h3>新能源</h3>
                                    <p>全方位检测方案，助力绿色发展</p>
                                    <ul class="case-features">
                                        <li>光伏电池检测</li>
                                        <li>风电叶片检测</li>
                                        <li>储能系统监测</li>
                                    </ul>
                                    <a href=" /cases/new-energy/" class="btn btn-light">了解更多</a>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>

            <div class="text-center mt-5">
                <a href=" /cases/" class="btn btn-primary btn-lg">查看更多案例</a>
            </div>
        </div>
    </section>

    <!-- 页脚占位符 -->
    <div id="footer-placeholder"></div>

    <!-- Bootstrap 5 JS -->
    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/js/bootstrap.bundle.min.js"></script>
    <!-- Particles.js -->
    <script src="https://cdn.jsdelivr.net/particles.js/2.0.0/particles.min.js"></script>
    <!-- 组件加载脚本 -->
    <script src=" /js/components.js"></script>
    <!-- 粒子效果配置 -->
    <script>
        particlesJS('particles-js', {
            particles: {
                number: {
                    value: 80,
                    density: {
                        enable: true,
                        value_area: 800
                    }
                },
                color: {
                    value: '#ffffff'
                },
                shape: {
                    type: 'circle'
                },
                opacity: {
                    value: 0.5,
                    random: true
                },
                size: {
                    value: 3,
                    random: true
                },
                line_linked: {
                    enable: true,
                    distance: 150,
                    color: '#ffffff',
                    opacity: 0.4,
                    width: 1
                },
                move: {
                    enable: true,
                    speed: 2,
                    direction: 'none',
                    random: true,
                    straight: false,
                    out_mode: 'out'
                }
            },
            interactivity: {
                detect_on: 'canvas',
                events: {
                    onhover: {
                        enable: true,
                        mode: 'grab'
                    },
                    onclick: {
                        enable: true,
                        mode: 'push'
                    },
                    resize: true
                }
            },
            retina_detect: true
        });

        // 动态添加测量点
        function addMeasurePoint() {
            const measurePoints = document.querySelector('.measure-points');
            const point = document.createElement('div');
            point.className = 'measure-point';
            point.style.left = Math.random() * 100 + '%';
            point.style.top = Math.random() * 100 + '%';
            measurePoints.appendChild(point);
            
            setTimeout(() => {
                point.remove();
            }, 2000);
        }

        setInterval(addMeasurePoint, 300);
    </script>
</body>
</html> 