.page-contact{
  --ct-panel:#131F2E;
  display:block;
  padding-bottom:72px;
  overflow-x:clip;
  font-family:var(--font-body);
  color:var(--text);
}

/* ---- 面包屑 ---- */
.page-contact .ui-breadcrumb{
  margin:26px 0 0;
}

/* ---- 首屏 ---- */
.page-contact .contact-mast{
  padding:32px 0 40px;
  border-bottom:1px solid var(--line);
}
.page-contact .contact-mast__lead .ui-title{
  margin:14px 0 18px;
  max-width:22ch;
}
.page-contact .contact-mast__lead .ui-lede{
  max-width:44ch;
}
.page-contact .contact-mast__meta{
  margin-top:30px;
  padding-top:16px;
  border-top:2px solid var(--ice);
}
.page-contact .contact-mast__facts{
  margin:0;
  display:grid;
  gap:12px;
}
.page-contact .contact-mast__facts > div{
  display:flex;
  align-items:baseline;
  justify-content:space-between;
  gap:16px;
}
.page-contact .contact-mast__facts dt{
  font-family:var(--font-data);
  font-size:12px;
  letter-spacing:.08em;
  color:var(--text-dim);
}
.page-contact .contact-mast__facts dd{
  margin:0;
  font-family:var(--font-data);
  font-size:13px;
  color:var(--white);
  text-align:right;
}

@media (min-width:900px){
  .page-contact .contact-mast{
    display:grid;
    grid-template-columns:minmax(0,1.45fr) minmax(240px,.55fr);
    gap:56px;
    align-items:end;
    padding:56px 0 52px;
  }
  .page-contact .contact-mast__meta{
    margin-top:0;
    padding-top:18px;
  }
}

/* ---- 联系渠道 ---- */
.page-contact .contact-channels__grid{
  display:grid;
  gap:30px;
}
.page-contact .contact-card{
  position:relative;
  padding:28px 22px 26px;
  border-left:3px solid var(--lime);
  background:linear-gradient(155deg,#14253A 0%,#0D1725 66%);
  clip-path:polygon(0 0,calc(100% - 28px) 0,100% 28px,100% 100%,0 100%);
}
.page-contact .contact-card__title{
  margin:0 0 18px;
  font-family:var(--font-display);
  font-size:21px;
  font-weight:600;
  letter-spacing:.02em;
  color:var(--white);
}
.page-contact .contact-card__list{
  list-style:none;
  margin:0;
  padding:0;
}
.page-contact .contact-card__row{
  padding:18px 0;
  border-top:1px solid var(--line);
}
.page-contact .contact-card__row:first-child{
  border-top:0;
  padding-top:0;
}
.page-contact .contact-card__head{
  display:flex;
  flex-wrap:wrap;
  align-items:baseline;
  gap:10px 12px;
}
.page-contact .contact-card__value{
  font-family:var(--font-data);
  font-size:15px;
  line-height:1.5;
  color:var(--white);
  word-break:break-all;
  user-select:all;
}
.page-contact .contact-card__value--lg{
  font-size:20px;
  letter-spacing:.06em;
  word-break:normal;
}
.page-contact .contact-card__value--addr{
  font-size:14px;
  line-height:1.7;
  color:var(--text);
}
.page-contact .contact-card__hint{
  margin:10px 0 0;
  max-width:46ch;
  font-size:14px;
  line-height:1.75;
  color:var(--text-dim);
}
.page-contact .contact-channels__aside{
  display:grid;
  gap:18px;
  align-content:start;
}
.page-contact .contact-channels__media{
  margin:0;
}
.page-contact .contact-channels__note{
  margin:0;
  padding-left:16px;
  border-left:2px solid var(--ice);
  font-size:14px;
  line-height:1.75;
  color:var(--text-dim);
}
@media (min-width:900px){
  .page-contact .contact-channels__grid{
    grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);
    gap:46px;
    align-items:start;
  }
  .page-contact .contact-card{
    padding:32px 28px 28px;
  }
}

/* ---- 问题类型 ---- */
.page-contact .contact-topics__grid{
  display:grid;
  gap:34px;
}
.page-contact .contact-topics__main .ui-lede{
  margin:14px 0 26px;
  max-width:40ch;
}
.page-contact .contact-topics__media{
  margin:0;
  width:min(100%,420px);
}
.page-contact .contact-topic{
  border-top:1px solid var(--line);
}
.page-contact .contact-topic:last-of-type{
  border-bottom:1px solid var(--line);
}
.page-contact .contact-topic > summary{
  position:relative;
  display:block;
  padding:17px 36px 17px 0;
  font-family:var(--font-display);
  font-size:17px;
  font-weight:600;
  letter-spacing:.02em;
  color:var(--white);
  cursor:pointer;
  list-style:none;
  transition:color .2s var(--ease);
}
.page-contact .contact-topic > summary::-webkit-details-marker{
  display:none;
}
.page-contact .contact-topic > summary::after{
  content:"+";
  position:absolute;
  top:50%;
  right:6px;
  transform:translateY(-50%);
  font-family:var(--font-data);
  font-size:20px;
  line-height:1;
  color:var(--ice);
}
.page-contact .contact-topic[open] > summary::after{
  content:"–";
  color:var(--lime);
}
.page-contact .contact-topic > summary:hover,
.page-contact .contact-topic > summary:focus-visible{
  color:var(--ice);
}
.page-contact .contact-topic__body{
  padding:0 0 20px;
  font-size:14.5px;
  line-height:1.8;
  color:var(--text-dim);
}
.page-contact .contact-topic__body p{
  margin:0 0 12px;
  max-width:42ch;
}
.page-contact .contact-topic__check{
  list-style:none;
  margin:0;
  padding:0;
  display:grid;
  gap:8px;
}
.page-contact .contact-topic__check li{
  position:relative;
  padding-left:20px;
  font-family:var(--font-data);
  font-size:13px;
  color:var(--text);
}
.page-contact .contact-topic__check li::before{
  content:"";
  position:absolute;
  left:2px;
  top:.6em;
  width:8px;
  height:8px;
  background:var(--lime);
}
@media (min-width:900px){
  .page-contact .contact-topics__grid{
    grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);
    gap:52px;
    align-items:start;
  }
  .page-contact .contact-topics__media{
    width:100%;
    justify-self:end;
  }
}

