.page-contact{
  --fb-panel:rgba(255,255,255,.05);
  --fb-panel-line:rgba(244,247,243,.16);
  --fb-radius:0;
}

/* ---------- 首屏 ---------- */
.page-contact .fb-hero{padding-block:clamp(2rem,5vw,3.5rem) clamp(2.5rem,6vw,4.5rem);}
.page-contact .fb-hero__inner{display:grid;gap:clamp(1.5rem,4vw,2.75rem);align-items:end;}
.page-contact .fb-hero__eyebrow{color:var(--cyan);letter-spacing:.14em;text-transform:uppercase;margin-bottom:.75rem;}
.page-contact .fb-hero__title{
  font-family:var(--font-display);
  font-weight:900;
  font-stretch:condensed;
  letter-spacing:-.02em;
  font-size:clamp(2.1rem,6.4vw,4rem);
  line-height:1.04;
  color:var(--white);
  margin:0 0 1rem;
}
.page-contact .fb-hero__lede{
  max-width:34rem;
  color:var(--mist);
  opacity:.92;
  font-size:clamp(.98rem,2.1vw,1.12rem);
}
.page-contact .fb-hero__main{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:.55rem .9rem;
  margin-top:1.5rem;
  padding:.85rem 1.1rem;
  border-left:3px solid var(--cyan);
  background:rgba(16,26,43,.6);
}
.page-contact .fb-hero__mail{
  font-size:clamp(.92rem,2.6vw,1.15rem);
  color:var(--cyan);
  word-break:break-all;
  letter-spacing:.01em;
}
.page-contact .fb-hero__figure{margin:0;align-self:stretch;}
.page-contact .fb-hero__figure img{
  display:block;
  width:100%;
  height:auto;
  aspect-ratio:12/5;
  object-fit:cover;
}

