/* =========================================================
   联系我们 / page-contact
   ========================================================= */
.page-contact{
  --ct-cyan-a: rgba(43, 227, 196, .08);
  --ct-cyan-b: rgba(43, 227, 196, .34);
  --ct-row: clamp(1.5rem, 4vw, 2.75rem);
  background: var(--fb-deep);
  padding-bottom: clamp(2rem, 6vw, 4rem);
}

/* ---------- 面包屑位置 ---------- */
.page-contact .contact-crumbs{
  padding-top: clamp(1rem, 3vw, 1.75rem);
}

/* ---------- 首屏 ---------- */
.page-contact .contact-hero{
  border-bottom: 1px solid var(--fb-line);
}
.page-contact .contact-hero__inner{
  padding-top: clamp(1.5rem, 4.5vw, 3rem);
  padding-bottom: clamp(1.5rem, 4vw, 2.5rem);
}
.page-contact .contact-hero .fb-title--hero{
  margin: .4rem 0 0;
  max-width: 15em;
}
.page-contact .contact-hero .fb-lede{
  margin-top: clamp(1rem, 3vw, 1.5rem);
}
.page-contact .contact-hero__meta{
  display: flex;
  flex-wrap: wrap;
  gap: .55rem 1.6rem;
  margin: clamp(1.25rem, 3.5vw, 1.75rem) 0 0;
  font-size: var(--fs-13);
  letter-spacing: .06em;
  color: var(--fb-mist);
}
.page-contact .contact-hero__meta > span{
  display: inline-flex;
  align-items: center;
  gap: .5rem;
}
.page-contact .contact-hero__dot{
  width: 6px;
  height: 6px;
  flex: none;
  border-radius: 50%;
  background: var(--fb-cyan);
  box-shadow: 0 0 10px rgba(43, 227, 196, .8);
}
.page-contact .contact-banner{
  margin: 0;
}

/* ---------- 主体左右分栏 ---------- */
.page-contact .contact-panel{
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: var(--ct-row);
}
.page-contact .contact-panel__body .fb-title--lg{
  margin: 0 0 clamp(1.25rem, 3vw, 1.75rem);
}

/* 左侧联系方式 */
.page-contact .contact-info{
  display: grid;
  gap: clamp(1rem, 3vw, 1.5rem);
  margin: clamp(1.5rem, 4vw, 2.25rem) 0 0;
  font-style: normal;
}
.page-contact .contact-info__row{
  border-left: 2px solid var(--fb-line);
  padding-left: clamp(.75rem, 2.4vw, 1.1rem);
}
.page-contact .contact-info__row--live{
  border-left-color: var(--fb-cyan);
}
.page-contact .contact-info__label{
  display: block;
  margin-bottom: .4rem;
  font-size: var(--fs-13);
  letter-spacing: .14em;
  color: var(--fb-mist);
}
.page-contact .contact-info__value{
  display: block;
  font-family: var(--fb-mono);
  font-size: var(--fs-18);
  line-height: 1.4;
  letter-spacing: -.01em;
  color: var(--fb-white);
  overflow-wrap: anywhere;
  word-break: break-word;
}
.page-contact .contact-info__note{
  margin: clamp(1.25rem, 3.5vw, 1.75rem) 0 0;
  max-width: 30em;
  font-size: var(--fs-14);
  line-height: 1.8;
  color: var(--fb-mist);
}

/* 右侧渠道说明 */
.page-contact .channel-list{
  list-style: none;
  margin: 0;
  padding: 0;
  border-top: 1px solid var(--fb-line);
}
.page-contact .channel-item{
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: .5rem;
  padding: clamp(1rem, 3vw, 1.5rem) clamp(.75rem, 2vw, 1.15rem);
  border-bottom: 1px solid var(--fb-line);
  border-left: 3px solid transparent;
  transition: border-color .24s var(--fb-ease), background-color .24s var(--fb-ease);
}
.page-contact .channel-item:hover,
.page-contact .channel-item:focus-within{
  border-left-color: var(--fb-cyan);
  background-color: var(--ct-cyan-a);
}
.page-contact .channel-item__side{
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: .55rem;
}
.page-contact .channel-item__title{
  margin: 0;
  font-size: var(--fs-18);
  font-weight: 700;
  line-height: 1.35;
  letter-spacing: -.01em;
  color: var(--fb-white);
}
.page-contact .channel-item__text{
  margin: 0;
  font-size: var(--fs-16);
  line-height: 1.75;
  color: var(--fb-mist);
}

/* ---------- 写邮件带什么 ---------- */
.page-contact .brief-grid{
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: var(--ct-row);
}
.page-contact .brief-list{
  list-style: none;
  counter-reset: brief;
  margin: 0;
  padding: 0;
}
.page-contact .brief-list__item{
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: clamp(.85rem, 2.5vw, 1.35rem);
  align-items: start;
  padding: clamp(1rem, 2.8vw, 1.4rem) 0;
  border-top: 1px solid var(--fb-line);
}
.page-contact .brief-list__item:last-child{
  border-bottom: 1px solid var(--fb-line);
}
.page-contact .brief-list__item::before{
  counter-increment: brief;
  content: "0" counter(brief);
  font-family: var(--fb-mono);
  font-size: var(--fs-32);
  line-height: 1;
  letter-spacing: -.02em;
  color: var(--fb-cyan);
}
.page-contact .brief-list__title{
  margin: 0 0 .35rem;
  font-size: var(--fs-18);
  font-weight: 700;
  color: var(--fb-white);
}
.page-contact .brief-list__text{
  margin: 0;
  font-size: var(--fs-16);
  line-height: 1.75;
  color: var(--fb-mist);
}

