/*
 * トップページ共通レイアウト（2026-10-23）
 * 対象：index.html / employee-home.html / digital-home.html（standalone-home テンプレート）
 *
 * 商品詳細ページ（css/detail-layout-2026.css）と同じ考え方で、見た目のデザイン・文字・画像・ボタンは変えず
 * 「面積」と背景色だけをそろえる。
 *  - 各ブロックの中身の幅 = var(--layout-width)（画面の87.5%・最大1440px。css/brand-tokens.css で定義）
 *  - 横に流れるスペックバー（.specs-bar）だけは画面いっぱいのまま
 *  - 銀灰色の背景（#f5f5f7）は var(--page-bg-silver) にそろえる
 */

/* ---- 幅：全ブロックの中身を同じ幅にそろえる ---- */
html body section.hero > .hero-content-wrapper,
html body section:not(.specs-bar) > .container,
html body section.of-section > .home-flow-inner,
html body section.nx-section > .nx-container,
html body section.case-studies > .white-background > .container {
  width: var(--layout-width) !important;
  max-width: none !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  box-sizing: border-box !important;
}
/* index.html は home-beginner-guide.css / home-purpose-refined.css が body.home-page・#products 指定で幅を固定しているため、同じ強さで上書きする */
html body.home-page section.home-beginner-guide > .container,
html body.home-page section.price-comparison > .container,
html body.home-page #products > .nx-container {
  width: var(--layout-width) !important;
  max-width: none !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}
html body.home-page section.home-beginner-guide,
html body.home-page #products.nx-products-section.nx-section {
  background-color: var(--page-bg-silver) !important;
}
/* 中身をそろえるため、ブロック自体の左右の余白はなくす（背景の色帯は画面いっぱいのまま） */
html body section.color-card,
html body section.price-comparison {
  padding-left: 0 !important;
  padding-right: 0 !important;
}

/* ---- 背景色の統一 ---- */
html body section.color-card,
html body section.nx-section {
  background-color: var(--page-bg-silver) !important;
}
