/* =========================================
   九游竞界 Site Kit — /assets/site.css
   ========================================= */
:root{
  --font-title:"Noto Sans SC","Source Han Sans SC","PingFang SC","Microsoft YaHei",sans-serif;
  --font-body:"Noto Sans SC","Source Han Sans SC","PingFang SC","Microsoft YaHei",sans-serif;
  --color-deep:#0D1B3E;
  --color-deep-2:#0A0F1E;
  --color-white:#F7F5F0;
  --color-gold:#D4A017;
  --color-red:#C0392B;
  --color-yellow:#F1C40F;
  --color-green:#27AE60;
  --color-blue:#2980B9;
  --color-ink:#16213E;
  --color-muted:#65718A;
  --radius-lg:32px;
  --radius-md:20px;
  --radius-pill:999px;
  --shadow-md:0 12px 36px rgba(13,27,62,.10);
  --shadow-lg:0 24px 60px rgba(13,27,62,.14);
  --ease:cubic-bezier(.22,.9,.34,1);
  --header-w:264px;
}
*,*::before,*::after{box-sizing:border-box;}
*{margin:0;padding:0;}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;}
body{
  font-family:var(--font-body);
  font-size:16px;line-height:1.75;
  color:var(--color-ink);
  background:var(--color-white);
  -webkit-font-smoothing:antialiased;
}
img,svg,video{display:block;max-width:100%;}
ul,ol{list-style:none;}
button,input,select,textarea{font:inherit;color:inherit;}
button{cursor:pointer;}
a{color:var(--color-deep);text-decoration:underline;text-underline-offset:2px;}
h1,h2,h3,h4{font-family:var(--font-title);font-weight:900;line-height:1.3;color:var(--color-deep);word-break:break-word;}
h1{font-size:clamp(30px,4.6vw,48px)}
h2{font-size:clamp(24px,3.2vw,32px)}
h3{font-size:clamp(20px,2.2vw,24px)}
::selection{background:var(--color-gold);color:var(--color-deep);}
:focus-visible{outline:3px solid var(--color-gold);outline-offset:3px;border-radius:6px;}
.visually-hidden{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0;}

/* ---------- 布局基座 ---------- */
.container{max-width:1200px;margin:0 auto;padding:0 clamp(20px,4vw,40px);}
.site-main{min-height:70vh;display:block;}
.section{padding:clamp(56px,8vw,104px) 0;}
.section--tight{padding:clamp(36px,5vw,64px) 0;}
.section-head{max-width:760px;margin-bottom:clamp(32px,5vw,56px);}
.section-head--center{margin-left:auto;margin-right:auto;text-align:center;}
.section-kicker{
  display:inline-flex;align-items:center;gap:10px;
  font-size:12px;font-weight:800;letter-spacing:.2em;
  color:var(--color-gold);text-transform:uppercase;margin-bottom:14px;
}
.section-kicker::before{content:"";width:28px;height:2px;background:var(--color-gold);border-radius:2px;}
.section-title{margin-bottom:14px;}
.section-lead{color:var(--color-muted);font-size:17px;max-width:640px;}
.section-head--center .section-lead{margin-inline:auto;}
.gold-rule{display:block;width:72px;height:4px;border-radius:2px;background:linear-gradient(90deg,var(--color-gold),rgba(212,160,23,.15));margin:20px 0 0;}
.display-hero{font-size:clamp(40px,6.5vw,72px);line-height:1.08;font-weight:900;letter-spacing:-.015em;color:var(--color-deep);}
.lead{font-size:19px;color:var(--color-muted);line-height:1.8;}

/* ---------- 网格 ---------- */
.grid{display:grid;gap:24px;}
.grid-2{grid-template-columns:repeat(2,1fr);}
.grid-3{grid-template-columns:repeat(3,1fr);}
.grid-4{grid-template-columns:repeat(4,1fr);}
.gap-sm{gap:16px;}
.gap-lg{gap:32px;}
@media(max-width:992px){.grid-3,.grid-4{grid-template-columns:repeat(2,1fr);}}
@media(max-width:640px){.grid-2,.grid-3,.grid-4{grid-template-columns:1fr;}}

