/* ══════════════════════════════════════════════════
   四时织锦·舟游四海 — sections.css
   About / Zones / Seasons / Experiences 四个内容区
   ══════════════════════════════════════════════════ */

/* ═══ About ═══ */
.about {
  background: linear-gradient(180deg, var(--white) 0%, var(--paper) 100%);
  position: relative;
  overflow: hidden;
}
.about::before {
  content: '四';
  position: absolute;
  top: -0.1em; left: -0.08em;
  font-family: 'Ma Shan Zheng', serif;
  font-size: clamp(200px, 26vw, 380px);
  color: rgba(45,90,39,.028);
  pointer-events: none;
  line-height: 1;
}
.about-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 80px;
  align-items: start;
  position: relative; z-index: 1;
}
.about-left .s-desc { margin-bottom: 12px; }
.about-feats {
  margin-top: 32px;
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.feat-item {
  display: flex;
  align-items: flex-start;
  gap: 14px;
  padding: 16px 18px;
  background: rgba(255,255,255,.55);
  border-radius: var(--radius-md);
  border: 1px solid rgba(255,255,255,.65);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  box-shadow: 0 8px 22px rgba(0,0,0,.05);
  transition: transform var(--transition), box-shadow var(--transition), background var(--transition), border-color var(--transition);
}
.feat-item:nth-child(1) { background: linear-gradient(135deg, rgba(45,90,39,.12) 0%, rgba(255,255,255,.6) 100%); border-color: rgba(45,90,39,.22); }
.feat-item:nth-child(2) { background: linear-gradient(135deg, rgba(200,134,10,.12) 0%, rgba(255,255,255,.6) 100%); border-color: rgba(200,134,10,.22); }
.feat-item:nth-child(3) { background: linear-gradient(135deg, rgba(139,26,26,.1) 0%, rgba(255,255,255,.6) 100%); border-color: rgba(139,26,26,.2); }
.feat-item:nth-child(4) { background: linear-gradient(135deg, rgba(74,127,165,.12) 0%, rgba(255,255,255,.6) 100%); border-color: rgba(74,127,165,.22); }
.feat-item:hover { transform: translateY(-4px); box-shadow: 0 12px 30px rgba(0,0,0,.12); }
.feat-icon { font-size: 1.6rem; flex-shrink: 0; margin-top: 2px; }
.feat-text strong { display: block; font-size: .95rem; color: var(--ink); margin-bottom: 3px; font-weight: 700; }
.feat-text span   { font-size: .84rem; color: var(--gray); line-height: 1.5; }

/* 统计卡片 */
.stats-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 14px;
  margin-bottom: 24px;
}
.stat-card {
  background: var(--white);
  border: 1px solid rgba(0,0,0,.06);
  border-radius: var(--radius-md);
  padding: 22px 14px 18px;
  text-align: center;
  box-shadow: 0 2px 12px rgba(0,0,0,.07);
  transition: transform var(--transition), box-shadow var(--transition);
  position: relative;
  overflow: hidden;
}
.stat-card::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 3px;
  background: linear-gradient(to right, var(--green-mid), var(--green-light));
  transform: scaleX(0);
  transition: transform var(--transition);
}
.stat-card:hover { transform: translateY(-6px); box-shadow: 0 12px 36px rgba(0,0,0,.14); }
.stat-card:hover::before { transform: scaleX(1); }
.stat-icon { font-size: 1.6rem; margin-bottom: 10px; }
.stat-num {
  display: block;
  font-family: 'Noto Serif SC', serif;
  font-size: 1.7rem;
  font-weight: 900;
  color: var(--green-mid);
  line-height: 1.2;
  margin-bottom: 6px;
}
.stat-lbl { font-size: .75rem; color: var(--gray); letter-spacing: .04em; line-height: 1.4; }

