/* ══ 金継ぎ追補スタイル（キャスティング.com 仮LP・2026-09-07）══
   対象: index.html（代表ページ）／contact.html も同じ規則で拾える分だけ
   元の規則と同じセレクタ・同じ media で後から上書きする。:root の変数は触らない。
   🔴 本体HTMLは1行も書き換えていない。<head> に link を1行足すだけで効く。 */

/* ───────── ① 破れ: 低コントラスト（1件 → 0）─────────
   「おすすめ」バッジ = 白文字 × 金地 #B89A4A で比2.71（床4.5）。
   新しい色は作らない。金地の上の文字色は、このページが既に使っている
   紺 var(--navy) に合わせる（金のCTA帯の文字色と同じ組み合わせ）＝比5.89。 */
.price__grid .rec { color: var(--navy); }

/* ───────── ② 破れ: 極小文字（2件 → 0）───────── */
.lpfoot { font-size: 12px; }          /* footer の a と span が11px を継いでいた */
.legal { font-size: 12px; }           /* contact.html の特商法リンク（同じく11px） */
.fixed-cta .l2 { font-size: 13px; }   /* 11px → 13px（スマホの固定CTAの副文） */
.fixed-cta .l1 { font-size: 15px; }   /* 17px → 15px（ボタンの段を .fv__cta b と1本に） */

/* ───────── ③ 乱れ: 似て非なる色（金の文字色を1本に）─────────
   #A38841（見出しの飾り数字）を、キッカーで既に使っている #856b2c へ寄せる。
   生成り地での比 3.08 → 4.58 で、小さく組まれても床を割らなくなる。
   ⚠ 台帳のもう1件「#FFFFFF → #F7F3EA」は当てない（理由は診断書の「見送った警告と理由」）。 */
