.page-about{
  --about-cut:22px;
  --hall-a1:#d9a33c;
  --hall-a2:#f4d488;
  --hall-b1:#9a5cff;
  --hall-b2:#c9a4ff;
  --hall-c1:#ff8b3d;
  --hall-c2:#ffc38a;
  --hall-d1:#2fd6a4;
  --hall-d2:#8ff2d4;
  display:block;
  position:relative;
  overflow-x:clip;
}

.page-about .breadcrumb{
  padding-top:clamp(18px,3vw,30px);
}

.page-about .section-title{
  max-width:24ch;
}

/* ---------- 首屏 ---------- */
.page-about .about-hero{
  position:relative;
  padding:clamp(26px,4vw,56px) 0 clamp(48px,7vw,96px);
  border-bottom:1px solid var(--line-soft);
  overflow:hidden;
}

.page-about .about-hero::before{
  content:"";
  position:absolute;
  inset:0;
  background-image:
    linear-gradient(rgba(217,163,60,.07) 1px, transparent 1px),
    linear-gradient(90deg, rgba(217,163,60,.07) 1px, transparent 1px);
  background-size:76px 76px;
  -webkit-mask-image:radial-gradient(120% 90% at 72% 8%, #000 8%, transparent 74%);
  mask-image:radial-gradient(120% 90% at 72% 8%, #000 8%, transparent 74%);
  pointer-events:none;
}

.page-about .about-hero::after{
  content:"";
  position:absolute;
  top:-22%;
  right:-14%;
  width:min(560px,74vw);
  height:min(560px,74vw);
  border-radius:50%;
  background:conic-gradient(from 205deg, rgba(154,92,255,.24), rgba(255,139,61,.14), rgba(217,163,60,.2), rgba(154,92,255,.24));
  filter:blur(72px);
  opacity:.72;
  pointer-events:none;
}

.page-about .about-hero__grid{
  position:relative;
  z-index:1;
  display:grid;
  grid-template-columns:minmax(0,1fr);
  gap:clamp(28px,5vw,56px);
  align-items:center;
}

.page-about .about-hero__title{
  margin:clamp(12px,1.6vw,18px) 0 0;
  font-family:var(--font-serif);
  font-size:clamp(28px,4.6vw,50px);
  line-height:1.24;
  letter-spacing:-.01em;
  color:var(--text);
  max-width:20ch;
}

.page-about .about-hero__desc{
  margin:clamp(16px,2vw,24px) 0 0;
  max-width:54ch;
  font-size:clamp(15px,1.6vw,17px);
  line-height:1.9;
  color:var(--muted);
}

.page-about .about-hero__actions{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  margin-top:clamp(24px,3vw,36px);
}

.page-about .about-hero__media{
  margin:0;
  padding:1px;
  background:linear-gradient(150deg, rgba(217,163,60,.55), rgba(154,92,255,.32) 55%, rgba(255,139,61,.42));
  clip-path:polygon(0 0, 100% 0, 100% calc(100% - 34px), calc(100% - 34px) 100%, 0 100%);
}

.page-about .about-hero__media img{
  display:block;
  width:100%;
  height:auto;
  aspect-ratio:4 / 5;
  object-fit:cover;
  clip-path:polygon(0 0, 100% 0, 100% calc(100% - 33px), calc(100% - 33px) 100%, 0 100%);
}

@media (min-width:900px){
  .page-about .about-hero__grid{
    grid-template-columns:minmax(0,1.12fr) minmax(0,.88fr);
  }
  .page-about .about-hero__media{
    transform:rotate(-1.6deg);
  }
}

/* ---------- 四类玩法 ---------- */
.page-about .about-faces{
  padding:clamp(48px,7vw,96px) 0;
}

.page-about .faces-grid{
  display:grid;
  grid-template-columns:minmax(0,1fr);
  gap:clamp(28px,4.5vw,56px);
  align-items:start;
}

.page-about .faces-media{
  margin:0;
  border:1px solid var(--line);
  background:linear-gradient(160deg, rgba(14,51,42,.7), rgba(4,16,12,.9));
}

.page-about .faces-intro{
  margin:clamp(14px,1.8vw,20px) 0 clamp(22px,3vw,32px);
  max-width:56ch;
  font-size:15.5px;
  line-height:1.9;
  color:var(--muted);
}

.page-about .faces-list{
  list-style:none;
  margin:0;
  padding:0;
  display:flex;
  flex-direction:column;
  gap:2px;
}

.page-about .face-item{
  position:relative;
  display:grid;
  grid-template-columns:auto minmax(0,1fr);
  gap:clamp(14px,2vw,22px);
  align-items:start;
  padding:clamp(16px,2.2vw,24px) 0;
  border-top:1px solid var(--line-soft);
}

.page-about .face-item::before{
  content:"";
  position:absolute;
  left:0;
  top:-1px;
  width:clamp(52px,8vw,96px);
  height:2px;
  background:linear-gradient(90deg, var(--face-c1), var(--face-c2));
}

.page-about .face-item--a{ --face-c1:var(--hall-a1); --face-c2:var(--hall-a2); }
.page-about .face-item--b{ --face-c1:var(--hall-b1); --face-c2:var(--hall-b2); }
.page-about .face-item--c{ --face-c1:var(--hall-c1); --face-c2:var(--hall-c2); }
.page-about .face-item--d{ --face-c1:var(--hall-d1); --face-c2:var(--hall-d2); }

.page-about .face-idx{
  font-family:var(--font-mono);
  font-size:13px;
  letter-spacing:.1em;
  color:var(--gold);
  padding-top:4px;
}

.page-about .face-name{
  margin:0;
  font-family:var(--font-serif);
  font-size:clamp(17px,2vw,20px);
  font-weight:600;
  color:var(--text);
}

.page-about .face-text{
  margin:8px 0 0;
  font-size:14.5px;
  line-height:1.85;
  color:var(--muted);
}

@media (min-width:900px){
  .page-about .faces-grid{
    grid-template-columns:minmax(0,.78fr) minmax(0,1.22fr);
  }
  .page-about .faces-media{
    position:sticky;
    top:96px;
  }
}

/* ---------- 班次 ---------- */
.page-about .about-shift{
  padding:clamp(48px,7vw,96px) 0;
  border-top:1px solid var(--line-soft);
  border-bottom:1px solid var(--line-soft);
  background:radial-gradient(80% 60% at 50% 0%, rgba(217,163,60,.07), transparent 68%);
}

.page-about .shift-head{
  max-width:70ch;
}

.page-about .shift-head .section-desc{
  margin-top:14px;
}

.page-about .shift-track{
  list-style:none;
  margin:clamp(28px,4vw,48px) 0 0;
  padding:0;
  display:grid;
  grid-template-columns:minmax(0,1fr);
  gap:1px;
  background:var(--line-soft);
  border:1px solid var(--line-soft);
  border-radius:2px;
  overflow:hidden;
}

.page-about .shift-item{
  position:relative;
  padding:clamp(24px,3vw,34px) clamp(18px,2.4vw,28px);
  background:linear-gradient(165deg, rgba(14,51,42,.78), rgba(4,16,12,.94));
}

.page-about .shift-item::before{
  content:"";
  position:absolute;
  top:0;
  left:0;
  right:0;
  height:2px;
  background:linear-gradient(90deg, var(--shift-c1), var(--shift-c2));
}

.page-about .shift-item--dawn{ --shift-c1:var(--hall-a1); --shift-c2:var(--hall-a2); }
.page-about .shift-item--mid{ --shift-c1:var(--hall-b1); --shift-c2:var(--hall-b2); }
.page-about .shift-item--night{ --shift-c1:var(--hall-c1); --shift-c2:var(--hall-c2); }

.page-about .shift-idx{
  font-family:var(--font-mono);
  font-size:12px;
  letter-spacing:.16em;
  color:var(--muted);
}

.page-about .shift-name{
  margin:10px 0 0;
  font-family:var(--font-serif);
  font-size:clamp(20px,2.4vw,24px);
  color:var(--text);
}

.page-about .shift-dur{
  margin:8px 0 0;
  font-family:var(--font-mono);
  font-size:13px;
  letter-spacing:.08em;
  color:var(--gold);
}

.page-about .shift-note{
  margin:14px 0 0;
  font-size:14.5px;
  line-height:1.85;
  color:var(--muted);
}

.page-about .shift-foot{
  margin:clamp(20px,2.6vw,30px) 0 0;
  padding-left:16px;
  border-left:2px solid var(--gold);
  max-width:70ch;
  font-size:14.5px;
  line-height:1.85;
  color:var(--muted);
}

@media (min-width:760px){
  .page-about .shift-track{
    grid-template-columns:repeat(3, minmax(0,1fr));
  }
}

/* ---------- CN 大厅 ---------- */
.page-about .about-halls{
  padding:clamp(48px,7vw,96px) 0;
  background:
    radial-gradient(70% 60% at 0% 0%, rgba(154,92,255,.11), transparent 62%),
    radial-gradient(60% 55% at 100% 100%, rgba(255,139,61,.09), transparent 62%);
}

.page-about .halls-head{
  max-width:74ch;
}

.page-about .halls-head .section-desc{
  margin-top:14px;
}

.page-about .hall-grid{
  list-style:none;
  margin:clamp(28px,4vw,48px) 0 0;
  padding:0;
  display:grid;
  grid-template-columns:repeat(3, minmax(0,1fr));
  gap:8px;
}

.page-about .hall-cell{
  position:relative;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  gap:10px;
  min-height:92px;
  padding:14px 12px 18px;
  background:linear-gradient(180deg, rgba(14,51,42,.62), rgba(4,16,12,.88));
  border:1px solid var(--line-soft);
  clip-path:polygon(0 0, 100% 0, 100% calc(100% - 12px), calc(100% - 12px) 100%, 0 100%);
  transition:background .3s ease, border-color .3s ease;
}

.page-about .hall-cell::after{
  content:"";
  position:absolute;
  left:0;
  bottom:0;
  width:100%;
  height:3px;
  background:linear-gradient(90deg, var(--cell-c1), var(--cell-c2));
}

.page-about .hall-cell--a{ --cell-c1:var(--hall-a1); --cell-c2:var(--hall-a2); }
.page-about .hall-cell--b{ --cell-c1:var(--hall-b1); --cell-c2:var(--hall-b2); }
.page-about .hall-cell--c{ --cell-c1:var(--hall-c1); --cell-c2:var(--hall-c2); }
.page-about .hall-cell--d{ --cell-c1:var(--hall-d1); --cell-c2:var(--hall-d2); }

.page-about .hall-cell--a{ box-shadow:inset 0 0 0 1px rgba(217,163,60,.06); }
.page-about .hall-cell--b{ box-shadow:inset 0 0 0 1px rgba(154,92,255,.06); }
.page-about .hall-cell--c{ box-shadow:inset 0 0 0 1px rgba(255,139,61,.06); }
.page-about .hall-cell--d{ box-shadow:inset 0 0 0 1px rgba(47,214,164,.06); }

.page-about .hall-cell:hover{
  background:linear-gradient(180deg, rgba(20,68,56,.75), rgba(4,16,12,.94));
  border-color:var(--line);
}

.page-about .hall-no{
  font-family:var(--font-mono);
  font-size:20px;
  letter-spacing:.05em;
  color:var(--text);
}

.page-about .hall-tag{
  font-size:12px;
  letter-spacing:.06em;
  color:var(--muted);
}

.page-about .hall-legend{
  list-style:none;
  margin:clamp(22px,3vw,32px) 0 0;
  padding:0;
  display:flex;
  flex-wrap:wrap;
  gap:10px 26px;
}

.page-about .hall-legend__item{
  display:inline-flex;
  align-items:center;
  gap:9px;
  font-family:var(--font-mono);
  font-size:12px;
  letter-spacing:.05em;
  color:var(--muted);
}

.page-about .hall-legend__dot{
  width:22px;
  height:3px;
  display:inline-block;
  border-radius:2px;
}

.page-about .hall-legend__item--a .hall-legend__dot{ background:linear-gradient(90deg, var(--hall-a1), var(--hall-a2)); }
.page-about .hall-legend__item--b .hall-legend__dot{ background:linear-gradient(90deg, var(--hall-b1), var(--hall-b2)); }
.page-about .hall-legend__item--c .hall-legend__dot{ background:linear-gradient(90deg, var(--hall-c1), var(--hall-c2)); }
.page-about .hall-legend__item--d .hall-legend__dot{ background:linear-gradient(90deg, var(--hall-d1), var(--hall-d2)); }

@media (min-width:640px){
  .page-about .hall-grid{
    grid-template-columns:repeat(4, minmax(0,1fr));
  }
}

@media (min-width:1000px){
  .page-about .hall-grid{
    grid-template-columns:repeat(6, minmax(0,1fr));
  }
}

/* ---------- 返水与活动 ---------- */
.page-about .about-reward{
  padding:clamp(48px,7vw,96px) 0;
  border-top:1px solid var(--line-soft);
}

.page-about .reward-board{
  display:grid;
  grid-template-columns:minmax(0,1fr);
  gap:clamp(26px,4vw,52px);
  padding:clamp(26px,4vw,48px);
  background:linear-gradient(140deg, rgba(14,51,42,.72), rgba(4,16,12,.92));
  border:1px solid var(--line);
  clip-path:polygon(0 0, 100% 0, 100% calc(100% - var(--about-cut)), calc(100% - var(--about-cut)) 100%, 0 100%);
  position:relative;
  overflow:hidden;
}

.page-about .reward-board::before{
  content:"";
  position:absolute;
  top:-40%;
  right:-10%;
  width:min(420px,60vw);
  height:min(420px,60vw);
  border-radius:50%;
  background:radial-gradient(circle, rgba(154,92,255,.22), transparent 68%);
  pointer-events:none;
}

.page-about .reward-board__main{
  position:relative;
  z-index:1;
}

.page-about .reward-text{
  margin:14px 0 0;
  max-width:62ch;
  font-size:15px;
  line-height:1.9;
  color:var(--muted);
}

.page-about .reward-figures{
  position:relative;
  z-index:1;
  display:grid;
  grid-template-columns:minmax(0,1fr);
  gap:2px;
}

.page-about .reward-figure{
  padding:clamp(18px,2.6vw,26px) clamp(16px,2vw,22px);
  border-left:3px solid var(--fig-c);
  background:rgba(4,16,12,.5);
  display:flex;
  flex-direction:column;
  gap:8px;
}

.page-about .reward-figure--gold{ --fig-c:var(--gold); }
.page-about .reward-figure--neon{ --fig-c:var(--neon); }

.page-about .reward-value{
  font-family:var(--font-mono);
  font-size:clamp(24px,3.4vw,34px);
  letter-spacing:.02em;
  line-height:1.1;
  background:linear-gradient(100deg, var(--gold-l), var(--gold));
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
}

.page-about .reward-figure--neon .reward-value{
  background:linear-gradient(100deg, #c9a4ff, var(--neon));
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
}

.page-about .reward-label{
  font-size:12.5px;
  letter-spacing:.08em;
  color:var(--muted);
}

@media (min-width:900px){
  .page-about .reward-board{
    grid-template-columns:minmax(0,1.35fr) minmax(0,.65fr);
    align-items:center;
  }
}

/* ---------- 服务与联络 ---------- */
.page-about .about-contact{
  padding:clamp(48px,7vw,96px) 0 clamp(56px,8vw,110px);
  border-top:1px solid var(--line-soft);
}

.page-about .about-contact__media{
  margin:0 0 clamp(28px,4vw,48px);
}

.page-about .contact-body{
  display:grid;
  grid-template-columns:minmax(0,1fr);
  gap:clamp(24px,3.5vw,48px);
  align-items:start;
}

.page-about .contact-text{
  margin:14px 0 0;
  max-width:56ch;
  font-size:15px;
  line-height:1.9;
  color:var(--muted);
}

.page-about .contact-list{
  list-style:none;
  margin:0;
  padding:0;
  display:flex;
  flex-direction:column;
  gap:2px;
}

.page-about .contact-item{
  display:grid;
  grid-template-columns:minmax(0,1fr);
  gap:6px;
  padding:16px 0;
  border-bottom:1px solid var(--line-soft);
}

.page-about .contact-item:first-child{
  border-top:1px solid var(--line-soft);
}

.page-about .contact-key{
  font-family:var(--font-mono);
  font-size:11.5px;
  letter-spacing:.16em;
  color:var(--gold);
}

.page-about .contact-val{
  font-size:15px;
  letter-spacing:.02em;
  color:var(--text);
  word-break:break-word;
}

.page-about .contact-actions{
  margin-top:clamp(22px,3vw,30px);
}

@media (min-width:760px){
  .page-about .contact-item{
    grid-template-columns:170px minmax(0,1fr);
    align-items:baseline;
    gap:20px;
  }
}

@media (min-width:900px){
  .page-about .contact-body{
    grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  }
}
