:root{
    --bg:#f6f8fb;
    --surface:#ffffff;
    --alt:#f7f8fa;
    --ink:#1f2d3d;
    --ink-soft:#5a6b7b;
    --primary:#4d7ba6;
    --primary-dark:#33566f;
    --primary-darker:#28404f;
    --accent:#7ba2c4;
    --line:#e8edf4;
    --slate:#64748b;
    --radius:14px;
    --shadow:0 2px 12px rgba(31,45,61,.05);
    --maxw:1180px;
    --w-title:600;
    --w-body:400;
    --w-light:300;
  }
*{box-sizing:border-box;margin:0;padding:0;}
html{scroll-behavior:smooth;}
  body{
    font-family:"Noto Sans SC","Source Han Sans CN","PingFang SC","Microsoft YaHei","Hiragino Sans GB","Segoe UI",Roboto,Helvetica,Arial,sans-serif;
    color:var(--ink);
    background:var(--bg);
    font-size:15px;line-height:1.6;font-weight:var(--w-body);
    -webkit-font-smoothing:antialiased;
  }
a{color:inherit;text-decoration:none;}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 24px;}
header{
    position:sticky;top:0;z-index:100;
    background:rgba(255,255,255,.92);
    backdrop-filter:saturate(150%) blur(12px);
    border-bottom:1px solid var(--line);
    box-shadow:0 2px 14px rgba(31,45,61,.05);
    transition:background .25s ease,box-shadow .25s ease;
  }