.sec h2 .num { color: #856b2c; }

/* ───────── ④ 乱れ: 角丸 5種 → 2種（ボタン10 / カード14）───────── */
.price__grid .rec { border-radius: 10px; }
.worry__list li  { border-radius: 14px; }
.five li         { border-radius: 14px; }

/* ───────── ⑤ 乱れ: 文字サイズ 役割内の割れ（本文12段 → 6段）─────────
   新しい寸法は作らない。ページに既にある clamp を6本だけ残し、役割ごとに割り当てる。
   s=clamp(13,1.15vw,16) / m=clamp(13,1.25vw,17) / l=clamp(14,1.6vw,22)
   xl=clamp(15,1.9vw,27) / 2xl=clamp(16,2.2vw,30) / 3xl=clamp(19,2.5vw,35) */
.price__note,
.price__grid .rec        { font-size: clamp(13px, 1.15vw, 16px); }

.fv__kicker, .fv__sub,
.price__grid .cap,
.faqs__grid dd,
.last__foot .own         { font-size: clamp(13px, 1.25vw, 17px); }

.worry__list li,
.last__lead,
.last__items li          { font-size: clamp(14px, 1.6vw, 22px); }

.faqs__grid dt           { font-size: clamp(15px, 1.9vw, 27px); }

.sub, .closing           { font-size: clamp(16px, 2.2vw, 30px); }

/* ⚠ .price__grid .en（PRIVATE PLAN 等の英字ラベル）は段に寄せない。
   17.3px→16px にすると desktop でも型紙 uppercase-labels / english-labels が
   点灯し、定番度が 8→25 に悪化した（再計測で確認）。段を1つ増やしてでも
   元の寸法を残す＝点数の都合を役割の判断より先にしない。
   英字ラベルそのものの直しは文言の変更なので依頼主の裁定に回す。 */

.fv__brand, .five b, .step .no,
.last__foot .brand,
.price__grid .yen,
.worry__close            { font-size: clamp(19px, 2.5vw, 35px); }

/* ───────── ⑥ 乱れ: 見出しの段（h2 3段 → 2段）─────────
   最後の節だけ <section class="sec last"> に sec--navy が付いておらず、
   h2 がブラウザ既定の24pxで描かれていた（他の節は47px）。見出しの序列が
   ここだけ半分になっていたので、他の節と同じ寸法へ戻す。 */
.last h2 { font-size: clamp(26px, 3.7vw, 56px); }

/* ───────── ⑦ 悩みカードを元のデザインへ戻す（2026-09-07・シギさん「凄い変だから直して」）─────────
   🔴 これは金継ぎの診断で出た項目ではなく、minaがC案でHTML化したときに作った後退の修理。
   原本 assets/desktop/slice_02.png ／ assets/mobile/slice_02.png と突き合わせて分かったこと:
     ・PC版は「上段3枚＋下段2枚」の格子で、下段は中央寄せ。左右交互ではない
     ・スマホ版は左右交互で合っていた
     ・どちらも箱は中身の長さに合わせて伸び縮みしている
     ・引用符「“」は箱の左上。文字は箱の中で中央
   minaは幅の指摘（代表「PCで幅が足りない」）に対して箱を760px→560pxに縮めただけで、
   ①PCの並びが原本と違うこと ②箱が中身に合っていないこと を見ていなかった。
   実測（修理前・幅1280px）: 5枚とも箱幅560px固定に対し、文字幅は225〜328px。
   右に余る空白は191〜294px で、「この予算で頼めるのかな」は箱の52%が空白だった。
   さらに左カード(180〜740)と右カード(540〜1100)が中央200pxで重なり、互い違いに見えていなかった。 */

/* 共通: 箱を中身の長さに合わせる／引用符を左上へ／折り返しは日本語の文節で
   （原本は「余興、何にすれば／いいんだろう」と読点のところで折れている。
     指定なしだと「いいんだ／ろう」「探す／の？」のように語の途中で切れる） */
.worry__list li {
  width: fit-content;
  max-width: min(100%, 560px);
  align-items: flex-start;
  word-break: auto-phrase;
  text-wrap: pretty;
}
.worry__list li::before { line-height: 1; margin-top: -.06em; }

/* PC（768px以上）: 原本どおり 上段3枚＋下段2枚の格子。下段は中央に寄せる */
@media (min-width: 768px) {
  .worry__list {
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    gap: clamp(12px, 1.4vw, 22px);
    align-items: stretch;
    max-width: 920px;
    margin-left: auto;
    margin-right: auto;
  }
  .worry__list li {
    grid-column: span 2;
    width: auto;
    max-width: none;
    margin: 0;
    /* 5枚の高さは揃う（grid の stretch）。中の文字は上下の真ん中に置く。
       これをしないと、1行で収まるカード（「この予算で頼めるのかな」）だけ
       文字が上に寄り、下に大きく空白が残る（2026-09-08 シギさん指摘）。 */
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: stretch;
    position: relative;
    text-align: center;
    /* ⚠ 左右は18pxまで。26pxだと幅1440px以上で内寸が238pxになり、
       一番長い文節「盛り上がらなかったら、」（22pxで242px必要）が3px足りずに
       語の途中で折れる（2026-09-08 シギさんの画面のスクショで発覚。
       minaの確認が1280pxだけだったため見落としていた）。
       文字サイズと5枚の並びは原本のまま変えない＝余白だけで内寸を作る。 */
    padding: clamp(34px, 3.4vw, 46px) clamp(16px, 1.8vw, 18px) clamp(24px, 2.6vw, 34px);
  }
  .worry__list li::before {
    position: absolute;
    left: clamp(14px, 1.4vw, 20px);
    top: clamp(8px, 0.9vw, 14px);
  }
  .worry__list li:nth-child(4) { grid-column: 2 / span 2; }
  .worry__list li:nth-child(5) { grid-column: 4 / span 2; }
  .worry__list li:nth-child(even) { margin-left: 0; }   /* スマホ用の右寄せを打ち消す */
}
