/* ======================================================================
   王施帆 · 全站统一页头/页尾样式（与服务单页一致）
   配合 header.php / header2.php / footer.php 使用
   只负责 #wsfHd 顶部导航 与 #wsfFt 页脚，不影响站内其它样式
   ====================================================================== */
:root{
  --wp:#996493;--wpd:#8a5685;--wchip:#f6eef5;--wink:#1c1f23;--wline:#ececf0;
}

/* 隐藏 mzalog 主题原生的 header / footer，改用本套 */
#header,#footer,#mzaback{display:none !important;}

/* ---------------- 顶部导航 ---------------- */
#wsfHd{position:sticky;top:0;z-index:500;background:rgba(255,255,255,.93);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-bottom:1px solid #eee}
#wsfHd .wsf-wrap{max-width:1240px;margin:0 auto;padding:0 28px;height:84px;display:flex;align-items:center;justify-content:space-between}
#wsfHd .wsf-logo img{height:46px;width:auto;display:block}
#wsfHd .wsf-logo .txt{font-size:26px;font-weight:800;color:var(--wink);letter-spacing:.02em}
#wsfHd svg{display:block}

/* 汉堡按钮 */
.wsf-toggle{display:none;width:48px;height:48px;align-items:center;justify-content:center;color:var(--wp);background:none;border:0;cursor:pointer}

/* 右侧区域：导航 + 搜索图标 */
.wsf-hd-right{display:flex;align-items:center;gap:6px}

