:root { --ink:#10283d; --muted:#5f7383; --blue:#0877bb; --blue-deep:#07588f; --cyan:#dff3f6; --line:#dce7ee; --off:#f6fafc; --dark:#092333; --radius:4px; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; color:var(--ink); background:#fff; font-family:'Noto Sans SC','Microsoft YaHei',sans-serif; font-size:15px; line-height:1.75; }
a { color:inherit; text-decoration:none; }
button { font:inherit; }
.container { width:min(1200px, calc(100% - 64px)); margin:0 auto; }
.site-header { position:sticky; z-index:20; top:0; background:rgba(255,255,255,.97); border-bottom:1px solid rgba(16,40,61,.08); backdrop-filter:blur(14px); }
.header-inner { width:min(1320px, calc(100% - 64px)); height:84px; margin:auto; display:flex; align-items:center; justify-content:space-between; gap:32px; }
.brand { display:flex; width:188px; height:64px; flex-shrink:0; align-items:center; overflow:hidden; }
.brand img { width:100%; height:100%; object-fit:contain; object-position:left center; mix-blend-mode:multiply; }
.main-nav { display:flex; height:100%; align-items:center; gap:34px; margin-left:auto; }
.main-nav a { position:relative; color:#536875; font-weight:500; white-space:nowrap; }
.main-nav a:after { content:''; position:absolute; left:0; right:100%; bottom:-8px; height:2px; background:var(--blue); transition:right .25s ease; }
.main-nav a:hover,.main-nav a.active { color:var(--blue-deep); }
.main-nav a:hover:after,.main-nav a.active:after { right:0; }
.header-actions { display:flex; align-items:center; gap:20px; flex-shrink:0; }
.hotline { display:flex; flex-direction:column; line-height:1.25; border-left:1px solid var(--line); padding-left:20px; }
.hotline span { font-size:11px; color:#8394a0; letter-spacing:.08em; }
.hotline strong { color:var(--blue-deep); font-size:14px; font-family:Manrope,sans-serif; letter-spacing:.03em; }
.icon-button { display:none; border:0; background:transparent; padding:8px; cursor:pointer; }
.icon-button span { display:block; width:22px; height:2px; margin:4px 0; background:var(--ink); }
.hero { position:relative; background:#e8f2f6; overflow:hidden; }
.hero-track { position:relative; width:100%; aspect-ratio:1920 / 750; min-height:370px; max-height:615px; }
.hero-slide { position:absolute; inset:0; opacity:0; transition:opacity .7s ease; pointer-events:none; }
.hero-slide.is-active { opacity:1; pointer-events:auto; }
.hero-slide img { display:block; width:100%; height:100%; object-fit:cover; }
.hero-control { position:absolute; top:50%; width:44px; height:44px; margin-top:-22px; border:1px solid rgba(255,255,255,.65); border-radius:50%; color:#fff; background:rgba(5,46,70,.22); font-size:30px; line-height:1; cursor:pointer; transition:background .2s, transform .2s; }
.hero-control:hover { background:rgba(5,46,70,.66); transform:scale(1.06); }
.hero-control.prev { left:28px; }.hero-control.next { right:28px; }
.hero-footer { position:absolute; right:0; bottom:0; left:0; display:flex; width:min(1200px, calc(100% - 64px)); margin:auto; align-items:center; justify-content:space-between; padding:18px 0; }
.hero-dots { display:flex; gap:10px; align-items:center; }
.dot { width:30px; height:3px; padding:0; border:0; background:rgba(255,255,255,.62); cursor:pointer; transition:width .25s, background .25s; }.dot.is-active { width:58px; background:#fff; }
.hero-scroll { color:#fff; font-size:12px; letter-spacing:.12em; text-transform:uppercase; text-shadow:0 1px 4px rgba(0,0,0,.35); }.hero-scroll i { margin-left:8px; font-style:normal; font-size:16px; }
.brand-strip { background:var(--dark); color:#fff; }
.brand-strip-inner { display:flex; min-height:94px; align-items:center; justify-content:space-between; gap:40px; }
.eyebrow { margin:0 0 14px; color:var(--blue); font:700 11px/1.3 Manrope,sans-serif; letter-spacing:.16em; text-transform:uppercase; }.eyebrow span { margin-left:16px; color:#a6bbc8; font-weight:500; }
.brand-strip .eyebrow { margin:0; color:#7db4c8; }
.brand-list { display:flex; align-items:center; gap:clamp(22px, 4vw, 65px); color:#e7f4f8; font:600 clamp(15px, 1.6vw, 22px) Manrope,sans-serif; }
.brand-list span { opacity:.92; white-space:nowrap; }.brand-list span:nth-child(1){color:#55bc9c}.brand-list span:nth-child(3){color:#80aee2}.brand-list span:nth-child(4){color:#e97e69}.brand-list span:nth-child(5){color:#e3c26e}
.section { padding:112px 0; }.intro { background:var(--off); overflow:hidden; }
.intro-grid { display:grid; grid-template-columns:1fr 1fr; gap:80px; align-items:center; }.intro-copy { max-width:520px; }.intro-copy h1 { margin:0 0 24px; font-size:clamp(37px, 4vw, 57px); line-height:1.25; letter-spacing:.01em; font-weight:700; }.intro-copy h1 em,.service-copy h2 em { color:var(--blue); font-style:normal; }.intro-copy .lead { margin:0 0 16px; color:var(--ink); font-size:18px; font-weight:600; }.intro-copy > p:not(.eyebrow):not(.lead) { color:var(--muted); }
.text-link { display:inline-flex; align-items:center; gap:14px; margin-top:22px; padding-bottom:6px; border-bottom:1px solid var(--blue); color:var(--blue-deep); font-weight:700; }.text-link span,.outline-link span { font-size:19px; }
.intro-visual { position:relative; min-height:460px; }.visual-frame { overflow:hidden; background:#fff; box-shadow:0 18px 44px rgba(9,35,51,.14); }.visual-frame img { display:block; width:100%; height:100%; object-fit:cover; }.frame-large { position:absolute; top:18px; right:0; width:84%; height:360px; }.frame-small { position:absolute; bottom:0; left:0; width:47%; height:220px; border:8px solid var(--off); }.visual-caption { position:absolute; right:5%; bottom:34px; display:flex; align-items:baseline; gap:12px; padding:10px 15px; background:var(--blue-deep); color:#fff; }.visual-caption strong { font:800 27px Manrope,sans-serif; }.visual-caption span { font-size:12px; }
.section-blue { background:var(--blue-deep); color:#fff; }.section-heading { display:flex; align-items:flex-end; justify-content:space-between; gap:30px; margin-bottom:48px; }.section-heading h2 { margin:0; font-size:clamp(30px, 3vw, 43px); line-height:1.2; letter-spacing:.02em; }.section-heading > p { max-width:390px; margin:0; color:var(--muted); }.light-heading .eyebrow { color:#9fd9e4; }.light-heading .eyebrow span { color:#5fa9c6; }.light-heading > p { color:#b5cfdb; }
.advantage-grid { display:grid; grid-template-columns:repeat(3,1fr); border-top:1px solid rgba(255,255,255,.25); }.advantage-card { min-height:285px; padding:32px 32px 27px; border-right:1px solid rgba(255,255,255,.25); position:relative; }.advantage-card:last-child{border-right:0}.advantage-number { color:#6ea9c0; font:600 12px Manrope,sans-serif; letter-spacing:.12em; }.advantage-icon { position:absolute; top:24px; right:30px; color:#7ccee0; font:300 35px Manrope,sans-serif; }.advantage-card h3 { margin:48px 0 13px; font-size:21px; }.advantage-card p { margin:0; color:#b6d1dc; font-size:14px; line-height:1.8; }.advantage-card a { display:inline-flex; gap:12px; align-items:center; margin-top:24px; color:#fff; font-size:13px; font-weight:600; }.advantage-card a span { color:#7ccee0; font-size:18px; }
.products { background:#fff; }.outline-link { display:inline-flex; gap:12px; align-items:center; padding:10px 0; border-bottom:1px solid var(--ink); font-weight:600; }.product-tabs { display:flex; gap:8px; flex-wrap:wrap; margin-bottom:35px; }.product-tabs button { border:1px solid var(--line); border-radius:2px; padding:9px 19px; background:#fff; color:#70818c; cursor:pointer; transition:all .2s; }.product-tabs button:hover,.product-tabs button.is-active { border-color:var(--blue); background:var(--blue); color:#fff; }.product-grid { display:grid; grid-template-columns:repeat(4, 1fr); gap:20px; }.product-card { border:1px solid var(--line); background:#fff; transition:transform .25s, box-shadow .25s; }.product-card:hover { transform:translateY(-5px); box-shadow:0 15px 30px rgba(5,58,88,.12); }.product-card.is-hidden { display:none; }.product-image { display:flex; height:214px; align-items:center; justify-content:center; padding:16px; background:#f7fafb; border-bottom:1px solid var(--line); }.product-image img { width:100%; height:100%; object-fit:contain; mix-blend-mode:multiply; }.product-meta { display:flex; align-items:center; justify-content:space-between; padding:17px 18px 0; color:#7b909d; font-size:11px; letter-spacing:.02em; }.card-arrow { color:var(--blue); font-size:18px; }.product-card h3 { margin:7px 18px 0; font-size:18px; }.product-card p { margin:2px 18px 18px; color:var(--muted); font-size:13px; }
.service-band { overflow:hidden; background:#e5f5f5; }.service-inner { display:grid; grid-template-columns:1fr 1fr; min-height:420px; align-items:center; }.service-copy { padding:70px 0; }.service-copy h2 { margin:0 0 17px; font-size:clamp(31px,3.5vw,48px); line-height:1.35; }.service-copy > p:not(.eyebrow) { color:var(--muted); }.solid-link { display:inline-flex; gap:16px; align-items:center; margin-top:22px; padding:12px 20px; background:var(--blue-deep); color:#fff; font-size:14px; font-weight:600; }.solid-link span { font-size:19px; }.service-art { position:relative; min-height:420px; }.ring { position:absolute; border:1px solid rgba(7,88,143,.23); border-radius:50%; }.ring-one { width:440px; height:440px; top:-18px; right:-46px; }.ring-two { width:285px; height:285px; top:58px; right:31px; border-color:rgba(8,119,187,.4); }.service-art:after { content:''; position:absolute; width:112px; height:112px; top:145px; right:118px; border-radius:50%; background:var(--blue); box-shadow:0 0 0 20px rgba(8,119,187,.1), 0 0 0 42px rgba(8,119,187,.06); }.service-stat { position:absolute; right:96px; bottom:58px; display:flex; flex-direction:column; color:var(--blue-deep); }.service-stat strong { font:800 38px Manrope,sans-serif; }.service-stat span { color:var(--muted); font-size:12px; }
.news { background:var(--off); }.news-grid { display:grid; grid-template-columns:1.3fr 1fr 1fr; gap:20px; }.news-card { background:#fff; border:1px solid var(--line); }.news-image { height:186px; overflow:hidden; }.news-card.featured .news-image { height:220px; }.news-image img { display:block; width:100%; height:100%; object-fit:cover; transition:transform .5s; }.news-card:hover .news-image img { transform:scale(1.04); }.news-body { padding:21px 23px 23px; }.news-date { color:var(--blue); font:600 11px Manrope,sans-serif; letter-spacing:.06em; }.news-body h3 { margin:8px 0 9px; font-size:17px; line-height:1.5; }.news-body p { margin:0 0 18px; color:var(--muted); font-size:13px; }.news-body a { display:flex; align-items:center; gap:12px; color:var(--blue-deep); font-size:13px; font-weight:700; }.news-body a span { font-size:17px; }
.site-footer { background:var(--dark); color:#fff; }.footer-main { display:grid; grid-template-columns:1.4fr .8fr 1fr 1fr; gap:60px; padding:65px 0 54px; }.footer-brand img { width:185px; height:70px; object-fit:contain; object-position:left center; mix-blend-mode:screen; filter:grayscale(1) brightness(3) invert(1); }.footer-brand p { margin:22px 0 0; color:#7fa2b1; font:13px/1.8 Manrope,sans-serif; }.footer-col { display:flex; flex-direction:column; gap:9px; }.footer-col h3 { margin:4px 0 14px; font-size:15px; }.footer-col a,.footer-col p { margin:0; color:#9cb5c0; font-size:13px; }.contact-col { gap:8px; }.contact-col .footer-phone { color:#6ed0dd; font:700 21px Manrope,sans-serif; }.footer-cta { display:flex; flex-direction:column; align-items:flex-end; justify-content:space-between; text-align:right; }.footer-cta p { margin:0; color:#9cb5c0; font-size:15px; line-height:1.7; }.footer-cta strong { color:#fff; font-size:22px; }.circle-arrow { display:flex; width:51px; height:51px; align-items:center; justify-content:center; border:1px solid #73c9d5; border-radius:50%; color:#73c9d5; font-size:24px; transition:all .2s; }.circle-arrow:hover { color:var(--dark); background:#73c9d5; }.footer-bottom { display:flex; justify-content:space-between; align-items:center; padding:16px 0 22px; border-top:1px solid rgba(255,255,255,.15); color:#6e8d99; font-size:11px; }.footer-bottom a { color:#a1c3cd; }
@media (max-width: 1050px) { .main-nav { gap:19px; }.header-inner { gap:18px; }.hotline { display:none; }.product-grid { grid-template-columns:repeat(3, 1fr); }.footer-main { gap:30px; } }
@media (max-width: 760px) { .container,.header-inner,.hero-footer { width:calc(100% - 36px); }.header-inner { height:72px; }.brand { width:162px; height:54px; }.main-nav { position:absolute; top:72px; right:18px; left:18px; display:none; height:auto; padding:10px 18px 15px; flex-direction:column; align-items:stretch; gap:0; border:1px solid var(--line); background:#fff; box-shadow:0 15px 30px rgba(5,58,88,.13); }.main-nav.is-open { display:flex; }.main-nav a { padding:9px 0; border-bottom:1px solid #eef3f5; }.main-nav a:last-child{border:0}.main-nav a:after{display:none}.icon-button { display:block; }.hero-track { aspect-ratio:4 / 3; min-height:280px; }.hero-slide img { object-fit:cover; }.hero-control { width:34px; height:34px; margin-top:-17px; font-size:24px; }.hero-control.prev{left:12px}.hero-control.next{right:12px}.hero-footer{padding:11px 0}.hero-scroll{display:none}.dot{width:18px}.dot.is-active{width:35px}.brand-strip-inner { display:block; padding:22px 0; min-height:0; }.brand-strip .eyebrow { margin-bottom:16px; }.brand-list { justify-content:space-between; gap:10px; flex-wrap:wrap; font-size:14px; }.section { padding:70px 0; }.intro-grid,.service-inner { grid-template-columns:1fr; gap:34px; }.intro-copy h1 { font-size:38px; }.intro-visual { min-height:365px; }.frame-large { height:285px; }.frame-small { height:170px; }.visual-caption { bottom:17px; right:1%; }.section-heading { display:block; margin-bottom:30px; }.section-heading > p { margin-top:15px; }.outline-link { margin-top:19px; }.advantage-grid { grid-template-columns:1fr; }.advantage-card { min-height:0; border-right:0; border-bottom:1px solid rgba(255,255,255,.25); padding:25px 5px 27px 0; }.advantage-card:last-child { border-bottom:0; }.advantage-card h3 { margin-top:28px; }.product-grid { grid-template-columns:repeat(2, 1fr); gap:12px; }.product-image { height:155px; padding:10px; }.product-meta { padding:12px 12px 0; font-size:10px; }.product-card h3 { margin-left:12px; margin-right:12px; font-size:16px; }.product-card p { margin:2px 12px 15px; font-size:12px; }.product-tabs { gap:6px; }.product-tabs button { padding:7px 12px; font-size:13px; }.service-art { min-height:260px; }.ring-one { width:270px; height:270px; top:-12px; right:-10px; }.ring-two { width:176px; height:176px; top:35px; right:37px; }.service-art:after { width:70px; height:70px; top:88px; right:90px; box-shadow:0 0 0 13px rgba(8,119,187,.1),0 0 0 27px rgba(8,119,187,.06); }.service-stat { right:47px; bottom:20px; }.service-stat strong { font-size:27px; }.news-grid { grid-template-columns:1fr; }.news-card.featured .news-image,.news-image { height:200px; }.footer-main { grid-template-columns:1fr 1fr; gap:35px 20px; padding:48px 0 40px; }.footer-brand { grid-column:1 / -1; }.footer-cta { align-items:flex-start; text-align:left; }.footer-bottom { display:block; line-height:2; }.footer-bottom a { display:block; margin-top:7px; } }
@media (max-width: 390px) { .product-grid { grid-template-columns:1fr; }.product-image { height:210px; }.footer-main { grid-template-columns:1fr; }.footer-brand { grid-column:auto; } }