/* ---------- 回复节奏 ---------- */
.page-contact .contact-rhythm{
  border-top: 1px solid var(--fb-line);
  border-bottom: 1px solid var(--fb-line);
}
.page-contact .rhythm-grid{
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: var(--ct-row);
}
.page-contact .rhythm-list{
  list-style: none;
  margin: 0;
  padding: 0;
}
.page-contact .rhythm-item{
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: .35rem;
  padding: clamp(.9rem, 2.4vw, 1.2rem) 0;
  border-top: 1px solid var(--fb-line);
}
.page-contact .rhythm-item:first-child{
  border-top: 0;
  padding-top: 0;
}
.page-contact .rhythm-item__time{
  font-family: var(--fb-mono);
  font-size: var(--fs-14);
  letter-spacing: .08em;
  color: var(--fb-orange);
}
.page-contact .rhythm-item__text{
  margin: 0;
  font-size: var(--fs-16);
  line-height: 1.75;
  color: var(--fb-mist);
}
.page-contact .rhythm-note{
  margin: clamp(1.25rem, 3vw, 1.75rem) 0 0;
  font-size: var(--fs-14);
  line-height: 1.8;
  color: var(--fb-mist);
}
.page-contact .rhythm-note a{
  color: var(--fb-cyan);
  text-decoration: none;
  border-bottom: 1px solid var(--ct-cyan-b);
}
.page-contact .rhythm-note a:hover,
.page-contact .rhythm-note a:focus-visible{
  color: var(--fb-cyan-soft);
  border-bottom-color: var(--fb-cyan-soft);
}

/* ---------- 内容与数据合作 ---------- */
.page-contact .partner-grid{
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: var(--ct-row);
  align-items: start;
}
.page-contact .partner-figure{
  margin: 0;
}
.page-contact .partner-body__text{
  margin: 0 0 1rem;
  max-width: 36em;
  font-size: var(--fs-16);
  line-height: 1.8;
  color: var(--fb-mist);
}
.page-contact .partner-stats{
  list-style: none;
  margin: clamp(1.25rem, 3.5vw, 1.75rem) 0;
  padding: clamp(.9rem, 2.5vw, 1.25rem) 0;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: clamp(.75rem, 2vw, 1.25rem);
  border-top: 1px solid var(--fb-line);
  border-bottom: 1px solid var(--fb-line);
}
.page-contact .partner-stats__num{
  display: block;
  font-family: var(--fb-mono);
  font-size: var(--fs-32);
  line-height: 1;
  letter-spacing: -.02em;
  color: var(--fb-cyan);
}
.page-contact .partner-stats__label{
  display: block;
  margin-top: .4rem;
  font-size: var(--fs-13);
  line-height: 1.5;
  color: var(--fb-mist);
}
.page-contact .partner-actions{
  display: flex;
  flex-wrap: wrap;
  gap: .75rem 1rem;
  margin-top: clamp(1.25rem, 3.5vw, 1.75rem);
}

/* ---------- 断点 ---------- */
@media (min-width: 620px){
  .page-contact .channel-item{
    grid-template-columns: 10.5rem minmax(0, 1fr);
    gap: clamp(1rem, 3vw, 2rem);
    align-items: start;
  }
}

@media (min-width: 760px){
  .page-contact .brief-grid{
    grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr);
    column-gap: clamp(2rem, 5vw, 4rem);
  }
  .page-contact .rhythm-grid{
    grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr);
    column-gap: clamp(2rem, 5vw, 4rem);
  }
}

@media (min-width: 960px){
  .page-contact .contact-panel{
    grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr);
    column-gap: clamp(2rem, 5vw, 4rem);
  }
  .page-contact .contact-panel__aside{
    border-right: 1px solid var(--ct-cyan-b);
    padding-right: clamp(1.5rem, 4vw, 3rem);
  }
  .page-contact .contact-info__value{
    font-size: var(--fs-22);
  }
  .page-contact .partner-grid{
    grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr);
    column-gap: clamp(2rem, 5vw, 4rem);
  }
}

@media (max-width: 519px){
  .page-contact .partner-stats{
    grid-template-columns: minmax(0, 1fr);
    gap: .9rem;
  }
  .page-contact .partner-stats li{
    display: flex;
    align-items: baseline;
    gap: .75rem;
  }
  .page-contact .partner-stats__label{
    margin-top: 0;
  }
  .page-contact .brief-list__item::before{
    font-size: var(--fs-22);
  }
}

@media (prefers-reduced-motion: reduce){
  .page-contact .channel-item{
    transition: none;
  }
}