/* =========================================================================
   保合咨询 PowerHelm — media.css
   摄影氛围层：墨色双调 + 渐变压暗，让影像成为定制氛围而非库存图。
   ========================================================================= */

/* ---- 区块氛围背景（绝对定位于 section 内，content 置于其上） ---- */
.sec-media { position: absolute; inset: 0; z-index: 0; overflow: hidden; pointer-events: none; }
.sec-media img { width: 100%; height: 100%; object-fit: cover; display: block; }
.section > .shell { position: relative; z-index: 1; }

/* 理念（浅色段）：山峦淡入，纸色渐隐保证可读 */
.philosophy { overflow: hidden; }
.philosophy .sec-media img {
  filter: grayscale(0.45) contrast(1.03) brightness(1.02);
  opacity: 0.18;
  object-position: 50% 60%;
}
.philosophy .sec-media::after {
  content: ""; position: absolute; inset: 0;
  background:
    linear-gradient(180deg, var(--paper) 0%, color-mix(in oklab, var(--paper) 55%, transparent) 35%, color-mix(in oklab, var(--paper) 70%, transparent) 70%, var(--paper) 100%),
    linear-gradient(90deg, var(--paper) 0%, transparent 45%);
}

/* 方法论（深色段）：蓝金能源之光，极淡纹理 */
.method .sec-media img {
  filter: grayscale(0.35) brightness(0.7) contrast(1.05);
  opacity: 0.14; mix-blend-mode: screen;
  object-position: 50% 40%;
}
.method .sec-media::after {
  content: ""; position: absolute; inset: 0;
  background: radial-gradient(70% 60% at 50% 40%, transparent, var(--ink) 80%);
}

/* 联系（深色段）：夜城电网灯光 */
.contact .sec-media img {
  filter: grayscale(0.25) brightness(0.62) contrast(1.08);
  opacity: 0.34;
  object-position: 50% 35%;
}
.contact .sec-media::after {
  content: ""; position: absolute; inset: 0;
  background:
    linear-gradient(180deg, var(--ink) 0%, transparent 30%, color-mix(in oklab, var(--ink) 55%, transparent) 70%, var(--ink) 100%),
    radial-gradient(80% 70% at 70% 30%, transparent, var(--ink) 85%);
}

/* ---- 满幅影像带 ---- */
.band {
  position: relative; overflow: hidden; background: var(--ink);
  min-height: clamp(380px, 60vh, 660px);
  display: grid; align-items: center;
}
.band__img {
  position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover;
  filter: grayscale(1) contrast(1.12) brightness(0.62);
  opacity: 0.62; object-position: 50% 42%;
  transform: scale(1.04);
  transition: transform 1.6s var(--ease), opacity 1.6s var(--ease);
}
.band.in .band__img { transform: scale(1); }
.band::after {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background:
    linear-gradient(105deg, var(--ink) 0%, color-mix(in oklab, var(--ink) 60%, transparent) 42%, transparent 78%),
    linear-gradient(0deg, var(--ink), transparent 50%);
}
.band__inner { position: relative; z-index: 2; display: grid; gap: 1.1rem; }
.band .eyebrow { color: var(--gold-soft); }
.band .eyebrow::before { background: var(--gold-soft); }
.band__quote { display: grid; gap: 0.1rem; }
.band__quote span {
  font-family: var(--font-display); font-weight: 460; line-height: 1.08;
  font-size: var(--t-h2); color: var(--on-ink-text); letter-spacing: -0.01em;
}
.band__quote span:nth-child(2) { color: var(--gold-soft); }
:root[lang="en"] .band__quote span { font-size: clamp(1.5rem, 1rem + 2vw, 2.5rem); }
.band__sub { font-size: var(--t-base); color: var(--on-ink-soft); max-width: 46ch; }
.band__credit {
  position: absolute; right: var(--gutter); bottom: 1rem; z-index: 2;
  font-family: var(--font-mono); font-size: 0.6rem; letter-spacing: 0.16em;
  text-transform: uppercase; color: var(--on-ink-mute); opacity: 0.6;
}

@media (prefers-reduced-motion: reduce) {
  .band__img { transform: none; transition: none; }
}
