*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;text-size-adjust:100%}
:root{
  --bg-deep:#0F1A2F;
  --bg-deeper:#0A1220;
  --bg-card:#1D2C45;
  --bg-light:#F2F4F7;
  --line-light:#E8ECF1;
  --accent-orange:#FF6B35;
  --accent-lime:#39FF14;
  --accent-yellow:#FFD166;
  --accent-teal:#5BE8C7;
  --text-light:#F2F4F7;
  --text-muted:#AFC1D6;
  --text-deep:#0F1A2F;
  --font-head:"Archivo Black","Arial Black",Impact,"Helvetica Neue","PingFang SC","Microsoft YaHei",sans-serif;
  --font-body:Inter,"PingFang SC","Microsoft YaHei",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --font-data:"JetBrains Mono","SFMono-Regular",Consolas,"Liberation Mono",Menlo,monospace;
  --container:min(1200px,calc(100% - 48px));
  --ease:cubic-bezier(.22,.61,.36,1);
  --dur:160ms
}
body{
  min-height:100vh;
  display:flex;
  flex-direction:column;
  background:var(--bg-deep);
  color:var(--text-light);
  font-family:var(--font-body);
  font-size:1rem;
  line-height:1.75;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeSpeed
}
main{flex:1 0 auto}
img,picture,svg,video{display:block;max-width:100%}
h1,h2,h3,h4{
  font-family:var(--font-head);
  line-height:1;
  letter-spacing:-.02em;
  font-weight:700;
  text-wrap:balance;
  overflow-wrap:break-word
}
h1{font-size:clamp(2.5rem,6vw,5.5rem)}
h2{font-size:clamp(2rem,4vw,3.1rem)}
h3{font-size:clamp(1.25rem,2vw,1.7rem)}
p{max-width:72ch}
a{color:inherit;text-decoration:none}
ul,ol{list-style:none}
:focus-visible{outline:2px solid var(--accent-lime);outline-offset:3px;border-radius:2px}
::selection{background:var(--accent-orange);color:var(--bg-deeper)}
.container{width:min(1200px,calc(100% - 48px));margin-inline:auto}
.container--wide{width:min(1440px,calc(100% - 48px))}
.skip-link{
  position:fixed;
  top:8px;left:8px;
  z-index:2000;
  padding:10px 16px;
  background:var(--accent-lime);
  color:var(--bg-deeper);
  font-weight:700;
  font-size:.9rem;
  border-radius:6px;
  transform:translateY(-160%);
  transition:transform .2s var(--ease)
}
.skip-link:focus{transform:translateY(0)}
.scroll-progress{
  position:fixed;
  top:0;left:0;
  width:100%;
  height:3px;
  z-index:1500;
  pointer-events:none
}
.scroll-progress__bar{
  display:block;
  width:100%;
  height:100%;
  background:linear-gradient(90deg,var(--accent-orange),var(--accent-lime));
  transform:scaleX(0);
  transform-origin:0 50%;
  will-change:transform
}
.back-to-top{
  position:fixed;
  right:22px;bottom:22px;
  z-index:900;
  width:44px;height:44px;
  display:grid;
  place-items:center;
  background:var(--accent-orange);
  color:var(--bg-deeper);
  border:0;
  border-radius:12px;
  font-size:1.1rem;
  font-weight:700;
  line-height:1;
  cursor:pointer;
  opacity:0;
  visibility:hidden;
  transform:translateY(10px);
  transition:opacity .2s var(--ease),transform .2s var(--ease),visibility .2s,background-color .2s
}
.back-to-top:hover{background:var(--accent-lime)}
.back-to-top.is-visible{opacity:1;visibility:visible;transform:translateY(0)}
.site-header{
  position:sticky;
  top:12px;
  z-index:1000;
  padding:0 0 12px
}
.site-header__inner{
  width:var(--container);
  min-height:var(--header-h,68px);
  margin-inline:auto;
  display:flex;
  align-items:center;
  gap:18px;
  padding:8px 10px 8px 16px;
  background:rgba(10,18,32,.88);
  border:1px solid rgba(242,244,247,.08);
  border-radius:999px;
  box-shadow:0 16px 48px rgba(0,0,0,.35);
  -webkit-backdrop-filter:blur(14px);
  backdrop-filter:blur(14px)
}
.site-header__brand{
  display:inline-flex;
  align-items:center;
  gap:10px;
  flex-shrink:0;
  color:var(--text-light)
}
.site-header__brand:hover .brand-mark{background:var(--accent-lime)}
.brand-mark{
  display:inline-grid;
  place-items:center;
  width:36px;
  height:36px;
  flex-shrink:0;
  background:var(--accent-orange);
  color:var(--bg-deeper);
  font-family:var(--font-head);
  font-size:1.2rem;
  line-height:1;
  clip-path:polygon(0 0,calc(100% - 8px) 0,100% 8px,100% 100%,8px 100%,0 calc(100% - 8px));
  transition:background-color var(--dur) var(--ease),color var(--dur) var(--ease)
}
.brand-name{
  font-weight:800;
  font-size:1.05rem;
  line-height:1.15;
  letter-spacing:.02em;
  white-space:nowrap
}
.brand-name small{
  display:block;
  font-size:.62rem;
  font-weight:500;
  color:var(--text-muted);
  letter-spacing:.1em;
  margin-top:2px
}
.site-nav{margin-left:auto}
.site-nav__list{display:flex;align-items:center;gap:2px}
.nav-link{
  position:relative;
  display:inline-block;
  padding:10px 14px;
  font-size:.9rem;
  font-weight:600;
  color:var(--text-light);
  border-radius:999px;
  white-space:nowrap;
  transition:color .16s var(--ease),background-color .16s var(--ease)
}
.nav-link::after{
  content:"";
  position:absolute;
  left:15px;right:15px;bottom:5px;
  height:2px;
  background:var(--accent-orange);
  clip-path:polygon(0 0,100% 0,calc(100% - 6px) 100%,6px 100%);
  transform:scaleX(0);
  transform-origin:left;
  transition:transform .16s var(--ease)
}
.nav-link:hover{color:var(--accent-lime)}
.nav-link:hover::after,
.nav-link[aria-current="page"]::after{transform:scaleX(1)}
.nav-link[aria-current="page"]{color:var(--accent-orange)}
.site-header__action{flex-shrink:0}
.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  padding:12px 22px;
  border:0;
  border-radius:999px;
  background:transparent;
  color:var(--text-light);
  font-family:var(--font-body);
  font-size:.92rem;
  font-weight:700;
  line-height:1;
  cursor:pointer;
  white-space:nowrap;
  text-decoration:none;
  transition:background-color .18s var(--ease),color .18s var(--ease),transform .18s var(--ease),box-shadow .18s var(--ease)
}
.btn--primary{background:var(--accent-orange);color:var(--bg-deeper)}
.btn--primary:hover{
  background:var(--accent-lime);
  color:var(--bg-deeper);
  transform:translateY(-2px);
  box-shadow:0 10px 24px rgba(57,255,20,.2)
}
.btn--ghost{border:1px solid rgba(242,244,247,.3);color:var(--text-light)}
.btn--ghost:hover{
  background:rgba(255,255,255,.06);
  border-color:var(--accent-lime);
  color:var(--accent-lime)
}
.btn--small{padding:9px 16px;font-size:.82rem}
.nav-toggle{
  display:none;
  align-items:center;
  justify-content:center;
  width:42px;
  height:42px;
  padding:0;
  border:1px solid rgba(242,244,247,.18);
  border-radius:50%;
  background:rgba(255,255,255,.04);
  color:var(--text-light);
  cursor:pointer;
  position:relative;
  flex-shrink:0
}
.nav-toggle__bar{
  position:absolute;
  left:11px;
  width:18px;
  height:2px;
  background:currentColor;
  border-radius:2px;
  transition:top .18s var(--ease),transform .18s var(--ease),opacity .18s var(--ease)
}
.nav-toggle__bar:nth-child(1){top:13px}
.nav-toggle__bar:nth-child(2){top:19px}
.nav-toggle__bar:nth-child(3){top:25px}
.site-header[data-open] .nav-toggle__bar:nth-child(1){top:19px;transform:rotate(45deg)}
.site-header[data-open] .nav-toggle__bar:nth-child(2){opacity:0}
.site-header[data-open] .nav-toggle__bar:nth-child(3){top:19px;transform:rotate(-45deg)}
@media (max-width:1024px){
  .site-header__inner{
    flex-wrap:wrap;
    border-radius:22px;
    padding:10px 14px 10px 16px
  }
  .site-header__action{margin-left:auto}
  .site-nav{
    display:none;
    order:10;
    width:100%;
    margin-left:0;
    padding:8px 0 10px
  }
  .site-nav::before{
    content:"";
    display:block;
    height:1px;
    margin:0 0 8px;
    background:rgba(242,244,247,.1)
  }
  .site-nav[data-open]{display:block}
  .site-nav__list{
    flex-direction:column;
    align-items:stretch;
    gap:2px
  }
  .nav-link{
    display:flex;
    align-items:center;
    justify-content:space-between;
    padding:12px 14px;
    font-size:1rem;
    border-radius:12px
  }
  .nav-link::after{
    left:auto;
    right:14px;
    top:50%;
    bottom:auto;
    width:6px;
    height:6px;
    background:var(--accent-orange);
    clip-path:polygon(0 0,100% 50%,0 100%);
    transform:translateY(-50%) scale(0)
  }
  .nav-link:hover::after,
  .nav-link[aria-current="page"]::after{transform:translateY(-50%) scale(1)}
  .nav-link[aria-current="page"]{
    background:rgba(255,107,53,.12);
    color:var(--accent-orange)
  }
  .nav-toggle{display:inline-flex}
}
@media (max-width:640px){
  .site-header__action{display:none}
}
@media (max-width:520px){
  .brand-name small{display:none}
}
.site-footer{
  position:relative;
  margin-top:auto;
  background:var(--bg-deeper);
  color:var(--text-light)
}
.site-footer::before{
  content:"";
  position:absolute;
  top:0;left:0;
  width:100%;
  height:3px;
  background:linear-gradient(90deg,var(--accent-orange),var(--accent-lime))
}
.site-footer__main{
  width:var(--container);
  margin-inline:auto;
  display:grid;
  grid-template-columns:1.15fr .85fr 1fr;
  gap:clamp(28px,6vw,64px);
  padding-block:clamp(2.8rem,7vw,4.5rem)
}
.site-footer__brand{
  display:grid;
  justify-items:start;
  gap:14px
}
.site-footer__brand-link{
  display:inline-flex;
  align-items:center;
  gap:10px;
  color:var(--text-light)
}
.site-footer__brand-link:hover .brand-mark{background:var(--accent-lime)}
.footer-desc{
  color:var(--text-muted);
  font-size:.92rem;
  line-height:1.8;
  max-width:46ch
}
.footer-title{
  font-family:var(--font-data);
  font-size:.78rem;
  font-weight:600;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:var(--accent-lime);
  line-height:1.4;
  margin-bottom:16px
}
.site-footer__links ul{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:10px 24px
}
.footer-link{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding-block:4px;
  font-size:.92rem;
  font-weight:500;
  color:var(--text-light);
  transition:color .16s var(--ease)
}
.footer-link::before{
  content:"";
  width:12px;
  height:2px;
  flex-shrink:0;
  background:var(--accent-orange);
  transition:width .16s var(--ease),background-color .16s var(--ease)
}
.footer-link:hover{color:var(--accent-lime)}
.footer-link:hover::before{
  width:18px;
  background:var(--accent-lime)
}
.site-footer__contact address{
  display:grid;
  gap:6px;
  font-style:normal;
  font-size:.9rem;
  color:var(--text-muted);
  line-height:1.8
}
.site-footer__bottom{border-top:1px solid rgba(242,244,247,.08)}
.site-footer__bottom-inner{
  width:var(--container);
  margin-inline:auto;
  display:flex;
  align-items:center;
  justify-content:space-between;
  flex-wrap:wrap;
  gap:10px 24px;
  padding-block:18px;
  font-size:.82rem;
  color:var(--text-muted)
}
.footer-legal{
  display:inline-flex;
  flex-wrap:wrap;
  gap:18px
}
.footer-legal a{font-weight:500}
.footer-legal a:hover{color:var(--accent-lime)}
.icp-text{
  font-family:var(--font-data);
  font-variant-numeric:tabular-nums
}
@media (max-width:900px){
  .site-footer__main{grid-template-columns:1fr 1fr}
  .site-footer__brand{grid-column:1/-1}
}
@media (max-width:640px){
  .site-footer__main{grid-template-columns:1fr}
  .site-footer__bottom-inner{flex-direction:column;align-items:flex-start}
}
.breadcrumbs{
  width:var(--container);
  margin-inline:auto;
  padding:26px 0 6px;
  font-size:.85rem;
  color:var(--text-muted)
}
.breadcrumbs ul{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:4px
}
.breadcrumbs li{
  display:inline-flex;
  align-items:center;
  gap:4px
}
.breadcrumbs li+li::before{
  content:"/";
  color:rgba(242,244,247,.3)
}
.breadcrumbs a{color:var(--text-muted)}
.breadcrumbs a:hover{color:var(--accent-lime)}
.breadcrumbs [aria-current="page"]{color:var(--text-light)}
.section{
  position:relative;
  padding-block:clamp(3.5rem,9vw,7rem)
}
.section--deep{background:var(--bg-deep);color:var(--text-light)}
.section--light{background:var(--bg-light);color:var(--text-deep)}
.section--dark{background:var(--bg-card);color:var(--text-light)}
.section--slant{
  clip-path:polygon(0 0,calc(100% - 36px) 0,100% 36px,100% 100%,0 100%)
}
.grid{
  display:grid;
  gap:clamp(24px,5vw,48px)
}
.grid--2{grid-template-columns:repeat(2,minmax(0,1fr))}
.grid--7-5{grid-template-columns:7fr 5fr}
.grid--6-5{grid-template-columns:6fr 5fr}
.grid--2-1{grid-template-columns:2fr 1fr}
@media (max-width:900px){
  .grid--2,.grid--7-5,.grid--6-5,.grid--2-1{grid-template-columns:1fr}
}
.kicker{
  display:inline-flex;
  align-items:center;
  gap:10px;
  margin-bottom:14px;
  font-family:var(--font-data);
  font-size:.78rem;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:var(--accent-lime)
}
.kicker::before{
  content:"";
  width:26px;
  height:2px;
  background:var(--accent-orange);
  clip-path:polygon(0 0,100% 0,calc(100% - 6px) 100%,6px 100%)
}
.display-title{
  font-family:var(--font-head);
  font-size:clamp(2.5rem,6vw,5.2rem);
  line-height:.98;
  letter-spacing:-.02em;
  margin-bottom:.35em
}
.lede{
  font-size:1.1rem;
  color:var(--text-muted);
  max-width:58ch
}
.section--light .lede{color:#52667b}
.text-muted{color:var(--text-muted)}
.section--light .text-muted{color:#52667b}
.data-tag{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:5px 12px 5px 16px;
  font-family:var(--font-data);
  font-size:.82rem;
  font-variant-numeric:tabular-nums;
  background:rgba(255,107,53,.14);
  border-left:3px solid var(--accent-orange);
  color:var(--accent-orange)
}
.data-tag--lime{
  background:rgba(57,255,20,.1);
  border-left-color:var(--accent-lime);
  color:var(--accent-lime)
}
.panel{
  position:relative;
  padding:clamp(20px,4vw,36px);
  background:var(--bg-card)
}
.panel--cut{
  clip-path:polygon(0 0,calc(100% - 22px) 0,100% 22px,100% 100%,22px 100%,0 calc(100% - 22px))
}
.panel--light{background:var(--bg-light);color:var(--text-deep)}
.panel--deep{background:var(--bg-deeper)}
.panel--outline{
  background:transparent;
  border:1px solid rgba(255,255,255,.16)
}
.media-frame{
  position:relative;
  display:block;
  aspect-ratio:16/9;
  background:linear-gradient(135deg,var(--bg-card),var(--bg-deeper));
  overflow:hidden;
  clip-path:polygon(0 0,calc(100% - 22px) 0,100% 22px,100% 100%,22px 100%,0 calc(100% - 22px))
}
.media-frame img,
.media-frame video{
  width:100%;
  height:100%;
  object-fit:cover
}
.media-frame::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(115deg,transparent 42%,rgba(255,107,53,.22) 42%,transparent 44%);
  mix-blend-mode:screen;
  pointer-events:none
}
.media-frame--portrait{aspect-ratio:4/5}
.media-frame--wide{aspect-ratio:21/9}
.data-card{
  position:relative;
  padding:20px 24px;
  background:var(--bg-card);
  clip-path:polygon(0 0,calc(100% - 14px) 0,100% 14px,100% 100%,14px 100%,0 calc(100% - 14px))
}
.data-card__index{
  font-family:var(--font-data);
  font-size:2rem;
  line-height:1;
  color:var(--accent-orange);
  font-variant-numeric:tabular-nums
}
.data-card__label{
  margin-top:8px;
  font-size:.82rem;
  color:var(--text-muted);
  letter-spacing:.04em
}
.data-card--lime .data-card__index{color:var(--accent-lime)}
[data-reveal]{
  opacity:0;
  transform:translateY(16px);
  transition:opacity .5s var(--ease),transform .5s var(--ease)
}
[data-reveal].is-revealed{
  opacity:1;
  transform:none
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,
  *::before,
  *::after{
    animation-duration:.01ms !important;
    animation-iteration-count:1 !important;
    transition-duration:.01ms !important
  }
  [data-reveal]{
    opacity:1;
    transform:none;
    transition:none
  }
}
