:root { color-scheme: dark; }
* { box-sizing: border-box; }
html, body { width: 100%; height: 100%; margin: 0; overflow: hidden; overscroll-behavior: none; }
body { color: #f3fafb; background: #142731; font-family: 'LXGW WenKai','Microsoft Yahei',system-ui,sans-serif; }
.landing { position: relative; width: 100%; height: 100svh; min-height: 520px; overflow: hidden; background: url('/assets/snow-mountain-lake.jpg') center 47%/cover no-repeat; isolation: isolate; }
.landing__shade { position: absolute; z-index: -1; inset: 0; background: radial-gradient(circle at 50% 39%,rgba(40,74,86,.02),rgba(8,25,34,.18) 45%,rgba(5,18,26,.62) 100%),linear-gradient(180deg,rgba(15,31,39,.12),rgba(9,24,33,.3) 58%,rgba(9,22,29,.8)); backdrop-filter: saturate(82%); }
.landing__intro { position: absolute; top: 42%; left: 50%; width: min(90%,900px); text-align: center; text-shadow: 0 3px 28px rgba(2,15,22,.72); transform: translate(-50%,-50%); }
.landing__eyebrow { margin: 0 0 24px; color: rgba(181,224,229,.84); font: 600 10px/1.4 system-ui,sans-serif; letter-spacing: .3em; }
.landing h1 { margin: 0; color: #f7fbfc; font-size: clamp(50px,6vw,86px); font-weight: 500; line-height: 1.15; letter-spacing: .08em; }
.landing__subtitle { margin: 18px 0 0; color: rgba(229,241,243,.82); font-size: 14px; letter-spacing: .18em; }
.landing__nav { position: absolute; left: 50%; bottom: 8.5vh; display: grid; grid-template-columns: repeat(5,minmax(76px,1fr)); gap: 5px; padding: 7px; border-radius: 20px; background: rgba(10,27,35,.38); box-shadow: 0 18px 48px rgba(1,13,19,.24); backdrop-filter: blur(15px) saturate(85%); transform: translateX(-50%); }
.landing__nav a { display: flex; min-height: 70px; padding: 9px 8px; border-radius: 14px; align-items: center; justify-content: center; flex-direction: column; gap: 6px; color: rgba(229,241,242,.72); text-decoration: none; transition: color .2s,background-color .2s,transform .2s; }
.landing__nav a:hover, .landing__nav a:focus-visible { color: #fff; background: rgba(91,157,166,.3); transform: translateY(-2px); outline: none; }
.landing__nav .is-primary { color: #fff; background: rgba(91,157,166,.52); }
.landing__icon { font: 500 25px/1 system-ui,sans-serif; }
.landing__nav strong { font-size: 11px; font-weight: 500; }
.landing__hint { position: absolute; right: 34px; bottom: 24px; margin: 0; color: rgba(210,229,232,.5); font-size: 10px; letter-spacing: .14em; }
@media (max-width: 600px) {
  .landing { min-height: 480px; background-position: 51% center; }
  .landing__intro { top: 39%; }
  .landing__eyebrow { margin-bottom: 20px; font-size: 9px; letter-spacing: .23em; }
  .landing h1 { font-size: clamp(42px,13vw,58px); letter-spacing: .045em; }
  .landing__subtitle { margin-top: 14px; font-size: 12px; letter-spacing: .1em; }
  .landing__nav { bottom: max(6.5vh,44px); width: calc(100% - 26px); grid-template-columns: repeat(5,minmax(0,1fr)); }
  .landing__nav a { min-height: 66px; padding-inline: 2px; }
  .landing__icon { font-size: 22px; }
  .landing__nav strong { font-size: 10px; }
  .landing__hint { display: none; }
}