/* ==========================================================================
   fizx-push-up-bar.css — Issue-014 FIZX Push-up Bar page-specific 層
   wp_diversity theme / enqueue: is_page('fizx-push-up-bar') のときのみ配信
   読み込み順: style.css → rebuild.css → fizx-push-up-bar.css
   --------------------------------------------------------------------------
   命名根拠
   - 既存の page-specific CSS は `top.css` / `company.css` /
     `products-list.css` / `curble-chair.css` / `curble-sh-pillow.css` /
     `curble-2w-footrest.css`。「1 Page = 1 page-specific CSS / slug で命名」
     という規約に従い、slug `fizx-push-up-bar` に一致する
     `fizx-push-up-bar.css` を採用する。
   - class prefix は既存の `.fizx-` を **踏襲する**（Issue-013 の
     `.curble-footrest-` → `.footrest-` のような prefix 変更は行わない）。
     理由は本 Issue の CSS 方針が **visual parity 優先**（Trial Rule §9）で
     あるため。`.fizx-` / `.fizx-product-page` は theme CSS・他 release
     成果物のいずれにも存在せず、衝突 0件を実測済み
     （rebuild.css の `fizx` 出現は Design Token `--c-brand-fizx` の1行のみ）。
   - ルート `.page-fizx` は他ページと同じ page スコープ表明であり、
     tools/build-production-content.py が `<div class="page-*">` を
     ルート検出に使うため必須。内側の `.fizx-product-page` が
     Component ルートで、既存 CSS はすべてこちらに紐づく。
   --------------------------------------------------------------------------
   移設元と方針（Trial Rule §9）
   - 本ファイルの §1 は Production の Customizer「追加CSS」
     （`<style id="wp-custom-css">`）末尾にあった **FIZX 専用の連続ブロック**
     （offset 10,205–23,047 / 12,842 B / top-level 74 rules）を移設したもの。
     Phase 1B の実測で以下を確認済み:
       * ブロック内の非 FIZX ルール = 0
       * ブロック外の FIZX ルール   = 0
       * 参照カスタムプロパティ 13 個はすべてブロック内で自己定義
         → **外部依存トークン 0**
   - ### 見た目を意図的に変更しない。 ###
     `--fizx-*` トークンを Global Design Token（rebuild.css の
     `--c-*` / `--sp-*` / `--fs-*`）へ寄せる refactor は **本 Issue では行わない**。
     色・余白が動くと新しい Human Design Decision が発生するため。
     トークンの二重管理は Observation として記録し、後続 Issue へ送る。
   - 移設時の差分は次の2点のみ:
       (1) `.fizx-usage__grip-list` / `.fizx-usage__grip-item` の2ルールを削除。
           対応する本文（`狭め / 肩幅程度 / 広め`）を AI-014-09 で削除したため、
           参照元のないルールになる。
       (2) §2 として本 Issue で新設した要素のルールを追記
           （Hero facts / Hero action / Usage text / Cover action / CTA section）。
   - `!important` は使わない。inline style も使わない。JS も追加しない。
   - Global Component（rebuild.css）は再定義しない。
     再利用: .cta / .cta--primary / .link-inline / .ext-mark /
             .screen-reader-text / :focus-visible
   - breakpoint は移設元に合わせる（768）。
   --------------------------------------------------------------------------
   wpautop 注意（Issue-009 Production incident / Issue-010 O-30）
     `.fizx-hero__layout` / `.fizx-features__grid` / `.fizx-colors__grid` /
     `.fizx-specs__jan-list` / `.fizx-cover__jan-list` /
     `.fizx-brand__info-list` / `.fizx-faq__list` / `.fizx-cta__grid`
     は Grid / Flex コンテナ。
     **直接の子の位置に HTML コメントを置かない**こと。
     加えて **行頭空白 ＋ 閉じ `</div>`** は unmatched `</p>` を生む。
     投入用 Artifact は tools/build-production-content.py で行頭空白を除去する。
   ========================================================================== */

/* --------------------------------------------------------------------------
   §1  移設ブロック（Customizer 追加CSS より / visual parity）
   -------------------------------------------------------------------------- */
.fizx-product-page,
.fizx-product-page * {
  box-sizing: border-box;
}

