/* ===================================================================
   SUP+30 — 製品ページ「最後の砦 LAST FORT」（屋内設置型）last-fort.css
   構造はサバイブと同テンプレ＝ground.css を @import で再利用。
   PC = 確定カンプ node 226:30（横長 baked HERO 226:58）を 1:1 転写（内容カラム 792px 中央／台紙 1440）。
   SP = 確定カンプ node 742:486（M2転写0.75）を写経。各面は各自のカンプに従う（PC/SP は同期しない）。
   ・FV: PC=横長 baked 1枚絵 / SP=縦長 baked 1枚絵（743:1015・別画像）。
   ・SPEC: PC=／区切り表 / SP=spec-row 縦6項目・各等級を改行（748:504）。中身は同一・見せ方だけ別。
   ・CONCEPT/FEATURE/GALLERY/WORKS/VOICE/FLOW: 内容PC同一＝ground.css のライブ reflow が
     SPカンプ（742:486）と一致（同コンポーネント・同トークン・変えるのはレイアウト軸のみ＝健全な転写）。
   ・CTA: site.css が PC/SP 両方を持つ共有部品（ここでは触らない）。
   共通トークン・ヘッダー・フッター・CTA・モーションは site.css。
   =================================================================== */
@import url("/assets/css/ground.css");

/* ====== ① HERO（PC：焼き込みコラージュ・1440×672 を1枚絵で配置）======
   ground の .phero（h672・背景写真＋scrim＋ライブコピー）と同じ器寸法だが、
   確定カンプの hero は文字込みの1枚絵なので .phero-baked を全面 cover で敷くだけ。 */
.phero--baked{display:block}
.phero-baked{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 50%;display:block}

/* SP 専用 FV（375×500 縦長 baked・確定カンプ 743:1015）— PC では非表示 */
.phero-sp{display:none}

/* SP 専用 SPEC（spec-row・748:504）— PC では非表示 */
.pspec-sp{display:none}

/* ===================================================================
   SP（〜767px）— 確定カンプ 742:486 の写経で、ground.css の自動リフローを上書き
   =================================================================== */
@media (max-width:767px){
  /* --- ① FV：PC 横長 baked を隠し、SP 縦長 baked（743:1015）を表示 --- */
  /* ground.css の .phero（h672 背景写真器）と本ファイル PC の .phero--baked を両方畳む */
  .phero,.phero--baked{display:none}
  .phero-sp{display:block;width:100%;line-height:0;background:#ffffff}
  .phero-sp-img{display:block;width:100%;height:auto;aspect-ratio:375/500;object-fit:cover}

  /* --- ⑤ SPEC：PC ／区切り表を隠し、SP spec-row（748:504）を表示 ---
     spec-row＝cobalt 上罫2px／各行＝cobalt ラベル13px bold ＋ 本文14.5px（各等級を改行） */
  .pspec-table{display:none}
  .pspec-sp{display:block;border-top:2px solid var(--cobalt);margin-top:0}
  .pspec-sp-row{display:flex;flex-direction:column;gap:7px;padding:15px 0;
    border-bottom:1px solid var(--line)}
  .pspec-sp-row .k{font-family:var(--jp);font-weight:700;font-size:13px;letter-spacing:.26px;
    line-height:normal;color:var(--cobalt);white-space:nowrap}
  .pspec-sp-row .v{font-family:var(--jp);font-weight:400;font-size:14.5px;line-height:1.72;color:#2a313f}
  .pspec-sp-row .v.strong{font-weight:700;color:var(--ink)}
}
