/* ============ 西米分享 - 主样式（设计系统 + 通用组件） ============ */

/* ---------- 设计系统变量 ---------- */
:root{
  --bg:#100d0b;
  --bg-soft:#171310;
  --surface:rgba(245,238,228,.04);
  --surface-2:rgba(245,238,228,.075);
  --border:rgba(245,238,228,.09);
  --border-strong:rgba(245,238,228,.16);
  --txt:#ece4d8;
  --txt-dim:#9c9384;
  --txt-faint:#635b50;
  --brand:#dd7a44;
  --brand-soft:#eaa468;
  --rose:#cf8aa0;
  --teal:#5f97a0;
  --amber:#e0a45a;
  --green:#6aa978;
  --gold:#d9b15a;
  --radius:22px;
  --radius-sm:14px;
  --shadow:0 24px 60px -22px rgba(0,0,0,.75);
  --maxw:1180px;
}

/* ---------- Reset ---------- */
*{margin:0;padding:0;box-sizing:border-box;font-family:'Noto Sans SC',system-ui,sans-serif;}
html{scroll-behavior:smooth;}
body{
  background:var(--bg);color:var(--txt);overflow-x:hidden;line-height:1.6;
  -webkit-font-smoothing:antialiased;
}

/* ---------- 氛围背景 ---------- */
body::before{
  content:'';position:fixed;inset:0;z-index:-2;pointer-events:none;
  background:
    radial-gradient(900px 620px at 16% -10%, rgba(221,122,68,.10), transparent 60%),
    radial-gradient(820px 580px at 90% 6%, rgba(207,138,160,.06), transparent 55%);
}
body::after{
  content:'';position:fixed;inset:0;z-index:-1;pointer-events:none;opacity:.035;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}

/* ---------- 通用排版 ---------- */
.mono{font-family:'Space Grotesk',monospace;}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 24px;}
section{position:relative;padding:34px 0;}
main{padding-top:90px;}
.hero{margin-top:-90px;}
.member-hero{margin-top:-90px;}
.eyebrow{font-size:13px;letter-spacing:.32em;text-transform:uppercase;color:var(--brand-soft);font-weight:700;margin-bottom:14px;}
.h2{font-size:clamp(28px,4vw,46px);font-weight:900;letter-spacing:-.02em;line-height:1.1;}
.h2 .accent{color:var(--brand-soft);}
.lead{color:var(--txt-dim);max-width:660px;margin-top:16px;font-size:16px;}

/* ---------- 滚动进度条 ---------- */
#progress{position:fixed;top:0;left:0;height:3px;width:0;z-index:100;
  background:linear-gradient(90deg,var(--brand),var(--rose),var(--teal));
  box-shadow:0 0 14px rgba(221,122,68,.7);transition:width .1s linear;}

/* ---------- 导航 ---------- */
#nav{position:fixed;top:0;left:0;right:0;z-index:90;transition:.3s;
  border-bottom:1px solid transparent;}