.fizx-product-page {
  --fizx-color-text: #1a1a1a;
  --fizx-color-text-muted: #5a5a5a;
  --fizx-color-bg: #ffffff;
  --fizx-color-bg-muted: #f4f4f4;
  --fizx-color-border: #dcdcdc;
  --fizx-content-max-width: 40rem;
  --fizx-content-max-width-wide: 62rem;
  --fizx-space: 1rem;
  --fizx-space-lg: 2.5rem;
  --fizx-radius: 0.5rem;
  --fizx-shadow: 0 0.125rem 0.5rem rgba(0, 0, 0, 0.08);

  color: var(--fizx-color-text);
  background-color: var(--fizx-color-bg);
  overflow-x: hidden;
}

.fizx-product-page__container {
  width: 100%;
  max-width: var(--fizx-content-max-width);
  margin-left: auto;
  margin-right: auto;
  padding-left: var(--fizx-space);
  padding-right: var(--fizx-space);
}

.fizx-product-page .fizx-section {
  padding-top: var(--fizx-space-lg);
  padding-bottom: var(--fizx-space-lg);
  overflow-wrap: break-word;
}

.fizx-product-page .fizx-section__eyebrow {
  display: block;
  font-size: 0.8125rem;
  line-height: 1.4;
  color: var(--fizx-color-text-muted);
  margin: 0 0 0.5rem;
}

.fizx-product-page .fizx-section__title {
  font-size: 1.5rem;
  line-height: 1.3;
  color: var(--fizx-color-text);
  margin: 0 0 0.75rem;
}

.fizx-product-page .fizx-section__lead {
  font-size: 1rem;
  line-height: 1.7;
  color: var(--fizx-color-text-muted);
  margin: 0 0 var(--fizx-space);
}

.fizx-product-page__image {
  display: block;
  width: 100%;
  height: auto;
  max-width: 100%;
}

.fizx-product-page__visually-hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

@media (min-width: 768px) {
  .fizx-product-page__container {
    padding-left: var(--fizx-space-lg);
    padding-right: var(--fizx-space-lg);
  }

  .fizx-product-page .fizx-section {
    padding-top: calc(var(--fizx-space-lg) * 1.6);
    padding-bottom: calc(var(--fizx-space-lg) * 1.6);
  }

  .fizx-product-page .fizx-section__title {
    font-size: 2rem;
  }
}

.fizx-product-page .fizx-hero {
  --fizx-hero-color-bg: #111110;
  --fizx-hero-color-text: #f6f5f2;
  --fizx-hero-color-text-muted: #c2c0ba;
  background-color: var(--fizx-hero-color-bg);
  color: var(--fizx-hero-color-text);
  padding-top: var(--fizx-space);
  padding-bottom: calc(var(--fizx-space) * 1.5);
}

.fizx-product-page .fizx-hero .fizx-product-page__container {
  max-width: 72rem;
}

.fizx-product-page .fizx-hero__layout {
  display: flex;
  flex-direction: column;
  gap: var(--fizx-space);
}

.fizx-product-page .fizx-hero__media {
  width: 100%;
  max-width: 22rem;
  margin-inline: auto;
  border-radius: var(--fizx-radius);
  overflow: hidden;
  box-shadow: var(--fizx-shadow);
}

.fizx-product-page .fizx-hero__image {
  display: block;
  width: 100%;
  height: auto;
}

.fizx-product-page .fizx-hero__content {
  display: flex;
  flex-direction: column;
  max-width: 38rem;
}

.fizx-product-page .fizx-hero__eyebrow {
  display: block;
  font-size: 0.8125rem;
  line-height: 1.4;
  letter-spacing: 0.08em;
  color: var(--fizx-hero-color-text-muted);
  margin: 0 0 0.75rem;
}

.fizx-product-page .fizx-hero__title {
  font-size: clamp(1.75rem, 4vw + 1rem, 2.5rem);
  line-height: 1.25;
  color: var(--fizx-hero-color-text);
  margin: 0 0 0.5rem;
  word-break: keep-all;
  overflow-wrap: break-word;
}

.fizx-product-page .fizx-hero__model {
  font-size: 0.9375rem;
  line-height: 1.5;
  color: var(--fizx-hero-color-text-muted);
  margin: 0 0 1rem;
}

