/* 3案共通の最小限スタイル */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
body { margin: 0; }
img { max-width: 100%; display: block; }
[hidden] { display: none !important; }

.sr-only {
  position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}

/* Google マップ */
[data-map] iframe { display: block; width: 100%; height: 100%; border: 0; }

/* モック用：比較ページへ戻る */
.x-mock-back {
  position: fixed; left: 16px; bottom: 16px; z-index: 90;
  padding: 8px 14px; border-radius: 999px;
  background: rgba(30, 30, 30, .78); color: #fff;
  font: 500 12px/1.4 system-ui, sans-serif; letter-spacing: .04em;
  text-decoration: none; backdrop-filter: blur(6px);
}
.x-mock-back:hover { background: rgba(30, 30, 30, .92); }
@media (max-width: 767px) {
  .x-mock-back { bottom: calc(80px + env(safe-area-inset-bottom, 0px)); left: 12px; padding: 6px 12px; font-size: 11px; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .01ms !important; transition-duration: .01ms !important; }
}

/* よくあるご質問（チャット形式）：骨組みだけ。色・形は各案の style.css で指定 */
.chat-nav { display: flex; gap: 8px; overflow-x: auto; scrollbar-width: none; padding: 2px 2px 14px; margin: 0 0 8px; position: sticky; top: var(--chat-top, 76px); z-index: 5; }
.chat-nav::-webkit-scrollbar { display: none; }
.chat-nav__chip { flex: none; display: inline-flex; align-items: center; min-height: 40px; padding: 0 16px; font-size: 13px; text-decoration: none; white-space: nowrap; }
.chat__group { scroll-margin-top: 130px; }
.chat__day { display: flex; justify-content: center; margin: 28px 0 18px; font-size: 12px; font-weight: 500; letter-spacing: .06em; }
.chat__day span { padding: 4px 14px; }
.chat__list { margin: 0; }
.chat__pair { display: grid; gap: 10px; margin-bottom: 22px; }
.chat__q { display: flex; justify-content: flex-end; margin: 0; padding-left: 15%; }
.chat__a { display: flex; align-items: flex-start; gap: 10px; margin: 0; padding-right: 10%; }
.chat__avatar { flex: none; display: grid; place-items: center; width: 36px; height: 36px; font-size: 15px; font-weight: 700; }
.chat__who { display: grid; gap: 4px; justify-items: start; min-width: 0; }
.chat__name { font-size: 11px; letter-spacing: .06em; }
.chat__bubble { display: inline-block; max-width: 100%; padding: 12px 16px; font-size: 15px; line-height: 1.8; letter-spacing: .03em; overflow-wrap: anywhere; }
.chat__todo { font-size: 11px; opacity: .8; }
.chat__pair .chat__q, .chat__pair .chat__a { opacity: 0; transform: translateY(10px); transition: opacity .5s cubic-bezier(.16, 1, .3, 1), transform .5s cubic-bezier(.16, 1, .3, 1); }
.chat__pair .chat__a { transition-delay: .35s; }
.chat__pair.is-in .chat__q, .chat__pair.is-in .chat__a { opacity: 1; transform: none; }
@media (min-width: 768px) { .chat__q { padding-left: 30%; } .chat__a { padding-right: 24%; } }

/* スマホ下の固定予約ボタン：ページ内のLINEボタンが見えている間は隠す（common.js の fixedCta） */
.fixed-cta { transition: translate .4s cubic-bezier(.16, 1, .3, 1), opacity .3s; }
body:not(.cta-on) .fixed-cta { translate: 0 calc(100% + 24px); opacity: 0; pointer-events: none; visibility: hidden; transition: translate .4s cubic-bezier(.16, 1, .3, 1), opacity .3s, visibility 0s .4s; }
@media (max-width: 767px) {
  .x-mock-back { transition: translate .4s cubic-bezier(.16, 1, .3, 1), opacity .3s; }
  body:not(.cta-on) .x-mock-back { translate: 0 12px; opacity: 0; pointer-events: none; }
}