/* ============================================================
   SQF 官网 · 深色科技运动�?设计系统
   主色: 深炭�?+ SQF�?+ 电光�?   ============================================================ */

:root {
    /* 色彩 */
    --bg-900: #050810;          /* 最深背�?*/
    --bg-800: #0A0F1C;          /* 主背�?*/
    --bg-700: #111A2E;          /* 卡片背景 */
    --bg-600: #18243D;          /* 悬浮卡片 */
    --bg-500: #233355;          /* 边框/分隔 */

    --line: rgba(255,255,255,.08);
    --line-strong: rgba(255,255,255,.16);

    --text: #F2F5FA;            /* 主文�?*/
    --text-2: #B6BFCC;          /* 次级文字 */
    --text-3: #6B7585;          /* 弱文�?*/

    --brand: #1E5EFF;           /* 深海�?主色) */
    --brand-2: #4D7CFF;
    --brand-glow: rgba(30,94,255,.45);

    --cyan: #00E0FF;            /* 亮青(辅色/高亮) */
    --cyan-glow: rgba(0,224,255,.4);

    --gold: #F4B740;            /* 强调�?荣誉) */

    --grad-brand: linear-gradient(135deg, #1E5EFF 0%, #00A3FF 100%);
    --grad-cyan:  linear-gradient(135deg, #00E0FF 0%, #0094FF 100%);
    --grad-hero:  linear-gradient(120deg, rgba(30,94,255,.18) 0%, rgba(0,224,255,.12) 50%, transparent 100%);

    /* 尺寸 */
    --container: 1240px;
    --radius: 14px;
    --radius-sm: 8px;
    --radius-lg: 24px;

    /* 阴影 */
    --shadow: 0 10px 40px rgba(0,0,0,.45);
    --shadow-glow: 0 0 40px var(--brand-glow);

    /* 过渡 */
    --t: .3s cubic-bezier(.4,.0,.2,1);

    --font: 'Inter','Noto Sans SC',-apple-system,'Segoe UI','Microsoft YaHei',sans-serif;
    --font-disp: 'Montserrat','Noto Sans SC',sans-serif;
}

/* ============ Reset ============ */
* { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior:smooth; -webkit-text-size-adjust:100%; }
body {
    font-family: var(--font);
    background: var(--bg-800);
    color: var(--text);
    line-height: 1.65;
    font-size: 16px;
    overflow-x: hidden;
    -webkit-font-smoothing: antialiased;
}
img { max-width:100%; display:block; }
a { color:inherit; text-decoration:none; transition:color var(--t); }
a:hover { color:var(--brand-2); }
ul { list-style:none; }
button { font-family:inherit; cursor:pointer; border:none; background:none; color:inherit; }
input,textarea,select { font-family:inherit; font-size:inherit; }

::selection { background:var(--brand); color:#fff; }

/* 滚动�?*/
::-webkit-scrollbar { width:10px; height:10px; }
::-webkit-scrollbar-track { background:var(--bg-900); }
::-webkit-scrollbar-thumb { background:var(--bg-500); border-radius:5px; }
::-webkit-scrollbar-thumb:hover { background:var(--brand); }

/* ============ Layout ============ */
.container { width:100%; max-width:var(--container); margin:0 auto; padding:0 24px; }
.muted { color:var(--text-3); }

.section { padding:96px 0; position:relative; }
.section--tight { padding:64px 0; }
.section--alt { background:var(--bg-900); }

.section-head { text-align:center; max-width:760px; margin:0 auto 56px; }
.section-head h2 {
    font-family:var(--font-disp);
    font-size:clamp(28px,4vw,44px);
    font-weight:800;
    letter-spacing:-.02em;
    line-height:1.15;
    margin-bottom:16px;
}
.section-head h2 .accent { color:var(--brand); }
.section-head h2 .accent-c { color:var(--cyan); }
.section-head p { color:var(--text-2); font-size:17px; }
.section-head .eyebrow {
    display:inline-block;
    font-size:13px; font-weight:700; letter-spacing:.15em; text-transform:uppercase;
    color:var(--cyan);
    padding:6px 14px; border:1px solid var(--cyan-glow); border-radius:30px;
    margin-bottom:18px;
    background:rgba(0,212,255,.06);
}

/* ============ 顶部公告�?============ */
.topbar {
    background:var(--bg-900);
    border-bottom:1px solid var(--line);
    font-size:13px; color:var(--text-3);
}
.topbar__inner { display:flex; align-items:center; gap:24px; height:38px; flex-wrap:wrap; }
.topbar__item--right { margin-left:auto; display:flex; gap:18px; }
.topbar__item--right a:hover { color:var(--cyan); }

/* ============ Header / Nav ============ */
.site-header {
    position:sticky; top:0; z-index:100;
    background:rgba(10,14,20,.85);
    backdrop-filter:blur(14px);
    -webkit-backdrop-filter:blur(14px);
    border-bottom:1px solid var(--line);
    transition:background var(--t), border-color var(--t);
}
.site-header.scrolled { background:rgba(6,9,15,.95); border-bottom-color:var(--line-strong); }
.site-header__inner { display:flex; align-items:center; justify-content:space-between; height:72px; }

.brand { display:flex; align-items:center; gap:12px; }
.brand__logo { height:42px; width:auto; object-fit:contain; filter:drop-shadow(0 0 10px rgba(30,94,255,.3)); }
.brand__mark {
    font-family:var(--font-disp);
    font-weight:900; font-size:24px;
    background:var(--grad-brand);
    -webkit-background-clip:text; background-clip:text;
    -webkit-text-fill-color:transparent;
    letter-spacing:-.02em;
    filter:drop-shadow(0 0 12px var(--brand-glow));
}
.brand__text { display:flex; flex-direction:column; line-height:1.1; }
.brand__name { font-weight:700; font-size:15px; }
.brand__tag { font-size:11px; color:var(--text-3); letter-spacing:.05em; }

.main-nav { display:flex; align-items:center; gap:4px; }
.main-nav__link {
    font-size:14px; font-weight:500;
    padding:8px 14px; border-radius:8px;
    color:var(--text-2);
    position:relative;
}
.main-nav__link:hover { color:var(--text); background:var(--bg-700); }
.main-nav__link.is-active { color:var(--text); }
.main-nav__link.is-active::after {
    content:''; position:absolute; left:14px; right:14px; bottom:2px; height:2px;
    background:var(--grad-brand); border-radius:2px;
}
.main-nav__cta { display:flex; align-items:center; gap:10px; margin-left:12px; padding-left:16px; border-left:1px solid var(--line); }
.lang-switch {
    font-size:12px; font-weight:700; letter-spacing:.05em;
    padding:6px 10px; border:1px solid var(--line-strong); border-radius:6px;
    color:var(--text-2);
}
.lang-switch:hover { border-color:var(--cyan); color:var(--cyan); }

.nav-toggle { display:none; flex-direction:column; gap:5px; padding:8px; }
.nav-toggle span { width:24px; height:2px; background:var(--text); border-radius:2px; transition:var(--t); }
.nav-toggle.active span:nth-child(1){ transform:translateY(7px) rotate(45deg); }
.nav-toggle.active span:nth-child(2){ opacity:0; }
.nav-toggle.active span:nth-child(3){ transform:translateY(-7px) rotate(-45deg); }

/* ============ Buttons ============ */
.btn {
    display:inline-flex; align-items:center; justify-content:center; gap:8px;
    font-weight:600; font-size:15px;
    padding:13px 26px; border-radius:10px;
    transition:all var(--t);
    cursor:pointer; border:1px solid transparent;
    white-space:nowrap;
}
.btn--primary { background:var(--grad-brand); color:#fff; box-shadow:0 6px 24px var(--brand-glow); }
.btn--primary:hover { transform:translateY(-2px); box-shadow:0 10px 32px var(--brand-glow); color:#fff; }
.btn--cyan { background:var(--grad-cyan); color:#06121a; }
.btn--cyan:hover { transform:translateY(-2px); color:#06121a; }
.btn--ghost { background:transparent; border-color:var(--line-strong); color:var(--text); }
.btn--ghost:hover { border-color:var(--cyan); color:var(--cyan); background:rgba(0,212,255,.06); }
.btn--sm { padding:9px 18px; font-size:13px; }
.btn--lg { padding:16px 32px; font-size:16px; }
.btn--block { width:100%; }

/* ============ Hero ============ */
.hero {
    position:relative;
    min-height:88vh;
    display:flex; align-items:center;
    padding:80px 0 96px;
    overflow:hidden;
    background:
        radial-gradient(ellipse at 80% 20%, rgba(0,212,255,.12), transparent 50%),
        radial-gradient(ellipse at 10% 80%, rgba(30,94,255,.18), transparent 55%),
        var(--bg-800);
}
.hero::before {
    content:''; position:absolute; inset:0;
    background-image:
        linear-gradient(rgba(255,255,255,.025) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,.025) 1px, transparent 1px);
    background-size:60px 60px;
    mask-image:radial-gradient(ellipse at center, #000 30%, transparent 75%);
    -webkit-mask-image:radial-gradient(ellipse at center, #000 30%, transparent 75%);
    pointer-events:none;
}
.hero__inner { position:relative; z-index:2; max-width:880px; }
.hero__eyebrow {
    display:inline-flex; align-items:center; gap:8px;
    font-size:13px; font-weight:700; letter-spacing:.18em; text-transform:uppercase;
    color:var(--cyan);
    padding:8px 16px; border:1px solid var(--cyan-glow);
    border-radius:30px; margin-bottom:28px;
    background:rgba(0,212,255,.06);
}
.hero h1 {
    font-family:var(--font-disp);
    font-size:clamp(40px,7vw,82px);
    font-weight:900;
    line-height:1.02;
    letter-spacing:-.03em;
    margin-bottom:24px;
}
.hero h1 .grad {
    background:var(--grad-brand);
    -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent;
}
.hero__sub {
    font-size:clamp(18px,2.4vw,26px);
    font-weight:600; color:var(--text);
    margin-bottom:12px;
}
.hero__desc { font-size:17px; color:var(--text-2); margin-bottom:36px; }
.hero__btns { display:flex; gap:16px; flex-wrap:wrap; }

/* 浮动几何装饰 */
.hero__deco {
    position:absolute; right:-100px; top:50%; transform:translateY(-50%);
    width:520px; height:520px; z-index:1; opacity:.5;
    pointer-events:none;
}
.hero__deco .ring {
    position:absolute; inset:0; border:1px solid var(--line-strong); border-radius:50%;
    animation:spin 40s linear infinite;
}
.hero__deco .ring:nth-child(2){ inset:60px; animation-duration:30s; animation-direction:reverse; border-color:rgba(0,212,255,.2); }
.hero__deco .ring:nth-child(3){ inset:120px; animation-duration:20s; border-color:rgba(30,94,255,.3); }
.hero__deco .ring:nth-child(4){ inset:180px; animation-duration:15s; animation-direction:reverse; }
@keyframes spin { to { transform:rotate(360deg); } }

/* ============ 信任�?数字) ============ */
.trust-band {
    background:var(--bg-900);
    border-top:1px solid var(--line);
    border-bottom:1px solid var(--line);
    padding:48px 0;
}
.trust-band__grid { display:grid; grid-template-columns:repeat(4,1fr); gap:32px; }
.stat { text-align:center; }
.stat__num {
    font-family:var(--font-disp);
    font-size:clamp(32px,5vw,52px); font-weight:900;
    background:var(--grad-cyan);
    -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent;
    line-height:1;
}
.stat__label { margin-top:8px; color:var(--text-2); font-size:14px; letter-spacing:.05em; }

/* ============ 产品网格 ============ */
.product-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(240px,1fr)); gap:20px; }

/* ˫�д�Ƭ(��ҳ�����Ʒ��) */
.product-feature-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:28px; }
.product-feature {
    position:relative;
    background:linear-gradient(160deg, var(--bg-700), var(--bg-900));
    border:1px solid var(--line);
    border-radius:var(--radius-lg);
    padding:0;
    overflow:hidden;
    transition:all var(--t);
    min-height:380px;
    display:flex; flex-direction:column;
}
.product-feature__photo { aspect-ratio:16/10; overflow:hidden; position:relative; }
.product-feature__photo img { width:100%; height:100%; object-fit:cover; transition:transform .5s ease; }
.product-feature:hover .product-feature__photo img { transform:scale(1.05); }
.product-feature__body { padding:32px 36px 40px; flex:1; display:flex; flex-direction:column; position:relative; z-index:2; }
.product-feature::before {
    content:''; position:absolute; top:0; left:0; right:0; height:4px;
    background:var(--grad-brand);
    transform:scaleX(0); transform-origin:left; transition:transform .4s ease;
}
.product-feature::after {
    content:''; position:absolute; right:-60px; bottom:-60px;
    width:240px; height:240px; border-radius:50%;
    background:radial-gradient(circle, var(--brand-glow), transparent 70%);
    opacity:.4; transition:opacity var(--t);
}
.product-feature:hover { transform:translateY(-6px); border-color:var(--brand); box-shadow:var(--shadow); }
.product-feature:hover::before { transform:scaleX(1); }
.product-feature:hover::after { opacity:.7; }
.product-feature__icon { font-size:64px; margin-bottom:20px; line-height:1; position:relative; z-index:2; }
.product-feature__title { font-family:var(--font-disp); font-weight:800; font-size:28px; margin-bottom:12px; position:relative; z-index:2; }
.product-feature__desc { color:var(--text-2); font-size:15px; line-height:1.7; flex:1; position:relative; z-index:2; }
.product-feature__link { display:inline-flex; align-items:center; gap:8px; margin-top:24px; font-weight:600; color:var(--cyan); position:relative; z-index:2; transition:gap var(--t),color var(--t); }
.product-feature__link:hover { color:var(--brand-2); gap:14px; }
@media (max-width:768px){ .product-feature-grid { grid-template-columns:1fr; } }
.product-card {
    position:relative;
    background:var(--bg-700);
    border:1px solid var(--line);
    border-radius:var(--radius);
    padding:32px 24px;
    transition:all var(--t);
    overflow:hidden;
}
.product-card::before {
    content:''; position:absolute; top:0; left:0; right:0; height:3px;
    background:var(--grad-brand);
    transform:scaleX(0); transform-origin:left; transition:transform var(--t);
}
.product-card:hover { transform:translateY(-6px); border-color:var(--line-strong); background:var(--bg-600); box-shadow:var(--shadow); }
.product-card:hover::before { transform:scaleX(1); }
.product-card__icon { font-size:42px; margin-bottom:16px; line-height:1; }
.product-card__title { font-family:var(--font-disp); font-weight:700; font-size:19px; margin-bottom:8px; }
.product-card__desc { color:var(--text-2); font-size:14px; line-height:1.55; }
.product-card__link {
    display:inline-block; margin-top:16px;
    font-size:13px; font-weight:600; color:var(--cyan);
}
.product-card__link:hover { color:var(--brand-2); }

/* ============ 优势卡片(台球八大优势) ============ */
.adv-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(280px,1fr)); gap:20px; }
.adv-card {
    background:linear-gradient(180deg, var(--bg-700), var(--bg-800));
    border:1px solid var(--line);
    border-radius:var(--radius);
    padding:28px;
    transition:all var(--t);
    position:relative;
}
.adv-card:hover { border-color:var(--brand); transform:translateY(-4px); box-shadow:0 8px 30px rgba(30,94,255,.15); }
.adv-card__num {
    position:absolute; top:20px; right:24px;
    font-family:var(--font-disp); font-weight:900; font-size:42px;
    color:var(--bg-500); line-height:1;
}
.adv-card__icon { font-size:32px; margin-bottom:14px; }
.adv-card__title { font-family:var(--font-disp); font-weight:700; font-size:18px; margin-bottom:10px; }
.adv-card__desc { color:var(--text-2); font-size:14px; line-height:1.6; }

/* ============ 客户�?============ */
.partner-band { background:var(--bg-900); overflow:hidden; }
.marquee { position:relative; overflow:hidden; mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent); -webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent); }
.marquee__track { display:flex; gap:16px; width:max-content; animation:marquee 40s linear infinite; }
.marquee:hover .marquee__track { animation-play-state:paused; }
@keyframes marquee { to { transform:translateX(-50%); } }
.partner-chip {
    display:flex; flex-direction:column; align-items:center; justify-content:center;
    min-width:170px; height:90px;
    background:var(--bg-700); border:1px solid var(--line); border-radius:12px;
    padding:12px 20px; transition:var(--t);
}
.partner-chip:hover { border-color:var(--cyan); background:var(--bg-600); }
.partner-chip__name { font-family:var(--font-disp); font-weight:700; font-size:16px; }
.partner-chip__cat { font-size:11px; color:var(--text-3); margin-top:2px; letter-spacing:.05em; text-transform:uppercase; }

/* ============ 案例 ============ */
.project-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(220px,1fr)); gap:16px; }
.project-card {
    position:relative; aspect-ratio:4/3;
    border-radius:var(--radius); overflow:hidden;
    border:1px solid var(--line);
    background:linear-gradient(135deg, var(--bg-700), var(--bg-600));
    display:flex; align-items:flex-end;
    transition:var(--t);
}
.project-card:hover { transform:scale(1.03); border-color:var(--brand); box-shadow:var(--shadow); }
.project-card__label {
    position:relative; z-index:2;
    padding:14px 16px; width:100%;
    background:linear-gradient(0deg, rgba(6,9,15,.92), transparent);
    font-weight:600; font-size:14px;
}
.project-card__icon {
    position:absolute; inset:0; display:flex; align-items:center; justify-content:center;
    font-size:64px; opacity:.18;
}