.about-img-wrap {
  position: relative;
  border-radius: var(--radius-lg);
  overflow: hidden;
  box-shadow: var(--shadow-lg);
}
.about-img-wrap img { width: 100%; aspect-ratio: 4/3; object-fit: cover; transition: transform .7s ease; }
.about-img-wrap:hover img { transform: scale(1.04); }
.about-img-badge {
  position: absolute;
  bottom: 16px; right: 16px;
  background: var(--gold);
  color: var(--white);
  font-size: .8rem;
  font-weight: 700;
  padding: 8px 18px;
  border-radius: var(--radius-xl);
  letter-spacing: .06em;
  box-shadow: 0 4px 16px rgba(200,134,10,.5);
  backdrop-filter: blur(4px);
}

/* ═══ Zones ═══ */
.zones {
  background: linear-gradient(180deg, #F8F4EE 0%, #F2EBE0 50%, #EDE3D6 100%);
  position: relative;
  overflow: hidden;
}
.zones::before {
  content: '脉';
  position: absolute;
  top: 50%; right: -0.08em;
  transform: translateY(-50%);
  font-family: 'Ma Shan Zheng', serif;
  font-size: clamp(280px, 38vw, 580px);
  color: rgba(45,90,39,.02);
  pointer-events: none;
  line-height: 1;
}

/* ── 舟游四海 沉浸式横幅 ── */
.voyage-banner {
  display: grid;
  grid-template-columns: 42% 58%;
  gap: 0;
  background: var(--green-dark);
  border-radius: var(--radius-lg);
  overflow: hidden;
  box-shadow: 0 28px 80px rgba(15,42,15,.3);
  margin-bottom: 72px;
  min-height: 520px;
  position: relative;
}
.voyage-img-wrap {
  position: relative;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(150deg, #0a1e0a 0%, #1A3A1A 60%, #243e22 100%);
  padding: 32px;
}
.voyage-img-wrap img {
  width: 100%;
  max-width: 480px;
  object-fit: contain;
  position: relative;
  z-index: 1;
  filter: drop-shadow(0 20px 48px rgba(0,0,0,.45)) drop-shadow(0 6px 16px rgba(0,0,0,.3));
  transition: transform .9s cubic-bezier(.4,0,.2,1);
}
.voyage-banner:hover .voyage-img-wrap img { transform: translateY(-10px) scale(1.03); }
.voyage-img-glow {
  position: absolute; inset: 0;
  background: radial-gradient(ellipse at 50% 50%, rgba(90,180,90,.12) 0%, transparent 65%);
  pointer-events: none;
}
.voyage-content {
  padding: 52px 56px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  background: linear-gradient(150deg, #1e3d1e 0%, #162b16 50%, #0f2010 100%);
  position: relative;
  overflow: hidden;
}
.voyage-content::before {
  content: '舟';
  position: absolute;
  bottom: -0.15em; right: -0.08em;
  font-family: 'Ma Shan Zheng', serif;
  font-size: 16rem;
  color: rgba(255,255,255,.03);
  line-height: 1;
  pointer-events: none;
}
.voyage-eyebrow {
  font-size: .73rem;
  font-weight: 700;
  letter-spacing: .2em;
  color: rgba(150,220,150,.9);
  background: rgba(90,180,90,.12);
  border: 1px solid rgba(90,180,90,.25);
  padding: 5px 14px;
  border-radius: var(--radius-xl);
  display: inline-block;
  margin-bottom: 20px;
  width: fit-content;
}
.voyage-title {
  font-family: 'Noto Serif SC', serif;
  font-size: 3.2rem;
  font-weight: 900;
  color: var(--white);
  letter-spacing: .28em;
  margin-bottom: 10px;
  line-height: 1.1;
  text-shadow: 0 4px 24px rgba(0,0,0,.4);
}
.voyage-tagline {
  font-size: .95rem;
  color: rgba(200,230,200,.75);
  letter-spacing: .1em;
  margin-bottom: 22px;
  font-style: italic;
}
.voyage-desc {
  font-size: .9rem;
  color: rgba(220,240,220,.7);
  line-height: 1.9;
  margin-bottom: 28px;
  border-left: 2px solid rgba(90,180,90,.5);
  padding-left: 16px;
}
.voyage-routes { display: flex; flex-direction: column; gap: 8px; }
.vr-item {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 10px 14px;
  border-radius: var(--radius-md);
  transition: transform var(--transition), background var(--transition);
}
.vr-item:hover { transform: translateX(6px); }
.vr-dot { width: 8px; height: 8px; border-radius: 50%; flex-shrink: 0; }
.vr-info { display: flex; flex-direction: column; gap: 2px; }
.vr-info strong { font-size: .85rem; color: rgba(255,255,255,.9); font-weight: 700; }
.vr-info span   { font-size: .76rem; color: rgba(200,230,200,.6); }
.vr-core     { background: rgba(90,160,90,.12); border: 1px solid rgba(90,160,90,.15); }
.vr-flower   { background: rgba(200,160,60,.12); border: 1px solid rgba(200,160,60,.15); }
.vr-mountain { background: rgba(90,160,90,.12); border: 1px solid rgba(90,160,90,.15); }
.vr-wall     { background: rgba(180,80,80,.12); border: 1px solid rgba(180,80,80,.15); }
.vr-core     .vr-dot { background: #7ecb7e; box-shadow: 0 0 6px rgba(126,203,126,.5); }
.vr-flower   .vr-dot { background: #e8b84b; box-shadow: 0 0 6px rgba(232,184,75,.5); }
.vr-mountain .vr-dot { background: #5A8A50; box-shadow: 0 0 6px rgba(90,138,80,.5); }
.vr-wall     .vr-dot { background: #c06060; box-shadow: 0 0 6px rgba(192,96,96,.5); }

/* ── 分区小标题 ── */
.zones-sub-header {
  display: flex;
  align-items: center;
  gap: 16px;
  margin: 48px 0 28px;
}
.zones-sub-header span {
  font-size: .85rem;
  font-weight: 700;
  letter-spacing: .14em;
  color: var(--gold);
  white-space: nowrap;
  background: rgba(200,134,10,.08);
  border: 1px solid rgba(200,134,10,.2);
  padding: 5px 18px;
  border-radius: var(--radius-xl);
}
.zsh-line {
  flex: 1;
  height: 1px;
  background: linear-gradient(to right, rgba(200,134,10,.35), rgba(200,134,10,.04));
}
.zones-sub-header .zsh-line:first-child {
  background: linear-gradient(to left, rgba(200,134,10,.35), rgba(200,134,10,.04));
}

/* ── 一核 大卡 (重设计) ── */
.zone-hero-card {
  position: relative;
  border-radius: var(--radius-lg);
  overflow: hidden;
  box-shadow: 0 24px 64px rgba(0,0,0,.18);
  margin-bottom: 40px;
  min-height: 460px;
  display: grid;
  grid-template-columns: 55% 45%;
}
.zhc-img {
  position: relative;
  overflow: hidden;
}
.zhc-img img {
  width: 100%; height: 100%;
  object-fit: cover;
  transition: transform .8s cubic-bezier(.4,0,.2,1);
}
.zone-hero-card:hover .zhc-img img { transform: scale(1.05); }
.zhc-img-overlay {
  position: absolute; inset: 0;
  background: linear-gradient(to right, rgba(10,28,10,.15) 0%, rgba(10,28,10,.05) 60%, rgba(248,244,238,.8) 100%);
}
.zhc-body {
  padding: 52px 48px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  background: linear-gradient(160deg, #F8F4EE 0%, #F0E8DC 100%);
  position: relative;
  overflow: hidden;
}
.zhc-body::before {
  content: '核';
  position: absolute;
  right: -0.1em; bottom: -0.15em;
  font-family: 'Ma Shan Zheng', serif;
  font-size: 12rem;
  font-weight: 900;
  line-height: 1;
  color: rgba(45,90,39,.06);
  pointer-events: none;
}
.zone-num-badge {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background: linear-gradient(135deg, var(--green-mid) 0%, var(--green-light) 100%);
  color: var(--white);
  font-size: .73rem;
  font-weight: 700;
  letter-spacing: .12em;
  padding: 6px 18px;
  border-radius: var(--radius-xl);
  margin-bottom: 18px;
  width: fit-content;
  box-shadow: 0 4px 16px rgba(45,90,39,.35);
}
.zone-h3 {
  font-family: 'Noto Serif SC', serif;
  font-size: 2.2rem;
  font-weight: 900;
  color: var(--ink);
  margin-bottom: 8px;
  line-height: 1.2;
  position: relative; z-index: 1;
}
.zone-theme {
  font-size: .95rem;
  color: var(--gold);
  margin-bottom: 20px;
  letter-spacing: .08em;
  font-weight: 600;
  position: relative; z-index: 1;
}
.zone-p {
  font-size: .92rem;
  color: var(--gray);
  line-height: 1.9;
  margin-bottom: 28px;
  position: relative; z-index: 1;
  border-left: 2px solid rgba(45,90,39,.25);
  padding-left: 14px;
}
.zone-tags { display: flex; flex-wrap: wrap; gap: 8px; position: relative; z-index: 1; }
.zone-tags span {
  font-size: .78rem;
  color: var(--green-mid);
  background: rgba(45,90,39,.06);
  border: 1px solid rgba(45,90,39,.18);
  padding: 5px 14px;
  border-radius: var(--radius-xl);
  transition: background var(--transition), transform var(--transition);
}
.zone-tags span:hover {
  background: rgba(45,90,39,.12);
  transform: translateY(-2px);
}

/* ══════════════════════════════════════
   三脉横向网格 — Horizontal 3-Column
   ══════════════════════════════════════ */
.veins-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 28px;
}

.vg-card {
  border-radius: var(--radius-lg);
  overflow: hidden;
  background: var(--white);
  box-shadow: 0 8px 32px rgba(0,0,0,.1);
  transition: transform .45s cubic-bezier(.4,0,.2,1), box-shadow .45s cubic-bezier(.4,0,.2,1);
  display: flex;
  flex-direction: column;
  position: relative;
}
.vg-card:hover {
  transform: translateY(-16px);
  box-shadow: 0 32px 80px rgba(0,0,0,.18);
}

/* 顶部色条 */
.vg-card::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 4px;
  z-index: 10;
  transition: height .35s ease;
}
.vg-card:hover::before { height: 6px; }
.vg-flower::before   { background: linear-gradient(to right, var(--gold), #f0c860); }
.vg-mountain::before { background: linear-gradient(to right, var(--green-mid), var(--green-light)); }
.vg-wall::before     { background: linear-gradient(to right, var(--red-mid), #c04848); }

/* 图片区域 */
.vg-img {
  position: relative;
  aspect-ratio: 4 / 3;
  overflow: hidden;
  background: linear-gradient(140deg, #f5f1ea 0%, #ece5db 100%);
}
.vg-img img {
  width: 100%; height: 100%;
  object-fit: cover;
  object-position: center;
  transform: scale(1.08);
  transition: transform .65s cubic-bezier(.4,0,.2,1), filter .35s ease, opacity .35s ease;
}
.vg-card:hover .vg-img img {
  object-fit: contain;
  transform: scale(1);
  padding: 10px;
  filter: drop-shadow(0 8px 18px rgba(0,0,0,.2));
}
.vg-img-mask {
  position: absolute; inset: 0;
  background: linear-gradient(to bottom, rgba(0,0,0,.04) 0%, rgba(0,0,0,.5) 100%);
  transition: opacity .45s ease;
}
.vg-card:hover .vg-img-mask { opacity: 0; }

/* P1 高级悬停全图预览层（JS 注入） */
.vg-hover-preview {
  position: absolute;
  inset: 10px;
  border-radius: 18px;
  overflow: hidden;
  opacity: 0;
  transform: perspective(900px) translateY(16px) scale(.92) rotateX(var(--rx, 0deg)) rotateY(var(--ry, 0deg));
  transition: opacity .36s cubic-bezier(.2,.9,.2,1), transform .36s cubic-bezier(.2,.9,.2,1);
  pointer-events: none;
  z-index: 3;
  background: radial-gradient(circle at 50% 40%, rgba(34,40,50,.92) 0%, rgba(10,12,16,.96) 72%);
  border: 1px solid rgba(255,255,255,.2);
  box-shadow: 0 24px 56px rgba(0,0,0,.48), inset 0 1px 0 rgba(255,255,255,.16);
}
.vg-hover-preview::after {
  content: '';
  position: absolute;
  inset: 0;
  border-radius: inherit;
  padding: 1px;
  background: linear-gradient(125deg, rgba(255,255,255,.6), rgba(255,255,255,0) 35%, rgba(95,170,255,.45) 70%, rgba(255,255,255,.3));
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite: xor;
  mask-composite: exclude;
  pointer-events: none;
}
.vg-hover-preview::before {
  content: '';
  position: absolute;
  inset: -2px;
  background: radial-gradient(circle at var(--mx, 50%) var(--my, 50%), rgba(130,190,255,.35) 0%, rgba(130,190,255,.08) 24%, transparent 62%);
  mix-blend-mode: screen;
  pointer-events: none;
}
.vg-hover-img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  padding: 12px;
  transform: translate3d(calc((var(--mx,50%) - 50%) * .08), calc((var(--my,50%) - 50%) * .1), 0) scale(1.03);
  transition: transform .28s ease-out;
  filter: drop-shadow(0 16px 32px rgba(0,0,0,.55)) contrast(1.03) saturate(1.04);
}
.vg-card.is-previewing .vg-hover-preview {
  opacity: 1;
  transform: perspective(900px) translateY(0) scale(1) rotateX(var(--rx, 0deg)) rotateY(var(--ry, 0deg));
}
.vg-card.is-previewing .vg-img img {
  opacity: .16;
  filter: saturate(.7) brightness(.72);
}

/* 禁用黑色悬浮预览层：回到清晰直出方案 */
.vg-hover-preview { display: none !important; }
.vg-card.is-previewing .vg-img img {
  opacity: 1;
  filter: none;
}
.vg-route-chip {
  position: absolute;
  bottom: 14px; left: 14px;
  font-size: .7rem;
  font-weight: 700;
  letter-spacing: .14em;
  color: var(--white);
  padding: 5px 14px;
  border-radius: var(--radius-xl);
  backdrop-filter: blur(10px);
  z-index: 2;
}
.vg-flower   .vg-route-chip { background: rgba(200,134,10,.88); }
.vg-mountain .vg-route-chip { background: rgba(45,90,39,.88); }
.vg-wall     .vg-route-chip { background: rgba(139,26,26,.88); }

.vg-seq-num {
  position: absolute;
  top: 14px; right: 18px;
  font-family: 'Noto Serif SC', serif;
  font-size: 2.2rem;
  font-weight: 900;
  color: rgba(255,255,255,.55);
  line-height: 1;
  z-index: 2;
  text-shadow: 0 2px 8px rgba(0,0,0,.3);
}

/* 卡片内容 */
.vg-body {
  padding: 28px 26px 32px;
  flex: 1;
  display: flex;
  flex-direction: column;
  position: relative;
}
.vg-label {
  display: inline-block;
  font-size: .7rem;
  font-weight: 700;
  letter-spacing: .2em;
  padding: 4px 12px;
  border-radius: var(--radius-xl);
  margin-bottom: 12px;
  width: fit-content;
}
.vg-flower   .vg-label { background: rgba(200,134,10,.1); color: var(--gold);      border: 1px solid rgba(200,134,10,.22); }
.vg-mountain .vg-label { background: rgba(45,90,39,.1);  color: var(--green-mid); border: 1px solid rgba(45,90,39,.22); }
.vg-wall     .vg-label { background: rgba(139,26,26,.1); color: var(--red-mid);   border: 1px solid rgba(139,26,26,.22); }

.vg-title {
  font-family: 'Noto Serif SC', serif;
  font-size: 1.45rem;
  font-weight: 900;
  color: var(--ink);
  margin-bottom: 6px;
  line-height: 1.25;
}
.vg-sub {
  font-size: .8rem;
  letter-spacing: .06em;
  margin-bottom: 14px;
  font-weight: 600;
}
.vg-flower   .vg-sub { color: var(--gold); }
.vg-mountain .vg-sub { color: var(--green-mid); }
.vg-wall     .vg-sub { color: var(--red-mid); }

.vg-desc {
  font-size: .87rem;
  color: var(--gray);
  line-height: 1.85;
  margin-bottom: 20px;
  flex: 1;
  padding: 12px 14px;
  border-radius: 12px;
  border: 1px solid transparent;
}
.vg-flower   .vg-desc { background: rgba(200,134,10,.06); border-color: rgba(200,134,10,.15); }
.vg-mountain .vg-desc { background: rgba(45,90,39,.06);  border-color: rgba(45,90,39,.15); }
.vg-wall     .vg-desc { background: rgba(139,26,26,.05); border-color: rgba(139,26,26,.14); }

.vg-feats {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.vg-feats li {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  padding: 10px 14px;
  border-radius: var(--radius-md);
  transition: transform .3s ease, box-shadow .3s ease, background .3s ease;
}
.vg-flower   .vg-feats li { background: rgba(200,134,10,.04); border: 1px solid rgba(200,134,10,.1); }
.vg-mountain .vg-feats li { background: rgba(45,90,39,.04);  border: 1px solid rgba(45,90,39,.1); }
.vg-wall     .vg-feats li { background: rgba(139,26,26,.04); border: 1px solid rgba(139,26,26,.1); }
.vg-flower   .vg-feats li:hover { background: rgba(200,134,10,.09); transform: translateX(5px); box-shadow: var(--shadow-sm); }
.vg-mountain .vg-feats li:hover { background: rgba(45,90,39,.09);  transform: translateX(5px); box-shadow: var(--shadow-sm); }
.vg-wall     .vg-feats li:hover { background: rgba(139,26,26,.09); transform: translateX(5px); box-shadow: var(--shadow-sm); }
.vg-feats li > span { font-size: 1.15rem; flex-shrink: 0; margin-top: 2px; }
.vg-feats strong { display: block; font-size: .86rem; font-weight: 700; color: var(--ink); margin-bottom: 2px; }
.vg-feats small  { font-size: .74rem; color: var(--gray); line-height: 1.45; }

/* 保留旧 vein-card 类兼容（已废弃，由 vg-card 替代） */
.veins-stack { display: none; }

/* ═══ Seasons — 全面重设计 ═══ */
.seasons {
  background: var(--green-dark);
  position: relative;
  overflow: hidden;
}
.seasons::before {
  content: '';
  position: absolute; inset: 0;
  background:
    radial-gradient(ellipse at 20% 0%, rgba(200,134,10,.07) 0%, transparent 50%),
    radial-gradient(ellipse at 80% 100%, rgba(90,138,80,.1) 0%, transparent 55%);
  pointer-events: none;
}
.seasons-top { padding: 80px 0 0; position: relative; z-index: 1; }

/* ── 四季导航标签 (全面重设计) ── */
.season-tabs {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 0;
  margin-top: 52px;
  border-radius: var(--radius-lg) var(--radius-lg) 0 0;
  overflow: hidden;
  box-shadow: 0 -6px 32px rgba(0,0,0,.25);
  position: relative;
  z-index: 2;
}
.stab {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 28px 16px 24px;
  border-radius: 0;
  background: rgba(255,255,255,.04);
  border: none;
  border-right: 1px solid rgba(255,255,255,.06);
  color: rgba(255,255,255,.5);
  font-family: 'Noto Serif SC', serif;
  cursor: pointer;
  transition: all .4s cubic-bezier(.4,0,.2,1);
  position: relative;
  overflow: hidden;
  min-height: 120px;
}
.stab:last-child { border-right: none; }

/* 季节专属渐变背景层 */
.stab::before {
  content: '';
  position: absolute; inset: 0;
  opacity: 0;
  transition: opacity .4s ease;
}
.stab[data-season="spring"]::before { background: linear-gradient(145deg, rgba(210,110,150,.55) 0%, rgba(240,180,200,.25) 100%); }
.stab[data-season="summer"]::before { background: linear-gradient(145deg, rgba(40,100,50,.7) 0%, rgba(90,150,60,.3) 100%); }
.stab[data-season="autumn"]::before { background: linear-gradient(145deg, rgba(190,80,20,.65) 0%, rgba(240,140,40,.25) 100%); }
.stab[data-season="winter"]::before { background: linear-gradient(145deg, rgba(40,90,140,.65) 0%, rgba(80,140,180,.25) 100%); }

/* 底部季节色条 */
.stab::after {
  content: '';
  position: absolute;
  bottom: 0; left: 0; right: 0;
  height: 3px;
  transform: scaleX(0);
  transition: transform .4s cubic-bezier(.4,0,.2,1);
}
.stab[data-season="spring"]::after  { background: linear-gradient(to right, #e8a0c0, #f4c0d0); }
.stab[data-season="summer"]::after  { background: linear-gradient(to right, #5A8A50, #90c060); }
.stab[data-season="autumn"]::after  { background: linear-gradient(to right, #D4521A, #f08030); }
.stab[data-season="winter"]::after  { background: linear-gradient(to right, #4A7FA5, #80b8d0); }

.stab:hover::before { opacity: 1; }
.stab:hover::after  { transform: scaleX(1); }
.stab:hover { color: rgba(255,255,255,.9); }
.stab.active { color: var(--white); }
.stab.active::before { opacity: 1; }
.stab.active::after  { transform: scaleX(1); height: 4px; }

.stab-icon {
  font-size: 2.2rem;
  position: relative; z-index: 1;
  filter: drop-shadow(0 2px 8px rgba(0,0,0,.3));
  transition: transform .4s cubic-bezier(.34,1.56,.64,1);
  line-height: 1;
}
.stab:hover .stab-icon,
.stab.active .stab-icon { transform: scale(1.2) translateY(-3px); }

.stab-name {
  font-size: 1rem;
  font-weight: 700;
  letter-spacing: .05em;
  position: relative; z-index: 1;
  line-height: 1;
}
.stab-en {
  font-size: .65rem;
  font-family: 'Noto Sans SC', sans-serif;
  color: rgba(255,255,255,.45);
  position: relative; z-index: 1;
  letter-spacing: .04em;
}
.stab.active .stab-en { color: rgba(255,255,255,.7); }

/* ── 四季内容面板 (全面重设计) ── */
.season-panels {
  background: var(--paper);
  position: relative;
}
.spanel {
  display: none;
  min-height: 600px;
  position: relative;
}
.spanel.active {
  display: grid;
  grid-template-columns: 54% 46%;
  animation: spIn .55s cubic-bezier(.4,0,.2,1);
}
@keyframes spIn {
  from { opacity: 0; transform: translateY(14px); }
  to   { opacity: 1; transform: translateY(0); }
}

/* 图片侧 */
.spanel-img {
  overflow: hidden;
  position: relative;
}
.spanel-img img {
  width: 100%; height: 100%;
  object-fit: cover;
  transition: transform .9s cubic-bezier(.4,0,.2,1);
}
.spanel:hover .spanel-img img { transform: scale(1.05); }
.spanel-img::after {
  content: '';
  position: absolute; inset: 0;
  background: linear-gradient(to right, transparent 55%, var(--paper) 100%);
  pointer-events: none;
}

/* 内容侧 */
.spanel-body {
  padding: 60px 52px 60px 44px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  position: relative;
  overflow: hidden;
}
/* 大号季节汉字水印 */
.spanel-body::before {
  content: attr(data-season-char);
  position: absolute;
  right: -0.12em; bottom: -0.18em;
  font-family: 'Ma Shan Zheng', serif;
  font-size: 13rem;
  font-weight: 900;
  line-height: 1;
  pointer-events: none;
  user-select: none;
  opacity: .045;
  color: var(--ink);
}

/* 季节徽章 */
.spanel-season-badge {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: .78rem;
  font-weight: 700;
  letter-spacing: .16em;
  padding: 6px 18px;
  border-radius: var(--radius-xl);
  margin-bottom: 20px;
  width: fit-content;
  position: relative; z-index: 1;
}
.spring-badge { background: rgba(240,168,200,.18); color: #9B3060; border: 1px solid rgba(210,130,170,.3); }
.summer-badge { background: rgba(45,90,39,.1);     color: var(--green-mid); border: 1px solid rgba(45,90,39,.25); }
.autumn-badge { background: rgba(212,82,26,.1);    color: var(--autumn);    border: 1px solid rgba(212,82,26,.3); }
.winter-badge { background: rgba(74,127,165,.1);   color: #2E6A8E;          border: 1px solid rgba(74,127,165,.3); }

.spanel-body h3 {
  font-family: 'Noto Serif SC', serif;
  font-size: 2rem;
  font-weight: 700;
  color: var(--ink);
  margin-bottom: 14px;
  line-height: 1.3;
  position: relative; z-index: 1;
}
.spanel-body p {
  font-size: .94rem;
  color: var(--gray);
  line-height: 1.95;
  margin-bottom: 32px;
  position: relative; z-index: 1;
}

/* 活动卡片 — 2列网格 */
.spanel-acts {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
  position: relative; z-index: 1;
}
.sact {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  padding: 14px 14px;
  background: var(--paper-warm);
  border-radius: var(--radius-md);
  border: 1px solid rgba(0,0,0,.04);
  transition: transform .3s ease, box-shadow .3s ease, background .3s ease, border-color .3s ease;
}
.sact:hover {
  transform: translateY(-4px);
  box-shadow: var(--shadow-sm);
  background: var(--white);
}
.sact > span { font-size: 1.35rem; flex-shrink: 0; margin-top: 1px; }
.sact strong { display: block; font-size: .88rem; color: var(--ink); margin-bottom: 3px; font-weight: 700; }
.sact small  { font-size: .75rem; color: var(--gray); line-height: 1.4; }

/* 季节专属 hover accent */
#sp-spring .sact:hover { border-color: rgba(210,130,170,.25); }
#sp-summer .sact:hover { border-color: rgba(45,90,39,.2); }
#sp-autumn .sact:hover { border-color: rgba(212,82,26,.22); }
#sp-winter .sact:hover { border-color: rgba(74,127,165,.22); }

/* ═══ Experiences ═══ */
.experiences { background: var(--white); }
.exp-swiper {
  width: min(1400px, calc(100% - 48px));
  margin: 0 auto;
  overflow: hidden;
  padding: 20px 0 60px;
}
.exp-swiper .swiper-wrapper { padding: 10px 0; }
.exp-slide {
  position: relative;
  border-radius: var(--radius-lg);
  overflow: hidden;
  box-shadow: var(--shadow-md);
  cursor: pointer;
  height: 480px;
}
.exp-slide img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s ease; }
.exp-slide:hover img { transform: scale(1.06); }
.exp-info {
  position: absolute;
  bottom: 0; left: 0; right: 0;
  padding: 80px 28px 28px;
  background: linear-gradient(to top, rgba(0,0,0,.75) 0%, transparent 100%);
  color: var(--white);
  transition: padding var(--transition);
}
.exp-tag {
  display: inline-block;
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: .1em;
  padding: 3px 10px;
  border-radius: var(--radius-xl);
  margin-bottom: 10px;
}
.exp-tag--flower   { background: rgba(200,134,10,.85); }
.exp-tag--mountain { background: rgba(45,90,39,.85); }
.exp-tag--wall     { background: rgba(139,26,26,.85); }
.exp-tag--core     { background: rgba(74,127,165,.85); }
.exp-info h3 { font-family: 'Noto Serif SC', serif; font-size: 1.15rem; margin-bottom: 8px; }
.exp-info p  { font-size: .82rem; color: rgba(255,255,255,.75); line-height: 1.6; }

.exp-swiper .swiper-pagination-bullet { background: var(--gray-light); opacity: 1; }
.exp-swiper .swiper-pagination-bullet-active { background: var(--green-mid); }
.exp-swiper .swiper-button-prev,
.exp-swiper .swiper-button-next {
  color: var(--white);
  background: var(--green-mid);
  width: 44px; height: 44px;
  border-radius: 50%;
  box-shadow: var(--shadow-md);
}
.exp-swiper .swiper-button-prev::after,
.exp-swiper .swiper-button-next::after { font-size: 16px; font-weight: 700; }