/* [20260826du] 死んだCSSの掃除（ディレクター指示 2026-08-26）。削除2件＝
   (1) #tel-lead .urgent__title（＋SPの上書きと経緯コメント）: 2026-08-24 の A案で小見出し
       「急ぎの不具合・災害のあとに」ごと1つの .section__lead に統合したため、クラスも要素も消滅していた（DOM0件）。
       旧コメントの「強調が残るのは小見出しだけ」はその統合前の記述で、実態と食い違っていた。
   (2) .pending-block / .pending-block__title: 20260821co で最後の1箇所を通常本文化して以降DOM0件。 */
/* ============================================================================
   [20260810n] B確定トンマナ（design-rules §10）一貫性統一バッチ 適用済み
   ・級数   = --c1-fs-h2 / --c1-fs-h3 / --c1-fs-lead / --c1-fs-label-en（§10-2 L1〜L5）
   ・読み幅 = --c1-measure(720) / --c1-measure-narrow(640)（§10-5）
   ・画像幅 = 1480(--w-content) / 980 / 720 の3種のみ（§10-5）
   ・カードgap = --grid-gap(20px)／カード段組コンテナ = 980px（§10-5）
   ・セクション縦余白 = --sp-6/7/8/--sp-sec-sm の4段のみ（§10-5）
   ※本ブロック内に残る「C-1: SP22 / PC28」等のコメントは旧C-1級数時代の記述。
     現行の正は §10（B確定）＝上記トークン。
   ============================================================================ */

/* owners固有（WF由来。font-weight:bold→var(--fw-normal)／見出し固有クラスはfw明示） */
/* ==========================================================
   owners.html 固有CSS（フォーム／点検タイムライン／手帖DL）
   ========================================================== */