/* ---------- 按钮 ---------- */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  padding:13px 28px;border-radius:var(--radius-pill);
  font-weight:700;font-size:15px;letter-spacing:.02em;
  text-decoration:none;border:2px solid transparent;
  transition:transform .28s var(--ease),box-shadow .28s var(--ease),background .28s var(--ease),color .28s var(--ease);
}
.btn:hover{transform:translateY(-2px);box-shadow:var(--shadow-md);}
.btn:active{transform:translateY(0);}
.btn-primary{background:var(--color-deep);color:var(--color-white);}
.btn-primary:hover{background:#16275a;}
.btn-gold{background:var(--color-gold);color:var(--color-deep);}
.btn-gold:hover{background:#e0b029;}
.btn-ghost{border-color:rgba(13,27,62,.35);color:var(--color-deep);background:transparent;}
.btn-ghost:hover{border-color:var(--color-gold);color:var(--color-gold);}
.btn-light{background:var(--color-white);color:var(--color-deep);}
.btn-sm{padding:9px 20px;font-size:13px;}
.btn-lg{padding:16px 40px;font-size:17px;}

/* ---------- 经幡色标签 ---------- */
.chip{display:inline-flex;align-items:center;gap:6px;padding:5px 14px;border-radius:var(--radius-pill);font-size:12px;font-weight:800;letter-spacing:.02em;}
.chip::before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor;}
.chip-gold{background:rgba(212,160,23,.14);color:#8A6608;}
.chip-red{background:rgba(192,57,43,.10);color:var(--color-red);}
.chip-yellow{background:rgba(241,196,15,.16);color:#8A6D00;}
.chip-green{background:rgba(39,174,96,.12);color:var(--color-green);}
.chip-blue{background:rgba(41,128,185,.12);color:var(--color-blue);}
.chip-deep{background:rgba(13,27,62,.08);color:var(--color-deep);}
.chip-light{background:rgba(247,245,240,.16);color:var(--color-white);}

/* ---------- 卡片 ---------- */
.card{
  background:var(--color-white);border-radius:var(--radius-lg);padding:28px;
  border:1px solid rgba(13,27,62,.06);box-shadow:0 2px 10px rgba(13,27,62,.04);
}
.card--deep{background:var(--color-deep);border-color:transparent;color:rgba(247,245,240,.78);}
.card--deep h2,.card--deep h3,.card--deep h4{color:var(--color-white);}
.card--tint{background:rgba(212,160,23,.07);border-color:transparent;}
.card--plain{background:transparent;border-color:transparent;box-shadow:none;padding:0;}

/* ---------- 数字统计 ---------- */
.stat-block{position:relative;}
.stat-number{
  display:block;font-family:var(--font-title);
  font-size:clamp(40px,5vw,60px);font-weight:900;line-height:1;
  color:var(--color-deep);font-variant-numeric:tabular-nums;letter-spacing:-.02em;
}
.stat-label{margin-top:8px;color:var(--color-muted);font-size:14px;font-weight:500;}
.peak-band .stat-number{color:var(--color-gold);}
.peak-band .stat-label{color:rgba(247,245,240,.7);}

/* ---------- 数据脉冲 / 动态点 ---------- */
.pulse-ring{
  position:relative;display:inline-flex;align-items:center;justify-content:center;
  width:72px;height:72px;border-radius:50%;background:rgba(212,160,23,.08);
}
.pulse-ring::before{
  content:"";position:absolute;inset:10px;border-radius:50%;
  border:2px solid var(--color-gold);animation:pulse 2.4s var(--ease) infinite;
}
.pulse-ring::after{
  content:"";position:absolute;width:10px;height:10px;border-radius:50%;
  background:var(--color-gold);
}
@keyframes pulse{0%{transform:scale(.72);opacity:1;}100%{transform:scale(1.35);opacity:0;}}
.live-dot{display:inline-flex;align-items:center;gap:8px;font-size:13px;font-weight:700;color:var(--color-green);}
.live-dot::before{
  content:"";width:8px;height:8px;border-radius:50%;background:var(--color-green);
  box-shadow:0 0 0 0 rgba(39,174,96,.45);animation:live-ping 1.8s infinite;
}
@keyframes live-ping{0%{box-shadow:0 0 0 0 rgba(39,174,96,.45);}100%{box-shadow:0 0 0 12px rgba(39,174,96,0);}}

/* ---------- 图片容器 ---------- */
.img-frame{position:relative;border-radius:var(--radius-lg);overflow:hidden;background:var(--color-deep);box-shadow:var(--shadow-md);}
.img-frame img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;}
.img-frame[data-ratio="16/9"]{aspect-ratio:16/9;}
.img-frame[data-ratio="4/3"]{aspect-ratio:4/3;}
.img-frame[data-ratio="1/1"]{aspect-ratio:1/1;}
.img-frame[data-ratio="3/4"]{aspect-ratio:3/4;}
.img-frame::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 55%,rgba(13,27,62,.32));pointer-events:none;}
.img-frame--flat{box-shadow:none;}

