/* ===== 页面专属样式：about ===== */
.page-about{
  --ab-track-gap: 0;
  --ab-deco-opacity: 0.14;
  --ab-border-gold: rgba(201, 162, 39, 0.28);
  --ab-bg-glow: radial-gradient(ellipse at 88% 6%, rgba(15, 32, 39, 0.8), transparent 52%);
  position: relative;
  max-width: var(--container-max);
  margin-inline: auto;
  padding: var(--sp-5) var(--container-pad) var(--sp-10);
  background: var(--ab-bg-glow), var(--color-ink);
  color: var(--color-cream);
  font-family: var(--font-body);
  line-height: 1.75;
  overflow-x: clip;
}
.page-about *,.page-about *::before,.page-about *::after{box-sizing:border-box;}
.page-about a{color:inherit;text-decoration-color:rgba(201,162,39,.4);text-underline-offset:.2em;}
.page-about img{max-width:100%;height:auto;}
.page-about .breadcrumb{
  display:flex;flex-wrap:wrap;align-items:center;gap:var(--sp-2);
  font-family:var(--font-data);
  font-size:var(--fz-small);
  color:var(--color-grey-gold);
  padding-bottom:var(--sp-4);
  border-bottom:1px solid rgba(176,176,176,.14);
  margin-bottom:var(--sp-6);
}
.page-about .breadcrumb a{color:var(--color-gold);}
.page-about .breadcrumb [aria-current="page"]{color:var(--color-cream);}

/* ---------- Hero ---------- */
.page-about .about-hero{
  position:relative;
  isolation:isolate;
  padding:var(--sp-8) 0 var(--sp-10);
  background:
    linear-gradient(135deg, rgba(15,32,39,.92) 0%, rgba(15,32,39,.55) 46%, transparent 72%),
    linear-gradient(180deg, var(--color-charcoal) 0%, var(--color-ink) 100%);
  border-radius:var(--radius-lg);
  border:1px solid rgba(15,32,39,.7);
  overflow:hidden;
}
.page-about .about-hero::after{
  content:"";
  position:absolute;
  top:-20%;right:-8%;
  width:48%;height:120%;
  background:
    repeating-linear-gradient(45deg, rgba(201,162,39,.12) 0 2px, transparent 2px 22px),
    linear-gradient(135deg, rgba(139,0,0,.18), rgba(15,32,39,0) 60%);
  clip-path:polygon(26% 0, 100% 0, 100% 100%, 0 100%);
  transform:skewX(-6deg);
  z-index:0;
  pointer-events:none;
}
.page-about .about-hero__inner{position:relative;z-index:2;max-width:760px;}
.page-about .about-hero__kicker{
  font-family:var(--font-data);
  font-size:var(--fz-small);
  font-weight:700;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:var(--color-gold-bright);
  margin-bottom:var(--sp-4);
  display:flex;align-items:center;gap:var(--sp-3);
}
.page-about .about-hero__kicker::before{
  content:"";
  width:36px;height:2px;
  background:linear-gradient(90deg, var(--color-gold), rgba(201,162,39,0));
}
.page-about .page-hero__title{
  font-family:var(--font-heading);
  font-size:var(--fz-h1);
  font-weight:700;
  line-height:1.14;
  letter-spacing:.02em;
  margin:0 0 var(--sp-3);
}
.page-about .page-hero__lede{
  font-family:var(--font-heading);
  font-size:var(--fz-h3);
  color:var(--color-gold);
  letter-spacing:.06em;
  margin:0 0 var(--sp-4);
}
.page-about .page-hero__subtitle{
  font-size:var(--fz-body);
  color:var(--color-grey-gold);
  max-width:34em;
  margin:0;
}
.page-about .about-hero__meta{
  display:inline-block;
  margin-top:var(--sp-5);
  padding:var(--sp-2) var(--sp-4);
  font-family:var(--font-data);
  font-size:var(--fz-small);
  color:var(--color-gold);
  background:rgba(201,162,39,.08);
  border-left:3px solid var(--color-gold);
  border-radius:0 var(--radius-sm) var(--radius-sm) 0;
}
.page-about .about-hero__deco{
  position:absolute;
  right:-4%;bottom:8%;
  width:200px;height:200px;
  z-index:1;
  opacity:var(--ab-deco-opacity);
  background-image:
    linear-gradient(rgba(201,162,39,.8) 1px, transparent 1px),
    linear-gradient(90deg, rgba(201,162,39,.8) 1px, transparent 1px);
  background-size:32px 32px;
  transform:perspective(400px) rotateY(-18deg) rotateZ(5deg);
  pointer-events:none;
}