.fizx-product-page .fizx-hero__summary {
  font-size: 1rem;
  line-height: 1.7;
  color: var(--fizx-hero-color-text);
  margin: 0;
}

@media (min-width: 768px) {
  .fizx-product-page .fizx-hero {
    padding-top: calc(var(--fizx-space-lg) * 1.2);
    padding-bottom: calc(var(--fizx-space-lg) * 1.2);
  }

  .fizx-product-page .fizx-hero__layout {
    display: grid;
    grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.2fr);
    align-items: center;
    gap: var(--fizx-space-lg);
  }

  .fizx-product-page .fizx-hero__media {
    max-width: 30rem;
    margin-inline: 0;
  }
}

.fizx-product-page .fizx-features__grid {
  display: flex;
  flex-direction: column;
  gap: var(--fizx-space-lg);
}

.fizx-product-page .fizx-features__card {
  display: flex;
  flex-direction: column;
}

.fizx-product-page .fizx-features__card-title {
  font-size: 1.125rem;
  line-height: 1.4;
  color: var(--fizx-color-text);
  margin: var(--fizx-space) 0 0.5rem;
}

.fizx-product-page .fizx-features__card-text {
  font-size: 1rem;
  line-height: 1.7;
  color: var(--fizx-color-text-muted);
  margin: 0;
}

@media (min-width: 768px) {
  .fizx-product-page .fizx-features__grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--fizx-space-lg);
  }
}

.fizx-product-page .fizx-usage__subtitle {
  font-size: 1.125rem;
  line-height: 1.4;
  color: var(--fizx-color-text);
  margin: var(--fizx-space-lg) 0 0.75rem;
}

.fizx-product-page .fizx-usage__steps {
  margin: 0;
  padding-left: 1.25rem;
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.fizx-product-page .fizx-usage__step {
  font-size: 1rem;
  line-height: 1.7;
  color: var(--fizx-color-text-muted);
}

.fizx-product-page .fizx-usage__list {
  margin: 0;
  padding-left: 1.25rem;
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.fizx-product-page .fizx-usage__list-item {
  font-size: 1rem;
  line-height: 1.7;
  color: var(--fizx-color-text-muted);
}

.fizx-product-page .fizx-colors__overview {
  margin: 0 0 var(--fizx-space-lg);
}

.fizx-product-page .fizx-colors__grid {
  display: flex;
  flex-direction: column;
  gap: var(--fizx-space);
}

.fizx-product-page .fizx-colors__card {
  display: flex;
  flex-direction: column;
  align-items: center;
  background-color: var(--fizx-color-bg-muted);
  border-radius: var(--fizx-radius);
  padding: var(--fizx-space);
}

.fizx-product-page .fizx-colors__label {
  font-size: 1rem;
  line-height: 1.5;
  color: var(--fizx-color-text);
  text-align: center;
  margin: 0.75rem 0 0;
}

@media (min-width: 768px) {
  .fizx-product-page .fizx-colors__grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--fizx-space-lg);
  }
}

.fizx-product-page .fizx-specs__image {
  max-width: 20rem;
  margin: 0 auto var(--fizx-space-lg);
}

.fizx-product-page .fizx-specs__table-wrap {
  overflow-x: auto;
}

.fizx-product-page .fizx-specs__table {
  width: 100%;
  border-collapse: collapse;
}

.fizx-product-page .fizx-specs__caption {
  text-align: left;
  font-size: 0.9375rem;
  line-height: 1.5;
  color: var(--fizx-color-text-muted);
  margin: 0 0 0.75rem;
}

.fizx-product-page .fizx-specs__table-header {
  text-align: left;
  vertical-align: top;
  white-space: nowrap;
  font-size: 1rem;
  line-height: 1.6;
  color: var(--fizx-color-text);
  padding: 0.625rem 0.75rem 0.625rem 0;
  border-bottom: 1px solid var(--fizx-color-border);
}

.fizx-product-page .fizx-specs__table-cell {
  text-align: left;
  font-size: 1rem;
  line-height: 1.6;
  color: var(--fizx-color-text-muted);
  padding: 0.625rem 0;
  border-bottom: 1px solid var(--fizx-color-border);
}

