/* ============================================================
   SITE.CSS — 拉菲娱乐 GATE 中国站 共享样式
   堆叠面板 / 侧边轨道 / 编号章节 / 金色点缀
   ============================================================ */
:root{
  --c-bg:#0A0E27;
  --c-panel:#12153A;
  --c-rail:#1B1F4F;
  --c-gold:#D4AF37;
  --c-champagne:#F0D78C;
  --c-pink:#FF2A6D;
  --c-cyan:#05D9E8;
  --c-text:#EAE6FF;
  --c-muted:#8A8FB8;
  --c-line:#2A2E5A;
  --font-head:"Rajdhani","Noto Sans SC","PingFang SC",sans-serif;
  --font-body:"Source Serif Pro","Noto Serif SC","Songti SC",serif;
  --rail-w:284px;
  --header-h:64px;
  --container:1440px;
  --gold-grad:linear-gradient(135deg,#F0D78C 0%,#D4AF37 55%,#B8860B 100%);
  --gold-line:linear-gradient(90deg,transparent 0%,#D4AF37 30%,#FF2A6D 70%,transparent 100%);
  --shadow-sheet:0 18px 40px -18px rgba(0,0,0,.6);
  --shadow-deep:0 30px 60px -20px rgba(0,0,0,.55);
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0;}
html{scroll-behavior:smooth;}
body{
  min-height:100vh;
  background:
    radial-gradient(1200px 600px at 85% -10%,rgba(5,217,232,.08),transparent 60%),
    radial-gradient(900px 500px at -10% 30%,rgba(255,42,109,.07),transparent 55%),
    var(--c-bg);
  color:var(--c-text);
  font-family:var(--font-body);
  font-size:1rem;
  line-height:1.75;
  -webkit-font-smoothing:antialiased;
}
main{display:block;}
img,svg{display:block;max-width:100%;}
ul,ol{list-style:none;}
a{color:var(--c-gold);text-decoration:none;transition:color .2s ease;}
a:hover{color:var(--c-pink);}
button{font:inherit;color:inherit;}
h1,h2,h3,h4,h5,h6{font-family:var(--font-head);font-weight:700;line-height:1.15;letter-spacing:.02em;}
p{text-wrap:pretty;}
::selection{background:rgba(212,175,55,.35);color:var(--c-text);}
:focus-visible{outline:2px solid var(--c-cyan);outline-offset:3px;border-radius:2px;}

/* 布局与文字工具 */
.content-wrap{width:min(calc(100% - 3rem),var(--container));margin-inline:auto;}
.section-pad{padding-block:clamp(4rem,9vw,8rem);}
.split{display:grid;grid-template-columns:minmax(0,2fr) minmax(0,3fr);gap:clamp(1.5rem,4vw,4rem);align-items:center;}
@media(max-width:900px){.split{grid-template-columns:1fr;}}
.display-1{font-family:var(--font-head);font-size:clamp(2.4rem,6vw,5rem);font-weight:600;line-height:.95;letter-spacing:.01em;text-transform:uppercase;}
.eyebrow{font-family:var(--font-head);font-size:.72rem;letter-spacing:.35em;text-transform:uppercase;color:var(--c-gold);}
.text-gold{color:var(--c-gold);}
.text-pink{color:var(--c-pink);}
.text-cyan{color:var(--c-cyan);}
.text-champagne{color:var(--c-champagne);}
.text-muted{color:var(--c-muted);}
.hairline{height:1px;border:0;background:var(--gold-line);}

/* 网格 */
.grid{display:grid;gap:1.5rem;}
.grid--2{grid-template-columns:repeat(2,1fr);}
.grid--3{grid-template-columns:repeat(3,1fr);}
.grid--4{grid-template-columns:repeat(4,1fr);}
@media(max-width:900px){.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;gap:.55rem;
  font-family:var(--font-head);font-weight:700;font-size:.88rem;letter-spacing:.12em;
  padding:.85em 1.6em;cursor:pointer;border:1px solid var(--c-line);
  background:var(--c-panel);color:var(--c-text);
  clip-path:polygon(0 0,calc(100% - .8rem) 0,100% .8rem,100% 100%,.8rem 100%,0 calc(100% - .8rem));
  transition:background .25s ease,color .25s ease,border-color .25s ease,transform .25s ease;
}
.btn:hover{border-color:var(--c-gold);color:var(--c-champagne);transform:translateY(-2px);}
.btn--gold{background:var(--gold-grad);color:#12153A;border-color:transparent;font-weight:700;}
.btn--gold:hover{background:linear-gradient(135deg,#D4AF37,#B8860B);color:#0A0E27;}
.btn--ghost{background:transparent;border-color:rgba(212,175,55,.55);color:var(--c-gold);}
.btn--ghost:hover{background:rgba(212,175,55,.08);border-color:var(--c-pink);color:var(--c-pink);}
.btn--link{padding:.2em 0;background:transparent;border:0;border-bottom:1px solid rgba(255,42,109,0);clip-path:none;color:var(--c-gold);letter-spacing:.08em;}
.btn--link:hover{background:transparent;border-bottom-color:var(--c-pink);color:var(--c-pink);transform:none;}

/* 堆叠面板 */
.sheet{
  position:relative;
  background:linear-gradient(160deg,rgba(255,255,255,.02),transparent 30%),var(--c-panel);
  border:1px solid var(--c-line);
  box-shadow:var(--shadow-sheet);
}
.sheet--stack{
  box-shadow:
    6px 6px 0 -1px var(--c-rail),
    12px 12px 0 -2px rgba(27,31,79,.6),
    var(--shadow-sheet);
}
.sheet-tag{
  position:absolute;top:-1px;right:-1px;
  font-family:var(--font-head);font-size:.62rem;letter-spacing:.25em;text-transform:uppercase;
  background:var(--gold-grad);color:#12153A;padding:.5em 1em;
}

/* 编号章节 */
.chapter{
  position:relative;display:flex;flex-direction:column;gap:.35rem;
  padding:1.5rem 1.5rem 1.75rem;
  background:linear-gradient(160deg,rgba(255,255,255,.02),transparent 30%),var(--c-panel);
  border:1px solid var(--c-line);
  box-shadow:var(--shadow-sheet);
}
.chapter-index{
  font-family:var(--font-head);font-size:clamp(3rem,6vw,5.5rem);font-weight:600;line-height:.9;
  color:rgba(138,143,184,.35);
}
@supports((-webkit-text-stroke:1px rgba(138,143,184,.6))){
  .chapter-index{color:transparent;-webkit-text-stroke:1px rgba(138,143,184,.6);}
}
.chapter-kicker{font-family:var(--font-head);font-size:.66rem;letter-spacing:.4em;text-transform:uppercase;color:var(--c-gold);}
.chapter-title{font-family:var(--font-head);font-size:clamp(1.4rem,3vw,2.4rem);font-weight:700;letter-spacing:.03em;text-transform:uppercase;}

/* 信息卡 */
.card{
  position:relative;
  background:var(--c-panel);
  border:1px solid var(--c-line);
  padding:1.65rem;
  box-shadow:var(--shadow-sheet);
  transition:border-color .25s ease,transform .25s ease;
}
.card:hover{border-color:var(--c-cyan);transform:translateY(-3px);}
.card--glint::after{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(120deg,transparent 30%,rgba(5,217,232,.07) 50%,transparent 70%);
}
.card-index{font-family:var(--font-head);font-size:.66rem;letter-spacing:.3em;color:var(--c-gold);text-transform:uppercase;}
.card-title{font-family:var(--font-head);font-size:1.15rem;font-weight:700;margin:.6rem 0 .45rem;}
.card-text{font-size:.9rem;color:var(--c-muted);line-height:1.85;}

/* 图片容器基础 */
.media{
  position:relative;overflow:hidden;min-height:220px;border:1px solid var(--c-line);
  background:
    radial-gradient(140% 120% at 20% 10%,rgba(5,217,232,.18),transparent 50%),
    linear-gradient(145deg,#1B1F4F,#0A0E27);
}
.media::after{
  content:"GATE · IMAGE";position:absolute;bottom:.75rem;left:.75rem;
  font-family:var(--font-head);font-size:.58rem;letter-spacing:.32em;color:var(--c-champagne);opacity:.85;
}
.media--16x9{aspect-ratio:16/9;}
.media--4x3{aspect-ratio:4/3;}
.media--wide{aspect-ratio:21/9;}
.media--cover{background-size:cover;background-position:center;}

/* 面包屑 */
.breadcrumbs{display:flex;flex-wrap:wrap;gap:.5rem;align-items:center;font-size:.8rem;color:var(--c-muted);}
.breadcrumbs li{display:flex;align-items:center;gap:.5rem;}
.breadcrumbs li+li::before{content:"/";color:var(--c-line);}
.breadcrumbs a{color:var(--c-gold);}
.breadcrumbs a:hover{color:var(--c-pink);}

/* 数据表 */
.data-table{width:100%;border-collapse:collapse;font-size:.88rem;}
.data-table th{
  font-family:var(--font-head);text-align:left;font-size:.7rem;letter-spacing:.16em;text-transform:uppercase;
  color:var(--c-champagne);padding:.85rem 1rem;border-bottom:1px solid var(--c-gold);
  background:rgba(212,175,55,.05);
}
.data-table td{padding:.85rem 1rem;border-bottom:1px solid var(--c-line);color:var(--c-text);}
.data-table tr:last-child td{border-bottom:0;}

/* ============ 头部 ============ */
.skip-link{
  position:fixed;top:-100px;left:1rem;z-index:200;
  padding:.8em 1.4em;background:var(--c-gold);color:#0A0E27;
  font-family:var(--font-head);font-weight:700;letter-spacing:.12em;
  transition:top .2s ease;
}
.skip-link:focus{top:1rem;}

.scroll-progress{
  position:fixed;top:0;left:0;z-index:190;height:2px;width:0;
  background:linear-gradient(90deg,var(--c-gold),var(--c-pink),var(--c-cyan));
  pointer-events:none;
}

.topbar{
  position:sticky;top:0;z-index:120;
  display:flex;align-items:center;gap:1.25rem;
  margin-left:var(--rail-w);
  height:var(--header-h);
  padding:0 2rem;
  background:rgba(10,14,39,.86);
  -webkit-backdrop-filter:blur(10px);
  backdrop-filter:blur(10px);
  border-bottom:1px solid var(--c-line);
}
.topbar::before{
  content:"";position:absolute;top:0;left:0;right:0;height:1px;background:var(--gold-line);
}
.topbar-note{
  display:flex;align-items:center;gap:.55rem;margin-right:auto;
  font-family:var(--font-head);font-size:.7rem;letter-spacing:.3em;text-transform:uppercase;color:var(--c-muted);
}
.topbar-dot{width:.4rem;height:.4rem;background:var(--c-cyan);transform:rotate(45deg);flex:none;}

.season-chip{
  display:inline-flex;align-items:center;gap:.55rem;
  font-family:var(--font-head);font-size:.7rem;letter-spacing:.14em;color:var(--c-champagne);
  border:1px solid rgba(212,175,55,.5);background:rgba(212,175,55,.08);
  padding:.4em 1em;
  clip-path:polygon(0 0,calc(100% - .6rem) 0,100% .6rem,100% 100%,.6rem 100%,0 calc(100% - .6rem));
}
.season-pulse{width:.48rem;height:.48rem;border-radius:50%;background:var(--c-gold);box-shadow:0 0 0 0 rgba(212,175,55,.55);animation:seasonPulse 2.4s infinite;}
@keyframes seasonPulse{
  0%{box-shadow:0 0 0 0 rgba(212,175,55,.55);}
  70%{box-shadow:0 0 0 .6rem rgba(212,175,55,0);}
  100%{box-shadow:0 0 0 0 rgba(212,175,55,0);}
}

.nav-toggle{display:none;}

.side-rail{
  position:fixed;inset:0 auto 0 0;z-index:150;width:var(--rail-w);
  display:flex;flex-direction:column;
  padding:2.2rem 1.5rem;
  background:linear-gradient(165deg,rgba(255,255,255,.02),transparent 30%),var(--c-rail);
  border-right:1px solid var(--c-line);
  box-shadow:2px 0 30px rgba(0,0,0,.4);
}
.side-rail::before{
  content:"";position:absolute;top:0;left:0;bottom:0;width:3px;
  background:linear-gradient(180deg,var(--c-gold),var(--c-pink) 60%,transparent);
}
.rail-head{padding-bottom:2rem;border-bottom:1px solid var(--c-line);}
.brand{display:inline-flex;align-items:center;gap:.7rem;}
.brand-mark{font-family:var(--font-head);font-size:1.5rem;font-weight:700;letter-spacing:.08em;color:var(--c-text);transition:color .2s ease;}
.brand:hover .brand-mark{color:var(--c-champagne);}
.gate-tag{
  font-family:var(--font-head);font-size:.56rem;font-weight:600;letter-spacing:.34em;color:var(--c-gold);
  border:1px solid rgba(212,175,55,.65);background:rgba(212,175,55,.06);
  padding:.35em .65em .35em .95em;
}
.rail-sub{margin-top:.75rem;font-family:var(--font-head);font-size:.62rem;letter-spacing:.24em;text-transform:uppercase;color:var(--c-muted);}

.site-nav{margin-top:2rem;flex:1 0 auto;}
.nav-list{display:flex;flex-direction:column;gap:.15rem;}
.nav-link{
  display:flex;align-items:baseline;gap:1rem;padding:.75rem .9rem;
  font-family:var(--font-head);font-size:1.02rem;font-weight:600;letter-spacing:.06em;color:var(--c-text);
  border-left:2px solid transparent;
  transition:background .2s ease,color .2s ease,border-color .2s ease,padding-left .2s ease;
}
.nav-link:hover{color:var(--c-champagne);background:rgba(212,175,55,.06);border-left-color:var(--c-gold);padding-left:1.2rem;}
.nav-link[aria-current="page"]{background:rgba(212,175,55,.12);border-left-color:var(--c-gold);color:var(--c-gold);}
.nav-link[aria-current="page"] .nav-index{color:var(--c-gold);}
.nav-index{font-family:var(--font-head);font-size:.66rem;color:var(--c-muted);letter-spacing:.1em;}
.nav-label{font-weight:600;}

.rail-console{
  margin-top:2rem;padding:1.1rem 1.1rem 1rem;
  border:1px solid rgba(5,217,232,.22);background:rgba(5,217,232,.05);
}
.console-head{
  font-family:var(--font-head);font-size:.66rem;letter-spacing:.3em;color:var(--c-cyan);text-transform:uppercase;
  padding-bottom:.65rem;margin-bottom:.6rem;border-bottom:1px solid rgba(5,217,232,.2);
}
.console-list{margin:0;}
.console-row{display:flex;justify-content:space-between;gap:1rem;padding:.32rem 0;font-family:var(--font-head);font-size:.72rem;}
.console-row dt{color:var(--c-muted);}
.console-row dd{color:var(--c-champagne);font-weight:600;text-align:right;}

.nav-overlay{display:none;}

@media(min-width:1180px){
  .topbar-brand{display:none;}
  #main-content{margin-left:var(--rail-w);}
  .site-footer{margin-left:var(--rail-w);}
}

@media(max-width:1179px){
  .topbar{margin-left:0;padding:0 4.5rem 0 1.25rem;}
  .topbar-brand{
    display:inline-flex;align-items:center;gap:.45rem;margin-right:auto;
    color:var(--c-text);letter-spacing:.05em;
  }
  .topbar-brand .brand-mark{font-size:1.05rem;}
  .topbar-brand .gate-tag{font-size:.46rem;letter-spacing:.24em;padding:.25em .5em .25em .7em;}
  .topbar-note{display:none;}
  .nav-toggle{
    position:fixed;top:.7rem;right:1rem;z-index:170;
    display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.3rem;
    width:2.9rem;height:2.9rem;background:rgba(10,14,39,.9);border:1px solid var(--c-line);cursor:pointer;
  }
  .nav-toggle-box{position:relative;width:1.45rem;height:.85rem;display:block;}
  .nav-toggle-bar{position:absolute;left:0;width:100%;height:2px;background:var(--c-gold);transition:top .25s ease,transform .25s ease,opacity .2s ease;}
  .nav-toggle-bar:nth-child(1){top:0;}
  .nav-toggle-bar:nth-child(2){top:calc(50% - 1px);}
  .nav-toggle-bar:nth-child(3){top:calc(100% - 2px);}
  .nav-toggle[aria-expanded="true"] .nav-toggle-bar:nth-child(1){top:calc(50% - 1px);transform:rotate(45deg);}
  .nav-toggle[aria-expanded="true"] .nav-toggle-bar:nth-child(2){opacity:0;}
  .nav-toggle[aria-expanded="true"] .nav-toggle-bar:nth-child(3){top:calc(50% - 1px);transform:rotate(-45deg);}
  .nav-toggle-label{font-family:var(--font-head);font-size:.52rem;letter-spacing:.22em;color:var(--c-muted);}
  .side-rail{transform:translateX(-105%);visibility:hidden;transition:transform .32s ease,visibility .32s ease;}
  .side-rail[data-open]{transform:none;visibility:visible;box-shadow:24px 0 60px rgba(0,0,0,.45);}
  .nav-overlay{
    display:block;position:fixed;inset:0;z-index:140;
    background:rgba(5,7,20,.62);opacity:0;visibility:hidden;transition:opacity .3s ease,visibility .3s ease;
  }
  .nav-overlay[data-open]{opacity:1;visibility:visible;}
}
@media(max-width:420px){
  .season-chip{display:none;}
}

/* ============ 页脚 ============ */
.site-footer{
  position:relative;
  margin-top:clamp(4rem,8vw,7rem);
  background:
    radial-gradient(800px 300px at 90% 0%,rgba(212,175,55,.07),transparent 60%),
    linear-gradient(180deg,#0A0E27,#0B0E2B);
  border-top:1px solid var(--c-line);
  padding:clamp(3rem,7vw,5.5rem) 0 1.5rem;
}
.site-footer::before{
  content:"";position:absolute;top:-1px;left:0;right:0;height:1px;
  background:linear-gradient(90deg,var(--c-gold),transparent 50%,var(--c-pink));
}
.footer-grid{
  width:min(calc(100% - 4rem),1240px);margin-inline:auto;
  display:grid;grid-template-columns:1.4fr 1fr 1fr 1.2fr;gap:2.5rem;
}
.footer-brand .brand-mark--footer{font-size:1.35rem;}
.footer-note{margin-top:1rem;max-width:34ch;font-size:.88rem;line-height:1.85;color:var(--c-muted);}
.footer-title{
  font-family:var(--font-head);font-size:.7rem;letter-spacing:.28em;text-transform:uppercase;color:var(--c-champagne);
  margin-bottom:1.1rem;padding-bottom:.6rem;border-bottom:1px solid var(--c-line);position:relative;
}
.footer-title::after{content:"";position:absolute;left:0;bottom:-1px;width:2.2rem;height:1px;background:var(--c-gold);}
.footer-list{display:flex;flex-direction:column;gap:.55rem;}
.footer-link{color:var(--c-muted);font-size:.88rem;transition:color .2s ease,padding-left .2s ease;}
.footer-link:hover{color:var(--c-pink);padding-left:.35rem;}
.contact-item{display:flex;gap:.75rem;align-items:baseline;}
.contact-label{display:inline-block;min-width:3.2em;font-family:var(--font-head);font-size:.66rem;letter-spacing:.18em;color:var(--c-gold);}
.contact-value{color:var(--c-muted);font-size:.88rem;}
.footer-bottom{
  width:min(calc(100% - 4rem),1240px);margin:3rem auto 0;
  display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:1rem;
  padding-top:1.25rem;border-top:1px solid rgba(42,46,90,.7);
}
.footer-copy{font-family:var(--font-head);font-size:.76rem;letter-spacing:.1em;color:var(--c-muted);}
.footer-icp{font-family:var(--font-head);font-size:.7rem;letter-spacing:.16em;color:var(--c-muted);}
.footer-icp::before{content:"◆ ";color:var(--c-gold);}
.footer-trust{
  width:min(calc(100% - 4rem),1240px);margin:2rem auto 0;
  font-size:.76rem;line-height:1.95;color:var(--c-muted);text-align:center;
  border:1px dashed var(--c-line);background:rgba(255,255,255,.015);padding:1rem 1.2rem;
}
.footer-trust::before{content:"GATE · ";color:var(--c-gold);font-family:var(--font-head);letter-spacing:.2em;}
.back-top{
  position:fixed;right:1.5rem;bottom:1.5rem;z-index:90;
  width:3rem;height:3rem;display:flex;align-items:center;justify-content:center;
  border:1px solid rgba(212,175,55,.6);background:rgba(10,14,39,.9);color:var(--c-gold);
  font-size:1.1rem;cursor:pointer;
  clip-path:polygon(0 0,100% 0,100% calc(100% - .5rem),calc(100% - .5rem) 100%,0 100%);
  opacity:0;visibility:hidden;transform:translateY(.5rem);transition:opacity .25s ease,transform .25s ease,background .25s ease,color .25s ease,visibility .25s ease;
}
.back-top.visible{opacity:1;visibility:visible;transform:none;}
.back-top:hover{background:var(--c-gold);color:#0A0E27;}
@media(max-width:1020px){.footer-grid{grid-template-columns:1fr 1fr;}}
@media(max-width:640px){
  .content-wrap{width:min(calc(100% - 2rem),var(--container));}
  .footer-grid{grid-template-columns:1fr;gap:2rem;}
  .footer-bottom{flex-direction:column;align-items:flex-start;}
  .footer-trust{text-align:left;}
  .back-top{right:1rem;bottom:1rem;width:2.7rem;height:2.7rem;}
}

/* 动效与辅助 */
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto;}
  *,*::before,*::after{animation:none !important;transition:none !important;}
}