/* ---------- 章节通用 ---------- */
.page-about .section-title{
  display:flex;
  flex-wrap:wrap;
  align-items:baseline;
  gap:0 var(--sp-4);
  margin-bottom:var(--sp-6);
  padding-top:var(--sp-8);
  border-top:1px solid rgba(176,176,176,.12);
}
.page-about .section-title__index{
  font-family:var(--font-data);
  font-size:var(--fz-small);
  font-weight:700;
  color:var(--color-gold);
  letter-spacing:.1em;
}
.page-about .section-title h2{
  font-family:var(--font-heading);
  font-size:var(--fz-h2);
  line-height:1.2;
  margin:0;
}
.page-about .section-title p{
  flex-basis:100%;
  color:var(--color-grey-gold);
  margin:var(--sp-2) 0 0;
  font-size:var(--fz-body);
}
.page-about h3{
  font-family:var(--font-heading);
  font-size:var(--fz-h3);
  line-height:1.35;
  margin:0 0 var(--sp-3);
}

/* ---------- 品牌故事 ---------- */
.page-about .brand-story__layout{
  display:grid;
  grid-template-columns:1fr;
  gap:var(--sp-6);
  align-items:start;
}
.page-about .brand-story__text p{
  margin:0 0 var(--sp-4);
  color:rgba(245,245,240,.85);
}
.page-about .brand-story__text p:first-child::first-letter{
  font-family:var(--font-heading);
  font-size:2.8em;
  line-height:.85;
  float:left;
  padding-right:var(--sp-3);
  color:var(--color-gold);
}
.page-about .brand-story__facts{
  display:flex;
  flex-direction:column;
  gap:var(--sp-5);
}
.page-about .brand-story__panel{
  background:
    linear-gradient(135deg, rgba(15,32,39,.95) 0%, rgba(26,26,26,.98) 100%),
    var(--color-deep-blue);
  border:1px solid var(--ab-border-gold);
  box-shadow:var(--shadow-soft);
  padding:var(--sp-5);
  border-radius:var(--radius-md);
  position:relative;
  overflow:hidden;
}
.page-about .brand-story__panel::after{
  content:"";
  position:absolute;
  inset:0;
  background:radial-gradient(circle at 100% 0%, rgba(201,162,39,.14), transparent 55%);
  pointer-events:none;
}
.page-about .brand-story__panel h3{
  font-family:var(--font-heading);
  font-size:var(--fz-h3);
  color:var(--color-gold-bright);
  letter-spacing:.1em;
  padding-bottom:var(--sp-3);
  border-bottom:1px solid rgba(201,162,39,.25);
}
.page-about .brand-story__panel dl{
  margin:0;
}
.page-about .brand-story__panel .data-row{
  display:flex;
  justify-content:space-between;
  align-items:baseline;
  gap:var(--sp-4);
  padding:var(--sp-3) 0;
  border-bottom:1px dashed rgba(176,176,176,.14);
}
.page-about .brand-story__panel .data-row:last-child{border-bottom:none;}
.page-about .brand-story__panel .data-row__label{
  color:var(--color-grey-gold);
  font-size:var(--fz-small);
}
.page-about .brand-story__panel .data-row__value{
  font-family:var(--font-data);
  font-size:var(--fz-h3);
  font-weight:700;
  color:var(--color-gold-bright);
  margin:0;
}
.page-about .image-figure{
  margin:0;
}
.page-about .image-figure__frame{
  background:var(--color-charcoal);
  border-radius:var(--radius-md);
  overflow:hidden;
}
.page-about .image-figure__img{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center;
  transition:transform .6s cubic-bezier(.22,1,.36,1);
}
.page-about .image-figure:hover .image-figure__img,
.page-about .culture__figure:hover .culture__img{
  transform:scale(1.03);
}
.page-about .image-figure__caption{
  padding-top:var(--sp-2);
  font-family:var(--font-data);
  font-size:var(--fz-tiny);
  color:var(--color-grey-gold);
  line-height:1.6;
}