/* ============ 品牌故事 ============ */
.story-band {
    position:relative; overflow:hidden;
    background:
        radial-gradient(ellipse at 20% 50%, rgba(30,94,255,.15), transparent 60%),
        var(--bg-900);
}
.story-band__inner { max-width:820px; margin:0 auto; text-align:center; }
.story-band .quote-mark { font-size:80px; color:var(--brand); line-height:.5; font-family:Georgia,serif; opacity:.4; }
.story-band h2 {
    font-family:var(--font-disp);
    font-size:clamp(26px,4vw,40px); font-weight:800; line-height:1.2;
    margin:20px 0;
}
.story-band h2 .grad { background:var(--grad-brand); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; }
.story-band p { color:var(--text-2); font-size:17px; line-height:1.8; }
.story-band .author { margin-top:28px; font-weight:600; color:var(--cyan); }

/* ============ CTA �?============ */
.cta-band {
    background:var(--grad-brand);
    padding:64px 0;
    position:relative; overflow:hidden;
}
.cta-band::before {
    content:''; position:absolute; inset:0;
    background-image:linear-gradient(135deg, rgba(255,255,255,.08) 25%, transparent 25%, transparent 50%, rgba(255,255,255,.08) 50%, rgba(255,255,255,.08) 75%, transparent 75%);
    background-size:40px 40px; opacity:.5;
}
.cta-band__inner { position:relative; z-index:2; display:flex; align-items:center; justify-content:space-between; gap:32px; flex-wrap:wrap; }
.cta-band__text h2 { font-family:var(--font-disp); font-size:clamp(24px,3vw,34px); font-weight:800; color:#fff; margin-bottom:8px; }
.cta-band__text p { color:rgba(255,255,255,.9); }
.cta-band .btn--ghost { background:rgba(0,0,0,.25); border-color:rgba(255,255,255,.4); color:#fff; }
.cta-band .btn--ghost:hover { background:#fff; color:var(--brand); }
.cta-band .btn--primary { background:#fff; color:var(--brand); box-shadow:none; }
.cta-band .btn--primary:hover { background:var(--bg-900); color:#fff; transform:translateY(-2px); }

/* ============ Footer ============ */
.site-footer { background:var(--bg-900); border-top:1px solid var(--line); padding-top:72px; }
.site-footer__grid { display:grid; grid-template-columns:2fr 1fr 1fr 1.5fr; gap:48px; padding-bottom:48px; }
.footer-col__title { font-size:14px; font-weight:700; letter-spacing:.05em; text-transform:uppercase; color:var(--text); margin-bottom:18px; }
.footer-col__title--sm { margin-top:24px; }
.footer-links li { margin-bottom:10px; }
.footer-links a { color:var(--text-2); font-size:14px; }
.footer-links a:hover { color:var(--cyan); }
.footer-contact li { font-size:14px; color:var(--text-2); margin-bottom:10px; line-height:1.5; }
.footer-contact a:hover { color:var(--cyan); }
.footer-brief { color:var(--text-3); font-size:14px; margin:16px 0 20px; line-height:1.7; }
.footer-social { display:flex; gap:10px; }
.footer-social a {
    width:36px; height:36px; border-radius:8px;
    display:flex; align-items:center; justify-content:center;
    background:var(--bg-700); border:1px solid var(--line);
    font-size:12px; font-weight:700; color:var(--text-2);
}
.footer-social a:hover { background:var(--brand); color:#fff; border-color:var(--brand); }
.footer-channels { display:flex; flex-wrap:wrap; gap:8px; }
.footer-channels a { font-size:12px; padding:5px 10px; border:1px solid var(--line); border-radius:6px; color:var(--text-2); }
.footer-channels a:hover { border-color:var(--cyan); color:var(--cyan); }
.site-footer__bottom { border-top:1px solid var(--line); padding:20px 0; }
.site-footer__bottom-inner { display:flex; justify-content:space-between; flex-wrap:wrap; gap:12px; font-size:13px; color:var(--text-3); }

.brand--footer { margin-bottom:0; }
.brand--footer .brand__name { font-size:17px; }

/* ============ 浮动按钮 ============ */
.float-wa {
    position:fixed; right:24px; bottom:24px; z-index:90;
    width:56px; height:56px; border-radius:50%;
    background:#25D366; color:#fff;
    display:flex; align-items:center; justify-content:center;
    box-shadow:0 8px 24px rgba(37,211,102,.5);
    transition:var(--t);
    animation:pulse 2s infinite;
}
.float-wa:hover { transform:scale(1.1); color:#fff; }
@keyframes pulse { 0%{box-shadow:0 0 0 0 rgba(37,211,102,.5);} 70%{box-shadow:0 0 0 16px rgba(37,211,102,0);} 100%{box-shadow:0 0 0 0 rgba(37,211,102,0);} }

.back-top {
    position:fixed; right:24px; bottom:90px; z-index:89;
    width:44px; height:44px; border-radius:50%;
    background:var(--bg-700); border:1px solid var(--line-strong);
    color:var(--text); font-size:20px;
    opacity:0; pointer-events:none; transition:var(--t);
}
.back-top.show { opacity:1; pointer-events:auto; }
.back-top:hover { background:var(--brand); border-color:var(--brand); }

/* ============ 通用页面(内页) ============ */
.page-hero {
    padding:64px 0 48px;
    background:
        radial-gradient(ellipse at 80% 30%, rgba(0,212,255,.1), transparent 50%),
        radial-gradient(ellipse at 10% 80%, rgba(30,94,255,.12), transparent 55%),
        var(--bg-800);
    border-bottom:1px solid var(--line);
    position:relative;
}
.page-hero__inner { max-width:880px; }
.breadcrumb { font-size:13px; color:var(--text-3); margin-bottom:16px; }
.breadcrumb a:hover { color:var(--cyan); }
.breadcrumb span { margin:0 8px; }
.page-hero h1 {
    font-family:var(--font-disp);
    font-size:clamp(30px,4.5vw,52px); font-weight:800;
    letter-spacing:-.02em; line-height:1.1; margin-bottom:16px;
}
.page-hero__lead { font-size:18px; color:var(--text-2); max-width:720px; }

/* ============ About 时间�?============ */
.timeline { position:relative; max-width:880px; margin:0 auto; padding-left:32px; }
.timeline::before { content:''; position:absolute; left:8px; top:0; bottom:0; width:2px; background:var(--grad-brand); }
.timeline__item { position:relative; padding-bottom:36px; }
.timeline__item::before {
    content:''; position:absolute; left:-32px; top:6px;
    width:18px; height:18px; border-radius:50%;
    background:var(--bg-800); border:3px solid var(--brand);
    box-shadow:0 0 12px var(--brand-glow);
}
.timeline__year { font-family:var(--font-disp); font-weight:900; font-size:24px; color:var(--cyan); }
.timeline__text { color:var(--text-2); margin-top:4px; }

/* ============ 荣誉卡片 ============ */
.honor-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(280px,1fr)); gap:20px; }
.honor-card {
    background:var(--bg-700); border:1px solid var(--line); border-radius:var(--radius);
    padding:28px; text-align:center; transition:var(--t);
}
.honor-card:hover { border-color:var(--gold); transform:translateY(-4px); box-shadow:0 8px 30px rgba(244,183,64,.15); }
.honor-card__icon { font-size:42px; }
.honor-card__title { font-family:var(--font-disp); font-weight:700; font-size:17px; margin:12px 0 6px; }
.honor-card__sub { color:var(--text-3); font-size:13px; }

/* ============ 文章/News ============ */
.news-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(300px,1fr)); gap:24px; }
.news-card {
    background:var(--bg-700); border:1px solid var(--line); border-radius:var(--radius);
    overflow:hidden; transition:var(--t); display:flex; flex-direction:column;
}
.news-card:hover { transform:translateY(-4px); border-color:var(--line-strong); box-shadow:var(--shadow); }
.news-card__cover { aspect-ratio:16/9; background:var(--grad-brand); position:relative; display:flex; align-items:center; justify-content:center; font-size:48px; overflow:hidden; }
.news-card__body { padding:22px; flex:1; display:flex; flex-direction:column; }
.news-card__date { font-size:12px; color:var(--cyan); letter-spacing:.05em; margin-bottom:8px; }
.news-card__title { font-family:var(--font-disp); font-weight:700; font-size:18px; margin-bottom:8px; line-height:1.3; }
.news-card__excerpt { color:var(--text-2); font-size:14px; flex:1; }
.news-card__more { margin-top:14px; font-size:13px; font-weight:600; color:var(--cyan); }

.article-body { max-width:760px; margin:0 auto; }
.article-body h2 { font-family:var(--font-disp); font-size:26px; margin:32px 0 14px; }
.article-body h3 { font-size:19px; margin:24px 0 10px; color:var(--cyan); }
.article-body p { color:var(--text-2); margin-bottom:16px; line-height:1.85; }
.article-body ul { margin:0 0 16px 20px; }
.article-body li { color:var(--text-2); margin-bottom:6px; }
.article-body blockquote {
    border-left:3px solid var(--brand); padding:12px 20px; margin:20px 0;
    background:var(--bg-700); border-radius:0 8px 8px 0; font-style:italic; color:var(--text);
}
.article-meta { color:var(--text-3); font-size:14px; margin-bottom:24px; padding-bottom:16px; border-bottom:1px solid var(--line); }

/* ============ 表单 ============ */
.form-wrap { max-width:680px; margin:0 auto; }
.form-grid { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.form-field { display:flex; flex-direction:column; gap:6px; }
.form-field--full { grid-column:1/-1; }
.form-field label { font-size:13px; font-weight:600; color:var(--text-2); }
.form-field input, .form-field textarea, .form-field select {
    background:var(--bg-900); border:1px solid var(--line-strong); border-radius:8px;
    padding:12px 14px; color:var(--text); transition:var(--t);
}
.form-field input:focus, .form-field textarea:focus, .form-field select:focus {
    outline:none; border-color:var(--cyan); box-shadow:0 0 0 3px var(--cyan-glow);
}
.form-field textarea { min-height:120px; resize:vertical; }
.form-msg { margin-top:16px; padding:14px 18px; border-radius:8px; font-weight:500; display:none; }
.form-msg.show { display:block; }
.form-msg--ok { background:rgba(34,197,94,.12); border:1px solid rgba(34,197,94,.4); color:#4ade80; }
.form-msg--err { background:rgba(239,68,68,.12); border:1px solid rgba(239,68,68,.4); color:#f87171; }
/* honeypot 隐藏 */
.hp { position:absolute; left:-9999px; }

/* 联系信息�?*/
.contact-grid { display:grid; grid-template-columns:1fr 1fr; gap:48px; align-items:start; }
.contact-info-card {
    background:var(--bg-700); border:1px solid var(--line); border-radius:var(--radius);
    padding:28px; margin-bottom:16px;
}
.contact-info-card h3 { font-family:var(--font-disp); font-size:18px; margin-bottom:14px; display:flex; align-items:center; gap:10px; }
.contact-info-card ul li { padding:8px 0; border-bottom:1px dashed var(--line); color:var(--text-2); font-size:14px; }
.contact-info-card ul li:last-child { border-bottom:none; }
.contact-info-card a:hover { color:var(--cyan); }

/* ============ 通用详情�?产品) ============ */
.detail-grid { display:grid; grid-template-columns:1fr 1fr; gap:48px; align-items:center; }
.detail-visual {
    aspect-ratio:1; border-radius:var(--radius-lg);
    background:linear-gradient(135deg, var(--bg-700), var(--bg-900));
    border:1px solid var(--line);
    display:flex; align-items:center; justify-content:center;
    font-size:120px; position:relative; overflow:hidden;
}
.detail-visual::after {
    content:''; position:absolute; inset:0;
    background:radial-gradient(circle at 50% 50%, var(--brand-glow), transparent 60%);
}
.detail-body h2 { font-family:var(--font-disp); font-size:clamp(24px,3vw,36px); margin-bottom:16px; }
.feature-list { margin-top:20px; }
.feature-list li {
    padding:10px 0 10px 28px; position:relative; color:var(--text-2);
    border-bottom:1px solid var(--line);
}
.feature-list li::before { content:'\25B8'; position:absolute; left:0; color:var(--cyan); font-weight:700; }

/* ============ Product Showcase (big image sections) ============ */
.prod-showcase {
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:56px;
    align-items:center;
}
.prod-showcase--reverse .prod-showcase__visual { order:2; }
.prod-showcase__visual {
    position:relative;
    aspect-ratio:4/3;
    border-radius:var(--radius-lg);
    overflow:hidden;
    border:1px solid var(--line);
    box-shadow:var(--shadow);
}
.prod-showcase__visual img { width:100%; height:100%; object-fit:cover; transition:transform .6s ease; }
.prod-showcase:hover .prod-showcase__visual img { transform:scale(1.04); }
.prod-showcase__visual::after {
    content:''; position:absolute; inset:0;
    background:linear-gradient(135deg, transparent 60%, var(--brand-glow));
    opacity:.4; pointer-events:none;
}
.prod-showcase__badge {
    position:absolute; top:20px; left:20px; z-index:2;
    width:60px; height:60px; border-radius:50%;
    background:rgba(10,15,28,.85); backdrop-filter:blur(8px);
    display:flex; align-items:center; justify-content:center;
    font-size:28px; border:1px solid var(--line-strong);
}
.prod-showcase__body { padding:8px 0; }
.prod-showcase__title {
    font-family:var(--font-disp);
    font-size:clamp(28px,3.5vw,42px);
    font-weight:800; letter-spacing:-.02em;
    margin:14px 0 12px; line-height:1.1;
}
.prod-showcase__lead { color:var(--cyan); font-size:15px; font-weight:600; margin-bottom:14px; }
.prod-showcase__desc { color:var(--text-2); font-size:16px; line-height:1.7; margin-bottom:24px; }
.prod-showcase__stats {
    display:grid; grid-template-columns:repeat(4,1fr); gap:16px;
    margin-bottom:24px; padding:20px 0;
    border-top:1px solid var(--line); border-bottom:1px solid var(--line);
}
.prod-showcase__stat { text-align:center; }
.prod-showcase__stat-num {
    display:block; font-family:var(--font-disp); font-weight:800;
    font-size:clamp(18px,2.2vw,26px);
    background:var(--grad-cyan);
    -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent;
    line-height:1.1;
}
.prod-showcase__stat-label { font-size:12px; color:var(--text-3); margin-top:4px; display:block; }
.prod-showcase__features { margin-bottom:28px; }
.prod-showcase__features li {
    padding:8px 0 8px 26px; position:relative; color:var(--text-2);
    font-size:14px; border-bottom:1px dashed var(--line);
}
.prod-showcase__features li::before { content:'\2713'; position:absolute; left:0; color:var(--cyan); font-weight:700; }
.prod-showcase__cta { display:flex; gap:12px; align-items:center; flex-wrap:wrap; }

/* ============ Trade Strip ============ */
.trade-strip {
    display:grid; grid-template-columns:repeat(5,1fr); gap:0;
    background:var(--bg-700); border:1px solid var(--line); border-radius:var(--radius);
    overflow:hidden;
}
.trade-strip__item {
    padding:24px 20px; text-align:center;
    border-right:1px solid var(--line);
    display:flex; flex-direction:column; align-items:center; gap:6px;
}
.trade-strip__item:last-child { border-right:none; }
.trade-strip__icon { font-size:28px; }
.trade-strip__label { font-size:12px; color:var(--text-3); text-transform:uppercase; letter-spacing:.05em; }
.trade-strip__value { font-size:14px; font-weight:600; color:var(--text); }

.spec-table { width:100%; border-collapse:collapse; margin-top:20px; }
.spec-table th, .spec-table td { padding:12px 16px; text-align:left; border-bottom:1px solid var(--line); font-size:14px; }
.spec-table th { color:var(--text-3); font-weight:500; width:40%; }
.spec-table td { color:var(--text); }

/* ============ 动画进场 ============ */
.reveal { opacity:0; transform:translateY(30px); transition:opacity .7s ease, transform .7s ease; }
.reveal.in { opacity:1; transform:none; }

/* ============ 响应�?============ */
@media (max-width:980px) {
    .site-footer__grid { grid-template-columns:1fr 1fr; gap:32px; }
    .footer-col--brand { grid-column:1/-1; }
    .contact-grid, .detail-grid { grid-template-columns:1fr; gap:32px; }
    .series-block { grid-template-columns:1fr !important; gap:16px !important; }
    .series-block__img { max-width:280px; }
    .prod-showcase { grid-template-columns:1fr !important; }
    .prod-showcase__visual { aspect-ratio:16/10 !important; }
    .trade-strip { grid-template-columns:repeat(2,1fr) !important; }
}
@media (max-width:600px) {
    .prod-showcase__stats { grid-template-columns:repeat(2,1fr) !important; }
    .trade-strip { grid-template-columns:1fr !important; }
}
@media (max-width:768px) {
    .section { padding:64px 0; }
    .main-nav {
        position:fixed; top:0; right:0; bottom:0;
        width:min(320px,85vw);
        background:var(--bg-900);
        flex-direction:column; align-items:stretch;
        padding:90px 24px 32px; gap:6px;
        transform:translateX(100%); transition:transform var(--t);
        border-left:1px solid var(--line);
        z-index:99;
    }
    .main-nav.open { transform:none; }
    .main-nav__link { padding:14px 16px; font-size:16px; border-radius:8px; }
    .main-nav__link.is-active::after { display:none; }
    .main-nav__link.is-active { background:var(--bg-700); color:var(--brand-2); }
    .main-nav__cta { margin:16px 0 0; padding:16px 0 0; border-left:none; border-top:1px solid var(--line); flex-direction:column; align-items:stretch; }
    .nav-toggle { display:flex; z-index:101; }
    .topbar { display:none; }
    .trust-band__grid { grid-template-columns:1fr 1fr; gap:24px; }
    .form-grid { grid-template-columns:1fr; }
    .site-footer__grid { grid-template-columns:1fr; }
    .cta-band__inner { flex-direction:column; text-align:center; }
    .hero__deco { display:none; }
}
@media (max-width:480px) {
    .container { padding:0 16px; }
    .brand__tag { display:none; }
    .float-wa { width:50px; height:50px; right:16px; bottom:16px; }
    .back-top { right:16px; bottom:76px; }
}