/* 忠实保留桌面设计稿的页面样式与响应式断点。 */

    :root { --ink:#101418; --muted:#64707d; --line:#e7ebef; --red:#e5262b; --blue:#226edc; --soft:#f5f8fb; --card:#fff; --shadow:0 18px 50px rgba(11,28,45,.10); }
    * { box-sizing:border-box; }
    html { scroll-behavior:smooth; }
    body { margin:0; font-family:"Microsoft YaHei","PingFang SC",Arial,sans-serif; color:var(--ink); background:#fff; }
    a { color:inherit; text-decoration:none; }
    button,select,input { font:inherit; }
    .topbar { height:36px; background:#161b20; color:#e8edf2; display:flex; align-items:center; justify-content:space-between; padding:0 clamp(20px,5vw,80px); font-size:12px; }
    .topbar .meta { display:flex; gap:24px; align-items:center; }
    .topbar span { display:inline-flex; gap:7px; align-items:center; }
    .topbar .download { color:#fff; font-weight:700; }
    header { height:78px; display:flex; align-items:center; justify-content:space-between; padding:0 clamp(20px,5vw,80px); background:#fff; border-bottom:1px solid #edf0f2; position:sticky; z-index:20; top:0; }
    .brand img { width:146px; display:block; }
    nav { display:flex; align-items:center; gap:38px; font-weight:650; font-size:15px; }
    nav > a, nav > .has-mega > .nav-trigger { padding:28px 0 25px; position:relative; color:inherit; font-weight:650; font-size:15px; border:0; background:transparent; cursor:pointer; }
    nav > a.active, nav > a:hover, .nav-trigger:hover, .has-mega:hover .nav-trigger, .has-mega.is-open .nav-trigger { color:var(--red); }
    nav > a.active::after, .has-mega.is-open .nav-trigger::after { content:""; position:absolute; left:0; right:0; bottom:0; height:3px; border-radius:8px; background:var(--red); }
    .nav-contact { border:1px solid #d9e0e7; border-radius:3px; padding:9px 16px; font-weight:700; font-size:14px; }
    .has-mega { position:relative; display:flex; align-items:center; }.mega-toggle { border:0; background:transparent; color:inherit; cursor:pointer; padding:28px 0 25px 6px; font-size:13px; transition:transform .2s; }.has-mega.is-open .mega-toggle { color:var(--red); transform:rotate(180deg); }
    .mega-menu { width:min(900px,calc(100vw - 38px)); position:absolute; z-index:30; top:100%; left:50%; padding:0; border:1px solid #e1e7ec; background:#fff; box-shadow:0 22px 48px rgba(6,21,34,.2); opacity:0; visibility:hidden; pointer-events:none; transform:translate(-40%,12px); transition:opacity .18s,transform .18s,visibility .18s; }
    .has-mega:hover .mega-menu,.has-mega:focus-within .mega-menu,.has-mega.is-open .mega-menu { opacity:1; visibility:visible; pointer-events:auto; transform:translate(-40%,0); }
    .mega-top { display:grid; grid-template-columns:205px 1fr; }.mega-intro { padding:28px 24px; background:#151b20; color:#fff; }.mega-intro small { color:#ff6d71; display:block; letter-spacing:.13em; font-size:10px; font-weight:800; }.mega-intro strong { display:block; font-size:22px; margin:12px 0 9px; }.mega-intro p { font-size:12px; line-height:1.7; color:#b9c3ca; margin:0; }
    .mega-groups { display:grid; grid-template-columns:repeat(3,1fr); padding:22px 14px 15px; gap:0; }.mega-group { display:block; min-height:124px; padding:7px 13px 14px; border-left:1px solid #edf0f3; transition:background .16s; }.mega-group:first-child { border-left:0; }.mega-group:hover { background:#fafbfc; color:inherit; }.mega-title { display:block; color:var(--red); font-size:17px; font-weight:800; margin-bottom:7px; }.mega-sub { display:block; color:#26323c; font-size:12px; line-height:1.55; font-weight:700; }.mega-links { display:block; margin-top:9px; color:#798591; font-size:11px; line-height:1.7; }
    .mega-bottom { border-top:1px solid #e9edf0; padding:13px 24px; display:flex; gap:26px; align-items:center; background:#f8fafb; }.mega-bottom a { padding:0; font-size:12px; color:#536270; }.mega-bottom a::after { display:none; }.mega-bottom a:hover { color:var(--red); }.mega-bottom strong { color:#202a33; margin-right:auto; font-size:12px; }
    .mobile-toggle { display:none; border:0; background:none; font-size:26px; }
    .hero { min-height:630px; position:relative; display:flex; align-items:center; overflow:hidden; background:#080c11 var(--page-background0) center/cover no-repeat; color:#fff; }
    .hero::before { content:""; position:absolute; inset:0; background:linear-gradient(90deg,rgba(3,7,12,.88) 0%, rgba(3,7,12,.63) 34%, rgba(3,7,12,.14) 59%, rgba(3,7,12,.05) 100%); }
    .hero::after { content:""; position:absolute; inset:auto 0 0; height:180px; background:linear-gradient(transparent,rgba(0,0,0,.35)); }
    .hero-content { max-width:1320px; width:100%; margin:0 auto; padding:65px clamp(24px,6vw,84px); position:relative; z-index:1; }
    .eyebrow { display:flex; gap:10px; align-items:center; font-size:13px; letter-spacing:.16em; font-weight:700; color:#f5bdbe; }
    .eyebrow::before { content:""; width:35px; height:2px; background:var(--red); }
    h1 { font-size:clamp(42px,5.2vw,76px); line-height:1.16; margin:19px 0 20px; max-width:850px; letter-spacing:-.04em; }
    h1 em { font-style:normal; color:#ff4c50; }
    .hero-copy { max-width:550px; font-size:17px; line-height:1.8; color:#f2f5f7; }
    .hero-actions { display:flex; gap:13px; margin-top:32px; }
    .btn { cursor:pointer; border:1px solid transparent; padding:13px 22px; min-height:48px; font-weight:700; transition:.2s ease; display:inline-flex; align-items:center; justify-content:center; gap:9px; }
    .btn-primary { background:var(--red); color:#fff; }
    .btn-primary:hover { background:#c61e24; transform:translateY(-2px); }
    .btn-ghost { background:rgba(255,255,255,.1); color:#fff; border-color:rgba(255,255,255,.65); backdrop-filter:blur(5px); }
    .btn-ghost:hover { background:#fff; color:var(--ink); }
    .hero-bottom { position:absolute; z-index:2; bottom:20px; left:50%; transform:translateX(-50%); display:flex; gap:8px; }
    .hero-bottom i { width:8px; height:8px; border-radius:50%; background:#fff; opacity:.4; cursor:pointer; transition:.25s; } .hero-bottom i.active { opacity:1; width:28px; border-radius:10px; }
    .section { padding:92px clamp(20px,6vw,84px); }
    .section-inner { max-width:1320px; margin:auto; }
    .section-head { display:flex; align-items:end; justify-content:space-between; gap:28px; margin-bottom:38px; }
    .kicker { color:var(--red); font-size:13px; font-weight:800; letter-spacing:.14em; text-transform:uppercase; }
    h2 { font-size:clamp(30px,3.2vw,46px); margin:10px 0 0; letter-spacing:-.035em; }
    .section-desc { max-width:410px; margin:0; line-height:1.75; color:var(--muted); }
    .stats { background:#171d22; color:#fff; padding:38px clamp(20px,6vw,84px); }
    .stats-inner { max-width:1320px; margin:auto; display:grid; grid-template-columns:1.5fr repeat(3,1fr); align-items:center; }
    .stats-intro { font-size:22px; font-weight:750; line-height:1.4; max-width:330px; }
    .stat { border-left:1px solid rgba(255,255,255,.22); padding:3px 32px; }
    .stat strong { display:block; font-size:34px; color:#fff; margin-bottom:6px; } .stat span { color:#bac4cd; font-size:13px; }
    .match-area { background:linear-gradient(180deg,#f1f5f8 0%,#fff 100%); padding-top:95px; }
    .match-card { background:var(--card); border-radius:16px; padding:28px; box-shadow:var(--shadow); border:1px solid #e8edf1; }
    .form-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:19px; }
    .field { display:flex; flex-direction:column; gap:9px; } .field label { font-size:13px; font-weight:700; }
    select,input { width:100%; height:45px; border:1px solid #d8e0e7; border-radius:5px; padding:0 12px; outline:none; background:#fff; transition:.15s; }
    select:focus,input:focus { border-color:var(--blue); box-shadow:0 0 0 3px rgba(34,110,220,.12); }
    .field.span2 { grid-column:span 2; }
    .form-actions { grid-column:1/-1; display:flex; gap:13px; justify-content:center; padding-top:5px; }
    .match-button { background:#2475e9; color:#fff; min-width:238px; border-radius:6px; } .match-button:hover { background:#1259bd; }
    .reset-button { background:#fff; color:#526170; border-color:#d6dde4; border-radius:6px; }
    .result { display:none; margin-top:22px; border-top:1px solid var(--line); padding-top:22px; }
    .result.show { display:block; animation:rise .28s ease both; }
    @keyframes rise { from { opacity:0; transform:translateY(7px); } to { opacity:1; transform:translateY(0); } }
    .result-title { display:flex; align-items:center; justify-content:space-between; gap:15px; margin-bottom:16px; }
    .result-title b { font-size:17px; } .tag { background:#e8f1ff; color:#1761ca; padding:5px 9px; border-radius:99px; font-size:12px; font-weight:700; }
    .recommendations { display:grid; grid-template-columns:repeat(3,1fr); gap:14px; }
    .rec { display:flex; align-items:center; gap:13px; background:#f6f9fc; border:1px solid #e6edf3; padding:12px; border-radius:8px; }
    .rec img { height:74px; width:91px; object-fit:contain; mix-blend-mode:multiply; }
    .rec b { display:block; font-size:15px; margin-bottom:5px; }.rec small { color:var(--muted); line-height:1.45; display:block; }
    .products { display:grid; grid-template-columns:repeat(4,1fr); gap:20px; }
    .product { border:1px solid #e3e8ed; min-height:375px; background:#fff; display:flex; flex-direction:column; overflow:hidden; transition:.25s ease; }
    .product:hover { transform:translateY(-7px); box-shadow:var(--shadow); border-color:transparent; }
    .product-image { height:210px; position:relative; display:flex; justify-content:center; align-items:center; background:#f6f8fa; overflow:hidden; }
    .product-image::after { content:""; width:140px; height:16px; position:absolute; bottom:22px; background:radial-gradient(ellipse at center,rgba(13,25,34,.25),transparent 70%); filter:blur(5px); }
    .product-image img { width:90%; height:190px; object-fit:contain; mix-blend-mode:multiply; position:relative; z-index:1; transition:.35s; }.product:hover .product-image img { transform:scale(1.06); }
    .power { position:absolute; z-index:2; left:14px; top:14px; background:#fff; padding:5px 8px; color:#e1282d; font-size:11px; font-weight:800; }
    .product-body { padding:19px; display:flex; flex:1; flex-direction:column; }.product h3 { margin:0; font-size:20px; }.product p { color:var(--muted); font-size:13px; line-height:1.6; margin:10px 0 18px; }.product a { font-size:13px; font-weight:800; margin-top:auto; color:#1c67cf; }
    .solutions { background:#121a21; color:#fff; position:relative; overflow:hidden; }.solutions::before { content:""; position:absolute; width:640px; height:640px; border:1px solid rgba(255,255,255,.1); border-radius:50%; top:-430px; right:-120px; }
    .solutions .section-desc { color:#b7c3cd; }.solution-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:2px; position:relative; }.solution { padding:31px 26px; background:rgba(255,255,255,.05); min-height:225px; transition:.2s; }.solution:hover { background:var(--red); }.solution .number { color:#f6585c; font-weight:800; font-size:13px; }.solution:hover .number { color:#fff; }.solution h3 { font-size:22px; margin:28px 0 10px; }.solution p { color:#c6d0d7; font-size:14px; line-height:1.65; margin:0; }.solution:hover p { color:#fff; }
    .about { display:grid; grid-template-columns:1.06fr .94fr; gap:70px; align-items:center; }.about-visual { min-height:360px; background:linear-gradient(140deg,#e8edf0,#b8c1c7); position:relative; overflow:hidden; }.about-visual img { width:100%; height:100%; position:absolute; inset:0; object-fit:cover; mix-blend-mode:multiply; padding:28px; }.about-visual span { position:absolute; bottom:20px; left:20px; z-index:2; background:var(--red); color:#fff; padding:12px 16px; font-size:13px; font-weight:700; }.about-copy p { color:var(--muted); line-height:1.85; }.ticks { margin:23px 0; display:grid; gap:12px; }.tick { display:flex; gap:10px; font-size:14px; font-weight:700; }.tick::before { content:"✓"; color:var(--red); }
    footer { background:#0d1216; color:#c3ccd3; padding:50px clamp(20px,6vw,84px) 26px; }.footer-grid { max-width:1320px; margin:auto; display:grid; grid-template-columns:2fr repeat(3,1fr); gap:30px; }.footer-grid img { width:130px; filter:brightness(0) invert(1); margin-bottom:14px; }.footer-grid h4 { color:#fff; margin:5px 0 16px; }.footer-grid a,.footer-grid p { font-size:13px; line-height:2; margin:0; display:block; }.copyright { max-width:1320px; border-top:1px solid #2a3238; margin:35px auto 0; padding-top:20px; color:#7f8b94; font-size:12px; }
    .consult { position:fixed; right:22px; bottom:22px; width:54px; height:54px; border:0; border-radius:50%; background:var(--red); color:#fff; font-size:22px; box-shadow:0 8px 22px rgba(229,38,43,.4); z-index:10; cursor:pointer; }
    @media (max-width:980px) { nav { gap:18px; } .stats-inner { grid-template-columns:repeat(2,1fr); gap:25px; }.stats-intro { grid-column:1/-1; }.form-grid { grid-template-columns:repeat(2,1fr); }.products { grid-template-columns:repeat(2,1fr); }.recommendations { grid-template-columns:1fr; }.about { gap:35px; }.footer-grid { grid-template-columns:2fr 1fr 1fr; }.footer-grid>div:last-child { display:none; } }
    @media (max-width:680px) { .topbar .meta span:nth-child(2),.topbar .download { display:none; } header { height:64px; }.brand img { width:118px; } nav { display:none; position:absolute; top:64px; left:0; right:0; padding:13px 24px; background:#fff; box-shadow:0 15px 25px rgba(0,0,0,.12); }.nav-open nav { display:grid; gap:0; }.nav-open nav > a,nav > .has-mega > .nav-trigger { padding:12px 0; text-align:left; }.nav-trigger { width:100%; }.mega-menu { position:static; width:100%; transform:none; display:none; margin:0 0 7px; box-shadow:none; border:1px solid #e5e9ed; }.has-mega:hover .mega-menu,.has-mega:focus-within .mega-menu,.has-mega.is-open .mega-menu { display:block; transform:none; }.mega-top { grid-template-columns:1fr; }.mega-intro { padding:15px 17px; }.mega-intro strong { font-size:18px; margin:6px 0; }.mega-intro p { display:none; }.mega-groups { grid-template-columns:repeat(2,1fr); padding:10px 5px; }.mega-group { min-height:96px; padding:9px 11px; }.mega-title { font-size:15px; }.mega-bottom { padding:11px 15px; gap:12px; flex-wrap:wrap; }.mega-bottom strong { width:100%; }.mobile-toggle { display:block; }.hero { min-height:565px; }.hero-content { padding-top:50px; }.hero-copy { font-size:15px; }.section { padding:65px 20px; }.section-head { display:block; }.section-desc { margin-top:15px; }.form-grid,.products,.solution-grid,.about,.footer-grid { grid-template-columns:1fr; }.field.span2 { grid-column:auto; }.match-card { padding:19px; }.form-actions { flex-direction:column; }.btn { width:100%; }.stats-inner { grid-template-columns:1fr; }.stat { border-left:0; border-top:1px solid rgba(255,255,255,.2); padding:18px 0 0; }.about-visual { min-height:280px; }.footer-grid>div:last-child { display:block; } }
    .match-area { display:none; }
    @media (max-width:680px) { .has-mega { display:flex; flex-wrap:wrap; }.nav-trigger { width:calc(100% - 36px); }.mega-toggle { width:36px; padding:12px 3px; }.mega-menu { flex-basis:100%; } }
    .facebook-icon{width:18px;height:18px;border-radius:3px;background:#c3ccd3;color:#0d1216;display:inline-grid;place-items:center;font-family:Arial,sans-serif;font-size:17px;font-weight:800;line-height:1}.youtube-link:hover .facebook-icon{background:#fff}


    .youtube-link{display:flex!important;width:max-content;align-items:center;gap:8px!important;margin:12px 0 0!important;padding:0!important;background:transparent!important;color:#c3ccd3!important;font-size:13px!important;font-weight:400!important;line-height:2!important;transition:color .18s}.youtube-link:hover{color:#fff!important;transform:none}.youtube-icon{width:18px;height:13px;border-radius:4px;background:#c3ccd3;display:inline-grid;place-items:center}.youtube-link:hover .youtube-icon{background:#fff}.youtube-icon:after{content:"";margin-left:1px;border-top:3px solid transparent;border-bottom:3px solid transparent;border-left:5px solid #0d1216}