/* 菜单 */
.wsf-nav .menu{display:flex;align-items:center;list-style:none;margin:0;padding:0}
.wsf-nav .menu>li{position:relative}
.wsf-nav .menu>li>a{display:block;font-size:19px;color:#3c4149;padding:0 19px;line-height:84px;font-weight:500;transition:color .15s;white-space:nowrap}
.wsf-nav .menu>li>a:hover,.wsf-nav .menu>li.on>a{color:var(--wp)}
.wsf-nav .caret{display:inline-block;width:7px;height:7px;border-right:1.6px solid currentColor;border-bottom:1.6px solid currentColor;transform:rotate(45deg);margin-left:5px;vertical-align:2px;opacity:.7}
.wsf-nav .sub{position:absolute;top:100%;left:0;min-width:210px;background:#fff;border:1px solid #eee;border-radius:12px;box-shadow:0 16px 32px rgba(0,0,0,.09);padding:8px;list-style:none;margin:0;opacity:0;visibility:hidden;transform:translateY(8px);transition:opacity .18s,transform .18s,visibility .18s;z-index:60}
.wsf-nav .menu>li:hover .sub{opacity:1;visibility:visible;transform:translateY(0)}
.wsf-nav .sub li a{display:block;padding:12px 16px;font-size:16px;color:#4a4f57;border-radius:8px;white-space:nowrap}
.wsf-nav .sub li a:hover,.wsf-nav .sub li a.on{background:var(--wchip);color:var(--wp)}

/* 搜索：放大镜图标 */
.wsf-srch-btn{width:48px;height:48px;border-radius:50%;border:0;background:none;color:#3c4149;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:background .15s,color .15s}
.wsf-srch-btn:hover{background:var(--wchip);color:var(--wp)}
.wsf-srch-btn svg{width:23px;height:23px}

/* 搜索：点击后从顶部滑下的搜索条 */
.wsf-srch-panel{position:fixed;left:0;right:0;top:84px;background:rgba(255,255,255,.98);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-bottom:1px solid #eee;box-shadow:0 14px 30px rgba(0,0,0,.08);z-index:490;transform:translateY(-130%);transition:transform .28s ease;}
.wsf-srch-panel.open{transform:translateY(0)}
.wsf-srch-panel .box{max-width:760px;margin:0 auto;padding:18px 24px;display:flex;align-items:center;gap:12px}
.wsf-srch-panel input{flex:1;height:48px;border:1px solid var(--wline);border-radius:30px;padding:0 22px;font-size:16px;outline:none;transition:border-color .15s}
.wsf-srch-panel input:focus{border-color:var(--wp)}
.wsf-srch-panel .go{height:48px;padding:0 26px;border:0;border-radius:30px;background:var(--wp);color:#fff;font-size:15px;font-weight:600;cursor:pointer;transition:background .15s}
.wsf-srch-panel .go:hover{background:var(--wpd)}
.wsf-srch-panel .close{width:42px;height:42px;border:0;background:none;color:#9aa1a8;cursor:pointer;font-size:24px;line-height:1;flex:none}
.wsf-srch-mask{position:fixed;inset:0;background:rgba(20,16,24,.18);opacity:0;visibility:hidden;transition:opacity .25s,visibility .25s;z-index:480}
.wsf-srch-mask.open{opacity:1;visibility:visible}

/* ---------------- 移动端 ---------------- */
@media(max-width:920px){
  .wsf-toggle{display:flex}
  .wsf-nav{position:fixed;left:0;right:0;top:84px;background:#fff;border-bottom:1px solid #eee;max-height:0;overflow:hidden;transition:max-height .28s;box-shadow:0 14px 26px rgba(0,0,0,.07);z-index:495}
  .wsf-nav.open{max-height:84vh;overflow:auto}
  .wsf-nav .menu{flex-direction:column;align-items:stretch;padding:6px 0}
  .wsf-nav .menu>li>a{line-height:1;padding:16px 28px;font-size:18px}
  .wsf-nav .caret{float:right}
  .wsf-nav .sub{position:static;opacity:1;visibility:visible;transform:none;box-shadow:none;border:0;border-radius:0;padding:0 0 6px 0;min-width:0}
  .wsf-nav .sub li a{padding:10px 38px;color:#82868d}
  .wsf-srch-panel .box{padding:14px 18px}
}

/* ---------------- 页脚 ---------------- */
#wsfFt{margin-top:64px;background:#241f2b;color:#cfc6d3}
#wsfFt .ft-grid{max-width:1240px;margin:0 auto;display:grid;grid-template-columns:1.6fr 1fr 1fr;gap:44px;padding:56px 28px 38px}
#wsfFt .ft-brand .ft-logo{height:48px;width:auto;margin-bottom:14px;filter:brightness(0) invert(1);opacity:.92}
#wsfFt .ft-brand .ft-txt{font-size:26px;font-weight:800;color:#fff;margin-bottom:12px}
#wsfFt .ft-brand p{font-size:16px;color:#9b909f;line-height:1.9;margin:0}
#wsfFt .ft-brand .cc{margin-top:12px}
#wsfFt .ft-brand .cc a{color:#c3a9c0;text-decoration:none}
#wsfFt .ft-col h5{font-size:17px;color:#fff;font-weight:600;margin:0 0 18px;letter-spacing:.05em}
#wsfFt .ft-col a{display:block;font-size:16px;color:#a89cae;padding:8px 0;transition:color .15s;text-decoration:none}
#wsfFt .ft-col a:hover{color:#e3cfe1}
#wsfFt .ft-bottom{border-top:1px solid #38313f;text-align:center;font-size:15px;color:#7d7384;padding:22px 24px}
#wsfFt .ft-bottom a{color:#a89cae;text-decoration:none}

/* 返回顶部 */
#wsfTop{position:fixed;right:26px;bottom:30px;width:48px;height:48px;border-radius:14px;background:var(--wp);color:#fff;display:flex;align-items:center;justify-content:center;opacity:0;visibility:hidden;transition:opacity .2s,transform .2s;z-index:470;box-shadow:0 8px 22px rgba(120,80,120,.3);border:0;cursor:pointer}
#wsfTop.show{opacity:1;visibility:visible}
#wsfTop:hover{background:var(--wpd);transform:translateY(-3px)}
#wsfTop svg{width:22px;height:22px}

@media(max-width:760px){
  #wsfFt .ft-grid{grid-template-columns:1fr;gap:26px;text-align:center}
  #wsfFt .ft-col a{display:inline-block;margin:0 10px}
}