/* ---------- 数据表格 ---------- */
.data-table{width:100%;border-collapse:collapse;font-size:14px;background:var(--color-white);border-radius:var(--radius-md);overflow:hidden;}
.data-table th{text-align:left;padding:14px 18px;background:rgba(212,160,23,.10);color:var(--color-deep);font-weight:800;white-space:nowrap;}
.data-table td{padding:14px 18px;border-top:1px solid rgba(13,27,62,.07);color:var(--color-ink);}
.data-table tbody tr:hover{background:rgba(41,128,185,.05);}
.data-table td strong{color:var(--color-deep);}

/* ---------- 表单基础 ---------- */
.field{display:block;margin-bottom:18px;}
.field-label{display:block;margin-bottom:8px;font-size:14px;font-weight:700;color:var(--color-deep);}
.input,.select,.textarea{
  width:100%;padding:13px 20px;border-radius:var(--radius-pill);
  border:1.5px solid rgba(13,27,62,.16);background:var(--color-white);
  font-size:15px;color:var(--color-ink);
  transition:border-color .2s,box-shadow .2s;
}
.textarea{border-radius:20px;resize:vertical;min-height:120px;}
.input:focus,.select:focus,.textarea:focus{outline:none;border-color:var(--color-gold);box-shadow:0 0 0 4px rgba(212,160,23,.15);}

