@font-face{
  font-family:"Noto Sans HK";
  src:url("../fonts/NotoSansHK.ttf") format("truetype");
  font-weight:200 900;
  font-display:swap;
}
@font-face{
  font-family:"Noto Serif HK";
  src:url("../fonts/NotoSerifHK.ttf") format("truetype");
  font-weight:200 900;
  font-display:swap;
}
@font-face{
  font-family:"Source Serif 4";
  src:url("../fonts/SourceSerif4.ttf") format("truetype");
  font-weight:200 900;
  font-display:swap;
}
:root{
    --bg:#10201A;
    --bg-soft:#12241C;
    --bg-deep:#0D1B15;
    --bg-cta1:#14291F;
    --bg-cta2:#1B3A2C;
    --ink:#EDE9DC;
    --ink-dim:#93A69B;
    --ink-faint:#7E9086;
    --gold:#D9B36A;
    --gold-dim:rgba(217,179,106,.6);
    --cream:#EFEAE0;
    --cream-ink:#16211B;
    --cream-dim:#4A5850;
    --serif:"Noto Serif SC","Source Han Serif SC","Songti SC","STSong","SimSun",serif;
    --sans:"Noto Sans SC","Source Han Sans SC","PingFang SC","Microsoft YaHei",sans-serif;
  }
  /* 香港版：切换为香港字形字族（本地 Noto Sans/Serif HK，含系统繁中 fallback） */
  html[lang="zh-HK"]{
    --serif:"Noto Serif HK","Source Han Serif HK","Songti TC","PMingLiU",serif;
    --sans:"Noto Sans HK","Source Han Sans HK","PingFang TC","Microsoft JhengHei",sans-serif;
  }
  /* 英文版：拉丁专用衬线 Source Serif 4（与中文思源宋体同源，规避 Windows 下掉到 SimSun 的细窄拉丁） */
  html[lang="en"]{
    --serif:"Source Serif 4",Georgia,serif;
  }
  *{margin:0;padding:0;box-sizing:border-box}
  html{scroll-behavior:smooth}
  body{background:var(--bg);color:var(--ink);font-family:var(--sans);font-weight:300;-webkit-font-smoothing:antialiased}
  a{color:inherit;text-decoration:none}
  .wrap{max-width:1440px;margin:0 auto;padding:0 72px}
  @media(max-width:760px){.wrap{padding:0 24px}}

  /* ---------- header ---------- */
  header{position:fixed;top:0;left:0;right:0;z-index:50;background:rgba(16,32,26,.82);backdrop-filter:blur(12px)}
  .nav{display:flex;align-items:center;justify-content:space-between;height:72px}
  .logo{display:flex;align-items:center;gap:12px;font-family:var(--serif);font-weight:500;font-size:20px;letter-spacing:6px}
  .logo i{width:10px;height:10px;border-radius:50%;background:var(--gold)}
  .nav-right{display:flex;align-items:center;gap:40px}
  .nav-links{display:flex;align-items:center;gap:40px}
  .nav-links a{font-size:14px;letter-spacing:2px;color:var(--ink-dim);transition:color .25s}
  .nav-links a:hover{color:var(--ink)}
  .nav-links a.cta{color:var(--gold);font-weight:400}
  /* 语言切换：悬停淡入菜单 + 点击切换并落盘 */
  .lang-switch{position:relative;display:inline-block}
  .lang-trigger{
    display:flex;align-items:center;gap:6px;
    background:none;border:1px solid rgba(217,179,106,.35);
    border-radius:999px;cursor:pointer;
    font-family:var(--sans);font-size:13px;letter-spacing:.5px;
    color:var(--ink);padding:6px 14px;
    transition:border-color .25s,color .25s;
  }
  .lang-trigger:hover{border-color:var(--gold);color:var(--gold)}
  .lang-caret{font-size:10px;opacity:.7;transition:transform .25s}
  .lang-switch.open .lang-caret{transform:rotate(180deg)}
  .lang-menu{
    position:absolute;top:calc(100% + 10px);right:0;
    min-width:172px;margin:0;padding:6px;list-style:none;
    background:rgba(13,27,21,.97);
    border:1px solid rgba(217,179,106,.20);
    border-radius:12px;
    box-shadow:0 14px 40px rgba(0,0,0,.5);
    backdrop-filter:blur(8px);
    opacity:0;visibility:hidden;transform:translateY(-8px);
    transition:opacity .28s ease,transform .28s ease,visibility .28s;
    z-index:60;
  }
  .lang-switch:hover .lang-menu,
  .lang-switch.open .lang-menu{
    opacity:1;visibility:visible;transform:translateY(0);
  }
  /* 菜单项现在是真实 <a>（爬虫可见 + 可直接分享），不再是 JS 按钮 */
  .lang-menu .lang-item{
    display:block;width:100%;text-align:left;
    background:none;border:none;cursor:pointer;
    font-family:var(--sans);font-size:14px;letter-spacing:.3px;
    color:var(--ink-dim);padding:9px 12px;border-radius:8px;
    transition:background .2s,color .2s;
  }
  a.lang-item:hover{background:rgba(217,179,106,.12);color:var(--ink)}
  a.lang-item.active{color:var(--gold);font-weight:500}
  /* 触屏无 hover：点击 trigger 展开，点外部收起 */
  .lang-menu.no-hover{opacity:1;visibility:visible;transform:translateY(0)}
  @media(max-width:760px){
    .nav-right{gap:16px}
    .nav-links a:not(.cta){display:none}
    .lang-trigger{font-size:12px;padding:5px 11px}
  }

  /* ---------- hero ---------- */
  .hero{min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:36px;padding:120px 24px 80px;
    background:linear-gradient(180deg,#132720 0%,#0F1F19 60%,#142B22 100%)}
  .hero .tag{font-size:13px;letter-spacing:6px;color:var(--gold)}
  .hero .rule{width:48px;height:1px;background:var(--gold-dim)}
  .hero h1{font-family:var(--serif);font-weight:300;font-size:clamp(52px,8vw,104px);line-height:1.28;letter-spacing:8px}
  .hero p{font-size:18px;line-height:1.9;letter-spacing:1px;color:var(--ink-dim);max-width:640px}
  .hero .cta-line{display:inline-block;font-size:16px;font-weight:400;letter-spacing:3px;padding-bottom:10px;border-bottom:1px solid rgba(237,233,220,.35);transition:border-color .3s,color .3s}
  .hero .cta-line:hover{border-color:var(--gold);color:var(--gold)}
  .hero .scroll-hint{position:absolute;bottom:36px;left:50%;transform:translateX(-50%);font-size:12px;letter-spacing:4px;color:var(--ink-faint)}

  /* ---------- showcase ---------- */
  .showcase{position:relative;min-height:92vh;display:flex;align-items:flex-end;background:
    linear-gradient(180deg,rgba(13,27,21,0) 55%,rgba(13,27,21,.88) 100%),
    url("../images/pond-day.jpg") center/cover no-repeat,var(--bg-soft)}
  .showcase-inner{padding:0 72px 96px;max-width:1440px;width:100%;margin:0 auto}
  .showcase .tag{font-size:13px;letter-spacing:5px;color:var(--gold);margin-bottom:22px}
  .showcase h2{font-family:var(--serif);font-weight:300;font-size:clamp(36px,4.5vw,56px);letter-spacing:6px;margin-bottom:20px}
  .showcase p{font-size:16px;line-height:1.9;color:#D8DED6;max-width:620px}
  @media(max-width:760px){.showcase-inner{padding:0 24px 64px}}

  /* ---------- features ---------- */
  .features{background:var(--cream);color:var(--cream-ink);padding:120px 0 140px}
  .features .tag{font-size:13px;letter-spacing:6px;color:#7A6A45;margin-bottom:28px}
  .features h2{font-family:var(--serif);font-weight:300;font-size:clamp(40px,5vw,64px);line-height:1.35;letter-spacing:4px;margin-bottom:80px}
  .cols{display:grid;grid-template-columns:1fr 1fr 1fr}
  .col{padding:0 48px}
  .col:first-child{padding-left:0}
  .col:last-child{padding-right:0}
  .col .bar{width:32px;height:2px;background:#1F3A2E;margin-bottom:24px}
  .col h3{font-family:var(--serif);font-weight:500;font-size:26px;letter-spacing:3px;margin-bottom:20px}
  .col p{font-size:15px;line-height:2;color:var(--cream-dim)}
  @media(max-width:900px){.cols{grid-template-columns:1fr;gap:56px}.col{padding:0!important}}

  /* ---------- interaction ---------- */
  .interact{display:grid;grid-template-columns:1.4fr 1fr;background:var(--bg-soft);min-height:760px}
  .interact-text{padding:110px 90px;display:flex;flex-direction:column;justify-content:center;gap:36px}
  .interact .tag{font-size:13px;letter-spacing:6px;color:var(--gold)}
  .interact h2{font-family:var(--serif);font-weight:300;font-size:clamp(36px,4vw,56px);line-height:1.4;letter-spacing:4px}
  .row{display:flex;gap:24px;padding:26px 0;border-bottom:1px solid rgba(237,233,220,.08)}
  .row:last-child{border-bottom:none}
  .row .no{font-size:13px;letter-spacing:2px;color:var(--gold-dim);padding-top:4px}
  .row h4{font-size:18px;font-weight:400;letter-spacing:2px;margin-bottom:8px}
  .row p{font-size:14px;line-height:1.9;color:var(--ink-dim)}
  .interact-img{background:url("../images/pond-deep.jpg") center/cover no-repeat}
  @media(max-width:900px){.interact{grid-template-columns:1fr}.interact-img{min-height:380px}.interact-text{padding:80px 24px}}

  /* ---------- quote ---------- */
  .quote{min-height:520px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:36px;padding:0 24px;background:var(--bg)}
  .quote h2{font-family:var(--serif);font-weight:300;font-size:clamp(32px,4.5vw,64px);line-height:1.6;letter-spacing:8px}
  .quote .attr{font-size:13px;letter-spacing:5px;color:var(--gold)}

  /* ---------- final cta / pricing ---------- */
  .final{min-height:760px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:32px;padding:120px 24px;
    background:linear-gradient(180deg,var(--bg-cta1) 0%,var(--bg-cta2) 100%)}
  .app-icon{width:72px;height:72px;border-radius:16px;box-shadow:0 12px 40px rgba(0,0,0,.4)}
  .final .tag{font-size:13px;letter-spacing:6px;color:var(--gold)}
  .final h2{font-family:var(--serif);font-weight:300;font-size:clamp(48px,7vw,88px);letter-spacing:12px}
  .price-cards{display:grid;grid-template-columns:1fr;gap:28px;max-width:420px;width:100%;margin:8px auto 0}
  .price-card{background:rgba(237,233,220,.04);border:1px solid rgba(217,179,106,.22);padding:36px 32px;display:flex;flex-direction:column;gap:14px;text-align:left;transition:border-color .3s,transform .3s}
  .price-card:hover{border-color:var(--gold);transform:translateY(-3px)}
  .pc-region{font-size:13px;letter-spacing:4px;color:var(--gold)}
  .pc-price{font-family:var(--serif);font-weight:300;font-size:48px;letter-spacing:2px;color:var(--ink);line-height:1}
  .pc-note{font-size:13px;letter-spacing:1px;color:var(--ink-faint);margin-top:-4px}
  .pc-list{list-style:none;display:flex;flex-direction:column;gap:10px;margin:8px 0 18px}
  .pc-list li{font-size:14px;line-height:1.6;color:var(--ink-dim);padding-left:18px;position:relative}
  .pc-list li:before{content:"";position:absolute;left:0;top:9px;width:5px;height:5px;border-radius:50%;background:var(--gold-dim)}
  .pc-btn{display:block;text-align:center;background:var(--gold);color:var(--cream-ink);font-size:15px;font-weight:400;letter-spacing:2px;padding:14px 0;transition:transform .25s,box-shadow .25s}
  .pc-btn:hover{transform:translateY(-2px);box-shadow:0 10px 28px rgba(0,0,0,.35)}
  .spec{display:flex;flex-wrap:wrap;justify-content:center;gap:14px 40px;margin-top:8px;font-size:14px;letter-spacing:1px;color:var(--ink-faint)}
  .spec span{position:relative;padding-left:18px}
  .spec span:before{content:"";position:absolute;left:0;top:7px;width:5px;height:5px;border-radius:50%;background:rgba(217,179,106,.5)}
  .final .meta{font-size:14px;letter-spacing:1px;color:var(--ink-faint)}
  .final .meta a{color:var(--gold);border-bottom:1px solid var(--gold-dim)}
  .activate-note{max-width:560px;margin:24px auto 0;text-align:left;background:rgba(237,233,220,.03);border:1px solid rgba(217,179,106,.18);padding:24px 28px}
  .activate-note h3{font-family:var(--serif);font-weight:500;font-size:18px;letter-spacing:2px;color:var(--gold);margin-bottom:12px}
  .activate-note p{font-size:14px;line-height:1.9;color:var(--ink-dim)}
  @media(max-width:760px){.price-cards{grid-template-columns:1fr;max-width:420px}.activate-note{margin-left:24px;margin-right:24px}}

  /* ---------- footer ---------- */
  footer{background:var(--bg-deep);padding:34px 0;display:flex;align-items:center}
  .foot{flex-wrap:wrap;gap:16px;align-items:center;justify-content:space-between;width:100%}
  .foot .name{font-family:var(--serif);font-size:15px;letter-spacing:5px;color:var(--ink-dim)}
  .foot-links{display:flex;gap:28px}
  .foot-links a{font-size:13px;letter-spacing:1px;color:var(--ink-dim);transition:color .25s}
  .foot-links a:hover{color:var(--gold)}
  .foot .legal{font-size:13px;letter-spacing:1px;color:#5E6E64}
  @media(max-width:760px){.foot{flex-direction:column;gap:14px;justify-content:center;text-align:center}}

  /* ---------- legal pages ---------- */
  .legal-page{background:var(--bg);padding:140px 0 120px;min-height:100vh}
  .legal-page .wrap{max-width:820px}
  .legal-page h1{font-family:var(--serif);font-weight:300;font-size:clamp(36px,5vw,56px);letter-spacing:4px;margin-bottom:10px}
  .legal-page .updated{font-size:13px;letter-spacing:1px;color:var(--ink-faint);margin-bottom:52px}
  .legal-page h2{font-family:var(--serif);font-weight:500;font-size:22px;letter-spacing:2px;color:var(--ink);margin:44px 0 14px}
  .legal-page p{font-size:15px;line-height:2;color:var(--ink-dim);margin-bottom:6px}
  .legal-page ul{padding-left:22px;margin:6px 0 0}
  .legal-page li{font-size:15px;line-height:1.9;color:var(--ink-dim);margin-bottom:6px}
  .legal-page a{color:var(--gold);border-bottom:1px solid var(--gold-dim)}
  .legal-back{display:inline-block;margin-top:56px;font-size:14px;letter-spacing:2px;color:var(--gold);border-bottom:1px solid var(--gold-dim);padding-bottom:6px}

  /* ---------- reveal ---------- */
  .reveal{opacity:0;transform:translateY(28px);transition:opacity .9s ease,transform .9s ease}
  .reveal.on{opacity:1;transform:none}
  @media(prefers-reduced-motion:reduce){.reveal{opacity:1;transform:none;transition:none}}