.fizx-product-page .fizx-specs__subtitle {
  font-size: 1.125rem;
  line-height: 1.4;
  color: var(--fizx-color-text);
  margin: var(--fizx-space-lg) 0 0.75rem;
}

.fizx-product-page .fizx-specs__jan-list {
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.fizx-product-page .fizx-specs__jan-row {
  display: flex;
  justify-content: flex-start;
  gap: var(--fizx-space);
  padding: 0.5rem 0;
  border-bottom: 1px solid var(--fizx-color-border);
}

.fizx-product-page .fizx-specs__jan-term {
  flex: 0 0 7.5rem;
  width: 7.5rem;
  font-size: 1rem;
  line-height: 1.5;
  color: var(--fizx-color-text);
  margin: 0;
}

.fizx-product-page .fizx-specs__jan-desc {
  font-size: 1rem;
  line-height: 1.5;
  color: var(--fizx-color-text-muted);
  margin: 0;
}

.fizx-product-page .fizx-cover {
  background-color: var(--fizx-color-bg-muted);
}

.fizx-product-page .fizx-cover .fizx-product-page__container {
  max-width: 32rem;
}

.fizx-product-page .fizx-cover__title {
  font-size: 1.25rem;
}

.fizx-product-page .fizx-cover__badges {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin: 0 0 0.75rem;
}

.fizx-product-page .fizx-cover__badge {
  display: inline-block;
  font-size: 0.8125rem;
  line-height: 1.4;
  color: var(--fizx-color-text);
  background-color: var(--fizx-color-bg);
  border: 1px solid var(--fizx-color-border);
  border-radius: var(--fizx-radius);
  padding: 0.25rem 0.625rem;
}

.fizx-product-page .fizx-cover__lead {
  font-size: 1rem;
  line-height: 1.6;
  color: var(--fizx-color-text-muted);
  margin: 0 0 var(--fizx-space);
}

.fizx-product-page .fizx-cover__figure {
  margin: 0 0 var(--fizx-space-lg);
  text-align: center;
}

.fizx-product-page .fizx-cover__image {
  max-width: 20rem;
  margin: 0 auto;
}

.fizx-product-page .fizx-cover__figure-caption {
  font-size: 0.9375rem;
  line-height: 1.5;
  color: var(--fizx-color-text-muted);
  margin: 0.75rem 0 0;
}

.fizx-product-page .fizx-cover__table-wrap {
  overflow-x: auto;
}

.fizx-product-page .fizx-cover__table {
  width: 100%;
  border-collapse: collapse;
}

.fizx-product-page .fizx-cover__caption {
  text-align: left;
  font-size: 0.9375rem;
  line-height: 1.5;
  color: var(--fizx-color-text-muted);
  margin: 0 0 0.75rem;
}

.fizx-product-page .fizx-cover__table-header {
  text-align: left;
  vertical-align: top;
  white-space: nowrap;
  font-size: 1rem;
  line-height: 1.6;
  color: var(--fizx-color-text);
  padding: 0.625rem 0.75rem 0.625rem 0;
  border-bottom: 1px solid var(--fizx-color-border);
}

.fizx-product-page .fizx-cover__table-cell {
  text-align: left;
  font-size: 1rem;
  line-height: 1.6;
  color: var(--fizx-color-text-muted);
  padding: 0.625rem 0;
  border-bottom: 1px solid var(--fizx-color-border);
}

.fizx-product-page .fizx-cover__subtitle {
  font-size: 1.125rem;
  line-height: 1.4;
  color: var(--fizx-color-text);
  margin: var(--fizx-space-lg) 0 0.75rem;
}

.fizx-product-page .fizx-cover__jan-list {
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.fizx-product-page .fizx-cover__jan-row {
  display: flex;
  justify-content: flex-start;
  gap: var(--fizx-space);
  padding: 0.5rem 0;
  border-bottom: 1px solid var(--fizx-color-border);
}

.fizx-product-page .fizx-cover__jan-term {
  flex: 0 0 7.5rem;
  width: 7.5rem;
  font-size: 1rem;
  line-height: 1.5;
  color: var(--fizx-color-text);
  margin: 0;
}

.fizx-product-page .fizx-cover__jan-desc {
  font-size: 1rem;
  line-height: 1.5;
  color: var(--fizx-color-text-muted);
  margin: 0;
}

.fizx-product-page .fizx-brand__subtitle {
  font-size: 1.125rem;
  line-height: 1.4;
  color: var(--fizx-color-text);
  margin: var(--fizx-space-lg) 0 0.75rem;
}

.fizx-product-page .fizx-brand__text {
  font-size: 1rem;
  line-height: 1.7;
  color: var(--fizx-color-text-muted);
  margin: 0;
}

.fizx-product-page .fizx-brand__info-list {
  margin: var(--fizx-space) 0 0;
  padding: 0;
}

.fizx-product-page .fizx-brand__info-row {
  padding: 0.5rem 0;
  border-bottom: 1px solid var(--fizx-color-border);
}

.fizx-product-page .fizx-brand__info-term {
  display: block;
  font-size: 0.875rem;
  line-height: 1.5;
  color: var(--fizx-color-text-muted);
  margin: 0 0 0.25rem;
}

.fizx-product-page .fizx-brand__info-desc {
  display: block;
  font-size: 1rem;
  line-height: 1.5;
  color: var(--fizx-color-text);
  margin: 0;
}

/* --------------------------------------------------------------------------
   §2  Issue-014 追加分
   移設元に存在しなかった要素のみ。§1 のトークン・タイポグラフィ階層に
   合わせており、既存要素の見た目は変更しない。
   -------------------------------------------------------------------------- */

/* 画像の <figure> ラッパ。
   ### wpautop 対策 ###: `<article>` / コンテナ直下に裸の `<img>` を置くと
   wpautop が `<img …></p>` を生成し **unmatched `</p>`** になる
   （現行 Production 本文で実際に発生している事象）。
   Issue-013 と同じく `<figure>` で包んで block 境界を明示する。
   `margin: 0` は UA 既定の `1em 40px` を打ち消し、
   移設元（裸の img）と **同一の余白**にするためのもの。
   余白は従来どおり img 側のクラスが持つ。 */
.fizx-product-page .fizx-features__figure {
  margin: 0;
}

.fizx-product-page .fizx-colors__figure {
  margin: 0;
  width: 100%;
}

.fizx-product-page .fizx-colors__overview-figure,
.fizx-product-page .fizx-specs__figure {
  margin: 0;
}

/* Hero — Definition Block 直下の要点リスト。
   Hero は暗色面（--fizx-hero-color-*）のため、色は Hero スコープ内で解決する。 */
.fizx-product-page .fizx-hero__facts {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem 0.75rem;
  list-style: none;
  margin: 1rem 0 0;
  padding: 0;
}

.fizx-product-page .fizx-hero__facts li {
  font-size: 0.8125rem;
  line-height: 1.5;
  color: var(--fizx-hero-color-text);
  border: 1px solid rgba(246, 245, 242, 0.35);
  border-radius: 999px;
  padding: 0.25rem 0.75rem;
}

.fizx-product-page .fizx-hero__action {
  margin: 1.25rem 0 0;
}

/* Hero は暗色面（#111110）。Global の .cta--primary（背景 var(--c-primary)
   = #40567f）は **ボタン面とHero地の境界コントラストが約 2.5:1** となり、
   WCAG 2.2 の 1.4.11 Non-text Contrast（3:1）を満たさない。
   ボタンの色そのものは変えず（他ページとの一貫性を保つため）、
   `.fizx-hero__facts` と同じ手法で淡い境界線を足して輪郭を可視化する。
   ### Hero CTA は本 Issue で新設した要素であり、移設元に存在しない。 ###
   したがって visual parity の対象外で、既存要素の見た目は変わらない。 */
.fizx-product-page .fizx-hero__action .cta--primary {
  border: 1px solid rgba(246, 245, 242, 0.45);
}

/* Usage — 対応トレーニングの説明文。
   `.fizx-section__lead` と同じ役割だが Usage 内の h3 直下に置くため別名。 */
.fizx-product-page .fizx-usage__text {
  font-size: 1rem;
  line-height: 1.7;
  color: var(--fizx-color-text-muted);
  margin: 0 0 var(--fizx-space);
}

/* Cover — 専用カバーの Shopify 導線。 */
.fizx-product-page .fizx-cover__action {
  margin: var(--fizx-space) 0 0;
}

/* CTA — 本 Issue で新設。購入・法人問い合わせ・Hub 復帰。 */
.fizx-product-page .fizx-cta {
  background-color: var(--fizx-color-bg-muted);
}

.fizx-product-page .fizx-cta__grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--fizx-space-lg);
}