/* ---------- 信息架构理念 ---------- */
.page-about .ia-section{
  position:relative;
}
.page-about .ia-section__layout{
  display:grid;
  grid-template-columns:1fr;
  gap:var(--sp-6);
  align-items:center;
}
.page-about .ia-section__visual{
  border:1px solid var(--ab-border-gold);
  border-radius:var(--radius-md);
  padding:var(--sp-4);
  background:var(--color-charcoal);
  box-shadow:var(--shadow-soft);
}
.page-about .ia-section__text h3{
  color:var(--color-gold-bright);
}
.page-about .ia-section__text p{
  color:rgba(245,245,240,.82);
  margin-bottom:var(--sp-4);
}
.page-about .ia-section__principles{
  list-style:none;
  margin:var(--sp-5) 0 0;
  padding:0;
  display:grid;
  gap:var(--sp-3);
}
.page-about .ia-section__principles li{
  position:relative;
  padding:var(--sp-3) var(--sp-4);
  background:rgba(245,245,240,.04);
  border-left:3px solid var(--color-gold);
  border-radius:0 var(--radius-sm) var(--radius-sm) 0;
  color:rgba(245,245,240,.8);
  font-size:var(--fz-small);
}
.page-about .ia-section__principles strong{
  display:block;
  color:var(--color-cream);
  font-size:var(--fz-body);
  margin-bottom:var(--sp-1);
}

/* ---------- 里程碑 ---------- */
.page-about .milestones{
  margin-top:var(--sp-10);
  padding:var(--sp-6) var(--sp-5);
  background:linear-gradient(155deg, rgba(15,32,39,.95) 0%, rgba(10,10,10,.96) 58%, rgba(15,32,39,.88) 100%);
  border:1px solid rgba(201,162,39,.15);
  border-radius:var(--radius-lg);
  position:relative;
  overflow:hidden;
}
.page-about .milestones::before{
  content:"";
  position:absolute;
  top:0;right:0;
  width:240px;height:240px;
  background:radial-gradient(circle at 60% 40%, rgba(201,162,39,.12), transparent 65%);
  pointer-events:none;
}
.page-about .milestones .section-title{border-top:1px solid rgba(201,162,39,.18);}
.page-about .milestones__list{
  list-style:none;
  margin:0;
  padding:0;
  position:relative;
}
.page-about .milestones__list::before{
  content:"";
  position:absolute;
  left:15px;
  top:10px;
  bottom:10px;
  width:2px;
  background:linear-gradient(180deg, var(--color-gold) 0%, rgba(201,162,39,.18) 70%, transparent 100%);
  border-radius:1px;
}
.page-about .milestones__item{
  position:relative;
  padding-left:48px;
  padding-bottom:var(--sp-6);
}
.page-about .milestones__item:last-child{padding-bottom:var(--sp-2);}
.page-about .milestones__dot{
  position:absolute;
  left:7px;
  top:20px;
  width:18px;
  height:18px;
  border-radius:50%;
  background:var(--color-ink);
  border:3px solid var(--color-gold);
  box-shadow:0 0 0 5px rgba(201,162,39,.18);
}
.page-about .milestones__dot::after{
  content:"";
  position:absolute;
  inset:3px;
  border-radius:50%;
  background:var(--color-gold);
  transition:transform .35s ease;
}
.page-about .milestones__item--latest .milestones__dot{
  border-color:var(--color-gold-bright);
  box-shadow:0 0 0 6px rgba(245,215,110,.22), 0 0 24px rgba(245,215,110,.3);
}
.page-about .milestones__item--latest .milestones__dot::after{
  background:var(--color-gold-bright);
  transform:scale(1.35);
}
.page-about .milestones__time{
  display:block;
  font-family:var(--font-data);
  font-size:var(--fz-h3);
  font-weight:700;
  color:var(--color-gold);
  letter-spacing:.06em;
  margin-bottom:var(--sp-1);
}
.page-about .milestones__item--latest .milestones__time{
  color:var(--color-gold-bright);
}
.page-about .milestones__content h3{
  font-family:var(--font-heading);
  font-size:var(--fz-body);
  color:var(--color-cream);
  margin:0 0 var(--sp-1);
}
.page-about .milestones__content p{
  margin:0;
  color:var(--color-grey-gold);
  font-size:var(--fz-small);
  max-width:40em;
}

