/* line-float.css — 全ページ共通の丸型LINE固定ボタン。
   右下に固定表示。sticky-cta(電話/LINEの横長バー)がモバイルで画面下に出るため、
   その上に重ならないよう、表示中は少し上へ退避する(JS側で .is-raised を切替)。
   ボタン内にアイコン+「LINE無料お見積り」を常時表示するため、丸型よりやや大きい
   角丸カプセル型に変更(テキストが収まる最小限の大きさ・目立ちすぎない配色は維持)。 */
.line-float-btn {
  position: fixed;
  right: clamp(14px, 3vw, 28px);
  bottom: clamp(14px, 3vw, 28px);
  z-index: 9999;
  min-width: 64px;
  height: 64px;
  padding: 0 1.1rem 0 0.85rem;
  border-radius: 999px;
  background: #06C755;
  color: #ffffff;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  box-shadow: 0 8px 22px rgba(6, 199, 85, 0.4), 0 2px 8px rgba(0,0,0,0.15);
  text-decoration: none;
  transition: transform 0.25s ease, box-shadow 0.25s ease, bottom 0.25s ease;
  border: 2px solid #ffffff;
}
.line-float-btn:hover {
  transform: translateY(-3px) scale(1.03);
  box-shadow: 0 12px 28px rgba(6, 199, 85, 0.5), 0 4px 10px rgba(0,0,0,0.18);
  opacity: 1;
}
.line-float-btn:focus-visible {
  outline: 3px solid #06C755;
  outline-offset: 3px;
}
.line-float-btn__icon {
  width: 30px;
  height: 30px;
  flex: none;
}
.line-float-btn__text {
  font-size: 0.78rem;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: 0.01em;
  white-space: nowrap;
  color: #ffffff;
}

/* sticky-cta(画面下の横長バー)が表示されている間は、丸ボタンをその上に退避させて重ならないようにする */
.line-float-btn.is-raised {
  bottom: calc(clamp(14px, 3vw, 28px) + var(--sticky-cta-h, 64px));
}

@media (max-width: 768px) {
  .line-float-btn {
    height: 52px;
    min-width: 52px;
    padding: 0 0.9rem 0 0.7rem;
    right: 14px;
    gap: 0.4rem;
  }
  .line-float-btn__icon { width: 24px; height: 24px; }
  .line-float-btn__text { font-size: 0.68rem; }
}

@media (max-width: 380px) {
  /* 極小幅ではテキストを省略しアイコンのみの円形に戻す(誤タップ防止のため最低44pxは確保) */
  .line-float-btn { min-width: 48px; height: 48px; padding: 0; border-radius: 50%; }
  .line-float-btn__text { display: none; }
}