.fizx-product-page .fizx-cta__subtitle {
  font-size: 1.0625rem;
  line-height: 1.5;
  color: var(--fizx-color-text);
  margin: 0 0 0.5rem;
}

.fizx-product-page .fizx-cta__body {
  font-size: 0.9375rem;
  line-height: 1.7;
  color: var(--fizx-color-text-muted);
  margin: 0 0 0.875rem;
}

.fizx-product-page .fizx-cta__action {
  margin: 0;
}

.fizx-product-page .fizx-cta__more {
  font-size: 0.9375rem;
  line-height: 1.7;
  margin: var(--fizx-space-lg) 0 0;
}

@media (min-width: 768px) {
  .fizx-product-page .fizx-cta__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

/* --------------------------------------------------------------------------
   §3  Design Revision 1（Human Visual Review 2 / 2026-08-30）
   Human が指摘した 4 点のみを対象とする。Fact / SEO / Schema /
   CTA responsibility / material / Product Identity は変更していない。
   -------------------------------------------------------------------------- */

/* [R1-2/3] 幅の広い container。
   移設元は全セクションが 40rem（640px）で、Desktop 1440px でも本文が 640px、
   Features の 3 カードは **1枚 160px** しか幅が無く、Cover は 512px 幅に
   2,278px の縦積みになっていた（実測）。
   Features / Colors / Cover の **メディア系セクションのみ** 62rem へ広げる。
   テキスト主体のセクション（Usage / Specs / Brand / FAQ）は
   読み幅 40rem のまま変更しない。 */
/* 全セクションの container 幅を 62rem に統一する。
   当初は Features / Colors / Cover だけを広げたが、Usage / Specs / Brand / FAQ が
   40rem のままだと **セクションごとに左端がずれる**（Features の見出しは x=265、
   Usage の見出しは x=440）。左端の不揃いは見た目の破綻になるため、
   container は 1 種類に統一し、**読み幅は内側の要素で担保**する（下の measure 参照）。 */
.fizx-product-page .fizx-product-page__container {
  max-width: var(--fizx-content-max-width-wide);
}

/* 移設元には `.fizx-product-page .fizx-cover .fizx-product-page__container
   { max-width: 32rem }`（512px）があり、詳細度 (0,3,0) で上の宣言 (0,2,0) に勝つ。
   Cover は R1-3 で Accessory summary layout に再設計したため、同じ詳細度で
   後方に置いて上書きする。Human Decision（item 3）で明示的に許可された変更。 */
.fizx-product-page .fizx-cover .fizx-product-page__container {
  max-width: var(--fizx-content-max-width-wide);
}

/* container を広げても **テキストの読み幅は 40rem のまま**にする。
   これにより「セクションの左端は揃うが、本文の行長は従来どおり」になる。
   仕様表・FAQ・注意事項リストなどは移設元と同じ体感幅を維持する。 */
.fizx-product-page .fizx-section__lead,
.fizx-product-page .fizx-usage__text,
.fizx-product-page .fizx-usage__steps,
.fizx-product-page .fizx-usage__list,
.fizx-product-page .fizx-brand__text,
.fizx-product-page .fizx-brand__info-list,
.fizx-product-page .fizx-specs__table-wrap,
.fizx-product-page .fizx-specs__jan-list,
.fizx-product-page .fizx-faq__list {
  max-width: var(--fizx-content-max-width);
}

/* [R1-2] Features 3カードの画像ビューポートを統一。
   採用比率 = **860 / 755**（= use-closeup-07 の実寸比 1.139:1）。
   3枚の実画像を確認した結果:
     - feature-05 (1.528:1) 被写体は中央約60%、左右に約29%の余白
     - feature-02 (1.436:1) 手とバーが上下いっぱい、左右に余白
     - closeup-07 (1.139:1) バーが右下端。**上下のcropは不可**
   → 3枚とも縦方向のcropが危険なため、**最も正方形に近い 1.139:1** を採用し
     横方向のみを cover でトリミングする（feature-05 は左右各12.7%、
     feature-02 は左右各10.4%、closeup-07 は無crop）。いずれも余白内に収まる。
   元画像は変更していない。新規 Asset も使用していない。 */
.fizx-product-page .fizx-features__figure {
  aspect-ratio: 860 / 755;
  overflow: hidden;
  background-color: var(--fizx-color-bg-muted);
  border-radius: var(--fizx-radius);
}

.fizx-product-page .fizx-features__figure .fizx-product-page__image {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

/* [R1-3] Accessory summary layout。
   本体商品と同等の情報量（寸法図・JAN・フル仕様表）を廃し、
   メディアと要点を組み合わせた主従の明確な構成にする。 */
.fizx-product-page .fizx-cover__summary {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--fizx-space-lg);
  align-items: start;
}

.fizx-product-page .fizx-cover__media {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--fizx-space);
}

