/* ============================================================
   胜博中心 · /assets/site.css
   共享外壳：reset、变量、中文排版、头部、页脚、通用组件
   ============================================================ */

/* ---------- 1. reset ---------- */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body,h1,h2,h3,h4,h5,h6,p,ul,ol,li,figure,blockquote,dl,dd,address{margin:0;padding:0}
ul,ol{list-style:none}
img,svg,video{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
button,input,select,textarea{font:inherit;color:inherit}
button{background:none;border:0;padding:0;cursor:pointer}
address{font-style:normal}
:focus-visible{outline:2px solid #C8912B;outline-offset:3px}

/* ---------- 2. 变量 ---------- */
:root{
  --sb-red:#9E2B25;
  --sb-red-deep:#6B1A18;
  --sb-gold:#C8912B;
  --sb-gold-soft:#E9D3A0;
  --sb-gold-ink:#8A6A1F;
  --sb-indigo:#16233F;
  --sb-indigo-mid:#2C4270;
  --sb-cream:#F6F0E4;
  --sb-cream-deep:#E6DAC6;
  --sb-green:#4C7A4A;
  --sb-ink:#221E1B;

  --sb-font:"Noto Sans SC","PingFang SC","Hiragino Sans GB","Microsoft YaHei",system-ui,-apple-system,"Segoe UI",sans-serif;
  --sb-font-num:"Barlow Condensed","Noto Sans SC",system-ui,sans-serif;

  --sb-head-h:64px;
  --sb-shell:1240px;
  --sb-gutter:clamp(16px,4vw,40px);
  --sb-notch:14px;
  --sb-ease:cubic-bezier(.22,.61,.36,1);
}

/* ---------- 3. 基础排版 ---------- */
body{
  font-family:var(--sb-font);
  font-size:17px;
  line-height:1.75;
  color:var(--sb-ink);
  background:var(--sb-cream);
  -webkit-font-smoothing:antialiased;
  min-height:100vh;
  display:flex;
  flex-direction:column;
}
#main-content{flex:1 1 auto;padding-top:var(--sb-head-h)}
h1,h2,h3,h4{font-weight:900;letter-spacing:-.02em;line-height:1.12}
h1{font-size:clamp(34px,6.5vw,62px)}
h2{font-size:clamp(24px,3.4vw,36px)}
h3{font-size:clamp(19px,2.3vw,24px)}
h4{font-size:18px;letter-spacing:-.01em}

.sb-container{width:100%;max-width:var(--sb-shell);margin-inline:auto;padding-inline:var(--sb-gutter)}
.sb-sr-only{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}

.sb-section{padding-block:clamp(48px,7vw,96px)}
.sb-section--tight{padding-block:clamp(28px,4vw,56px)}

.sb-display{font-size:clamp(34px,6.5vw,62px);font-weight:900;letter-spacing:-.02em;line-height:1.12}
.sb-eyebrow{display:inline-flex;align-items:center;gap:9px;font-size:13px;font-weight:700;letter-spacing:.16em;color:var(--sb-red)}
.sb-eyebrow::before{content:"";width:22px;height:3px;background:var(--sb-gold)}
.sb-lead{font-size:clamp(17px,1.5vw,19px);line-height:1.78;color:rgba(34,30,27,.8);max-width:32em}

.sb-prose{max-width:40em}
.sb-prose > * + *{margin-top:1.1em}
.sb-prose h2{margin-top:1.9em;padding-bottom:.35em;border-bottom:3px solid var(--sb-gold-soft)}
.sb-prose h3{margin-top:1.6em}
.sb-prose ul{padding-left:0}
.sb-prose ul li{position:relative;padding-left:22px;margin-top:.62em}
.sb-prose ul li::before{content:"";position:absolute;left:0;top:.72em;width:9px;height:9px;background:var(--sb-gold);transform:rotate(45deg)}
.sb-prose blockquote{margin-top:1.4em;padding:18px 22px;border-left:5px solid var(--sb-red);background:var(--sb-cream-deep);font-weight:500}
.sb-prose a{border-bottom:2px solid var(--sb-gold-soft);font-weight:500}
.sb-prose a:hover{border-bottom-color:var(--sb-gold)}

/* 面包屑 */
.sb-breadcrumb{font-size:13.5px;letter-spacing:.02em;color:rgba(34,30,27,.55)}
.sb-breadcrumb ol{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.sb-breadcrumb li{display:flex;align-items:center;gap:8px}
.sb-breadcrumb li + li::before{content:"／";color:var(--sb-gold);font-weight:700}
.sb-breadcrumb a:hover{color:var(--sb-red)}

/* ---------- 4. 按钮 ---------- */
.sb-btn{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  padding:11px 20px;
  font-size:14.5px;font-weight:700;letter-spacing:.01em;line-height:1.2;
  white-space:nowrap;cursor:pointer;border:1px solid transparent;
  clip-path:polygon(0 0,100% 0,100% calc(100% - 11px),calc(100% - 11px) 100%,0 100%);
  transition:background-color .18s var(--sb-ease),color .18s var(--sb-ease),border-color .18s var(--sb-ease);
}
.sb-btn:active{transform:translateY(1px)}
.sb-btn:focus-visible{outline:0;box-shadow:inset 0 0 0 2px var(--sb-indigo),inset 0 0 0 4px var(--sb-gold-soft)}
.sb-btn--gold{background:var(--sb-gold);color:var(--sb-indigo)}
.sb-btn--gold:hover{background:var(--sb-gold-soft)}
.sb-btn--gold:active{background:#a9761f}
.sb-btn--red{background:var(--sb-red);color:var(--sb-cream)}
.sb-btn--red:hover{background:var(--sb-red-deep)}
.sb-btn--ink{background:var(--sb-indigo);color:var(--sb-cream)}
.sb-btn--ink:hover{background:var(--sb-indigo-mid)}
.sb-btn--ghost{background:transparent;border-color:rgba(246,240,228,.42);color:var(--sb-cream)}
.sb-btn--ghost:hover{background:rgba(246,240,228,.14);border-color:var(--sb-gold)}

/* ---------- 5. 头部 ---------- */
.sb-header{
  position:fixed;top:0;left:0;right:0;z-index:120;
  background:rgba(158,43,37,.86);
  color:var(--sb-cream);
  -webkit-backdrop-filter:saturate(1.1) blur(8px);
  backdrop-filter:saturate(1.1) blur(8px);
  transition:background-color .24s ease-out,-webkit-backdrop-filter .24s ease-out,backdrop-filter .24s ease-out;
}
.sb-header[data-solid]{background:#16233F;-webkit-backdrop-filter:none;backdrop-filter:none}
.sb-header__bar{display:flex;min-height:var(--sb-head-h);transition:min-height .24s ease-out}
.sb-header[data-solid] .sb-header__bar{min-height:52px}
.sb-header__inner{
  display:flex;align-items:center;gap:clamp(12px,2.2vw,30px);
  flex:1 1 auto;width:100%;max-width:var(--sb-shell);
  margin-inline:auto;padding-inline:var(--sb-gutter);
}
.sb-header__stripe{
  position:absolute;left:0;right:0;bottom:0;height:3px;pointer-events:none;
  background:linear-gradient(90deg,var(--sb-gold) 0 22%,var(--sb-red) 22% 48%,var(--sb-gold-soft) 48% 64%,var(--sb-green) 64% 100%);
}
.sb-progress{
  position:absolute;left:0;top:100%;height:3px;width:100%;
  background:linear-gradient(90deg,var(--sb-red),var(--sb-gold));
  transform:scaleX(0);transform-origin:0 50%;
  transition:transform .12s linear;pointer-events:none;z-index:2;
}

.sb-skip{
  position:absolute;left:12px;top:-80px;z-index:999;
  padding:11px 20px;font-size:14px;font-weight:700;
  background:var(--sb-gold-soft);color:var(--sb-indigo);
  clip-path:polygon(0 0,100% 0,100% calc(100% - 10px),calc(100% - 10px) 100%,0 100%);
  transition:top .18s var(--sb-ease);
}
.sb-skip:focus{top:12px;outline:none}

.sb-brand{display:flex;align-items:center;gap:10px;flex:0 0 auto}
.sb-brand__mark{
  width:36px;height:36px;display:grid;place-items:center;flex:0 0 auto;
  background:var(--sb-gold);color:var(--sb-indigo);
  font-size:18px;font-weight:900;line-height:1;
  clip-path:polygon(0 0,100% 0,100% calc(100% - 9px),calc(100% - 9px) 100%,0 100%);
}
.sb-brand__text{display:flex;flex-direction:column;line-height:1.2}
.sb-brand__name{font-size:17px;font-weight:900;letter-spacing:-.01em}
.sb-brand__sub{font-size:11.5px;font-weight:500;letter-spacing:.08em;color:rgba(246,240,228,.72)}

.sb-burger{
  display:none;align-items:center;gap:9px;flex:0 0 auto;
  padding:8px 13px;font-size:13.5px;font-weight:700;letter-spacing:.06em;
  color:var(--sb-cream);border:1px solid rgba(246,240,228,.36);
  clip-path:polygon(0 0,100% 0,100% calc(100% - 9px),calc(100% - 9px) 100%,0 100%);
}
.sb-burger:focus-visible{outline:0;box-shadow:inset 0 0 0 2px var(--sb-gold-soft)}
.sb-burger__bars{position:relative;width:18px;height:12px;flex:0 0 auto}
.sb-burger__bars::before,
.sb-burger__bars::after{
  content:"";position:absolute;left:0;right:0;height:2px;background:var(--sb-gold);
  transition:transform .2s var(--sb-ease),top .2s var(--sb-ease),bottom .2s var(--sb-ease);
}
.sb-burger__bars::before{top:0}
.sb-burger__bars::after{bottom:0}
.sb-header[data-open] .sb-burger__bars::before{top:5px;transform:rotate(45deg)}
.sb-header[data-open] .sb-burger__bars::after{bottom:5px;transform:rotate(-45deg)}

.sb-nav__list{display:flex;flex-direction:column}
.sb-nav__link{
  position:relative;display:block;
  padding:14px 2px;font-size:15px;font-weight:500;letter-spacing:.01em;
  color:rgba(246,240,228,.86);white-space:nowrap;
  border-bottom:1px solid rgba(246,240,228,.12);
  transition:color .18s var(--sb-ease);
}
.sb-nav__link::after{
  content:"";position:absolute;left:0;bottom:8px;width:26px;height:3px;
  background:var(--sb-gold);transform:scaleX(0);transform-origin:left;
  transition:transform .22s var(--sb-ease);
}
.sb-nav__link:hover{color:var(--sb-cream)}
.sb-nav__link:hover::after{transform:scaleX(1)}
.sb-nav__link[aria-current="page"]{color:var(--sb-cream);font-weight:700}
.sb-nav__link[aria-current="page"]::after{transform:scaleX(1)}

.sb-nav__drawer{display:flex;flex-direction:column;gap:10px;margin-top:20px}
.sb-nav__drawer .sb-btn{width:100%}

.sb-header__actions{display:none;align-items:center;gap:10px;flex:0 0 auto}

/* 移动抽屉 */
@media (max-width:1023px){
  .sb-burger{display:inline-flex}
  .sb-header[data-open]{background:var(--sb-indigo)}
  .sb-nav{
    position:absolute;left:0;right:0;top:100%;
    background:var(--sb-indigo);
    border-top:1px solid rgba(200,145,43,.4);
    padding:16px var(--sb-gutter) 26px;
    max-height:calc(100vh - 70px);overflow-y:auto;
    visibility:hidden;opacity:0;transform:translateY(-10px);
    transition:opacity .2s var(--sb-ease),transform .2s var(--sb-ease),visibility .2s var(--sb-ease);
    clip-path:polygon(0 0,100% 0,100% calc(100% - 18px),calc(100% - 18px) 100%,0 100%);
  }
  .sb-header[data-open] .sb-nav{visibility:visible;opacity:1;transform:translateY(0)}
  body.sb-nav-open{overflow:hidden}
}

/* 桌面导航 */
@media (min-width:1024px){
  .sb-burger{display:none}
  .sb-header__actions{display:flex}
  .sb-nav{
    position:static;flex:1 1 auto;display:flex;justify-content:center;
    visibility:visible;opacity:1;transform:none;
    background:none;border-top:0;padding:0;max-height:none;overflow:visible;
    clip-path:none;
  }
  .sb-nav__list{flex-direction:row;align-items:center;gap:clamp(2px,1.2vw,14px)}
  .sb-nav__link{padding:9px 10px;border-bottom:0}
  .sb-nav__link::after{left:10px;right:10px;bottom:3px;width:auto}
  .sb-nav__drawer{display:none}
}

/* ---------- 6. 页脚 ---------- */
.sb-footer{position:relative;background:var(--sb-indigo);color:var(--sb-cream)}
.sb-footer__stripe{
  height:6px;
  background:linear-gradient(102deg,
    var(--sb-red) 0 28%,
    var(--sb-gold) 28% 52%,
    var(--sb-gold-soft) 52% 66%,
    var(--sb-green) 66% 82%,
    var(--sb-indigo-mid) 82% 100%);
}
.sb-footer__inner{
  display:grid;grid-template-columns:1fr;gap:clamp(28px,4vw,48px);
  padding-block:clamp(40px,6vw,72px);
}
.sb-footer__brand{display:flex;flex-direction:column;gap:14px}
.sb-footer__logo{display:inline-flex;align-items:center;gap:10px}
.sb-footer__mark{
  width:34px;height:34px;display:grid;place-items:center;flex:0 0 auto;
  background:var(--sb-red);color:var(--sb-gold-soft);
  font-size:17px;font-weight:900;line-height:1;
  clip-path:polygon(0 0,100% 0,100% calc(100% - 9px),calc(100% - 9px) 100%,0 100%);
}
.sb-footer__name{font-size:19px;font-weight:900;letter-spacing:-.01em}
.sb-footer__line{font-size:15px;line-height:1.75;color:rgba(246,240,228,.74);max-width:24em}
.sb-footer__domain{font-family:var(--sb-font-num);font-size:16px;letter-spacing:.06em;color:var(--sb-gold)}
.sb-footer__col{display:flex;flex-direction:column}
.sb-footer__col-title{
  font-size:13px;font-weight:700;letter-spacing:.14em;color:var(--sb-gold);
  padding-bottom:12px;margin-bottom:14px;
  border-bottom:1px solid rgba(200,145,43,.32);
}
.sb-footer__links{display:grid;gap:11px}
.sb-footer__link{font-size:15px;color:rgba(246,240,228,.78);transition:color .18s var(--sb-ease)}
.sb-footer__link:hover{color:var(--sb-gold)}
.sb-footer__link[aria-current="page"]{color:var(--sb-gold-soft);font-weight:700}
.sb-footer__contact{display:flex;flex-direction:column}
.sb-footer__address{display:grid;gap:9px;margin-bottom:14px}
.sb-footer__contact-line{font-size:15px;line-height:1.6;color:rgba(246,240,228,.86);word-break:break-word}
.sb-footer__contact-line:first-child{font-family:var(--sb-font-num);font-size:17px;letter-spacing:.04em;color:var(--sb-cream)}
.sb-footer__note{font-size:13px;line-height:1.7;color:rgba(246,240,228,.56);max-width:26em}
.sb-footer__base{
  display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;
  gap:10px 24px;padding-block:18px 26px;
  border-top:1px solid rgba(246,240,228,.14);
}
.sb-footer__legal{font-size:13px;letter-spacing:.02em;color:rgba(246,240,228,.6)}

@media (min-width:640px){
  .sb-footer__inner{grid-template-columns:repeat(2,minmax(0,1fr))}
  .sb-footer__brand{grid-column:1 / -1}
}
@media (min-width:1024px){
  .sb-footer__inner{
    grid-template-columns:minmax(0,1.5fr) minmax(0,.9fr) minmax(0,.9fr) minmax(0,1.25fr);
  }
  .sb-footer__brand{grid-column:auto}
}

/* ---------- 7. 分屏与索引 ---------- */
.sb-split{display:grid;grid-template-columns:1fr;gap:clamp(24px,3.4vw,52px)}
.sb-split__aside{min-width:0}
.sb-split__main{min-width:0}
@media (min-width:900px){
  .sb-split{grid-template-columns:32% minmax(0,1fr)}
  .sb-split__aside{position:sticky;top:calc(var(--sb-head-h) + 26px);align-self:start}
}
.sb-index{display:flex;flex-direction:row;gap:8px;overflow-x:auto;scrollbar-width:thin;padding-bottom:4px}
.sb-index__link{
  flex:0 0 auto;display:block;padding:9px 14px;
  font-size:14px;font-weight:500;letter-spacing:.01em;white-space:nowrap;
  color:rgba(34,30,27,.62);
  border:1px solid rgba(158,43,37,.22);
  transition:color .18s var(--sb-ease),border-color .18s var(--sb-ease),background-color .18s var(--sb-ease);
}
.sb-index__link:hover{color:var(--sb-red);border-color:var(--sb-red)}
.sb-index__link[data-active="true"]{
  color:var(--sb-cream);background:var(--sb-red);border-color:var(--sb-red);font-weight:700;
}
@media (min-width:900px){
  .sb-index{flex-direction:column;gap:0;overflow:visible;padding-bottom:0;border-left:2px solid rgba(158,43,37,.16)}
  .sb-index__link{
    border:0;border-left:3px solid transparent;margin-left:-2px;padding:10px 16px;
    white-space:normal;line-height:1.55;
  }
  .sb-index__link:hover{border-left-color:var(--sb-gold)}
  .sb-index__link[data-active="true"]{
    background:transparent;color:var(--sb-red);border-left-color:var(--sb-red);
  }
}

/* ---------- 8. 面板、编号、标签、色带 ---------- */
.sb-panel{
  position:relative;
  padding:clamp(20px,2.6vw,30px);
  background:var(--sb-cream);
  border:1px solid var(--sb-cream-deep);
  clip-path:polygon(0 0,100% 0,100% calc(100% - var(--sb-notch)),calc(100% - var(--sb-notch)) 100%,0 100%);
}
.sb-panel--indigo{background:var(--sb-indigo);color:var(--sb-cream);border-color:transparent}
.sb-panel--red{background:var(--sb-red);color:var(--sb-cream);border-color:transparent}
.sb-panel--gold{background:var(--sb-gold-soft);border-color:var(--sb-gold)}
.sb-panel--outline{background:transparent;border-color:rgba(158,43,37,.28)}

.sb-num{
  display:inline-grid;place-items:center;
  min-width:34px;height:34px;padding:0 8px;
  font-family:var(--sb-font-num);font-size:22px;font-weight:700;line-height:1;
  background:var(--sb-gold-soft);color:var(--sb-gold-ink);
  clip-path:polygon(0 0,100% 0,100% calc(100% - 8px),calc(100% - 8px) 100%,0 100%);
}
.sb-chip{
  display:inline-block;padding:6px 13px;
  font-size:13.5px;font-weight:500;letter-spacing:.01em;line-height:1.4;
  background:var(--sb-cream-deep);color:var(--sb-ink);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%;
  clip-path:polygon(0 0,100% 0,100% calc(100% - 7px),calc(100% - 7px) 100%,0 100%);
  transition:background-color .18s var(--sb-ease),color .18s var(--sb-ease);
}
.sb-chip:hover{background:var(--sb-gold-soft)}
.sb-chip[aria-selected="true"]{background:var(--sb-gold);color:var(--sb-indigo);font-weight:700}

.sb-band{
  height:6px;
  background:linear-gradient(100deg,
    var(--sb-red) 0 30%,
    var(--sb-gold) 30% 58%,
    var(--sb-gold-soft) 58% 74%,
    var(--sb-green) 74% 100%);
}

.sb-grid{display:grid;gap:clamp(16px,2.2vw,26px)}
.sb-grid--2{grid-template-columns:repeat(auto-fit,minmax(min(260px,100%),1fr))}

/* ---------- 9. 图片容器（页面阶段放 img） ---------- */
.sb-media{
  position:relative;display:block;overflow:hidden;width:100%;
  aspect-ratio:4/5;
  background:linear-gradient(140deg,var(--sb-indigo) 0%,var(--sb-indigo-mid) 48%,var(--sb-red) 100%);
  clip-path:polygon(0 0,100% 0,100% calc(100% - var(--sb-notch)),calc(100% - var(--sb-notch)) 100%,0 100%);
}
.sb-media--tall{aspect-ratio:3/4}
.sb-media--square{aspect-ratio:1/1}
.sb-media--wide{aspect-ratio:16/9}
.sb-media > img{width:100%;height:100%;object-fit:cover}
.sb-media__caption{
  position:absolute;left:0;right:0;bottom:0;
  padding:14px 16px;font-size:13px;line-height:1.5;color:var(--sb-cream);
  background:linear-gradient(to top,rgba(22,35,63,.88),rgba(22,35,63,0));
}

/* ---------- 10. 折叠问答 ---------- */
.sb-accordion{display:grid;gap:10px}
.sb-accordion__item{
  background:var(--sb-cream);
  border:1px solid rgba(34,30,27,.14);
  border-left:5px solid var(--sb-gold-soft);
  transition:border-color .22s var(--sb-ease);
}
.sb-accordion__item[data-open="true"]{border-left-color:var(--sb-red)}
.sb-accordion__trigger{
  display:flex;align-items:center;gap:16px;width:100%;text-align:left;
  padding:16px clamp(14px,2vw,22px);color:var(--sb-ink);
}
.sb-accordion__trigger:focus-visible{outline:0;box-shadow:inset 0 0 0 2px var(--sb-gold)}
.sb-accordion__index{
  flex:0 0 auto;display:grid;place-items:center;width:40px;height:40px;
  font-family:var(--sb-font-num);font-size:24px;font-weight:700;line-height:1;
  background:var(--sb-gold-soft);color:var(--sb-gold-ink);
  transition:background-color .22s var(--sb-ease),color .22s var(--sb-ease);
}
.sb-accordion__item[data-open="true"] .sb-accordion__index{background:var(--sb-gold);color:var(--sb-indigo)}
.sb-accordion__title{flex:1 1 auto;font-size:16.5px;font-weight:700;line-height:1.5;letter-spacing:0}
.sb-accordion__sign{position:relative;flex:0 0 auto;width:16px;height:16px}
.sb-accordion__sign::before,
.sb-accordion__sign::after{
  content:"";position:absolute;background:var(--sb-red);
  transition:transform .22s var(--sb-ease);
}
.sb-accordion__sign::before{left:0;right:0;top:7px;height:2px}
.sb-accordion__sign::after{top:0;bottom:0;left:7px;width:2px}
.sb-accordion__item[data-open="true"] .sb-accordion__sign::after{transform:scaleY(0)}
.sb-accordion__panel{overflow:hidden;transition:height .22s var(--sb-ease),opacity .22s var(--sb-ease)}
.sb-accordion--js .sb-accordion__panel{height:0;opacity:0}
.sb-accordion--js .sb-accordion__item[data-open="true"] .sb-accordion__panel{opacity:1}
.sb-accordion__body{
  max-width:42em;
  padding:0 clamp(14px,2vw,22px) 20px;
  font-size:16px;line-height:1.75;color:rgba(34,30,27,.78);
}

/* ---------- 11. 动效降级 ---------- */
@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{
    animation-duration:.001ms !important;
    animation-iteration-count:1 !important;
    transition-duration:.001ms !important;
  }
}