/* ========================================
   320〜440px フルード調整（最後に読み込んで上書き）
   390px=Figma基準値・320pxでも溢れないよう min(基準値, vw) でスケール
   ======================================== */

/* ヘッダー（320で電話ピルと衝突しない幅に） */
/* 2026-08-17 Figma 2989:490 正確反映：ロゴタイプはrenderBounds 151.01px（旧151.5）／受付時間は10px（旧12px） */
.header-brand-name { width: min(151.01px, 38.72vw); }
.header-brand-hours { font-size: min(10px, 2.564vw); }
.header-logo-icon { width: min(31px, 7.95vw); }
.header-tel-number { font-size: min(14px, 3.7vw); }

/* S01 3バッジ：2026-08-12ユーザー指定でgap12pxは固定のままバッジ自体を拡大（旧110pxキャップ撤去）
   ⚠️flexアイテムのmin-width既定値=auto（画像の実寸220pxが下限になり縮まない）を明示的に0で解除 */
.hero-badge {
  flex: 1 1 0;
  min-width: 0;
  width: auto;
  height: auto;
  aspect-ratio: 1 / 1;
}

/* 全セクション 大型見出しのスケール */
.pledge-title { font-size: min(24px, 6.15vw); } /* 2026-08-11：Figma 2989:957 の24pxへ（旧28） */
/* 保証バンド：4行とも左右16pxパディングを残して画面幅いっぱいに自動スケール
   （390px時の自然幅から逆算した行別係数。子要素は warranty.css 側で em 指定） */
/* ※基準は保証バンド2。保証バンド1は warranty.css の .warranty--lead が上書き */
/* 2026-08-12：768px以上で巨大化しないよう414px時の実寸でキャップ（fluidはtablet.cssより後読みのためここで） */
.warranty-line2 { font-size: min(60.4px, 14.59vw); }
.warranty-line3 { font-size: min(31.5px, 7.61vw); }
.warranty-sub   { font-size: min(19.9px, 4.80vw); }
/* 吹き出し（2026-08-01）：2行目「長期無償保証付きで安心！」が折り返さない上限。
   可用幅＝100vw −（左右余白52＋ボックス枠線4＋padding32＋斜線54＋gap16＝158px）
   2行目は11文字＋0.8em（「で」）＝11.8em相当。安全マージンとして12emで計算 */
.warranty-bubble-text { font-size: min(20px, calc((100vw - 158px) / 12)); }
.empathy-title { font-size: min(32px, 8.5vw); }
/* S02 悪徳業者カード：390px=14px基準。360pxでは13pxに縮めて行の細切れ折返しを防ぐ */
.scam-lead, .scam-list li { font-size: min(14px, 3.61vw); }
.scam-head { font-size: min(24px, 6.2vw); }
.reason-title { font-size: min(36px, 9.2vw); }
.reason-title .num { font-size: min(54px, 13.8vw); }
/* 理由カード見出し：最大24px。2行目「地域密着で即日最短20分」が3行に折り返さない上限で縮小（2026-08-02）
   カード内の可用幅＝100vw −（wrapの32＋cardの左右64＝96px）／2行目は24px時に約266px＝11.1em相当 */
.reason-card-title { font-size: min(24px, calc((100vw - 96px) / 11.4)); }
.omakase-heading { font-size: min(28px, 7.2vw); }
.pricing-title { font-size: min(40px, 10.3vw); }
.pricing-card-label { font-size: min(24px, 6.2vw); }
.pricing-card-price .num { font-size: min(40px, 10.3vw); }
.pricing-card-price .comma { font-size: min(30px, 7.7vw); }
.pricing-card-price .unit { font-size: min(20px, 5.1vw); }
.flow-title { font-size: min(36px, 9.2vw); }
.flow-title .sm { font-size: min(28px, 7.2vw); }
.voice-title { font-size: min(28px, 7.2vw); } /* 2026-08-11：Figma 2989:1108の28pxへ（旧36） */
.voice-title .sm { font-size: min(26px, 6.7vw); } /* 2026-08-11：Figma 2989:1109の26pxへ（旧30） */
.area-title { font-size: min(40px, 10.3vw); }
.faq-heading { font-size: min(32px, 8.2vw); } /* 2026-07-31：Figma 32pxへ（旧36） */
.contact-title { font-size: min(32px, 8.2vw); }

/* S07 カルーセル：320でもカードが収まるように */
@media (max-width: 374px) {
  /* ヘッダー：360pxでは受付時間テキストと電話CTAが重なるため左右を16→8pxに（2026-08-02） */
  .header { padding-left: 8px; padding-right: 8px; }
  /* S01 FV：375px未満は人物を指定サイズで等倍表示（2026-08-02ユーザー指定） */
  /* 縦220pxで等倍（横幅ではない）＋右端に寄せて左へ詰める（旧 left:50%+36px＝15.5px見切れ） */
  .hero .hero-person { width: auto; height: 220px; left: auto; right: 0; }
  /* ※3バッジの margin-top 調整は 2026-08-02 のフロー化で不要（gap:24pxが自動で保たれる） */
  .voice-card { flex-basis: min(275px, calc(100vw - 80px)); }
  .voice-track { padding-left: 40px; padding-right: 40px; }
  /* S02 悪徳業者カード：リード文が「す。」だけの単独行にならない行長へ */
  .scam-lead { font-size: 12.4px; }
}

/* S04 料金表：症状リストが360〜379px幅で折り返す問題への対応（2026-08-12）
   ・780×356px2列カード内リスト、可用幅=(vw-72)/2。最長行(・設定温度まで冷えない=154px@14px)が
   　その可用幅に収まるサイズへ比例縮小し、380px以上で元の14pxに復帰（安全マージン込み） */
.pricing-card-list { font-size: clamp(12.9px, calc(4.7vw - 4px), 14px); }