/* ---------- 资质与认证 ---------- */
.page-about .credentials__grid{
  display:grid;
  grid-template-columns:1fr;
  gap:var(--sp-5);
  margin-bottom:var(--sp-5);
}
.page-about .credentials__card{
  position:relative;
  background:var(--color-charcoal);
  border:1px solid rgba(176,176,176,.1);
  border-top:3px solid var(--color-gold);
  border-radius:var(--radius-md);
  padding:var(--sp-5) var(--sp-5) var(--sp-5) calc(var(--sp-5) + 2.6rem);
  transition:transform .35s ease, box-shadow .35s ease, border-color .35s ease;
}
.page-about .credentials__card:hover{
  transform:translateY(-3px);
  box-shadow:var(--shadow-gold);
  border-color:var(--ab-border-gold);
}
.page-about .credentials__num{
  position:absolute;
  left:var(--sp-4);top:var(--sp-5);
  font-family:var(--font-data);
  font-size:var(--fz-small);
  font-weight:700;
  color:var(--color-gold);
  border:1px solid rgba(201,162,39,.4);
  border-radius:var(--radius-sm);
  width:1.8rem;height:1.8rem;
  display:grid;place-items:center;
}
.page-about .credentials__card h3{
  font-size:var(--fz-body);
  color:var(--color-gold-bright);
  margin-bottom:var(--sp-2);
}
.page-about .credentials__card p{
  margin:0;
  color:var(--color-grey-gold);
  font-size:var(--fz-small);
}
.page-about .credentials__extra .note{
  background:rgba(15,32,39,.55);
  border:1px solid rgba(139,0,0,.35);
  border-left:4px solid var(--color-crimson);
  border-radius:var(--radius-sm);
  padding:var(--sp-4) var(--sp-5);
  color:rgba(245,245,240,.8);
  font-size:var(--fz-small);
}

/* ---------- 地域文化基因 ---------- */
.page-about .culture{
  position:relative;
}
.page-about .culture::before{
  content:"";
  position:absolute;
  left:-6%;top:18%;
  width:200px;height:200px;
  background:
    radial-gradient(circle at 30% 30%, transparent 24% 26%, rgba(201,162,39,.1) 26% 28%, transparent 28% 30%);
  background-size:38px 38px;
  opacity:.5;
  pointer-events:none;
}
.page-about .culture__layout{
  display:grid;
  grid-template-columns:1fr;
  gap:var(--sp-5);
  align-items:center;
}
.page-about .culture__figure{
  margin:0;
  border:1px solid var(--ab-border-gold);
  border-radius:var(--radius-lg);
  padding:var(--sp-3);
  background:var(--color-charcoal);
}
.page-about .culture__img{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center;
  border-radius:var(--radius-md);
  transition:transform .6s cubic-bezier(.22,1,.36,1);
}
.page-about .culture__figure figcaption{
  padding:var(--sp-3) var(--sp-2) var(--sp-1);
  font-family:var(--font-data);
  font-size:var(--fz-tiny);
  color:var(--color-grey-gold);
}
.page-about .culture__text p{
  color:rgba(245,245,240,.83);
  margin-bottom:var(--sp-4);
}

