/**
 * 全站售后引导条（Contact band）
 * 位置：LINE 特典条下方、页脚上方。
 *
 * Pre-footer 色阶：
 *   LINE（主色米白）→ Contact（特殊色浅洗，次级）→ Footer（辅助色深底）
 */

.mns-contact-band {
  position: relative;
  overflow: hidden;
  background: color-mix(in srgb, var(--mns-accent, #9ea7a2) 14%, var(--mns-bg, #f4f4f2));
  color: var(--mns-ink, #2e2f2f);
  border-block: 1px solid var(--mns-line, #e8e8e8);
}

/* LINE 特典 is now a card (no full-bleed edge); keep contact-band top hairline. */

/* Soft side texture — accent dots on light surface */
.mns-contact-band::after {
  content: "";
  position: absolute;
  top: 0;
  right: max(24px, calc((100vw - var(--mns-container, 1280px)) / 2));
  width: min(22vw, 320px);
  aspect-ratio: 1;
  opacity: 0.4;
  background-image: radial-gradient(
    circle,
    color-mix(in srgb, var(--mns-accent, #9ea7a2) 70%, transparent) 0 1.5px,
    transparent 2px
  );
  background-size: 12px 12px;
  mask-image: radial-gradient(circle, #000 0 40%, transparent 72%);
  -webkit-mask-image: radial-gradient(circle, #000 0 40%, transparent 72%);
  pointer-events: none;
}

/* Width comes from shared .mns-container */
.mns-contact-band__container {
  /* hook only */
}

.mns-contact-band__inner {
  position: relative;
  z-index: 1;
  display: grid;
  justify-items: center;
  gap: var(--mns-prefooter-gap, clamp(16px, 2vw, 24px));
  padding-block: var(--mns-prefooter-pad-y, clamp(56px, 7vw, 96px));
  text-align: center;
}

.mns-contact-band__copy {
  display: grid;
  justify-items: center;
  gap: var(--mns-prefooter-gap, clamp(16px, 2vw, 24px));
  width: min(100%, var(--mns-prefooter-copy-max, 720px));
}

.mns-contact-band__title {
  margin: 0;
  color: var(--mns-ink, #2e2f2f);
  font-family: var(--font-heading, inherit);
  font-size: clamp(1.75rem, 3.2vw, 2.5rem);
  font-weight: 500;
  line-height: 1.15;
  letter-spacing: 0.04em;
}

.mns-contact-band__body {
  margin: 0;
  max-width: 36em;
  color: var(--mns-muted, #878887);
  font-size: var(--mns-prefooter-body-size, clamp(0.95rem, 1.35vw, 1.05rem));
  font-weight: 500;
  line-height: 1.75;
  letter-spacing: 0.02em;
}

.mns-contact-band__arrow {
  margin-left: 0.35em;
  font-weight: 500;
  opacity: 0.9;
}

.mns-contact-band__button {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  width: min(100%, 420px);
  min-height: var(--mns-prefooter-btn-min-h, 56px);
  padding: 0 var(--mns-prefooter-btn-pad-x, clamp(22px, 3vw, 32px));
  border: 0;
  border-radius: var(--mns-radius, 4px);
  background: var(--mns-primary, #2e2f2f);
  color: #fff;
  font-size: var(--mns-prefooter-btn-size, clamp(0.95rem, 1.4vw, 1.05rem));
  font-weight: 700;
  line-height: 1.2;
  text-decoration: none;
  transition: background-color 0.15s ease;
}

.mns-contact-band__button:hover {
  background: color-mix(in srgb, var(--mns-primary, #2e2f2f) 88%, #000);
  color: #fff;
}

.mns-contact-band__button:focus-visible {
  outline: 2px solid var(--mns-primary, #2e2f2f);
  outline-offset: 3px;
}

/* Light contact → dark footer: edge is already clear; no extra hairline. */
.mns-contact-band + .mns-footer {
  border-top: 0;
}

@media (max-width: 760px) {
  .mns-contact-band::after {
    right: -64px;
    width: 220px;
    opacity: 0.28;
  }

  .mns-contact-band__button {
    width: min(100%, 360px);
  }
}