/* ---------- 斜切雪山过渡区 ---------- */
.peak-band{
  position:relative;background:var(--color-deep);color:rgba(247,245,240,.8);
  padding:clamp(64px,8vw,112px) 0;
  clip-path:polygon(0 0,100% 3.5%,100% 100%,0 100%);margin-top:-1px;
}
.peak-band h1,.peak-band h2,.peak-band .display-hero{color:var(--color-white);}
.peak-band .section-lead{color:rgba(247,245,240,.68);}
.peak-band--flip{clip-path:polygon(0 3.5%,100% 0,100% 100%,0 100%);}
.peak-band--gold{background:linear-gradient(135deg,#b8860b,var(--color-gold));}

/* ---------- 面包屑 ---------- */
.breadcrumb{display:flex;flex-wrap:wrap;gap:6px;align-items:center;font-size:14px;color:var(--color-muted);margin-bottom:28px;}
.breadcrumb a{color:var(--color-deep);text-decoration:none;font-weight:600;}
.breadcrumb a:hover{color:var(--color-gold);}
.breadcrumb li{display:flex;align-items:center;gap:6px;}
.breadcrumb li+li::before{content:"";width:6px;height:6px;border-top:1.5px solid rgba(13,27,62,.3);border-right:1.5px solid rgba(13,27,62,.3);transform:rotate(45deg);}

/* ---------- 无障碍跳转 ---------- */
.skip-link{
  position:fixed;top:14px;left:14px;z-index:1500;
  padding:12px 24px;border-radius:var(--radius-pill);
  background:var(--color-gold);color:var(--color-deep);
  font-weight:800;text-decoration:none;
  transform:translateY(-150%);transition:transform .3s var(--ease);
}
.skip-link:focus{transform:translateY(0);}

/* ---------- 阅读进度 ---------- */
.progress-bar{
  position:fixed;top:0;left:0;height:3px;width:0%;z-index:1400;
  background:linear-gradient(90deg,var(--color-gold),var(--color-yellow));
  box-shadow:0 0 8px rgba(212,160,23,.45);pointer-events:none;
}

/* ---------- 返回顶部 ---------- */
.to-top{
  position:fixed;right:22px;bottom:22px;z-index:900;
  width:52px;height:52px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  background:var(--color-deep);color:var(--color-white);
  border:2px solid var(--color-gold);box-shadow:var(--shadow-md);
  opacity:0;visibility:hidden;transform:translateY(18px);
  transition:opacity .3s,transform .3s,visibility .3s,background .3s,color .3s;
}
.to-top::before{content:"";width:10px;height:10px;border-top:2px solid currentColor;border-left:2px solid currentColor;transform:rotate(45deg);margin-top:5px;}
.to-top:hover{background:var(--color-gold);color:var(--color-deep);}
.to-top.is-visible{opacity:1;visibility:visible;transform:none;}

/* ---------- 头部：基础 ---------- */
.site-header{background:var(--color-deep);color:var(--color-white);}
.site-header::before{
  content:"";position:absolute;top:0;left:0;height:100%;width:5px;
  background:linear-gradient(180deg,var(--color-gold) 0 20%,var(--color-red) 20% 40%,var(--color-yellow) 40% 60%,var(--color-green) 60% 80%,var(--color-blue) 80% 100%);
  opacity:.92;pointer-events:none;
}
.site-header::after{
  content:"";position:absolute;left:5px;right:0;bottom:0;height:120px;
  background:linear-gradient(180deg,transparent,rgba(10,15,30,.7));pointer-events:none;
}
.header-inner{position:relative;z-index:1;}
.brand-lockup{display:inline-flex;align-items:center;gap:12px;text-decoration:none;color:var(--color-white);flex-shrink:0;}
.brand-mark{
  position:relative;width:46px;height:46px;flex:0 0 46px;border-radius:15px;
  background:var(--color-deep);box-shadow:0 0 0 2px rgba(212,160,23,.55);overflow:hidden;
}
.brand-peak{
  position:absolute;left:50%;bottom:-2px;transform:translateX(-50%);
  width:72%;height:62%;
  background:linear-gradient(120deg,#e2b34a,var(--color-gold));
  clip-path:polygon(50% 0,100% 100%,0 100%);
}
.brand-dot{
  position:absolute;left:50%;top:18px;transform:translateX(-50%);
  width:5px;height:5px;border-radius:50%;background:var(--color-white);
  box-shadow:0 0 0 2px rgba(212,160,23,.6);
}
.brand-text{display:flex;flex-direction:column;line-height:1.2;}
.brand-name{font-size:21px;font-weight:900;letter-spacing:.06em;color:var(--color-white);}
.brand-tagline{margin-top:2px;font-size:11px;font-weight:600;letter-spacing:.14em;color:var(--color-gold);white-space:nowrap;}
.nav-toggle{display:none;position:relative;z-index:320;width:44px;height:44px;align-items:center;justify-content:center;flex-direction:column;gap:5px;border-radius:50%;background:rgba(247,245,240,.08);}
.nav-toggle-bar{display:block;width:20px;height:2px;background:var(--color-white);border-radius:2px;transition:transform .28s var(--ease),opacity .2s;}
.site-header:has(.nav-toggle[aria-expanded="true"]) .nav-toggle-bar:nth-child(1){transform:translateY(7px) rotate(45deg);}
.site-header:has(.nav-toggle[aria-expanded="true"]) .nav-toggle-bar:nth-child(2){opacity:0;}
.site-header:has(.nav-toggle[aria-expanded="true"]) .nav-toggle-bar:nth-child(3){transform:translateY(-7px) rotate(-45deg);}

/* ---------- 轨道导航 ---------- */
.nav-track{position:relative;}
.nav-track::before{
  content:"";position:absolute;left:0;top:8px;bottom:8px;width:1px;
  background:linear-gradient(180deg,rgba(212,160,23,.7),rgba(212,160,23,.1));
}
.nav-item{position:relative;padding-left:22px;}
.nav-item::before{
  content:"";position:absolute;left:-3.5px;top:50%;transform:translateY(-50%);
  width:8px;height:8px;border-radius:50%;
  background:var(--color-deep);border:2px solid rgba(212,160,23,.65);z-index:1;
}
.nav-item:has(.nav-link[aria-current="page"])::before{
  background:var(--color-gold);border-color:var(--color-gold);
  box-shadow:0 0 0 4px rgba(212,160,23,.18);
}
.nav-link{
  display:block;padding:11px 14px;border-radius:13px;
  color:rgba(247,245,240,.72);font-weight:600;font-size:15px;line-height:1.4;
  text-decoration:none;transition:background .25s,color .25s;
}
.nav-link:hover{background:rgba(212,160,23,.10);color:var(--color-white);}
.nav-link[aria-current="page"]{
  background:linear-gradient(90deg,rgba(212,160,23,.18),rgba(212,160,23,.04));
  color:var(--color-gold);font-weight:800;
  box-shadow:inset 0 0 0 1px rgba(212,160,23,.25);
}
.nav-footer{display:flex;flex-direction:column;gap:14px;}
.nav-note{font-size:12px;line-height:1.6;color:rgba(247,245,240,.5);padding-left:6px;border-left:2px solid rgba(212,160,23,.5);}

/* ---------- 头部：桌面轨道 ---------- */
@media(min-width:1025px){
  .site-header{position:fixed;top:0;left:0;bottom:0;width:var(--header-w);z-index:300;overflow:hidden;}
  .header-inner{display:flex;flex-direction:column;height:100%;padding:34px 24px 26px 26px;}
  .site-nav{flex:1;display:flex;flex-direction:column;padding-top:54px;position:relative;}
  .nav-track{flex:1;display:flex;flex-direction:column;gap:6px;}
  .nav-footer{margin-top:auto;}
  .site-main,.site-footer{margin-left:var(--header-w);}
}

/* ---------- 头部：移动端抽屉 ---------- */
@media(max-width:1024px){
  .site-header{
    position:sticky;top:0;z-index:310;height:68px;padding:0 20px;
    display:flex;align-items:center;
  }
  .site-header::before{
    width:100%;height:4px;
    background:linear-gradient(90deg,var(--color-gold) 0 20%,var(--color-red) 20% 40%,var(--color-yellow) 40% 60%,var(--color-green) 60% 80%,var(--color-blue) 80% 100%);
  }
  .site-header::after{display:none;}
  .header-inner{display:flex;align-items:center;justify-content:space-between;gap:14px;width:100%;}
  .site-nav{
    position:fixed;inset:0;z-index:305;
    transform:translateX(-100%);visibility:hidden;
    transition:transform .38s var(--ease),visibility .38s;
    background:var(--color-deep);padding:96px 30px 40px;
    overflow-y:auto;display:flex;flex-direction:column;
  }
  .site-nav[data-open]{transform:translateX(0);visibility:visible;}
  .site-nav::after{
    content:"";position:absolute;left:0;right:0;bottom:0;height:180px;
    background:linear-gradient(160deg,transparent 45%,rgba(212,160,23,.12));
    clip-path:polygon(0 55%,100% 20%,100% 100%,0 100%);pointer-events:none;
  }
  .nav-track{display:flex;flex-direction:column;gap:8px;margin-bottom:36px;}
  .nav-footer{margin-top:auto;}
  .nav-toggle{display:inline-flex;}
  .nav-note{border-left:0;padding-left:0;}
}
@media(max-width:420px){.brand-tagline{display:none;}}

/* ---------- 页脚 ---------- */
.site-footer{
  position:relative;background:var(--color-deep-2);color:rgba(247,245,240,.78);
  overflow:hidden;padding:clamp(56px,7vw,88px) 0 28px;
}
.site-footer::before{
  content:"";position:absolute;top:-2px;left:0;right:0;height:48px;
  background:var(--color-deep-2);
  clip-path:polygon(0 100%,0 30%,14% 62%,24% 18%,38% 68%,52% 26%,64% 58%,78% 22%,90% 56%,100% 30%,100% 100%);
  pointer-events:none;
}
.site-footer::after{
  content:"";position:absolute;right:-160px;bottom:-160px;width:320px;height:320px;border-radius:50%;
  background:radial-gradient(circle,rgba(212,160,23,.14),transparent 70%);pointer-events:none;
}
.footer-inner{position:relative;z-index:1;}
.footer-grid{display:grid;grid-template-columns:1.6fr 1fr 1fr 1.4fr;gap:44px;}
.footer-logo{
  display:inline-flex;width:34px;height:34px;border-radius:10px;
  background:var(--color-deep);box-shadow:0 0 0 2px rgba(212,160,23,.5);
  position:relative;overflow:hidden;margin-bottom:14px;
}
.footer-logo-peak{
  position:absolute;left:50%;bottom:-2px;transform:translateX(-50%);
  width:72%;height:58%;background:var(--color-gold);
  clip-path:polygon(50% 0,100% 100%,0 100%);
}
.footer-brand-name{display:block;font-size:23px;font-weight:900;color:var(--color-white);letter-spacing:.06em;}
.footer-tagline{display:block;margin-top:2px;font-size:12px;font-weight:700;letter-spacing:.16em;color:var(--color-gold);}
.footer-desc{margin-top:16px;font-size:14px;color:rgba(247,245,240,.6);max-width:300px;}
.footer-heading{margin-bottom:18px;font-size:13px;font-weight:800;letter-spacing:.16em;color:var(--color-white);opacity:.8;}
.footer-list{display:flex;flex-direction:column;gap:10px;}
.footer-list a{color:rgba(247,245,240,.72);text-decoration:none;font-size:14px;transition:color .2s;}
.footer-list a:hover{color:var(--color-gold);}
.footer-contact .footer-contact-line{font-size:14px;color:rgba(247,245,240,.66);}
.footer-bottom{
  display:flex;flex-wrap:wrap;gap:10px 26px;align-items:center;justify-content:space-between;
  margin-top:56px;padding-top:22px;border-top:1px solid rgba(212,160,23,.22);
  font-size:13px;color:rgba(247,245,240,.55);
}
.footer-icp{letter-spacing:.08em;}
@media(max-width:980px){.footer-grid{grid-template-columns:1fr 1fr;gap:36px;}}
@media(max-width:620px){
  .footer-grid{grid-template-columns:1fr;gap:28px;}
  .footer-bottom{flex-direction:column;align-items:flex-start;}
}

/* ---------- 滚动显现 ---------- */
.js-ready [data-reveal]{
  opacity:0;transform:translateY(26px);
  transition:opacity .7s ease,transform .7s var(--ease);
  transition-delay:var(--reveal-delay,0s);
  will-change:opacity,transform;
}
.js-ready [data-reveal="left"]{transform:translateX(-36px);}
.js-ready [data-reveal="right"]{transform:translateX(36px);}
.js-ready [data-reveal="zoom"]{transform:scale(.94);}
.js-ready [data-reveal].is-visible{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;
  }
  .js-ready [data-reveal],
  .js-ready [data-reveal="left"],
  .js-ready [data-reveal="right"],
  .js-ready [data-reveal="zoom"]{
    opacity:1;transform:none;
  }
}