/* 扫码联系：右下角浮动面板（微信 / 抖音 / 小红书） */

.qr-dock { position: fixed; right: 20px; bottom: 20px; z-index: 90; }

.qr-dock-toggle {
  display: flex; align-items: center; gap: 11px; padding: 14px 19px;
  background: var(--green-deep); border: 1px solid var(--orange); color: #ffe1bf;
  font: 15px/1 var(--serif); letter-spacing: .08em;
  box-shadow: 0 16px 40px #19332959; transition: background .25s, color .25s;
}
.qr-dock-toggle:hover, .qr-dock-toggle:focus-visible,
.qr-dock-toggle[aria-expanded="true"] { background: var(--orange); color: var(--green-deep); }
.qr-dock-toggle svg { width: 19px; height: 19px; }

.qr-panel {
  position: absolute; right: 0; bottom: calc(100% + 14px);
  width: min(392px, calc(100vw - 40px)); padding: 24px;
  background: linear-gradient(145deg, #688779, #4c6d5e); color: var(--white);
  border: 1px solid #b7cab840; box-shadow: 0 28px 70px #14291f8c;
  opacity: 0; visibility: hidden; transform: translateY(10px);
  transition: opacity .28s ease, transform .28s ease, visibility .28s;
}
.qr-dock.is-open .qr-panel { opacity: 1; visibility: visible; transform: none; }

.qr-panel-title { font: 20px/1.6 var(--serif); letter-spacing: .06em; }
.qr-panel-sub { margin-top: 6px; font-size: 12.5px; letter-spacing: .05em; color: #dfe8dc; }

.qr-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 11px; margin-top: 18px; }
.qr-tile { background: #fff; padding: 9px; display: flex; flex-direction: column; gap: 7px; cursor: zoom-in; }
.qr-tile img { width: 100%; height: auto; aspect-ratio: 1 / 1; object-fit: contain; }
.qr-tile span { font: 12.5px/1.4 var(--serif); letter-spacing: .1em; color: var(--green-deep); text-align: center; }
.qr-tile:hover img, .qr-tile:focus-visible img { opacity: .86; }

.qr-id {
  margin-top: 16px; padding-top: 14px; border-top: 1px solid #c8d8ca40;
  display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap;
}
.qr-id p { font: 16px/1.5 var(--roman); letter-spacing: .05em; color: #ffe1bf; }
.qr-id small { display: block; font: 12px/1.7 var(--sans); letter-spacing: .04em; color: #dfe8dc; }
.qr-copy { background: var(--orange); color: var(--green-deep); padding: 10px 15px; font-size: 13.5px; }
.qr-copy:hover { background: #ffa76b; }
.qr-copy-status { flex-basis: 100%; font-size: 12px; letter-spacing: .03em; color: #ffe1bf; }

.qr-block { margin-top: 24px; padding-top: 20px; border-top: 1px solid #c8d8ca40; }
.qr-block-title { font: 14px var(--serif); letter-spacing: .08em; color: #dfe8dc; }
.contact-dialog .qr-grid { margin-top: 14px; }
.contact-dialog .qr-tile { padding: 8px; }

.qr-zoom { width: auto; padding: 24px; text-align: center; }
.qr-zoom img { width: min(64vw, 296px); height: auto; aspect-ratio: 1 / 1; object-fit: contain; background: #fff; padding: 10px; margin: 0 auto; }
.qr-zoom p { margin-top: 14px; font: 15px var(--serif); letter-spacing: .08em; color: #dfe8dc; }
.qr-zoom .close-button { position: absolute; top: 8px; right: 8px; }

/* 避免右下角浮层压住页脚右侧的「返回顶部」 */
.bottom-bar { padding-right: calc(var(--gutter) + 158px); }

@media (max-width: 760px) {
  .bottom-bar { padding-right: calc(var(--gutter) + 118px); }
}

@media (max-width: 760px) {
  .qr-dock { right: 14px; bottom: 14px; }
  .qr-dock-toggle { padding: 12px 15px; font-size: 14px; }
  .qr-panel { width: min(336px, calc(100vw - 28px)); padding: 18px; }
  .qr-panel-title { font-size: 17px; }
  .qr-grid { gap: 8px; margin-top: 14px; }
  .qr-tile { padding: 7px; }
  .qr-tile span { font-size: 11.5px; letter-spacing: .06em; }
  .qr-id p { font-size: 15px; }
}

@media (prefers-reduced-motion: reduce) {
  .qr-panel, .qr-dock-toggle { transition: none; }
}
