*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{
  margin:0;
  background:
    linear-gradient(rgba(0,255,135,.035) 1px,transparent 1px),
    linear-gradient(90deg,rgba(0,255,135,.035) 1px,transparent 1px),
    radial-gradient(circle at 15% -10%,rgba(46,94,255,.24),transparent 34rem),
    radial-gradient(circle at 85% 110%,rgba(255,106,0,.16),transparent 30rem),
    #0A1F44;
  background-size:44px 44px,44px 44px,auto,auto,auto;
  background-attachment:scroll;
  color:#F7FAFF;
  font-family:"Inter","Noto Sans SC","PingFang SC",sans-serif;
  font-size:16px;
  line-height:1.75;
  min-height:100vh;
}
img{max-width:100%;display:block}
a{color:#00FF87;text-decoration-thickness:1px;text-underline-offset:3px}
a:focus-visible,button:focus-visible,summary:focus-visible{outline:3px solid #FF6A00;outline-offset:3px;border-radius:4px}
button{font:inherit;cursor:pointer}
::selection{background:#FF6A00;color:#0A1F44}
h1,h2,h3,h4,h5,h6{font-family:"Anton","Arial Narrow","Noto Sans SC","PingFang SC",sans-serif;line-height:1.15;margin:0 0 .5em}
p{margin:0 0 1em}
ol,ul{margin:0 0 1em}
blockquote{margin:1.5rem 0;padding:.5rem 0 .5rem 1.25rem;border-left:3px solid #00FF87;color:#A8C0E0}
hr{border:0;height:1px;background:rgba(168,192,224,.25);margin:2rem 0}
:root{
  --navy-base:#0A1F44;
  --navy-surface:#122B50;
  --grad-start:#1B3B7B;
  --grad-end:#2E5EFF;
  --orange:#FF6A00;
  --green:#00FF87;
  --text:#F7FAFF;
  --text-muted:#A8C0E0;
  --line-glow:rgba(0,255,135,.45);
  --paper:#F2F4F8;
  --font-display:"Anton","Arial Narrow","Noto Sans SC","PingFang SC",sans-serif;
  --font-body:"Inter","Noto Sans SC","PingFang SC",sans-serif;
  --radius-lg:32px;
  --radius-md:20px;
  --radius-sm:12px;
  --content-max:1240px;
  --spacing-section:clamp(4rem,9vw,7.5rem);
}
.container{width:min(100% - 32px,var(--content-max));margin-inline:auto}
.container-narrow{width:min(100% - 32px,880px);margin-inline:auto}
.container-wide{width:min(100% - 24px,1400px);margin-inline:auto}
@media(max-width:600px){
  .container,.container-narrow{width:min(100% - 24px,var(--content-max))}
}
.skip-link{
  position:fixed;
  top:16px;
  left:16px;
  z-index:300;
  background:#00FF87;
  color:#0A1F44;
  padding:10px 18px;
  border-radius:999px;
  font-weight:800;
  text-decoration:none;
  transform:translateY(-180%);
  transition:transform .2s ease;
}
.skip-link:focus{transform:translateY(0)}
.site-header{
  position:sticky;
  top:16px;
  z-index:100;
  padding:0 20px;
  pointer-events:none;
}
.nav-capsule{
  position:relative;
  max-width:var(--content-max);
  margin-inline:auto;
  display:flex;
  align-items:center;
  gap:10px;
  padding:8px 10px 8px 18px;
  background:rgba(18,43,80,.86);
  -webkit-backdrop-filter:blur(18px);
  backdrop-filter:blur(18px);
  border:1px solid rgba(247,250,255,.08);
  border-radius:999px;
  box-shadow:0 18px 40px rgba(4,12,30,.45),inset 0 1px 0 rgba(255,255,255,.04);
  pointer-events:auto;
}
.brand{
  display:inline-flex;
  align-items:center;
  gap:10px;
  color:#F7FAFF;
  text-decoration:none;
  white-space:nowrap;
}
.brand-mark{
  flex:0 0 auto;
  width:34px;
  height:34px;
  display:grid;
  place-items:center;
  background:linear-gradient(135deg,#00FF87,#2E5EFF);
  color:#0A1F44;
  font-family:var(--font-display);
  font-size:1.25rem;
  border-radius:12px 4px 12px 4px;
}
.brand-name{
  font-family:var(--font-display);
  font-size:1.25rem;
  letter-spacing:.04em;
  line-height:1;
}
.brand-name small{margin:0 .1em;font-family:inherit}
.brand-badge{
  font-size:.7rem;
  font-weight:800;
  letter-spacing:.12em;
  border:1px solid rgba(0,255,135,.5);
  color:#00FF87;
  padding:2px 7px;
  border-radius:999px;
  text-transform:uppercase;
}
.nav{
  display:flex;
  align-items:center;
  margin-left:auto;
  gap:6px;
}
.nav-list{
  display:flex;
  align-items:center;
  gap:2px;
  list-style:none;
  margin:0;
  padding:0;
}
.nav-link{
  display:block;
  padding:10px 14px;
  border-radius:999px;
  color:#A8C0E0;
  text-decoration:none;
  font-size:14px;
  font-weight:600;
  white-space:nowrap;
  transition:color .2s ease,background .2s ease,box-shadow .2s ease;
}
.nav-link:hover{color:#F7FAFF;background:rgba(0,255,135,.12)}
.nav-link[aria-current="page"]{
  color:#0A1F44;
  background:#00FF87;
  box-shadow:0 0 18px rgba(0,255,135,.25);
}
.nav-cta{
  display:inline-block;
  padding:10px 18px;
  border-radius:999px;
  background:#FF6A00;
  color:#0A1F44;
  font-size:14px;
  font-weight:800;
  text-decoration:none;
  letter-spacing:.02em;
  white-space:nowrap;
  box-shadow:0 8px 24px rgba(255,106,0,.22);
  transition:background .2s ease,transform .2s ease,box-shadow .2s ease;
}
.nav-cta:hover{background:#ff7a1a;transform:translateY(-1px);box-shadow:0 12px 30px rgba(255,106,0,.32)}
.nav-toggle{
  display:none;
  align-items:center;
  gap:8px;
  margin-left:auto;
  background:rgba(247,250,255,.06);
  border:1px solid rgba(247,250,255,.14);
  border-radius:999px;
  color:#F7FAFF;
  padding:8px 12px;
  font-size:14px;
  font-weight:600;
}
.nav-toggle-box{
  display:inline-flex;
  flex-direction:column;
  gap:4px;
  width:18px;
}
.nav-toggle-box i{
  height:2px;
  background:currentColor;
  border-radius:2px;
  transition:transform .2s ease,opacity .2s ease;
}
.nav-toggle[aria-expanded="true"] .nav-toggle-box i:nth-child(1){transform:translateY(6px) rotate(45deg)}
.nav-toggle[aria-expanded="true"] .nav-toggle-box i:nth-child(2){opacity:0}
.nav-toggle[aria-expanded="true"] .nav-toggle-box i:nth-child(3){transform:translateY(-6px) rotate(-45deg)}
.site-footer{
  margin-top:clamp(60px,10vw,120px);
  background:#071633;
  border-top:1px solid rgba(0,255,135,.18);
  position:relative;
  overflow:hidden;
}
.site-footer::before{
  content:"";
  position:absolute;
  top:0;left:0;right:0;
  height:1px;
  background:linear-gradient(90deg,transparent,#00FF87,transparent);
}
.footer-top{
  max-width:var(--content-max);
  margin-inline:auto;
  display:grid;
  grid-template-columns:1.2fr .8fr 1fr;
  gap:48px;
  padding:56px 40px 40px;
}
.footer-brand-panel .brand{margin-bottom:20px}
.footer-about{
  color:#A8C0E0;
  font-size:15px;
  max-width:52ch;
}
.trust-statement{
  color:#00FF87;
  font-size:13px;
  line-height:1.6;
  border-left:2px solid rgba(0,255,135,.5);
  padding-left:12px;
  margin-top:20px;
}
.footer-heading{
  font-family:var(--font-body);
  font-size:.8rem;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.16em;
  color:#00FF87;
  margin-bottom:18px;
}
.footer-links{
  list-style:none;
  margin:0;
  padding:0;
  display:grid;
  gap:10px;
}
.footer-links a{
  color:#A8C0E0;
  text-decoration:none;
  display:inline-block;
  transition:color .2s ease,transform .2s ease;
}
.footer-links a:hover{color:#00FF87;transform:translateX(3px)}
.footer-contact-list{
  list-style:none;
  margin:0;
  padding:0;
  display:grid;
  gap:10px;
  color:#A8C0E0;
  font-size:14px;
}
.footer-bottom{
  border-top:1px solid rgba(247,250,255,.06);
  background:rgba(2,8,24,.4);
  padding:20px 40px;
  text-align:center;
  color:#A8C0E0;
  font-size:13px;
}
.footer-bottom p{margin:0}
.section{
  padding-block:var(--spacing-section);
  position:relative;
}
.section--tight{padding-block:clamp(2.5rem,5vw,4rem)}
.section--narrow{max-width:1000px;margin-inline:auto}
.section--wide{max-width:1400px}
.slab{
  position:relative;
  overflow:hidden;
  background:linear-gradient(135deg,rgba(18,43,80,.9),rgba(10,31,68,.75));
  border:1px solid rgba(247,250,255,.08);
  border-radius:var(--radius-lg);
  padding:clamp(1.75rem,4.5vw,4rem);
}
.slab::before{
  content:"";
  position:absolute;
  top:-20%;
  right:-6%;
  width:280px;
  height:280px;
  border-radius:50%;
  background:radial-gradient(circle,rgba(46,94,255,.24),transparent 70%);
  pointer-events:none;
}
.slab::after{
  content:"";
  position:absolute;
  left:0;
  top:0;
  bottom:0;
  width:3px;
  background:linear-gradient(180deg,#00FF87,#2E5EFF,transparent);
  opacity:.7;
  pointer-events:none;
}
.slab--highlight{
  border-color:rgba(0,255,135,.35);
  box-shadow:0 0 0 1px rgba(0,255,135,.1),0 20px 50px rgba(0,0,0,.25);
}
.slab--orange::after{background:linear-gradient(180deg,#FF6A00,transparent)}
.panel{
  background:#122B50;
  border:1px solid rgba(247,250,255,.08);
  border-radius:var(--radius-md);
  padding:24px;
}
.panel--glow{
  border-color:var(--line-glow);
  box-shadow:0 0 24px rgba(0,255,135,.08);
}
.panel--paper{
  background:#F2F4F8;
  color:#0A1F44;
  border-color:transparent;
}
.kicker{
  display:inline-flex;
  align-items:center;
  gap:10px;
  font-size:.8rem;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.14em;
  color:#00FF87;
  margin-bottom:14px;
}
.kicker::before{
  content:"";
  width:28px;
  height:2px;
  background:linear-gradient(90deg,#00FF87,transparent);
}
.display-title{
  font-size:clamp(2.4rem,6vw,4rem);
  line-height:.95;
  text-transform:uppercase;
  letter-spacing:.02em;
  margin:0 0 16px;
}
.section-title{
  font-size:clamp(1.8rem,4vw,2.8rem);
  margin:0 0 16px;
}
.lead{
  font-size:clamp(1.05rem,2vw,1.3rem);
  color:#A8C0E0;
  max-width:60ch;
  margin:0 0 1.5rem;
}
.prose{color:#A8C0E0;max-width:72ch}
.prose h2,.prose h3{color:#F7FAFF;margin-top:1.5em}
.prose a{color:#00FF87}
.glow-line{
  height:2px;
  border:0;
  background:linear-gradient(90deg,#00FF87,#2E5EFF,transparent);
  margin:2rem 0;
}
.grid{display:grid;gap:24px}
.grid--2{grid-template-columns:repeat(2,minmax(0,1fr))}
.grid--3{grid-template-columns:repeat(3,minmax(0,1fr))}
.grid--4{grid-template-columns:repeat(4,minmax(0,1fr))}
.data-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr));
  gap:20px;
}
@media(max-width:1024px){.grid--4{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:680px){
  .grid--2,.grid--3,.grid--4{grid-template-columns:1fr}
}
.card{
  background:linear-gradient(180deg,rgba(18,43,80,.75),rgba(10,31,68,.75));
  border:1px solid rgba(247,250,255,.08);
  border-radius:var(--radius-md);
  padding:24px;
  transition:border-color .25s ease,background .25s ease,transform .25s ease;
}
.card:hover{
  border-color:var(--line-glow);
  background:rgba(18,43,80,.92);
  transform:translateY(-2px);
}
.data-card{
  background:linear-gradient(180deg,rgba(18,43,80,.8),rgba(10,31,68,.7));
  border:1px solid rgba(247,250,255,.08);
  border-radius:var(--radius-md);
  padding:24px;
}
.metric{
  display:flex;
  flex-direction:column;
  gap:2px;
}
.metric-value{
  font-family:var(--font-display);
  font-size:clamp(2rem,5vw,3.5rem);
  line-height:1;
  letter-spacing:.02em;
  color:#F7FAFF;
}
.metric-value--green{color:#00FF87}
.metric-value--orange{color:#FF6A00}
.metric-label{
  font-size:.85rem;
  text-transform:uppercase;
  letter-spacing:.08em;
  color:#A8C0E0;
}
.tag{
  display:inline-block;
  padding:4px 10px;
  border:1px solid rgba(168,192,224,.35);
  border-radius:999px;
  font-size:.78rem;
  font-weight:700;
  letter-spacing:.06em;
  color:#A8C0E0;
  text-transform:uppercase;
}
.tag--live{
  color:#00FF87;
  border-color:#00FF87;
  box-shadow:0 0 12px rgba(0,255,135,.25);
}
.tag--new{
  color:#FF6A00;
  border-color:#FF6A00;
}
.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  padding:12px 24px;
  border-radius:999px;
  font-size:1rem;
  font-weight:800;
  text-decoration:none;
  color:#F7FAFF;
  background:rgba(247,250,255,.06);
  border:1px solid rgba(247,250,255,.16);
  transition:background .2s ease,transform .2s ease,box-shadow .2s ease;
}
.btn:hover{background:rgba(247,250,255,.12);transform:translateY(-2px)}
.btn--primary{
  background:#FF6A00;
  border-color:#FF6A00;
  color:#0A1F44;
  box-shadow:0 10px 24px rgba(255,106,0,.22);
}
.btn--primary:hover{background:#ff7a1a;box-shadow:0 14px 30px rgba(255,106,0,.3)}
.btn--ghost{
  border-color:#00FF87;
  color:#00FF87;
}
.btn--ghost:hover{background:rgba(0,255,135,.12)}
.btn--small{padding:8px 16px;font-size:.9rem}
.media{
  position:relative;
  display:block;
  overflow:hidden;
  border-radius:18px;
  border:1px solid rgba(247,250,255,.08);
  background:linear-gradient(135deg,rgba(27,59,123,.55),rgba(18,43,80,.35) 60%,rgba(0,255,135,.14));
}
.media::before{content:"";display:block;padding-top:56.25%}
.media--4-3::before{padding-top:75%}
.media--square::before{padding-top:100%}
.media--tall::before{padding-top:125%}
.media img{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
}
.media--placeholder::after{
  content:"场 · 景";
  position:absolute;
  inset:0;
  display:flex;
  align-items:center;
  justify-content:center;
  font-family:var(--font-display);
  letter-spacing:.22em;
  color:rgba(247,250,255,.4);
  font-size:1.2rem;
}
.media-caption{
  font-size:.85rem;
  color:#A8C0E0;
  margin-top:8px;
}
.rail-note{
  writing-mode:vertical-rl;
  text-orientation:mixed;
  transform:rotate(180deg);
  font-size:.8rem;
  font-weight:700;
  letter-spacing:.3em;
  text-transform:uppercase;
  color:#A8C0E0;
  border-left:1px solid rgba(0,255,135,.25);
  padding-left:10px;
}
.tick-grid{
  background-image:radial-gradient(circle,rgba(0,255,135,.25) 1px,transparent 1.4px);
  background-size:22px 22px;
}
.breadcrumb{
  font-size:.85rem;
  color:#A8C0E0;
  margin:0 0 24px;
}
.breadcrumb ol{
  list-style:none;
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin:0;
  padding:0;
}
.breadcrumb a{color:#A8C0E0;text-decoration:none}
.breadcrumb a:hover{color:#00FF87}
.breadcrumb li{display:flex;align-items:center;gap:8px}
.breadcrumb li+li::before{content:"/";color:rgba(168,192,224,.5)}
details{
  background:rgba(18,43,80,.5);
  border:1px solid rgba(247,250,255,.08);
  border-radius:14px;
  padding:14px 18px;
  margin-bottom:12px;
}
summary{
  cursor:pointer;
  font-weight:700;
  color:#F7FAFF;
  list-style:none;
}
summary::-webkit-details-marker{display:none}
summary::before{
  content:"+";
  display:inline-block;
  width:1.4em;
  color:#00FF87;
}
details[open] summary::before{content:"–"}
html.js [data-reveal]{
  opacity:0;
  transform:translateY(18px);
  transition:opacity .6s ease,transform .6s ease;
}
html.js [data-reveal][data-inview]{
  opacity:1;
  transform:none;
}
@media(max-width:1080px){
  .footer-top{grid-template-columns:1fr 1fr;gap:36px}
  .footer-brand-panel{grid-column:1/-1}
}
@media(max-width:900px){
  .site-header{top:10px;padding:0 14px}
  .nav-capsule{border-radius:28px;padding:8px 10px 8px 14px}
  .nav-toggle{display:inline-flex}
  .nav{
    display:none;
    position:absolute;
    top:calc(100% + 12px);
    left:0;
    right:0;
    flex-direction:column;
    align-items:stretch;
    gap:8px;
    background:linear-gradient(145deg,rgba(18,43,80,.98),rgba(10,31,68,.98));
    border:1px solid rgba(247,250,255,.1);
    border-radius:24px;
    padding:14px;
    box-shadow:0 24px 60px rgba(4,12,30,.5);
  }
  .nav[data-open]{display:flex}
  .nav-list{
    flex-direction:column;
    gap:4px;
    margin-bottom:8px;
  }
  .nav-link{
    border-radius:14px;
    color:#F7FAFF;
    padding:12px 14px;
  }
  .nav-cta{text-align:center}
}
@media(max-width:560px){
  .footer-top{grid-template-columns:1fr;padding:40px 24px;gap:32px}
  .footer-brand-panel{grid-column:auto}
  .footer-bottom{padding:16px 24px;text-align:left}
}
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{
    animation-duration:.01ms !important;
    animation-iteration-count:1 !important;
    transition-duration:.01ms !important;
  }
  html.js [data-reveal]{
    opacity:1;
    transform:none;
  }
}