header.scrolled{background:rgba(255,255,255,.96);box-shadow:0 8px 24px rgba(31,45,61,.10);}
.nav{display:flex;align-items:center;justify-content:space-between;height:72px;}
.brand{display:flex;align-items:center;gap:12px;color:var(--primary-dark);text-decoration:none;}
.brand-mark{height:42px;width:auto;flex:none;display:block;object-fit:contain;}
.brand-text{display:flex;flex-direction:column;justify-content:center;line-height:1.12;}
.brand-name{font-size:33.6px;font-weight:700;color:var(--primary-dark);letter-spacing:.5px;}
.brand-sub{font-size:15px;font-weight:500;color:#8ba3bd;letter-spacing:.3px;margin-top:2px;}
.menu{display:flex;gap:6px;list-style:none;align-items:center;}
.menu a{
    position:relative;padding:8px 14px;border-radius:8px;font-size:15px;letter-spacing:1.5px;color:var(--ink-soft);
    transition:color .15s;
  }
.menu a::after{content:"";position:absolute;left:14px;right:14px;bottom:6px;height:2px;background:var(--primary);border-radius:2px;transform:scaleX(0);transition:transform .22s ease;opacity:.85;}
.menu a:hover{color:var(--primary-dark);}
.menu a:hover::after{transform:scaleX(1);}
.menu .cta{
    background:var(--primary);color:#fff;font-weight:600;
  }
.menu .cta:hover{background:var(--primary-dark);color:#fff;}
.menu .cta::after{display:none;}
.burger{display:none;flex-direction:column;gap:5px;cursor:pointer;background:none;border:0;padding:8px;}
.burger span{width:24px;height:2px;background:var(--ink);border-radius:2px;}
.nav-auth{position:relative;}
.nav-auth-btn{
    display:inline-flex;align-items:center;gap:6px;cursor:pointer;
    background:none;border:0;font:inherit;color:var(--ink-soft);
    padding:8px 14px;border-radius:8px;font-size:15px;letter-spacing:1.5px;
    transition:background .15s,color .15s;
  }
.nav-auth-btn:hover{background:var(--bg);color:var(--primary-dark);}
.nav-auth-btn .caret{font-size:12.1px;line-height:1;color:var(--slate);transition:transform .15s;}
.nav-auth.open .nav-auth-btn .caret,
  .nav-auth:hover .nav-auth-btn .caret{transform:rotate(180deg);}
.nav-auth-menu{
    position:absolute;top:calc(100% + 6px);right:0;min-width:172px;
    list-style:none;margin:0;padding:8px;
    background:#fff;border:1px solid var(--line);border-radius:14px;
    box-shadow:0 12px 28px rgba(31,45,61,.14);
    display:none;flex-direction:column;gap:4px;z-index:60;
  }
.nav-auth:hover .nav-auth-menu,
  .nav-auth.open .nav-auth-menu{display:flex;}
.nav-auth-menu li{width:100%;}
.nav-auth-menu a{
    display:block;padding:10px 14px;border-radius:8px;font-size:14.5px;
    color:var(--ink-soft);text-decoration:none;
    transition:background .15s,color .15s;
  }
.nav-auth-menu a:hover{background:var(--bg);color:var(--primary-dark);}
.nav-auth-menu a.cta{background:var(--primary);color:#fff;font-weight:600;text-align:center;margin-top:2px;}
.nav-auth-menu a.cta:hover{background:var(--primary-dark);color:#fff;}
.hero{
    background:#eaf2fc url('/hero-bg.jpg?v=20261005f') center/cover no-repeat;
    color:#0f2a4a;position:relative;overflow:hidden;
  }
.hero::after{
    content:"";position:absolute;inset:0;
    background:linear-gradient(90deg,rgba(243,248,252,.96) 0%,rgba(243,248,252,.80) 45%,rgba(243,248,252,.40) 100%);
    z-index:0;pointer-events:none;
  }
.hero .wrap{padding-top:72px;padding-bottom:120px;position:relative;z-index:1;text-align:center;}
.hero .tag{
    display:inline-block;font-size:14.3px;letter-spacing:2px;
    background:rgba(51,86,111,.10);color:#33566f;padding:6px 14px;border-radius:999px;margin-bottom:22px;
  }
.hero h1{font-size:40px;line-height:1.2;font-weight:700;margin-bottom:16px;letter-spacing:1px;}
.hero-slogan{font-size:21px;font-weight:600;color:#0f2a4a;letter-spacing:1px;line-height:1.5;margin:0 0 18px;}
.hero-intro{font-size:16.5px;line-height:1.75;color:rgba(31,45,61,.78);max-width:720px;margin:0 auto 34px;letter-spacing:.01em;}
.hero-points{list-style:none;margin:0 auto 40px;max-width:600px;padding:0;text-align:center;}
.hero-points li{font-size:16px;line-height:1.75;color:var(--ink);margin-bottom:13px;}
.hero-points li::before{content:"▷";color:#6f9fce;margin-right:9px;font-weight:400;}
.hero-points li:last-child{margin-bottom:0;}
.hero .sub{font-size:14.1px;color:rgba(15,42,74,.68);max-width:680px;margin-bottom:34px;margin-left:auto;margin-right:auto;line-height:1.65;}
.hero .btns{display:flex;gap:16px;flex-wrap:wrap;justify-content:center;}
.btn{
    display:inline-flex;align-items:center;justify-content:center;min-height:46px;
    padding:13px 30px;border-radius:10px;font-size:14.4px;font-weight:600;cursor:pointer;
    border:1px solid transparent;transition:background .2s ease,border-color .2s ease,color .2s ease,box-shadow .2s ease;
  }
.btn-primary{background:var(--primary);color:#fff;}
.btn-primary:hover{background:var(--primary-dark);}
.btn-ghost{background:#fff;border:1px solid var(--primary);color:var(--primary-dark);}
.btn-ghost:hover{background:#f1f6fc;}
.hero .btn-primary{background:var(--primary);color:#fff;box-shadow:0 6px 16px rgba(51,86,111,.16);}
.hero .btn-primary:hover{background:var(--primary-dark);}
.hero .btn-ghost{border-color:var(--primary);color:var(--primary-dark);}
.hero .btn-ghost:hover{background:rgba(255,255,255,.65);}
.btn:active{transform:translateY(1px);}
.btn-primary:active{background:var(--primary-darker);box-shadow:inset 0 2px 6px rgba(0,0,0,.18);}
.btn-ghost:active{background:rgba(77,123,166,.16);}
.hero .btn-primary:active{background:var(--primary-darker);}
.hero .btn-ghost:active{background:rgba(255,255,255,.5);}
section{padding:112px 0;}
.section-head{text-align:center;margin-bottom:64px;}
.section-head .eyebrow{color:var(--primary);font-weight:600;letter-spacing:1px;font-size:14px;}
.section-head h2{font-size:28.8px;font-weight:var(--w-title);margin:10px 0 12px;color:var(--ink);display:flex;align-items:center;justify-content:center;gap:10px;}
.sec-ico{flex:none;width:28px;height:28px;color:var(--primary-dark);}
.section-head p{color:var(--ink-soft);max-width:640px;margin:0 auto;font-size:15px;line-height:1.62;}
#pricing .section-head p{max-width:1120px;padding:0 10px;line-height:1.62;}
/* 业务服务：拓宽描述容器，压缩为 2 行展示（仅改容器宽度） */
#services .section-head p{max-width:800px;}
.accent-bar{width:52px;height:4px;border-radius:4px;background:linear-gradient(90deg,#4d7ba6,#7ba2c4);margin:16px auto 0;}
#about{background:var(--alt);}
.about-grid{display:grid;grid-template-columns:1fr;gap:48px;align-items:center;}
.about-text{background:linear-gradient(135deg,#eef4fb,#f6f9fd);border:1px solid var(--line);border-radius:var(--radius);box-shadow:0 2px 12px rgba(31,45,61,.05);padding:58px 40px;display:flex;gap:36px;align-items:center;}
.about-text p{color:var(--ink-soft);margin-bottom:16px;font-size:15px;line-height:1.62;}
.about-text .hl{color:var(--primary-dark);font-weight:600;}
.about-points{list-style:none;margin-top:0;}
.about-points li{
    position:relative;padding-left:28px;margin-bottom:12px;color:var(--ink);font-size:14.1px;
  }
.about-points li::before{
    content:"";position:absolute;left:0;top:9px;width:14px;height:14px;border-radius:4px;
    background:linear-gradient(135deg,var(--primary),var(--accent));
  }
/* 关于我们：品牌定位标语移至标题下方、分割横杠上方，居中突出（文字内容不变） */
.brand-pos-line{font-size:19px;font-weight:600;color:var(--ink);line-height:1.7;margin:8px auto 0;max-width:760px;}
.brand-pos-line .hl{color:var(--ink);font-weight:600;}
#about .brand-quote{text-align:left;}

.value-points{list-style:disc;margin:10px 0 0 22px;}
.value-points li{margin-bottom:10px;color:var(--ink);font-size:14.1px;}
#services{background:#fff;}
.svc-intro{max-width:920px;margin:0 auto 34px;}
.svc-intro p{color:var(--ink-soft);margin-bottom:14px;font-size:15.4px;line-height:1.62;}
.svc-intro p:last-child{margin-bottom:0;}
.svc-extra{max-width:920px;margin:22px auto 0;}
.card{
    background:#fff;border:1px solid var(--line);border-radius:var(--radius);
    padding:40px;box-shadow:0 2px 12px rgba(31,45,61,.05);transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease;
  }
.card:hover{transform:translateY(-4px);box-shadow:0 12px 26px rgba(31,45,61,.10);border-color:rgba(77,123,166,.30);}
.card .ico{
    width:50px;height:50px;border-radius:12px;display:flex;align-items:center;justify-content:center;
    background:linear-gradient(135deg,var(--primary),var(--primary-dark));color:#fff;font-size:22px;margin-bottom:18px;
  }
.card h3{font-size:19px;font-weight:var(--w-title);margin-bottom:6px;color:var(--ink);}
.card p{color:var(--ink-soft);font-size:13.5px;margin-bottom:14px;line-height:1.62;}
.scenes{list-style:none;display:flex;flex-wrap:wrap;gap:8px;}
.scenes li{background:var(--bg);border:1px solid var(--line);color:var(--slate);font-size:13.8px;padding:4px 10px;border-radius:999px;}
.svc-extra-title{font-size:15px;font-weight:600;color:#4d7ba6;margin:0 0 6px;}
.svc-extra-desc{font-size:12.7px;color:#8a97a8;line-height:1.62;margin:0;}
#pricing{background:var(--alt);}
.price-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;align-items:stretch;}
.price-card{
    background:#fff;border:1px solid var(--line);border-radius:var(--radius);box-shadow:0 2px 12px rgba(31,45,61,.05);
    padding:44px 36px;display:flex;flex-direction:column;position:relative;
  }
.price-card h3{font-size:20px;font-weight:var(--w-title);color:var(--ink);margin-bottom:8px;}
.price-card .desc{font-size:12.7px;color:var(--slate);margin-bottom:18px;min-height:40px;}
.price-card .price{font-size:15px;font-weight:600;color:var(--primary-dark);margin-bottom:6px;line-height:1.55;overflow-wrap:anywhere;}
.price-card .price span{font-size:15px;font-weight:500;color:var(--slate);}
.price-card .price-foot{font-size:12.5px;color:var(--slate);line-height:1.6;margin-bottom:14px;}
.price-card .delivery{
    display:inline-block;background:var(--bg);border:1px solid var(--line);color:var(--ink-soft);
    font-size:14.3px;padding:6px 14px;border-radius:8px;margin-bottom:20px;
  }
.price-card .card-extra{flex:1;display:flex;flex-direction:column;}
.price-card ul li{position:relative;padding-left:24px;margin-bottom:10px;font-size:13.1px;color:var(--ink);}
.price-card ul li::before{content:"✓";position:absolute;left:0;color:var(--primary);font-weight:700;}
.price-card .btn{width:100%;background:var(--primary);color:#fff;}
.price-card .btn:hover{background:var(--primary-dark);}
.price-card .card-body{font-size:12.7px;color:var(--slate);line-height:1.85;margin:0 0 14px;}
.price-card .card-tags{display:flex;flex-wrap:wrap;gap:6px;margin:0 0 12px;}
.price-card .card-tags span{font-size:13.2px;color:var(--primary-dark);background:rgba(51,86,111,.07);border:1px solid rgba(51,86,111,.15);padding:3px 9px;border-radius:999px;}
.price-card .card-channel{font-size:11.7px;color:var(--ink-soft);line-height:1.75;margin:0;padding-top:12px;border-top:1px solid var(--line);}
.price-card .card-channel b{color:var(--primary-dark);font-weight:700;}
.price-note{font-size:12.5px;color:var(--ink-soft);line-height:1.7;text-align:center;margin:26px auto 0;max-width:880px;padding-top:16px;border-top:1px solid var(--line);}
.price-note{
    margin-top:28px;text-align:center;background:var(--bg);border:1px dashed var(--primary);
    border-radius:8px;padding:14px 20px;color:var(--ink-soft);font-size:13.1px;
  }
.price-note b{color:var(--primary-dark);}
#advantages{background:#fff;}
.adv-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;}
.adv-card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:40px;box-shadow:0 2px 12px rgba(31,45,61,.05);transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease;}
.price-card,.client-card,.step{transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease;}
.price-card:hover,.adv-card:hover,.client-card:hover,.step:hover{transform:translateY(-4px);box-shadow:0 12px 26px rgba(31,45,61,.10);border-color:rgba(77,123,166,.30);}
.adv-card h3{font-size:18px;font-weight:var(--w-title);margin:10px 0 10px;color:var(--ink);}
.adv-card p{font-size:13.5px;color:var(--ink-soft);line-height:1.62;}
#clients{background:var(--alt);}
.client-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:24px;max-width:1080px;margin:0 auto;}
.client-card{
    border:1px solid var(--line);border-radius:var(--radius);padding:34px 32px;text-align:left;background:#fff;box-shadow:0 2px 12px rgba(31,45,61,.05);
  }
.client-card h3{display:flex;align-items:center;gap:9px;font-size:18px;font-weight:var(--w-title);margin-bottom:14px;color:var(--ink);line-height:1.4;}
.client-card h3 .c-ico{width:19px;height:19px;flex:0 0 19px;color:var(--primary);}
.client-card p{font-size:13.1px;color:var(--ink-soft);line-height:1.62;}
.client-scene{font-size:13.4px;line-height:1.74;color:var(--ink-soft);margin-top:16px;}
.client-scene strong{color:var(--ink);font-weight:600;}
.client-card .mark{margin-right:5px;}
.client-card--slim .client-pain{font-size:14px;color:#5b6b7a;line-height:1.9;margin:0 0 16px;}
.client-card--slim .client-scene{font-size:13px;color:#5b6b7a;line-height:1.7;margin:0;padding-top:14px;border-top:1px solid var(--line);}
.client-card--slim .client-scene strong{color:var(--primary-dark);font-weight:700;}
#clients .section-head p{max-width:780px;}
#cases{background:#fff;display:none;}
.case-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;}
.case-card{
    background:#fff;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;
    box-shadow:0 2px 12px rgba(31,45,61,.05);
  }
.case-thumb{
    aspect-ratio:16/9;background:linear-gradient(135deg,#dfe7f0,#c9d6e6);
    display:flex;align-items:center;justify-content:center;color:var(--slate);font-size:14px;position:relative;
  }
.case-thumb::after{
    content:"后续上传项目样片";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);
    background:rgba(31,45,61,.55);color:#fff;font-size:13px;padding:5px 14px;border-radius:8px;white-space:nowrap;letter-spacing:.5px;
  }
.case-body{padding:26px 28px;}
.case-body h4{font-size:14.4px;color:var(--ink);margin-bottom:6px;}
.case-body p{font-size:12.7px;color:var(--ink-soft);line-height:1.62;}
.case-thumb.has-cover{background-size:cover;background-position:center;background-repeat:no-repeat;}
.case-thumb.has-cover::after{display:none;}
.case-thumb .play-btn{
    position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);
    width:56px;height:56px;border-radius:50%;
    background:rgba(255,255,255,.88);border:1px solid rgba(51,86,111,.30);
    display:flex;align-items:center;justify-content:center;color:#33566f;
    box-shadow:0 6px 18px rgba(31,45,61,.22);
    opacity:0;transition:opacity .22s ease,transform .22s ease,background .22s ease;
  }
.case-thumb .play-btn svg{width:26px;height:26px;margin-left:3px;}
.case-card:hover .play-btn,.case-card:focus-visible .play-btn{opacity:1;}
.case-card{cursor:pointer;transition:transform .2s ease,box-shadow .2s ease;}
.case-card:hover{transform:translateY(-4px);box-shadow:0 10px 26px rgba(31,45,61,.12);}
.case-card:hover .play-btn{transform:translate(-50%,-50%) scale(1.05);background:#fff;}
.case-card:focus-visible{outline:2px solid var(--primary);outline-offset:2px;}
.case-empty{grid-column:1/-1;text-align:center;color:var(--ink-soft);padding:34px 0;}
.video-modal{
    position:fixed;inset:0;background:rgba(15,23,35,.74);
    display:none;align-items:center;justify-content:center;z-index:200;padding:24px;
  }
.video-modal.open{display:flex;animation:vmFade .18s ease;}
@keyframes vmFade{from{opacity:0;}
to{opacity:1;}
}
.video-modal__dialog{
    position:relative;width:100%;max-width:920px;background:#000;
    border-radius:12px;overflow:hidden;box-shadow:0 24px 60px rgba(0,0,0,.5);
  }
.video-modal__body{position:relative;width:100%;}
.video-modal__video{display:block;width:100%;height:auto;max-height:82vh;background:#000;}
.video-modal__placeholder{padding:44px 24px;text-align:center;color:#cdd7e3;font-size:16.5px;}
.video-modal__close{
    position:absolute;top:10px;right:10px;z-index:2;width:38px;height:38px;
    border:0;border-radius:50%;background:rgba(0,0,0,.55);color:#fff;font-size:24px;line-height:1;
    cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background .15s;
  }
.video-modal__close:hover{background:var(--primary);}
#contact{background:var(--alt);}
.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:start;}
.contact-info h3{font-size:22px;color:var(--ink);margin-bottom:14px;font-weight:var(--w-title);}
.contact-info p{color:var(--ink-soft);margin-bottom:22px;font-size:14.1px;line-height:1.62;}
.info-list{list-style:none;}
.info-list li{display:flex;align-items:flex-start;gap:14px;margin-bottom:18px;}
.info-list .ic{width:42px;height:42px;border-radius:8px;flex:none;display:flex;align-items:center;justify-content:center;
    background:var(--bg);border:1px solid var(--line);font-size:20px;color:#3d648c;}
.info-list .ic svg{width:20px;height:20px;}
.info-list .t{font-size:12.1px;color:var(--slate);}
.info-list .v{font-size:15px;font-weight:600;color:var(--ink);}
.info-list .v a{color:inherit;text-decoration:none;}
.info-list .v a:hover{text-decoration:underline;}
form{background:var(--bg);border:1px solid var(--line);border-radius:var(--radius);padding:30px;}
.field{margin-bottom:18px;}
.field label{display:block;font-size:14px;color:var(--ink);margin-bottom:7px;font-weight:600;}
.field input,.field textarea{
    width:100%;padding:12px 14px;border:1px solid var(--line);border-radius:10px;font-size:15px;
    font-family:inherit;background:#fff;color:var(--ink);transition:border .15s,box-shadow .15s;
  }
.field input:focus,.field textarea:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 3px rgba(77,123,166,.12);}
.field textarea{resize:vertical;min-height:96px;}
form .btn{width:100%;background:var(--primary);color:#fff;font-size:14.4px;}
form .btn:hover{background:var(--primary-dark);}
.form-ok{display:none;background:#e8f4ec;border:1px solid #b8dcc4;color:#1f6b3f;
    padding:12px 16px;border-radius:9px;font-size:14.5px;margin-top:14px;text-align:center;}
.brand-quote{
    background:transparent;border-left:none;border-radius:0;padding:0;margin-bottom:0;
  }
.brand-quote p{color:var(--ink);font-size:16px;line-height:1.7;margin-bottom:16px;}
.brand-quote .bq-sub{color:var(--ink-soft);font-size:16px;margin-bottom:0;}
.brand-quote .bq-sub strong{font-weight:800;color:var(--ink);}
.channel{
    margin-top:16px;padding-top:14px;border-top:1px dashed var(--line);
    font-size:12.1px;color:var(--slate);
  }
.faq{max-width:820px;margin:28px auto 0;}
.faq-title{text-align:center;font-size:22px;color:var(--ink);margin-bottom:18px;font-weight:var(--w-title);}
.faq-item{
    background:#fff;border:1px solid var(--line);border-radius:10px;
    padding:0 18px;margin-bottom:9px;box-shadow:0 2px 12px rgba(31,45,61,.05);
  }
.faq-item summary{
    cursor:pointer;list-style:none;padding:11px 28px 11px 4px;font-size:14px;font-weight:600;color:var(--ink);
    position:relative;
  }
.faq-item summary::-webkit-details-marker{display:none;}
.faq-item summary::after{content:"＋";position:absolute;right:6px;top:50%;transform:translateY(-50%);color:var(--primary);font-size:20px;font-weight:700;}
.faq-item[open] summary::after{content:"－";}
.faq-item p{padding:0 4px 11px;color:var(--ink-soft);font-size:12.5px;line-height:1.5;}
#process{background:#fff;position:relative;}
.process-grid{position:relative;}
.step:not(:last-child)::after{
  content:"";position:absolute;right:-15px;top:50%;transform:translateY(-50%);
  width:26px;height:26px;pointer-events:none;z-index:2;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%237e9bb8' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 12h14'/%3E%3Cpath d='M13 7l5 5-5 5'/%3E%3Cpath d='M8 7l5 5-5 5' opacity='0.45'/%3E%3C/svg%3E") no-repeat center/contain;
}
@media(max-width:768px){
  .step:not(:last-child)::after{display:none;}
}

.process-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:22px;}
.step{
    background:#fff;border:1px solid var(--line);border-radius:var(--radius);
    padding:30px 22px;text-align:center;box-shadow:0 2px 12px rgba(31,45,61,.05);position:relative;
  }
.step .step-ico{width:36px;height:36px;margin:10px auto 12px;color:var(--primary);}
.step .step-ico svg{width:36px;height:36px;display:block;margin:0 auto;}
.step h3{font-size:18px;font-weight:var(--w-title);color:var(--ink);margin-bottom:8px;}
.step p{font-size:12.7px;color:var(--ink-soft);line-height:1.62;text-align:left;}
.form-tip{
    background:#eef4fb;border:1px solid #cfe0f1;color:var(--primary-dark);
    border-radius:8px;padding:10px 14px;font-size:13.1px;margin-bottom:18px;text-align:center;
  }
.form-wx-tip{
    margin-top:14px;font-size:12.7px;color:var(--slate);text-align:center;line-height:1.85;
  }
.form-wx-tip b{color:var(--primary-dark);}
.to-top{
    position:fixed;right:22px;bottom:22px;z-index:200;
    width:46px;height:46px;border-radius:50%;border:0;cursor:pointer;
    background:var(--primary);color:#fff;font-size:22px;line-height:1;
    box-shadow:0 6px 18px rgba(31,45,61,.25);
    opacity:0;visibility:hidden;transform:translateY(12px);
    transition:opacity .25s,transform .25s,background .2s;
  }
.to-top.show{opacity:1;visibility:visible;transform:translateY(0);}
.to-top:hover{background:var(--primary-dark);}
footer{background:linear-gradient(180deg,#3e4754,#353d49);color:#c3c9d1;padding:10px 0 6px;}
footer .wrap{display:flex;flex-direction:column;gap:0;}
.f-cols{display:flex;justify-content:space-between;flex-wrap:wrap;gap:18px;width:100%;}
.f-col{flex:1 1 200px;min-width:160px;}
.f-brand-col{flex:2 1 320px;}
.f-title{font-size:12.5px;color:#e6eaef;font-weight:700;margin-bottom:8px;letter-spacing:1px;}
.fbrand{display:flex;align-items:center;gap:9px;font-weight:700;color:#f4f6f8;font-size:15px;letter-spacing:1px;margin-bottom:5px;}
.fbrand-logo{height:20px;width:auto;flex:none;display:block;object-fit:contain;background:#fff;border-radius:4px;padding:2px;}
.fbrand-text{display:flex;flex-direction:column;line-height:1.45;}
.fbrand-name{font-size:15px;color:#f4f6f8;font-weight:700;letter-spacing:1px;}
.fbrand-site{font-size:12.4px;color:#9aa3ad;font-weight:400;letter-spacing:.2px;margin-top:2px;}
.copy{font-size:12px;color:#9aa3ad;margin-bottom:4px;font-weight:var(--w-light);}
.f-company{font-size:12.4px;color:#9aa3ad;line-height:1.6;font-weight:var(--w-light);}
.f-tel{color:#8fc0ec;font-weight:600;text-decoration:none;}
.f-tel:hover{text-decoration:underline;}
.f-declare{width:100%;margin-top:5px;padding-top:4px;}
.f-declare .declare{font-size:12px;color:#aab2bc;max-width:860px;line-height:1.5;margin:0;font-weight:var(--w-light);}
.f-declare .f-title{margin-bottom:4px;}
.f-beian{width:100%;margin-top:5px;padding-top:4px;font-size:12.2px;color:#aab2bc;display:flex;flex-wrap:wrap;gap:14px;align-items:center;}
.f-beian .f-title-inline{color:#e6eaef;font-weight:700;letter-spacing:.5px;}
.f-beian a{color:#8fc0ec;text-decoration:none;}
.f-beian a:hover{text-decoration:underline;}
@media (max-width:1179.98px){.nav{height:68px;}
.brand{flex:none;}
.brand-mark{height:36px;}
.brand-name{font-size:30px;}
.brand-sub{font-size:14.3px;}
.menu{
      position:absolute;top:100%;left:0;right:0;
      background:rgba(255,255,255,.98);border-bottom:1px solid var(--line);border-radius:0 0 16px 16px;
      box-shadow:0 14px 30px rgba(31,45,61,.14);
      flex-direction:column;align-items:stretch;gap:0;
      padding:8px 16px 16px;display:none;
      max-height:calc(100vh - 68px);overflow-y:auto;
    }
.menu.open{display:flex;}
.menu li{width:100%;}
.menu a{padding:12px 10px;border-radius:8px;font-size:15px;}
.burger{display:flex;}
.nav-auth{width:100%;}
.nav-auth-btn{width:100%;justify-content:space-between;padding:12px 10px;font-size:15px;}
.nav-auth-menu{position:static;box-shadow:none;border:none;background:transparent;padding:0 0 8px;min-width:0;align-items:stretch;}
.nav-auth-menu a{padding:10px 14px;font-size:14.5px;}
.nav-auth-menu a.cta{margin-top:6px;}
}
@media (max-width:480px){.nav{height:60px;}
.brand-mark{height:30px;}
.brand-name{font-size:26px;}
.brand-sub{font-size:13.2px;}
form{padding:22px 18px;}
}
@media (max-width:920px){.about-grid,.contact-grid{grid-template-columns:1fr;gap:32px;}
.price-grid,.adv-grid,.case-grid{grid-template-columns:1fr 1fr;}
#clients .client-grid{grid-template-columns:1fr;}
.process-grid{grid-template-columns:1fr 1fr;}
}
@media (max-width:680px){.hero .wrap{padding-top:48px;padding-bottom:80px;}
.hero h1{font-size:26px;letter-spacing:1px;}
.hero-intro{font-size:14.5px;line-height:1.7;margin-bottom:28px;}.hero-points{margin-bottom:32px;max-width:100%;}.hero-points li{font-size:14.5px;line-height:1.7;margin-bottom:11px;}.hero-slogan{font-size:16px;letter-spacing:.5px;margin-bottom:14px;}
.hero .sub{font-size:13.1px;}
.hero .btns{flex-direction:column;}
.hero .btns .btn{width:100%;}
.section-head h2{font-size:21.6px;}
.sec-ico{width:24px;height:24px;}
section{padding:72px 0;}
.svc-extra{margin-top:18px;}
.svc-extra-title{font-size:14.5px;}
.svc-extra-desc{font-size:12.1px;}
.price-grid,.adv-grid,.client-grid,.case-grid,.process-grid{grid-template-columns:1fr;}
.adv-card,.client-card,.price-card{padding:30px 22px;}
.about-text{padding:42px 24px;flex-direction:column;gap:24px;align-items:center;}
.about-card-media{flex:0 0 auto;width:200px;max-width:200px;height:200px;}
.brand-quote{padding:0;}
.brand-quote p{font-size:15px;}
.faq{max-width:100%;}
.to-top{right:14px;bottom:14px;width:42px;height:42px;font-size:20px;}
footer .wrap{flex-direction:column;align-items:center;text-align:center;gap:6px;}
.f-cols{flex-direction:column;align-items:stretch;gap:10px;}
.f-col,.f-brand-col,.f-contact-col{flex:0 0 auto;width:100%;}
.fbrand{justify-content:center;}
.f-declare,.f-beian{text-align:center;}
.f-beian{justify-content:center;}
.f-declare .declare{font-size:12.5px;line-height:1.55;}
.f-beian{font-size:12.5px;}
.f-company{font-size:12.6px;}
.video-modal{padding:12px;}
.video-modal__dialog{max-width:96vw;}
.video-modal__video{max-height:70vh;}
.case-thumb .play-btn{width:48px;height:48px;}
.case-thumb .play-btn svg{width:22px;height:22px;}
}
@media (max-width:420px){.hero h1{font-size:21px;}.hero-intro{font-size:13.8px;line-height:1.65;}.hero-points li{font-size:13.8px;line-height:1.65;margin-bottom:10px;}.hero-slogan{font-size:15px;}.hero .wrap{padding-left:16px;padding-right:16px;}}

/* 卡片标题彩色线性矢量图标 */
.card-ico-wrap{width:34px;height:34px;border-radius:50%;background:#e8f1fc;display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto;box-shadow:inset 0 0 0 1px rgba(47,111,176,.10)}
.card-ico{width:19px;height:19px;flex:0 0 auto;display:block}
.adv-card h3,.price-card h3{display:flex;align-items:center;gap:10px;line-height:1.35}
.adv-card h3 .t-ico{width:19px;height:19px;flex:0 0 19px;color:var(--primary);}
@media (max-width:480px){.card-ico-wrap{width:30px;height:30px}.card-ico{width:17px;height:17px}.adv-card h3,.price-card h3,.client-card h3{gap:8px}.t-ico,.c-ico{width:17px;height:17px}}

/* Rev28 视觉体系：渐变强调、卡片描边、hero 光晕与科技暗纹、锚点偏移、页脚四区美化 */
:root{
  --grad:linear-gradient(135deg,#4d7ba6,#2f6fb0);
  --grad-soft:linear-gradient(90deg,#4d7ba6,#7ba2c4);
  --icon:#4a6c8c;
  --icon-soft:#7e9bb8;
}
section[id]{scroll-margin-top:86px;}
.accent-bar{width:52px;height:4px;border-radius:4px;background:var(--grad-soft);margin:16px auto 0;}
.section-head .eyebrow{letter-spacing:2px;}
.hero::before{content:"";position:absolute;inset:0;background:radial-gradient(120% 85% at 82% -5%,rgba(77,123,166,.18),transparent 58%);z-index:0;pointer-events:none;}
.adv-card,.price-card,.client-card{border-color:var(--line);}
.adv-card:hover,.price-card:hover,.client-card:hover{border-color:rgba(77,123,166,.30);box-shadow:0 12px 26px rgba(31,45,61,.10);}
.price-card{overflow:hidden;}
.price-card::before{content:"";position:absolute;top:0;left:0;right:0;height:3px;background:var(--grad-soft);opacity:.85;}
.faq-item{border-color:var(--line);transition:box-shadow .2s,border-color .2s,transform .2s;}
.faq-item[open]{border-color:rgba(77,123,166,.40);box-shadow:0 10px 26px rgba(31,45,61,.10);}
::selection{background:rgba(77,123,166,.18);}

/* Rev29 视觉微调：按钮按压反馈、页脚高度减半、滚动淡入（仅透明度） */
html.js-reveal .reveal{opacity:0;transition:opacity .8s ease,transform .25s ease,box-shadow .25s ease,border-color .25s ease;}
html.js-reveal .reveal.in{opacity:1;}
html.js-reveal.reveal-fallback .reveal{opacity:1!important;}
@media (prefers-reduced-motion:reduce){html.js-reveal .reveal{opacity:1!important;transition:none;}}

/* Rev30 字体 + 背景交替 + 服务卡装饰图标 + 页脚极致压缩 */
#services .adv-card{position:relative;}
.svc-deco{position:absolute;top:16px;right:18px;width:30px;height:30px;color:#9bb8d4;opacity:.7;pointer-events:none;}
.svc-deco svg{width:100%;height:100%;display:block;}
@media (max-width:680px){.svc-deco{top:14px;right:14px;width:26px;height:26px;}}
.copy,.f-company,.f-declare .declare,.svc-extra-desc,.scenes li{font-weight:var(--w-light);}

.about-card-media{flex:0 0 270px;max-width:270px;height:260px;}
.about-card-media img{display:block;width:100%;height:100%;object-fit:cover;border-radius:12px;box-shadow:0 6px 18px rgba(31,45,61,.10);}

/* [锦诺云] 关于我们：PC 端（≥921px）单独加宽浅蓝卡片内照片约 70%（270→460px），高度保持 260px 不变；
   保持 object-fit:cover 并居中裁切，确保网络节点/文档等主体内容保留、照片宽度明显更宽；
   移动端（≤680px）与其它断点不受影响。 */
@media (min-width:921px){
  .about-card-media{flex:0 0 460px;max-width:460px;height:260px;}
  .about-card-media img{object-fit:cover;object-position:center;}
  /* 业务服务 / 竞争优势：电脑端四宫格 2×2（仅作用于这两个板块，不影响其它 .adv-grid） */
  #services .adv-grid{grid-template-columns:repeat(2,1fr);max-width:880px;margin:0 auto;}
  #advantages .adv-grid{grid-template-columns:repeat(2,1fr);max-width:880px;margin:0 auto;}
}

/* ===== Rev27 交互与排版升级（业务文案零改动） ===== */
/* 1. 导航滚动吸顶：高度收窄 + LOGO 缩小 + 磨砂模糊 + 柔和阴影（250ms） */
header{transition:background .25s ease,box-shadow .25s ease,backdrop-filter .25s ease;}
.nav{transition:height .25s ease;}
.brand-mark{transition:height .25s ease;}
.brand-name,.brand-sub{transition:font-size .25s ease;}
.burger{position:relative;z-index:140;}
header.scrolled{background:rgba(255,255,255,.82);backdrop-filter:saturate(180%) blur(16px);-webkit-backdrop-filter:saturate(180%) blur(16px);box-shadow:0 6px 20px rgba(31,45,61,.09);}
header.scrolled .nav{height:58px;}
header.scrolled .brand-mark{height:34px;}
header.scrolled .brand-name{font-size:27px;}
header.scrolled .brand-sub{font-size:13.4px;}

/* 2. 菜单：当前板块细下划线高亮；悬浮变色（无大块背景） */
.menu a.active{color:var(--primary-dark);font-weight:600;}
.menu a.active::after{transform:scaleX(1);}

/* 3. PC 导航右侧常驻主色按钮 */
.menu .nav-cta{margin-left:6px;}
.menu .nav-cta a{background:var(--primary);color:#fff;font-weight:600;border-radius:10px;padding:9px 18px;letter-spacing:1px;}
.menu .nav-cta a:hover{background:var(--primary-dark);color:#fff;}
.menu .nav-cta a::after{display:none;}
.menu .nav-cta a.active{color:#fff;}

/* 4. 移动端侧边抽屉菜单 */
.nav-overlay{display:none;}
@media (max-width:1179.98px){
  .menu{
    position:fixed;top:0;right:0;bottom:0;left:auto;
    width:300px;max-width:84vw;background:#fff;
    border-radius:0;border-bottom:none;
    box-shadow:-10px 0 30px rgba(31,45,61,.16);
    flex-direction:column;align-items:stretch;gap:2px;
    padding:86px 18px 24px;
    transform:translateX(100%);visibility:hidden;
    transition:transform .25s ease,visibility .25s ease;
    max-height:none;overflow-y:auto;z-index:130;display:flex;
  }
  .menu.open{transform:translateX(0);visibility:visible;}
  .menu a{padding:13px 12px;border-radius:10px;}
  .menu a:hover,.menu a:focus-visible{background:rgba(77,123,166,.09);color:var(--primary-dark);}
  .menu .nav-cta{margin:10px 0 0;}
  .menu .nav-cta a{display:block;text-align:center;padding:13px 12px;}
  .nav-overlay.open{display:block;position:fixed;inset:0;background:rgba(15,23,35,.38);z-index:120;}
  header.scrolled .nav{height:56px;}
  header.scrolled .brand-mark{height:30px;}
}
@media (max-width:480px){
  header.scrolled .nav{height:52px;}
  header.scrolled .brand-mark{height:27px;}
  header.scrolled .brand-name{font-size:22px;}
}

/* 二、全站卡片统一 hover（轻微上浮 + 柔和加深阴影，禁止放大变形） */
.adv-card,.price-card,.client-card,.step{transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease;}
.adv-card:hover,.price-card:hover,.client-card:hover,.step:hover{transform:translateY(-4px);box-shadow:0 12px 26px rgba(31,45,61,.10);border-color:rgba(77,123,166,.30);}
.case-card:hover{transform:translateY(-4px);box-shadow:0 12px 26px rgba(31,45,61,.10);border-color:rgba(77,123,166,.30);}

/* 三、各大板块间距校准（节奏均衡） */
section{padding:104px 0;}
.hero{padding:0;}
.hero .wrap{padding-top:112px;padding-bottom:128px;}
@media (max-width:920px){section{padding:84px 0;}.hero .wrap{padding-top:72px;padding-bottom:88px;}}
@media (max-width:680px){section{padding:68px 0;}.hero .wrap{padding-top:48px;padding-bottom:80px;}}

/* 四、合作全流程：PC 横向浅蓝细线时间轴 */
.process-grid{position:relative;}
.process-grid::before{
  content:"";position:absolute;left:12.5%;right:12.5%;top:62px;height:2px;z-index:0;
  background:linear-gradient(90deg,rgba(123,162,196,.20),var(--accent) 50%,rgba(123,162,196,.20));
}
.step{position:relative;z-index:1;}
.step .step-ico{
  width:46px;height:46px;margin:8px auto 14px;border-radius:50%;
  background:#fff;border:2px solid var(--accent);box-shadow:0 0 0 5px #fff;
  display:flex;align-items:center;justify-content:center;position:relative;z-index:2;color:var(--primary);
}
.step .step-ico svg{width:24px;height:24px;display:block;margin:0;}
.step:not(:last-child)::after{display:none;}
/* 移动端竖向时间轴 */
@media (max-width:920px){
  .process-grid{grid-template-columns:1fr;gap:18px;}
  .process-grid::before{
    left:38px;right:auto;top:26px;bottom:26px;width:2px;height:auto;
    background:linear-gradient(180deg,rgba(123,162,196,.20),var(--accent) 50%,rgba(123,162,196,.20));
  }
  .step{display:grid;grid-template-columns:56px 1fr;column-gap:16px;row-gap:6px;text-align:left;padding:20px 18px;align-items:start;}
  .step .step-ico{grid-column:1;grid-row:1 / span 2;margin:0;width:40px;height:40px;box-shadow:0 0 0 4px #fff;}
  .step .step-ico svg{width:20px;height:20px;}
  .step h3{grid-column:2;grid-row:1;margin-bottom:0;}
  .step p{grid-column:2;grid-row:2;}
}

/* 七、流程底部信任文案 */
.process-trust{margin:28px auto 0;text-align:center;font-size:12.8px;color:var(--slate);letter-spacing:.5px;}

/* 五、客户案例占位文案 */
.case-thumb::after{
  content:"作品集素材正在更新，点击立即咨询，即可获取完整案例资料。";
  position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);
  background:rgba(31,45,61,.55);color:#fff;font-size:12.4px;padding:8px 14px;border-radius:8px;
  letter-spacing:.5px;line-height:1.45;max-width:84%;text-align:center;white-space:normal;
}

/* 六、FAQ 手风琴：轻量展开动画 + 标题悬浮反馈 */
.faq-item summary{transition:color .2s ease;}
.faq-item summary:hover{color:var(--primary-dark);}
.faq-item[open] p{animation:faqIn .22s ease;}
@keyframes faqIn{from{opacity:0;transform:translateY(-4px);}to{opacity:1;transform:none;}}
@media (prefers-reduced-motion:reduce){.faq-item[open] p{animation:none;}}

/* 八、表单输入框 hover / focus 细微边框反馈 */
.field input:hover,.field textarea:hover{border-color:rgba(77,123,166,.45);}
.field input:focus,.field textarea:focus{border-color:var(--primary);box-shadow:0 0 0 3px rgba(77,123,166,.12);}