#nav.scrolled{background:rgba(8,9,15,.72);backdrop-filter:blur(18px);border-bottom:1px solid var(--border);}
.nav-inner{max-width:var(--maxw);margin:0 auto;padding:0 24px;height:68px;display:flex;align-items:center;justify-content:space-between;}
.brand{display:flex;align-items:center;gap:11px;font-weight:900;font-size:17px;letter-spacing:-.01em;text-decoration:none;}
.brand .logo-img{width:36px;height:36px;border-radius:11px;object-fit:cover;box-shadow:0 6px 18px -4px rgba(221,122,68,.6);flex-shrink:0;}
.brand-text{display:flex;flex-direction:row;align-items:baseline;gap:8px;line-height:1;white-space:nowrap;}
.brand-name{font-size:22px;font-weight:900;letter-spacing:-.01em;color:var(--brand-soft);}
.brand-sub{font-size:13px;color:var(--txt-dim);font-weight:600;letter-spacing:.04em;}
.brand-sub::before{content:"·";margin-right:8px;color:var(--txt-dim);}
.nav-links{display:flex;gap:6px;}
.nav-links a{padding:9px 15px;border-radius:11px;color:var(--txt-dim);font-size:16px;font-weight:600;text-decoration:none;transition:.2s;position:relative;}
.nav-links a:hover{color:var(--txt);background:var(--surface);}
.nav-links a.active{color:#fff;background:var(--surface-2);}
.menu-toggle{display:none;background:none;border:0;color:var(--txt);font-size:24px;cursor:pointer;}

/* ---------- 通用按钮 ---------- */
.btn-primary{padding:14px 26px;border-radius:14px;font-weight:700;font-size:15px;text-decoration:none;color:#fff;
  background:linear-gradient(135deg,var(--brand),var(--rose));box-shadow:0 14px 34px -10px rgba(221,122,68,.65);transition:.25s;display:inline-block;}
.btn-primary:hover{transform:translateY(-3px);box-shadow:0 20px 44px -10px rgba(221,122,68,.8);}
.btn-ghost{padding:14px 24px;border-radius:14px;font-weight:600;font-size:15px;text-decoration:none;color:var(--txt);
  background:var(--surface);border:1px solid var(--border);transition:.25s;display:inline-block;}
.btn-ghost:hover{background:var(--surface-2);border-color:var(--border-strong);transform:translateY(-3px);}
.btn-douyin{display:inline-flex;align-items:center;gap:7px;padding:9px 16px;border-radius:12px;font-size:13px;font-weight:700;
  text-decoration:none;color:#fff;background:linear-gradient(135deg,#fe2c55,#cf8aa0);box-shadow:0 8px 22px -8px rgba(254,44,85,.7);transition:.2s;}
.btn-douyin:hover{transform:translateY(-2px);box-shadow:0 12px 30px -8px rgba(254,44,85,.8);}

/* ---------- 页脚 ---------- */
footer{border-top:1px solid var(--border);padding:64px 0 40px;margin-top:40px;}
.foot-grid{display:flex;justify-content:space-between;gap:40px;flex-wrap:wrap;align-items:flex-start;}
.foot-brand{font-size:22px;font-weight:900;}
.foot-brand p{font-size:13.5px;color:var(--txt-dim);margin-top:14px;max-width:340px;line-height:1.7;font-weight:400;}
.foot-links{display:flex;gap:40px;flex-wrap:wrap;}
.foot-col h5{font-size:13px;color:var(--txt-faint);letter-spacing:.1em;text-transform:uppercase;margin-bottom:16px;}
.foot-col a{display:block;color:var(--txt-dim);text-decoration:none;font-size:14px;margin-bottom:11px;transition:.2s;}
.foot-col a:hover{color:#fff;}
.foot-bottom{margin-top:54px;padding-top:24px;border-top:1px solid var(--border);display:flex;justify-content:space-between;flex-wrap:wrap;gap:14px;
  font-size:13px;color:var(--txt-faint);}

/* ---------- Reveal 动画 ---------- */
.reveal{opacity:0;transform:translateY(30px);transition:opacity .7s cubic-bezier(.2,.7,.2,1),transform .7s cubic-bezier(.2,.7,.2,1);}
.reveal.in{opacity:1;transform:none;}

/* ---------- 通用 dot-live ---------- */
.dot-live{width:8px;height:8px;border-radius:50%;background:var(--green);box-shadow:0 0 0 0 rgba(74,222,128,.7);animation:pulse 2s infinite;display:inline-block;}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(74,222,128,.6);}70%{box-shadow:0 0 0 9px rgba(74,222,128,0);}100%{box-shadow:0 0 0 0 rgba(74,222,128,0);}}

/* ---------- 响应式 ---------- */
@media(max-width:980px){
  .foot-grid{flex-direction:column;gap:30px;}
}
@media(max-width:680px){
  section{padding:56px 0;}
  .nav-links{display:none;}
  .menu-toggle{display:block;}
  .nav-links.open{display:flex;position:absolute;top:68px;left:0;right:0;flex-direction:column;background:rgba(8,9,15,.96);
    backdrop-filter:blur(18px);padding:16px 24px;border-bottom:1px solid var(--border);gap:4px;}
  .foot-bottom{flex-direction:column;text-align:center;}
}