/* メンテ依頼フォーム（WF上で入力可能） */
.form{max-width:var(--c1-measure);margin:56px auto 0;text-align:left;border:1px solid var(--c-line);background:var(--c-bg);padding:32px 20px;}
.form__row{margin-bottom:28px;}
.form__label{display:block;font-size:var(--fs-caption);letter-spacing:var(--ls-2);font-weight:500;margin-bottom:8px;line-height:1.6;}
.form__req{display:inline-block;font-size:var(--fs-micro);color:#fff;background:#555;padding:1px 7px;margin-left:8px;vertical-align:middle;letter-spacing:.06em;}
.form__opt{display:inline-block;font-size:var(--fs-micro);color:#555;border:1px solid var(--c-line-dark);padding:0 7px;margin-left:8px;vertical-align:middle;letter-spacing:.06em;}
.form input[type="text"],
.form input[type="tel"],
.form input[type="email"],
.form input[type="file"],
.form select,
.form textarea{
  width:100%;padding:12px 10px;border:1px solid var(--c-line-dark);
  background:var(--c-bg);font-size:var(--fs-body);font-family:inherit;color:var(--c-text);border-radius:0;
}
.form textarea{min-height:140px;resize:vertical;}
.form__inline{display:grid;gap:8px;}
.form__choices{display:flex;flex-wrap:wrap;gap:10px 20px;font-size:var(--fs-body);}
.form__choices label{display:flex;align-items:center;gap:7px;font-weight:normal;line-height:1.6;}
.form__choices input{width:16px;height:16px;flex:none;}
.form__hint{font-size:var(--fs-micro);color:var(--c-text-note);margin-top:6px;line-height:1.8;}
.form__submit{margin-top:36px;text-align:center;}
.form__submit .btn{width:100%;border:none;cursor:pointer;font-family:inherit;}
.form__micro{font-size:var(--fs-micro);line-height:1.9;color:var(--c-text-note);text-align:center;margin-top:16px;}
@media(min-width:768px){
  .form{padding:48px 56px;}
  .form__inline{grid-template-columns:1fr 1fr;}
  .form__submit .btn{width:auto;min-width:360px;}
}

/* 定期点検タイムライン（SP=縦・PC=横。横スクロールにしない） */
.inspection-flow{list-style:none;display:flex;flex-direction:column;gap:22px;max-width:var(--c1-measure-narrow);margin:0 auto;}
.inspection-flow__item{
  border:1px solid var(--c-text);background:var(--c-bg);
  padding:14px 10px;text-align:center;font-size:var(--fs-caption);line-height:1.7;position:relative;
}
.inspection-flow__item small{display:block;font-size:var(--fs-micro);color:var(--c-text-sub);margin-top:2px;}
.inspection-flow__item:not(:last-child)::after{
  content:"↓";position:absolute;left:50%;bottom:-20px;transform:translateX(-50%);
  color:#888;font-size:var(--fs-caption);line-height:1;
}
.inspection-flow__item--start{background:var(--c-btn);color:#fff;border-color:var(--c-btn);}
.inspection-flow__item--start small{color:#ccc;}
.inspection-flow__item--ext{border-style:dashed;color:var(--c-text-sub);}
@media(min-width:768px){
  .inspection-flow{flex-direction:row;max-width:none;gap:24px;align-items:stretch;}
  .inspection-flow__item{flex:1;display:flex;flex-direction:column;justify-content:center;}
  .inspection-flow__item:not(:last-child)::after{
    content:"→";left:auto;right:-19px;bottom:auto;top:50%;transform:translateY(-50%);
  }
}
/* [20260821l] 2026-08-21 ディレクター指示「タブレット時、文字が縦並びになり読みにくい」。
   原因＝768px以上で **8項目を1行** に flex:1 で等分するため、1枚の幅が
     768px  → 約162px（文字幅142px）… ではなく実測は約99px（文字幅79px）
     1024px → 約122px（文字幅102px）
   しか取れず、「点検 1回目」が「点検 1回／目」、「ここから始まる」が2文字ずつ、
   「延長保証点検［有償］で最長50年へ」が1〜2文字ずつに割れていた。
   → 768〜1199px は **4つ×2行** に分ける（1枚の幅が約4倍。1024pxで約222px＝文字幅202px）。
   1200px以上は従来どおり8つを1行（1枚約155px）。
   ※横スクロール化はしない（本ブロックの既定方針＝62行のコメント）。 */
@media(min-width:768px) and (max-width:1199px){
  /* 左に矢印1つ分（28px）の余地を作る。2行目の「5年」の前に矢印を置くため。
     1行目の先頭（お引き渡し）には矢印が付かないので、その分だけ左が空く。
     こうすることで1行目と2行目の桁（カラム位置）が完全に揃う。 */
  .inspection-flow{flex-wrap:wrap;gap:44px 24px;padding-left:28px;}
  .inspection-flow__item{flex:0 0 calc((100% - 28px - 3 * 24px) / 4);}
  /* 各行の右端（4番目＝「2年」）の「→」は行の外を指してしまうので消す */
  .inspection-flow__item:nth-child(4n)::after{content:none;}
  /* [20260821l-2] ディレクター指示「2年の後の矢印は『5年』の前に配置」。
     ＝行末に置くのではなく、次の行の先頭（2行目の「5年」）の左に「→」を置く。 */
  .inspection-flow__item:nth-child(4n+1):not(:first-child)::before{
    content:"→";position:absolute;left:-24px;top:50%;transform:translateY(-50%);
    color:#888;font-size:var(--fs-caption);line-height:1;
  }
}

/* お手入れ手帖DLブロック */
.techo{max-width:var(--c1-measure);margin:0 auto;border:1px solid var(--c-line);background:var(--c-bg);padding:24px 20px;display:grid;gap:20px;}
.techo__cover{aspect-ratio:210/297;width:180px;max-width:60%;margin:0 auto;box-shadow:0 0 0 1px var(--c-line);}   /* [20261026z] 完成版の表紙（A4比・細い縁取り＝資料カードと同じ） */
.techo__cover img{display:block;width:100%;height:100%;object-fit:cover;}
.techo__title{font-size:var(--c1-fs-h3);font-weight:500;letter-spacing:var(--ls-2);margin-bottom:10px;text-align:center;}
.techo__caution{font-size:var(--fs-micro);color:var(--c-text-note);margin-top:14px;line-height:1.8;}
@media(min-width:768px){
  .techo{grid-template-columns:200px 1fr;padding:32px;align-items:center;}
  .techo__cover{margin:0;width:100%;max-width:200px;}
  .techo__title{text-align:left;}
}
.techo .btn{width:100%;}   /* [20261026zb] ボタンの左右を、書名・分類・注意書きの列に揃える（ディレクター指示＝資料カード 20261026w と同じ扱い） */
.techo-cats{display:flex;flex-wrap:wrap;gap:6px;margin-top:14px;}
.techo-cats span{font-size:var(--fs-micro);border:1px solid var(--c-line-dark);color:var(--c-text-sub);padding:2px 10px;background:var(--c-bg-sub);}

/* 仮置きブロック（CMS非表示切替想定） */
/* [20260821cr] ディレクター指示「マージンも揃えて」。contact.html の電話ブロックと実測を突き合わせ、
   **食い違っていたのは「見出し→リード」の1箇所だけ**だった。
     ラベル→見出し 18px ✓一致 ／ リード→カード -8px ✓一致 ／ カード→受付行 16px ✓一致
     **見出し→リード = contact 28px / owners 64px（共有CSSの既定）** ← ここだけ差
   contact.html は `#tel-lead .section__title{margin-bottom:28px}` と**そのブロックだけに限定**して
   当てている（同じ `.section__title` を使う他セクションへ波及させないため）。同じやり方に倣い、
   owners.html でもセクションに `id="tel-lead"` を付けてスコープを限定する。 */
#tel-lead .section__title{margin-bottom:28px;}


/* [20260821cp] お問い合わせ窓口の電話カード。**contact.html の同名クラス群からそのまま転記**
   （新しいクラス・新しい級数は作っていない）。番号は `--c1-fs-h2`＝SP28/PC32px でページ内最大級。
   前案の `.owners-tel`（--fs-h3 18px）は目立ちが弱いため撤去した。 */
.tel-list{display:grid;gap:var(--grid-gap);max-width:var(--c1-measure);margin:0 auto;}
.tel-list--single{max-width:420px;}
@media(min-width:768px){.tel-list--single{grid-template-columns:1fr;}}
.tel-card{border:1px solid var(--c-line);background:var(--c-bg);padding:20px 16px;text-align:center;}
.tel-card__num{font-size:var(--c1-fs-h2);font-family:var(--ff-en);letter-spacing:.04em;line-height:1.4;display:block;margin:0;text-decoration:none;padding:6px 0;}
.tel-card__ic{width:.8em;height:.8em;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linejoin:round;vertical-align:-.04em;margin-right:.3em;}
.tel-hours{font-size:var(--fs-caption);color:var(--c-text-sub);text-align:center;margin-top:16px;letter-spacing:.04em;}

/* [20260821ce] ご家族・ご友人のご紹介セクションのイラスト。
   house-quality-support.html の .care-illust と同値（PC min(300px,70%)／SP 200px）。
   移設元の .ob-card__illust は幅200pxだったが、あちらは2列カードの中、
   こちらは読み幅640pxの独立セクションなので、同ページ帯の図版と同じ級で置く。 */
.referral-illust{display:block;width:min(300px,70%);margin:0 auto var(--sp-4);}
.referral-illust img{display:block;width:100%;height:auto;}
@media(max-width:767px){.referral-illust{width:200px;margin-bottom:var(--sp-3);}}

/* 段落ち対策ユーティリティ（基準=docs/22 §9 R08・2026-08-20）。
   本文中の <span class="nowrap"> で文節を一体で送り、最終行3字以下を防ぐ。 */
.nowrap{white-space:nowrap;}