/* ===================================================================
   tsuboi-mobile.css — スマホ最適化（GA4データ対応）
   対象スマホ: 390x844, 393x852, 375x667, 360x800, 412x915
   全ページ共通。tsuboi-common.css の後に読み込むこと。
   =================================================================== */

/* ── 768px以下：タブレット〜スマホ ── */
@media (max-width: 768px) {

  /* 本文の読みやすさ向上 */
  body {
    font-size: 15px;
    line-height: 1.85;
    -webkit-text-size-adjust: 100%;
  }

  /* コンテナの余白 */
  .container { padding-left: 16px; padding-right: 16px; }

  /* 見出しの行間・余白 */
  h1 { font-size: 1.5rem; line-height: 1.4; }
  h2 { font-size: 1.3rem; line-height: 1.45; margin-top: 32px; margin-bottom: 16px; }
  h3 { font-size: 1.1rem; line-height: 1.5; }

  /* 段落の余白 */
  .prose p, .content-section p { margin-bottom: 1.1em; }

  /* テーブル横スクロール防止 */
  table { display: block; overflow-x: auto; -webkit-overflow-scrolling: touch; max-width: 100%; }

  /* 画像・iframe はみ出し防止 */
  img, iframe, video, embed, object { max-width: 100% !important; height: auto; }

  /* ボタンのタップ改善 */
  .btn, a.btn, button.btn {
    min-height: 48px;
    padding: 14px 24px;
    font-size: .95rem;
  }
  .btn-sm { min-height: 42px; padding: 10px 18px; }

  /* CTAボタン群 — 縦積み */
  .cta-buttons {
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 10px !important;
  }
  .cta-buttons .btn, .cta-buttons a {
    width: 100%;
    text-align: center;
    min-height: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  /* sticky-cta改善 */
  .sticky-cta {
    padding: 8px 12px !important;
    gap: 6px !important;
  }
  .sticky-cta a {
    padding: 11px 6px !important;
    font-size: .82rem !important;
    min-height: 46px;
  }

  /* page-hero（下層ページ）のスマホ調整 */
  .page-hero { padding: 80px 16px 40px !important; }
  .page-hero h1 { font-size: 1.4rem !important; line-height: 1.45; }
  .page-hero-lead { font-size: .9rem; line-height: 1.7; }

  /* セクション間の余白増加 */
  .content-section { padding: 32px 0 40px; }

  /* カード類 */
  .feature-card, .contact-card { padding: 20px 16px; }
  .feature-grid { grid-template-columns: 1fr !important; gap: 16px; }

  /* アクセス情報 */
  .access-info { grid-template-columns: 1fr !important; }

  /* 2列レイアウトを1列に */
  [style*="columns:2"], [style*="columns: 2"] {
    columns: 1 !important;
  }

  /* inline-cta */
  .inline-cta { padding: 24px 16px; }
  .inline-cta .btn { width: 100%; margin-bottom: 8px; }

  /* note-box */
  .note-box { padding: 16px; font-size: .9rem; }

  /* price-table（料金テーブル）のスクロール */
  .price-table { font-size: .88rem; }
  .price-table th, .price-table td { padding: 10px 8px; }

  /* LINE相談バーのスマホ調整 */
  [style*="background:#f0faf4"] {
    padding: 10px 0 !important;
  }
}

/* ── 420px以下：小型スマホ ── */
@media (max-width: 420px) {

  body { font-size: 14.5px; }
  .container { padding-left: 14px; padding-right: 14px; }

  h1 { font-size: 1.3rem; }
  h2 { font-size: 1.15rem; }

  .page-hero { padding: 72px 14px 32px !important; }
  .page-hero h1 { font-size: 1.25rem !important; }

  /* ボタン */
  .btn { font-size: .9rem; padding: 12px 20px; }

  /* sticky-cta: よりコンパクトに */
  .sticky-cta a { font-size: .78rem !important; padding: 10px 4px !important; }
}

/* ── 印刷時はsticky-ctaを非表示 ── */
@media print {
  .sticky-cta { display: none !important; }
}