/* 送水通公司官网 2026-10 刷新 · 公共层（全站最后加载；只认 .sst-refresh 作用域；色值只用品牌标准色） */
.sst-refresh {
    --rf-blue:#1677FF; --rf-blue-2:#4096FF; --rf-drop:#69B1FF; --rf-ink:#151C2E;
    --rf-ice:#EAF2FF; --rf-mist:#B6D2FF; --rf-amber:#FFA31A; --rf-white:#FFFFFF;
    --rf-text:rgba(21,28,46,.92); --rf-text-2:rgba(21,28,46,.64); --rf-text-3:rgba(21,28,46,.46);
    --rf-line:rgba(21,28,46,.08); --rf-line-blue:rgba(22,119,255,.14);
    --rf-tint:rgba(22,119,255,.08); --rf-tint-2:rgba(22,119,255,.14);
    --rf-grad:linear-gradient(135deg,#4096FF 0%,#1677FF 100%);
    --rf-shadow-sm:0 1px 2px rgba(21,28,46,.04),0 4px 12px rgba(21,28,46,.04);
    --rf-shadow:0 2px 8px rgba(21,28,46,.04),0 12px 32px rgba(22,119,255,.08);
    --rf-shadow-lg:0 4px 12px rgba(21,28,46,.05),0 24px 56px rgba(22,119,255,.14);
    --rf-shadow-btn:0 8px 20px rgba(22,119,255,.28);
    --rf-r-sm:12px; --rf-r:16px; --rf-r-lg:20px; --rf-r-pill:999px;
    --rf-fs-h1:clamp(40px,2.6vw + 20px,64px);
    --rf-fs-h2:clamp(28px,1.2vw + 16px,40px);
    --rf-fs-h3:clamp(18px,.4vw + 14px,20px);
    --rf-fs-lead:clamp(16px,.3vw + 13px,18px);
    --rf-ease:cubic-bezier(.22,.61,.36,1);
    --rf-header-h:72px;
}
@media (min-width:2200px) {
    .sst-refresh {
        --rf-fs-h1:clamp(64px,2.6vw + 16px,84px);
        --rf-fs-h2:clamp(40px,1.3vw + 12px,52px);
        --rf-fs-h3:24px;
        --rf-fs-lead:20px;
        --rf-header-h:88px;
    }
}

/* 焦点环：键盘可见、鼠标点击不出现 */
.sst-refresh a:focus-visible,
.sst-refresh button:focus-visible,
.sst-refresh [tabindex]:focus-visible { outline:3px solid rgba(22,119,255,.42); outline-offset:3px; border-radius:var(--rf-r-sm); }

/* ---------- 按钮：胶囊、渐变主按钮、四种状态 ---------- */
.sst-refresh .btn {
    min-height:48px; padding:12px 32px; gap:8px; border-radius:var(--rf-r-pill);
    font-size:16px; font-weight:600; letter-spacing:0;
    transition:transform .2s var(--rf-ease),box-shadow .2s var(--rf-ease),background-color .2s,color .2s,border-color .2s,filter .2s;
}
.sst-refresh .btn svg { width:18px; height:18px; transition:transform .2s var(--rf-ease); }
.sst-refresh .btn:hover svg { transform:translateX(3px); }
.sst-refresh .btn-primary { background:var(--rf-grad); border-color:transparent; color:#fff; box-shadow:var(--rf-shadow-btn); }
.sst-refresh .btn-primary:hover { background:var(--rf-grad); transform:translateY(-1px); box-shadow:0 12px 28px rgba(22,119,255,.34); filter:brightness(1.05); }
.sst-refresh .btn-primary:active { transform:translateY(0); box-shadow:0 4px 12px rgba(22,119,255,.24); filter:brightness(.96); }
.sst-refresh .btn-outline { background:#fff; border-color:var(--rf-mist); color:var(--rf-ink); }
.sst-refresh .btn-outline:hover { background:var(--rf-ice); border-color:var(--rf-blue); color:var(--rf-blue); }
.sst-refresh .btn-outline:active { background:var(--rf-tint-2); }
.sst-refresh .btn-white { background:#fff; color:var(--rf-blue); border-color:transparent; box-shadow:0 8px 20px rgba(21,28,46,.14); }
.sst-refresh .btn-white:hover { transform:translateY(-1px); box-shadow:0 12px 28px rgba(21,28,46,.18); }
.sst-refresh .btn-white:active { transform:translateY(0); box-shadow:0 4px 12px rgba(21,28,46,.12); }

/* ---------- 导航：半透明白底毛玻璃吸顶；标志靠左、栏目居中、按钮靠右 ---------- */
.sst-refresh .site-header {
    height:var(--rf-header-h); background:rgba(255,255,255,.78);
    -webkit-backdrop-filter:saturate(180%) blur(16px); backdrop-filter:saturate(180%) blur(16px);
    border-bottom:1px solid var(--rf-line); box-shadow:none;
}
.sst-refresh .site-header .nav-links>a,
.sst-refresh .site-header .nav-group>a { color:var(--rf-text-2); font-weight:500; transition:color .2s,background-color .2s; }
.sst-refresh .site-header .nav-links>a:hover,
.sst-refresh .site-header .nav-group>a:hover,
.sst-refresh .site-header .nav-group:hover>a { color:var(--rf-blue); }
.sst-refresh .site-header .nav-links [aria-current=page] { color:var(--rf-blue); font-weight:600; }
.sst-refresh .site-header .nav-links>a.nav-cta {
    min-height:40px; padding:8px 24px; border:0; border-radius:var(--rf-r-pill);
    background:var(--rf-grad); color:#fff; font-weight:600; box-shadow:var(--rf-shadow-btn);
    transition:transform .2s var(--rf-ease),box-shadow .2s var(--rf-ease),filter .2s;
}
.sst-refresh .site-header .nav-links>a.nav-cta:hover { color:#fff; transform:translateY(-1px); box-shadow:0 12px 28px rgba(22,119,255,.34); filter:brightness(1.05); }
.sst-refresh .site-header .nav-links>a.nav-cta:active { transform:translateY(0); box-shadow:0 4px 12px rgba(22,119,255,.24); }
.sst-refresh .site-header .nav-dropdown {
    border:1px solid var(--rf-line); border-radius:var(--rf-r); padding:8px;
    background:rgba(255,255,255,.96); box-shadow:var(--rf-shadow-lg);
}
.sst-refresh .site-header .nav-dropdown a { border-radius:var(--rf-r-sm); transition:background-color .2s,color .2s; }
.sst-refresh .site-header .nav-dropdown a:hover,
.sst-refresh .site-header .nav-dropdown a:focus-visible { background:var(--rf-ice); }
.sst-refresh .site-header .nav-dropdown a:hover strong { color:var(--rf-blue); }

@media (min-width:951px) {
    .sst-refresh .site-header .header-inner {
        /* 导航不跟内容区对齐：标志贴左、按钮贴右，两边只留窄边距 */
        width:calc(100% - 2 * clamp(24px,2.5vw,64px));
        display:grid; grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);
        align-items:center; gap:24px; position:relative;
    }
    .sst-refresh .site-header .brand { justify-self:start; }
    .sst-refresh .site-header .nav-links { grid-column:2; justify-self:center; position:static; gap:clamp(4px,.8vw,16px); }
    .sst-refresh .site-header .nav-links>a:not(.nav-cta),
    .sst-refresh .site-header .nav-group>a { min-height:40px; padding:8px clamp(8px,.8vw,16px); border-radius:var(--rf-r-pill); }
    .sst-refresh .site-header .nav-links>a[aria-current=page]:not(.nav-cta),
    .sst-refresh .site-header .nav-group>a[aria-current=page] { background:var(--rf-tint); }
    .sst-refresh .site-header .nav-links>a.nav-cta { position:absolute; right:0; top:50%; transform:translateY(-50%); }
    .sst-refresh .site-header .nav-links>a.nav-cta:hover { transform:translateY(calc(-50% - 1px)); }
    .sst-refresh .site-header .nav-links>a.nav-cta:active { transform:translateY(-50%); }
}
@media (min-width:951px) and (max-width:1180px) {
    /* 窄桌面：栏目在标志与按钮之间居中，给按钮留出位置 */
    .sst-refresh .site-header .header-inner { grid-template-columns:auto minmax(0,1fr); gap:16px; }
    .sst-refresh .site-header .nav-links { padding-right:128px; }
    .sst-refresh .site-header .nav-links>a:not(.nav-cta),
    .sst-refresh .site-header .nav-group>a { padding-inline:8px; font-size:14px; }
    .sst-refresh .site-header .brand-wordmark { max-width:132px; height:auto; }
}
@media (max-width:950px) {
    .sst-refresh { --rf-header-h:64px; }
    .sst-refresh .site-header .nav-links { top:var(--rf-header-h); max-height:calc(100dvh - var(--rf-header-h)); border-radius:0 0 var(--rf-r-lg) var(--rf-r-lg); box-shadow:var(--rf-shadow-lg); }
    .sst-refresh .site-header .nav-links>a.nav-cta { justify-content:center; min-height:48px; }
}
@media (min-width:2200px) {
    .sst-refresh .site-header .nav-links>a,
    .sst-refresh .site-header .nav-group>a { font-size:17px; }
    .sst-refresh .site-header .nav-links>a.nav-cta { min-height:48px; padding:12px 32px; font-size:17px; }
}

/* ---------- 收尾横幅：蓝色渐变圆角卡 + 挥手吉祥物 ---------- */
.sst-refresh .closing-cta { background:transparent; padding:clamp(48px,6vw,96px) 0 clamp(48px,5vw,64px); color:#fff; }
.sst-refresh .closing-cta .closing-inner {
    position:relative; isolation:isolate; display:flex; flex-direction:column; align-items:flex-start; justify-content:center; gap:24px;
    min-height:clamp(220px,16vw,320px); padding:clamp(32px,4vw,64px) clamp(24px,5vw,96px);
    border-radius:var(--rf-r-lg); background:var(--rf-grad); box-shadow:var(--rf-shadow-lg);
}
.sst-refresh .closing-cta .closing-inner::before {
    content:""; position:absolute; inset:0; z-index:-1; border-radius:inherit; pointer-events:none;
    background:
        radial-gradient(circle at 78% 120%,rgba(255,255,255,.18) 0 18%,transparent 18.2%),
        radial-gradient(circle at 78% 120%,transparent 0 30%,rgba(255,255,255,.10) 30.2% 30.6%,transparent 30.8%),
        radial-gradient(circle at 12% -30%,rgba(255,255,255,.14) 0 22%,transparent 22.2%),
        radial-gradient(ellipse at 100% 0%,rgba(105,177,255,.55),transparent 60%);
}
/* 右侧留给吉祥物：用文字区最大宽度让位，不用大内边距 */
.sst-refresh .closing-cta .closing-inner > :not(.closing-mascot) { max-width:calc(100% - clamp(0px,24vw,512px)); }
.sst-refresh .closing-cta h2 { margin:0; color:#fff; font-size:var(--rf-fs-h2); font-weight:700; line-height:1.25; letter-spacing:0; }
.sst-refresh .closing-cta p { margin:12px 0 0; color:rgba(255,255,255,.86); font-size:var(--rf-fs-lead); line-height:1.7; }
.sst-refresh .closing-cta .closing-mascot {
    position:absolute; right:clamp(16px,6vw,140px); bottom:0; width:auto; height:calc(100% + 40px); max-height:400px;
    pointer-events:none; filter:drop-shadow(0 16px 24px rgba(21,28,46,.18));
}
@media (max-width:780px) {
    .sst-refresh .closing-cta .closing-inner { padding:32px 24px; min-height:0; }
    .sst-refresh .closing-cta .closing-inner > :not(.closing-mascot) { max-width:none; }
    .sst-refresh .closing-cta .closing-mascot { position:relative; right:auto; align-self:center; height:176px; margin:-8px 0 -32px; }
}

/* ---------- 页脚：浅色四栏，信息不变 ---------- */
.sst-refresh .site-footer {
    background:linear-gradient(180deg,rgba(234,242,255,0) 0%,rgba(234,242,255,.6) 100%);
    border-top:1px solid var(--rf-line); color:var(--rf-text-2);
    padding-top:clamp(48px,5vw,64px);
}
.sst-refresh .site-footer h3 { color:var(--rf-ink); font-size:15px; font-weight:600; letter-spacing:0; margin-bottom:16px; }
.sst-refresh .site-footer .footer-grid a:not(.official-phone):not(.footer-consult):not(.brand-word) {
    color:var(--rf-text-2); font-size:14px; transition:color .2s;
}
.sst-refresh .site-footer .footer-grid a:not(.official-phone):not(.footer-consult):not(.brand-word):hover { color:var(--rf-blue); }
.sst-refresh .site-footer .footer-brand p { color:var(--rf-text-2); font-size:14px; }
.sst-refresh .site-footer .official-phone-label { color:var(--rf-text-3); font-size:13px; }
.sst-refresh .site-footer .official-phone-number { color:var(--rf-ink); font-weight:700; letter-spacing:0; }
.sst-refresh .site-footer .official-phone:hover .official-phone-number { color:var(--rf-blue); }
.sst-refresh .site-footer .footer-consult {
    display:inline-flex; align-items:center; gap:8px; min-height:44px; padding:8px 24px;
    border:1px solid var(--rf-mist); border-radius:var(--rf-r-pill); background:#fff;
    color:var(--rf-blue); font-weight:600; transition:background-color .2s,border-color .2s,transform .2s var(--rf-ease);
}
.sst-refresh .site-footer .footer-consult:hover { background:var(--rf-ice); border-color:var(--rf-blue); transform:translateY(-1px); }
.sst-refresh .site-footer .footer-bottom { border-top:1px solid var(--rf-line); color:var(--rf-text-3); font-size:13px; }
.sst-refresh .site-footer .footer-bottom a { color:var(--rf-text-3); transition:color .2s; }
.sst-refresh .site-footer .footer-bottom a:hover { color:var(--rf-blue); }

/* ---------- 侧边咨询条：白色圆角卡、品牌蓝柔影 ---------- */
.sst-refresh .floating-contact.contact-widget {
    border:1px solid var(--rf-line); border-radius:var(--rf-r); overflow:hidden;
    background:rgba(255,255,255,.92); -webkit-backdrop-filter:blur(12px); backdrop-filter:blur(12px);
    box-shadow:var(--rf-shadow-lg);
}
.sst-refresh .contact-widget > .contact-widget-action,
.sst-refresh .contact-widget > .contact-widget-top { background:transparent; color:var(--rf-blue); transition:background-color .2s,color .2s; }
.sst-refresh .contact-widget > .contact-widget-action span { color:var(--rf-text-2); transition:color .2s; }
.sst-refresh .contact-widget > .contact-widget-action:hover,
.sst-refresh .contact-widget > .contact-widget-top:hover,
.sst-refresh .contact-widget > [aria-expanded=true] { background:var(--rf-ice); }
.sst-refresh .contact-widget > .contact-widget-action:hover span { color:var(--rf-blue); }
.sst-refresh .contact-widget .contact-qr-panel { border-radius:var(--rf-r); box-shadow:var(--rf-shadow-lg); }

/* ---------- 减少动效 ---------- */
@media (prefers-reduced-motion:reduce) {
    .sst-refresh .btn, .sst-refresh .btn svg, .sst-refresh .site-header .nav-links>a.nav-cta, .sst-refresh .site-footer .footer-consult { transition:none; }
    .sst-refresh .btn:hover, .sst-refresh .btn:hover svg, .sst-refresh .site-footer .footer-consult:hover { transform:none; }
}