.fizx-product-page .fizx-cover__media .fizx-cover__figure {
  margin: 0;
}

.fizx-product-page .fizx-cover__media .fizx-cover__image {
  max-width: 100%;
  aspect-ratio: 1 / 1;
  object-fit: contain;
  background-color: var(--fizx-color-bg-muted);
  border-radius: var(--fizx-radius);
}

.fizx-product-page .fizx-cover__facts {
  margin: 0 0 var(--fizx-space-lg);
  padding: 0;
}

.fizx-product-page .fizx-cover__facts-row {
  display: grid;
  grid-template-columns: 6rem 1fr;
  gap: 0.75rem;
  padding: 0.625rem 0;
  border-bottom: 1px solid var(--fizx-color-border);
}

.fizx-product-page .fizx-cover__facts-row:first-child {
  border-top: 1px solid var(--fizx-color-border);
}

.fizx-product-page .fizx-cover__facts-term {
  margin: 0;
  font-size: 0.875rem;
  line-height: 1.6;
  color: var(--fizx-color-text-muted);
}

.fizx-product-page .fizx-cover__facts-desc {
  margin: 0;
  font-size: 0.9375rem;
  line-height: 1.6;
  color: var(--fizx-color-text);
}

/* [R1-4] FAQ component。
   17問になったため UA 既定の <details> 表示では成立しない。
   native <details>/<summary> の挙動は維持し、JS は追加しない。
   派手な accordion にはせず Global の静かなトーンに合わせる。 */