/* ---------- 四类情形 ---------- */
.page-contact .fb-types{padding-block:clamp(2.25rem,5vw,4rem);}
.page-contact .fb-types__head .section-head__title{color:var(--white);}
.page-contact .fb-types__head .prose{color:var(--mist);opacity:.85;max-width:42rem;margin-top:.7rem;}
.page-contact .fb-types__grid{
  list-style:none;
  margin:clamp(1.5rem,3.5vw,2.5rem) 0 0;
  padding:0;
  display:grid;
  gap:1px;
  background:var(--fb-panel-line);
  border:1px solid var(--fb-panel-line);
}
.page-contact .fb-type{
  display:flex;
  flex-direction:column;
  gap:.6rem;
  padding:clamp(1.1rem,2.6vw,1.65rem);
  background:var(--night);
  transition:background .25s var(--ease),transform .25s var(--ease);
}
.page-contact .fb-type:hover,
.page-contact .fb-type:focus-within{background:#16233c;transform:translateY(-2px);}
.page-contact .fb-type .label-tag{align-self:flex-start;}
.page-contact .fb-type__title{
  font-family:var(--font-display);
  font-weight:800;
  font-size:clamp(1rem,2.3vw,1.14rem);
  line-height:1.35;
  color:var(--white);
  margin:.15rem 0 0;
}
.page-contact .fb-type__text{
  font-size:.93rem;
  line-height:1.75;
  color:var(--mist);
  opacity:.82;
  margin:0;
}
.page-contact .fb-type__hint{
  margin:auto 0 0;
  padding-top:.7rem;
  font-size:.76rem;
  color:var(--stand);
  opacity:.7;
  border-top:1px dashed rgba(244,247,243,.18);
  transition:opacity .25s var(--ease),color .25s var(--ease);
}
.page-contact .fb-type:hover .fb-type__hint,
.page-contact .fb-type:focus-within .fb-type__hint{opacity:1;color:var(--cyan);}

/* ---------- 联系方式 + 书写指引 ---------- */
.page-contact .fb-main{padding-block:clamp(2.25rem,5vw,4rem);}
.page-contact .fb-main__title{
  font-family:var(--font-display);
  font-weight:900;
  font-stretch:condensed;
  letter-spacing:-.02em;
  font-size:clamp(1.7rem,4.2vw,2.6rem);
  line-height:1.1;
  color:var(--grass);
  margin:0 0 clamp(1.5rem,3.5vw,2.5rem);
}
.page-contact .fb-main__grid{display:grid;gap:clamp(2rem,4.5vw,3.25rem);}
.page-contact .fb-main__col .section-head__title{
  font-family:var(--font-display);
  font-weight:800;
  font-size:clamp(1.15rem,2.6vw,1.4rem);
  color:var(--ink);
  margin:.3rem 0 0;
}
.page-contact .fb-main__col .section-head__kicker{color:var(--grass);opacity:.7;}

.page-contact .contact-cards{
  list-style:none;
  margin:1.35rem 0 0;
  padding:0;
  display:grid;
  gap:.9rem;
}
.page-contact .contact-card{
  position:relative;
  background:var(--white);
  border:1px solid var(--line-light);
  padding:clamp(1rem,2.4vw,1.35rem) clamp(1rem,2.4vw,1.4rem);
  padding-left:calc(clamp(1rem,2.4vw,1.4rem) + 8px);
}
.page-contact .contact-card::before{
  content:"";
  position:absolute;
  left:0;
  top:0;
  bottom:0;
  width:6px;
  background:var(--cyan);
}
.page-contact .contact-card--mail::before{background:var(--orange);}
.page-contact .contact-card--phone::before{background:var(--cyan);}
.page-contact .contact-card--addr::before{background:var(--violet);}
.page-contact .contact-card--addr{
  background-image:
    linear-gradient(var(--line-light) 1px,transparent 1px),
    linear-gradient(90deg,var(--line-light) 1px,transparent 1px);
  background-size:20px 20px;
  background-position:0 0;
}
.page-contact .contact-card__flag{align-self:flex-start;}
.page-contact .contact-card__label{
  font-size:.78rem;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:var(--stand);
  margin:.7rem 0 .25rem;
}
.page-contact .contact-card__value{
  font-family:var(--font-mono);
  font-size:clamp(.98rem,2.5vw,1.12rem);
  font-weight:600;
  color:var(--ink);
  margin:0 0 .45rem;
  word-break:break-all;
  overflow-wrap:anywhere;
}
.page-contact .contact-card--addr .contact-card__value{
  font-family:var(--font-body);
  font-weight:600;
  line-height:1.6;
  word-break:normal;
}
.page-contact .contact-card__note{
  font-size:.86rem;
  line-height:1.7;
  color:var(--stand);
  margin:0;
}
.page-contact .fb-main__hint{
  margin-top:1.25rem;
  font-size:.9rem;
  line-height:1.75;
  color:var(--ink);
  opacity:.8;
  border-left:2px solid var(--orange);
  padding-left:.85rem;
}
.page-contact .fb-main__hint a{
  color:var(--grass);
  font-weight:700;
  text-decoration:none;
  border-bottom:2px solid var(--cyan);
}

.page-contact .guide-list{
  list-style:none;
  margin:1.35rem 0 0;
  padding:0;
  display:grid;
}
.page-contact .guide-item{
  display:grid;
  grid-template-columns:auto 1fr;
  gap:.35rem 1rem;
  padding:1.1rem 0;
  border-top:1px solid var(--line-light);
}
.page-contact .guide-item:first-child{border-top:0;padding-top:0;}
.page-contact .guide-item__num{
  font-size:clamp(1.05rem,2.8vw,1.45rem);
  font-weight:700;
  line-height:1.15;
  color:var(--violet);
}
.page-contact .guide-item__title{
  font-family:var(--font-display);
  font-weight:800;
  font-size:clamp(.98rem,2.2vw,1.06rem);
  color:var(--ink);
  margin:0 0 .3rem;
}
.page-contact .guide-item__text{
  font-size:.92rem;
  line-height:1.75;
  color:var(--ink);
  opacity:.78;
  margin:0;
}

/* ---------- 响应时段 ---------- */
.page-contact .fb-response{padding-block:clamp(2rem,4.5vw,3.5rem);}
.page-contact .fb-response__inner{display:grid;gap:clamp(1.35rem,3.5vw,2.5rem);}
.page-contact .fb-response .section-head__kicker{color:var(--cyan);}
.page-contact .fb-response__title{
  font-family:var(--font-display);
  font-weight:900;
  font-stretch:condensed;
  letter-spacing:-.02em;
  font-size:clamp(1.5rem,3.8vw,2.2rem);
  line-height:1.1;
  color:var(--white);
  margin:.3rem 0 .7rem;
}
.page-contact .fb-response__lead{
  font-size:.95rem;
  line-height:1.75;
  color:var(--mist);
  opacity:.82;
  margin:0;
  max-width:32rem;
}
.page-contact .timebar{display:grid;gap:1.15rem;}
.page-contact .timebar__scale{
  display:grid;
  grid-template-columns:auto 1fr auto;
  align-items:center;
  gap:.7rem;
}
.page-contact .timebar__tick{
  font-size:.78rem;
  color:var(--mist);
  letter-spacing:.06em;
}
.page-contact .timebar__track{
  position:relative;
  display:block;
  height:12px;
  background:rgba(244,247,243,.14);
  clip-path:polygon(0 0,100% 0,calc(100% - 8px) 100%,0 100%);
}
.page-contact .timebar__fill{
  position:absolute;
  inset:0;
  background:linear-gradient(90deg,var(--orange) 0%,#FFA24D 38%,var(--cyan) 100%);
}
.page-contact .timebar__notes{
  list-style:none;
  margin:0;
  padding:0;
  display:grid;
  gap:.65rem;
  font-size:.9rem;
  line-height:1.7;
  color:var(--mist);
}
.page-contact .timebar__notes li{
  position:relative;
  padding-left:1.05rem;
  opacity:.88;
}
.page-contact .timebar__notes li::before{
  content:"";
  position:absolute;
  left:0;
  top:.62em;
  width:6px;
  height:6px;
  background:var(--cyan);
}

/* ---------- 合作共建 ---------- */
.page-contact .fb-coop{position:relative;padding-block:clamp(2.25rem,5vw,4rem);overflow:hidden;}
.page-contact .fb-coop__inner{display:grid;gap:clamp(1.75rem,4vw,3rem);align-items:center;}
.page-contact .fb-coop .section-head__kicker{color:var(--cyan);}
.page-contact .fb-coop__title{
  font-family:var(--font-display);
  font-weight:900;
  font-stretch:condensed;
  letter-spacing:-.02em;
  font-size:clamp(1.65rem,4.2vw,2.5rem);
  line-height:1.08;
  color:var(--white);
  margin:.4rem 0 .9rem;
}
.page-contact .fb-coop__text{
  font-size:.95rem;
  line-height:1.8;
  color:var(--mist);
  opacity:.86;
  margin:0;
  max-width:34rem;
}
.page-contact .fb-coop__list{
  list-style:none;
  margin:1.15rem 0 1.25rem;
  padding:0;
  display:grid;
  gap:.75rem;
}
.page-contact .fb-coop__list li{
  position:relative;
  padding-left:1.25rem;
  font-size:.92rem;
  line-height:1.75;
  color:var(--mist);
  opacity:.88;
}
.page-contact .fb-coop__list li::before{
  content:"";
  position:absolute;
  left:0;
  top:.58em;
  width:8px;
  height:8px;
  background:var(--orange);
  transform:rotate(45deg);
}
.page-contact .fb-coop__list strong{color:var(--white);font-weight:700;}
.page-contact .fb-coop__how{
  font-size:.9rem;
  line-height:1.75;
  color:var(--mist);
  opacity:.82;
  margin:0 0 1.5rem;
  padding:.85rem 1rem;
  border-left:2px solid var(--cyan);
  background:rgba(6,26,19,.35);
}
.page-contact .fb-coop__how .mono{color:var(--cyan);word-break:break-all;}
.page-contact .fb-coop__media{margin:0;}
.page-contact .fb-coop__media img{
  display:block;
  width:100%;
  height:auto;
  aspect-ratio:16/7;
  object-fit:cover;
}

/* ---------- 收束 ---------- */
.page-contact .fb-tail{padding-block:clamp(2rem,4.5vw,3.25rem);}
.page-contact .fb-tail__inner{display:grid;gap:clamp(1.75rem,4vw,2.75rem);}
.page-contact .fb-tail__title{
  font-family:var(--font-display);
  font-weight:800;
  font-size:clamp(1.25rem,3vw,1.6rem);
  line-height:1.25;
  color:var(--ink);
  margin:0;
}
.page-contact .fb-tail__list{
  list-style:none;
  margin:1.15rem 0 0;
  padding:0;
  display:grid;
  gap:.8rem;
}
.page-contact .fb-tail__list li{
  font-size:.92rem;
  line-height:1.7;
  color:var(--ink);
  opacity:.82;
  padding-bottom:.8rem;
  border-bottom:1px solid rgba(6,26,19,.12);
}
.page-contact .fb-tail__list li:last-child{border-bottom:0;padding-bottom:0;}
.page-contact .fb-tail__list a{
  color:var(--grass);
  font-weight:700;
  text-decoration:none;
  border-bottom:2px solid var(--cyan);
}
.page-contact .fb-tail__list a:hover,
.page-contact .fb-tail__list a:focus-visible{background:rgba(46,230,182,.22);}
.page-contact .fb-top{
  display:inline-block;
  margin-top:1.5rem;
  font-family:var(--font-mono);
  font-size:.8rem;
  letter-spacing:.06em;
  color:var(--ink);
  text-decoration:none;
  border-bottom:1px solid var(--ink);
  padding-bottom:2px;
}
.page-contact .fb-top:hover,
.page-contact .fb-top:focus-visible{color:var(--grass);border-color:var(--grass);}
.page-contact .fb-tail__legal{
  background:var(--white);
  border:1px solid rgba(6,26,19,.14);
  border-top:6px solid var(--grass);
  padding:clamp(1.1rem,2.6vw,1.5rem);
}
.page-contact .fb-tail__legal-label{
  font-size:.74rem;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:var(--stand);
  margin:0 0 .4rem;
}
.page-contact .fb-tail__legal-value{
  font-size:clamp(.95rem,2.3vw,1.08rem);
  font-weight:600;
  color:var(--ink);
  margin:0 0 .8rem;
  word-break:break-all;
}
.page-contact .fb-tail__legal-note{
  font-size:.86rem;
  line-height:1.7;
  color:var(--ink);
  opacity:.72;
  margin:0;
}

/* ---------- 响应式 ---------- */
@media (min-width:620px){
  .page-contact .fb-types__grid{grid-template-columns:repeat(2,minmax(0,1fr));}
}

@media (min-width:900px){
  .page-contact .fb-hero__inner{grid-template-columns:minmax(0,7fr) minmax(0,5fr);align-items:center;}
  .page-contact .fb-main__grid{grid-template-columns:minmax(0,5fr) minmax(0,7fr);align-items:start;}
  .page-contact .fb-response__inner{grid-template-columns:minmax(0,4fr) minmax(0,8fr);align-items:center;}
  .page-contact .fb-coop__inner{grid-template-columns:minmax(0,6fr) minmax(0,6fr);}
  .page-contact .fb-tail__inner{grid-template-columns:minmax(0,7fr) minmax(0,4fr);align-items:start;}
}

@media (min-width:1080px){
  .page-contact .fb-types__grid{grid-template-columns:repeat(4,minmax(0,1fr));}
}

@media (max-width:560px){
  .page-contact .fb-hero__main{padding:.75rem .85rem;}
  .page-contact .timebar__scale{
    display:flex;
    flex-direction:column;
    align-items:stretch;
    gap:.45rem;
  }
  .page-contact .timebar__tick:last-child{align-self:flex-end;}
  .page-contact .timebar__track{height:10px;}
  .page-contact .contact-card__value{font-size:.95rem;}
}
