@charset "UTF-8";
/* ============================================================================
   biz-works-img.css — 非住宅（biz）施工事例ページの「実写真スロット」レイヤー
   ----------------------------------------------------------------------------
   tag   : 20260809a（2026-08-09 / design-assistant）
   対象  : biz/works.html ・ biz/works-detail.html
   読込順: biz-base.css → biz-nav.css → ページ内<style> → biz-c1-dark.css → 本ファイル
           （.ph の破線ボーダー等を上書きするため**最後**に読む）

   設計方針
   1. `assets/biz-c1-dark.css` と `assets/c1-theme.css` は編集禁止（並行作業とのコンフリクト
      回避）。写真投入に必要な差分は本ファイル1枚に閉じる。
   2. 既存の未支給プレースホルダ `.ph` は **DOMもラベル文言も消さない**。写真を入れた
      スロットにだけ `.ph--photo` を足し、ラベルは視覚的に隠す（`.ph__label`）。
      → verify_biz_pages.py [7]「wireframes/biz/ 比・可視テキスト完全一致」を維持したまま
        見た目だけ写真に差し替えるための作法。写真未支給のスロットは従来どおり
        破線グレー面（＝「まだ無い」と分かる面）のまま残す。
   3. C-1トンマナ厳守: 角丸0・影なし・太字なし・object-fit:cover。演出は単発かつ控えめ
      （一覧カードのホバー拡大 1.03 のみ／prefers-reduced-motion で無効化）。
   ============================================================================ */

/* --- 写真スロット本体（.ph を写真面に置き換える） ------------------------- */
.ph--photo{
  position:relative;
  padding:0;
  border:none;              /* 未支給の破線を外す */
  border-radius:0;          /* 角丸0＝C-1 */
  background:var(--c-bg-sub);
  overflow:hidden;
}
.ph--photo > img{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}

/* --- スロットのラベル文言（DOMには残し、視覚的にのみ隠す） ---------------- */
.ph--photo > .ph__label{
  position:absolute;
  width:1px;height:1px;
  margin:-1px;padding:0;
  overflow:hidden;
  clip-path:inset(50%);
  white-space:nowrap;
  border:0;
}

/* --- works-detail: メインビジュアルの比率（min-heightのみだと切り過ぎるため） --- */
.ph--fv.ph--photo{
  aspect-ratio:4/3;
  min-height:0;
}
@media(min-width:768px){
  .ph--fv.ph--photo{ aspect-ratio:16/7; }   /* ギャラリー全幅カットと同じ横長リズム */
}

/* --- works一覧カード: 静かなホバー（拡大のみ・影なし） -------------------- */
.work-card .ph--photo > img{
  transition:transform .6s cubic-bezier(.22,.61,.36,1);
}
.work-card:hover .ph--photo > img{
  transform:scale(1.03);
}
@media(prefers-reduced-motion:reduce){
  .work-card .ph--photo > img{ transition:none; }
  .work-card:hover .ph--photo > img{ transform:none; }
}

/* --- 実例名キャプション（2026-08-09 P57回答: 実名表示OK・ダミー使用せず） --- */
/* 2026-08-09d 指示C（級数の統一）: 16/13px の中間サイズをトークンへ。
   本ファイルは biz-c1-dark.css より後読みのため、ここで直接トークンを参照する。 */
.work-card__case{
  display:block;font-size:var(--bz-fs-l3);font-weight:500;letter-spacing:.04em;
  line-height:1.7;color:var(--c-text);
}
.work-card__sub{
  display:block;font-size:var(--bz-fs-l4);font-weight:400;letter-spacing:.03em;
  line-height:1.8;color:var(--c-text-sub);margin-top:2px;
}