/* ---------- 页尾链接 ---------- */
.page-about .about-links{
  margin-top:var(--sp-10);
  padding-top:var(--sp-8);
  border-top:1px solid rgba(201,162,39,.2);
}
.page-about .about-links > h2{
  font-family:var(--font-heading);
  font-size:var(--fz-h3);
  color:var(--color-gold-bright);
  margin:0 0 var(--sp-2);
}
.page-about .about-links > p{
  color:var(--color-grey-gold);
  margin:0 0 var(--sp-5);
  font-size:var(--fz-small);
}
.page-about .about-links__grid{
  display:grid;
  grid-template-columns:1fr;
  gap:var(--sp-4);
}
.page-about .about-links__card{
  display:block;
  position:relative;
  background:var(--color-charcoal);
  border:1px solid rgba(176,176,176,.1);
  border-radius:var(--radius-md);
  padding:var(--sp-5) calc(var(--sp-5) + 3rem) var(--sp-5) var(--sp-5);
  transition:transform .35s ease, box-shadow .35s ease, border-color .35s ease;
  text-decoration:none;
}
.page-about .about-links__card:hover{
  transform:translateY(-3px);
  border-color:var(--ab-border-gold);
  box-shadow:var(--shadow-gold);
  text-decoration:none;
}
.page-about .about-links__card h3{
  font-family:var(--font-heading);
  color:var(--color-gold);
  font-size:var(--fz-h3);
  margin-bottom:var(--sp-2);
}
.page-about .about-links__card p{
  margin:0;
  color:var(--color-grey-gold);
  font-size:var(--fz-small);
}
.page-about .about-links__go{
  position:absolute;
  right:var(--sp-5);top:50%;
  transform:translateY(-50%);
  font-size:var(--fz-h2);
  color:var(--color-gold);
  transition:transform .35s ease;
}
.page-about .about-links__card:hover .about-links__go{
  transform:translate(6px,-50%);
}

/* ---------- 响应式 ---------- */
@media (min-width: 768px){
  .page-about .brand-story__layout{
    grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);
    gap:var(--sp-8);
  }
  .page-about .brand-story__facts{
    flex-direction:column;
  }
  .page-about .ia-section__layout{
    grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);
    gap:var(--sp-8);
  }
  .page-about .ia-section__visual{order:1;}
  .page-about .ia-section__text{order:2;}
  .page-about .credentials__grid{
    grid-template-columns:repeat(2, minmax(0,1fr));
  }
  .page-about .culture__layout{
    grid-template-columns:minmax(0,.92fr) minmax(0,1.08fr);
    gap:var(--sp-8);
  }
  .page-about .about-links__grid{
    grid-template-columns:repeat(3, minmax(0,1fr));
  }
  /* 里程碑中线居中 */
  .page-about .milestones__list::before{
    left:50%;
    transform:translateX(-1px);
  }
  .page-about .milestones__item{
    width:50%;
    padding-left:0;
  }
  .page-about .milestones__item:nth-child(odd){
    text-align:right;
    padding-right:calc(var(--sp-6) + 28px);
    padding-left:0;
  }
  .page-about .milestones__item:nth-child(even){
    margin-left:50%;
    padding-left:calc(var(--sp-6) + 28px);
    padding-right:0;
  }
  .page-about .milestones__dot{
    top:22px;
  }
  .page-about .milestones__item:nth-child(odd) .milestones__dot{
    left:auto;
    right:-8px;
  }
  .page-about .milestones__item:nth-child(even) .milestones__dot{
    left:-8px;
  }
  .page-about .milestones__content p{
    margin-inline:0;
  }
}

@media (min-width: 1024px){
  .page-about{
    padding-top:var(--sp-8);
  }
  .page-about .about-hero{
    padding:var(--sp-10) var(--sp-8);
  }
  .page-about .brand-story__layout{
    gap:var(--sp-10);
  }
  .page-about .credentials__grid{
    grid-template-columns:repeat(3, minmax(0,1fr));
  }
  .page-about .mix-grid{
    display:grid;
    grid-template-columns:minmax(0,1fr) minmax(0,1fr);
    gap:var(--sp-8);
  }
}

/* 动效增强 */
@media (prefers-reduced-motion: no-preference){
  .page-about [data-reveal]{
    opacity:0;
    transform:translateY(18px);
    transition:opacity .6s ease, transform .6s cubic-bezier(.22,1,.36,1);
    transition-delay:var(--reveal-delay, 0ms);
  }
  .page-about [data-reveal].is-revealed{
    opacity:1;
    transform:none;
  }
  .page-about [data-reveal]:nth-child(2){
    --reveal-delay:80ms;
  }
  .page-about [data-reveal]:nth-child(3){
    --reveal-delay:160ms;
  }
}
@media (prefers-reduced-motion: reduce){
  .page-about [data-reveal]{
    opacity:1;
    transform:none;
  }
  .page-about .image-figure:hover .image-figure__img,
  .page-about .culture__figure:hover .culture__img{
    transform:none;
  }
}