/* ---- 回复节奏 ---- */
.page-contact .contact-hours .ui-title{
  margin:14px 0 30px;
  max-width:24ch;
}
.page-contact .shift-band{
  padding:24px 18px 14px;
  border:1px solid var(--line);
  background:linear-gradient(180deg,rgba(16,26,38,.92),rgba(11,15,22,.92));
  clip-path:polygon(0 0,100% 0,100% calc(100% - 22px),calc(100% - 22px) 100%,0 100%);
}
.page-contact .shift-band__scale{
  display:grid;
  grid-template-columns:repeat(24,minmax(0,1fr));
  gap:3px;
  align-items:end;
  height:56px;
}
.page-contact .shift-band__tick{
  display:block;
  height:14px;
  background:rgba(138,148,166,.2);
  transition:height .22s var(--ease),background .22s var(--ease);
}
.page-contact .shift-band__tick--on{
  height:44px;
  background:linear-gradient(180deg,var(--lime),rgba(184,255,60,.24));
}
.page-contact .shift-band__tick:hover{
  background:var(--ice);
  height:52px;
}
.page-contact .shift-band__axis{
  position:relative;
  height:16px;
  margin-top:12px;
  font-family:var(--font-data);
  font-size:11px;
  letter-spacing:.06em;
  color:var(--steel);
}
.page-contact .shift-band__axis span{
  position:absolute;
  top:0;
  transform:translateX(-50%);
  white-space:nowrap;
}
.page-contact .shift-band__axis span:first-child{
  left:0;
  transform:none;
}
.page-contact .shift-band__axis span:nth-child(2){
  left:37.5%;
}
.page-contact .shift-band__axis span:nth-child(3){
  left:75%;
}
.page-contact .shift-band__axis span:last-child{
  left:auto;
  right:0;
  transform:none;
}
.page-contact .hours-list{
  list-style:none;
  margin:30px 0 0;
  padding:0;
}
.page-contact .hours-list li{
  display:grid;
  gap:6px;
  padding:16px 0;
  border-bottom:1px solid var(--line-soft);
}
.page-contact .hours-list__k{
  font-family:var(--font-data);
  font-size:13px;
  letter-spacing:.04em;
  color:var(--ice);
}
.page-contact .hours-list__v{
  font-size:14.5px;
  line-height:1.75;
  color:var(--text-dim);
}
@media (min-width:760px){
  .page-contact .hours-list li{
    grid-template-columns:190px minmax(0,1fr);
    gap:26px;
    align-items:baseline;
  }
  .page-contact .hours-list__v{
    max-width:56ch;
  }
}

/* ---- 运营地区与备案 ---- */
.page-contact .contact-meta{
  margin-top:56px;
  padding:28px 24px;
  background:var(--paper);
  color:#1B2430;
  clip-path:polygon(0 0,calc(100% - 26px) 0,100% 26px,100% 100%,0 100%);
}
.page-contact .contact-meta__title{
  margin:0 0 10px;
  font-family:var(--font-display);
  font-size:20px;
  font-weight:600;
  letter-spacing:.02em;
  color:#101820;
}
.page-contact .contact-meta__text{
  margin:0;
  max-width:62ch;
  font-size:14.5px;
  line-height:1.8;
  color:#3C4858;
}
.page-contact .contact-meta__text a{
  color:#0E4C63;
  text-decoration:underline;
  text-underline-offset:3px;
}
.page-contact .contact-meta__text a:hover{
  color:#B4520F;
}

/* ---- 继续浏览 ---- */
.page-contact .contact-next{
  display:grid;
  gap:16px;
  margin-top:44px;
}
.page-contact .contact-next__item{
  display:flex;
  flex-direction:column;
  gap:8px;
  padding:20px 18px;
  border:1px solid var(--line);
  background:rgba(16,26,38,.6);
  text-decoration:none;
  clip-path:polygon(0 0,calc(100% - 18px) 0,100% 18px,100% 100%,0 100%);
  transition:border-color .2s var(--ease),background .2s var(--ease),transform .2s var(--ease);
}
.page-contact .contact-next__item:hover,
.page-contact .contact-next__item:focus-visible{
  border-color:var(--ice);
  background:var(--teal-deep);
  transform:translateY(-3px);
}
.page-contact .contact-next__idx{
  font-family:var(--font-data);
  font-size:12px;
  letter-spacing:.18em;
  color:var(--lime);
}
.page-contact .contact-next__name{
  font-family:var(--font-display);
  font-size:19px;
  font-weight:600;
  letter-spacing:.02em;
  color:var(--white);
}
.page-contact .contact-next__desc{
  font-size:13px;
  line-height:1.7;
  color:var(--text-dim);
}
@media (min-width:700px){
  .page-contact .contact-next{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}
@media (min-width:1080px){
  .page-contact .contact-next{
    grid-template-columns:repeat(3,minmax(0,1fr));
  }
}
<<<END>>>