.fizx-product-page .fizx-faq__list {
  border-top: 1px solid var(--fizx-color-border);
}

.fizx-product-page .fizx-faq__item {
  border-bottom: 1px solid var(--fizx-color-border);
}

.fizx-product-page .fizx-faq__question {
  display: flex;
  align-items: flex-start;
  gap: 0.75rem;
  min-height: 44px;
  padding: 0.875rem 0;
  font-size: 0.9375rem;
  font-weight: 700;
  line-height: 1.6;
  color: var(--fizx-color-text);
  cursor: pointer;
  list-style: none;
}

.fizx-product-page .fizx-faq__question::-webkit-details-marker {
  display: none;
}

.fizx-product-page .fizx-faq__question::before {
  content: "＋";
  flex: 0 0 auto;
  width: 1.25em;
  font-weight: 400;
  color: var(--fizx-color-text-muted);
}

.fizx-product-page .fizx-faq__item[open] > .fizx-faq__question::before {
  content: "－";
}

.fizx-product-page .fizx-faq__question:hover {
  color: var(--fizx-color-text-muted);
}

.fizx-product-page .fizx-faq__question:focus-visible {
  outline: 2px solid var(--c-focus, #1f6feb);
  outline-offset: 2px;
}

.fizx-product-page .fizx-faq__answer {
  margin: 0;
  padding: 0 0 1.125rem 2rem;
  font-size: 0.9375rem;
  line-height: 1.8;
  color: var(--fizx-color-text-muted);
}

@media (min-width: 768px) {
  .fizx-product-page .fizx-cover__summary {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: calc(var(--fizx-space-lg) * 1.2);
  }

  .fizx-product-page .fizx-faq__question,
  .fizx-product-page .fizx-faq__answer {
    font-size: 1rem;
  }
}
