:root {
  color-scheme: light;
  --color-white: #ffffff;
  --color-primary: #595a5d;
  --color-primary-strong: #4d4e50;
  --color-secondary: #787b83;
  --color-accent: #b5a27c;
  --shadow-header: 0 8px 8px rgba(116, 109, 96, 0.1);
}

*,
*::before,
*::after {
  box-sizing: border-box;
}

body {
  margin: 0;
  font-family: "Noto Sans JP", sans-serif;
  color: var(--color-primary);
  background: #f7f6f3;
}

img {
  display: block;
  max-width: 100%;
}

a {
  color: inherit;
  text-decoration: none;
}

/* =============================================
   WordPress Block Editor Reset
   Gutenbergブロックのデフォルトスタイルをリセット
   ============================================= */

/* テンプレートパーツラッパーのリセット */
.wp-block-template-part {
  display: contents;
}

/* WordPress flex/grid gap デフォルトを無効化 */
:where(.is-layout-flex) {
  gap: 0;
}
:where(.is-layout-grid) {
  gap: 0;
}

/* グループブロックのデフォルトレイアウトを無効化 */
.wp-block-group {
  box-sizing: border-box;
}

/* ブロックのデフォルト幅・余白をリセット */
.wp-block-group:where(:not([class*="__"])):where(:not([class*="--"])) {
  max-width: none;
  margin-left: 0;
  margin-right: 0;
  padding-left: 0;
  padding-right: 0;
}

/* 見出しブロックのデフォルトスタイルをリセット */
.wp-block-heading {
  margin-top: 0;
  margin-bottom: 0;
}

/* 段落ブロックのデフォルトスタイルをリセット */
.wp-block-paragraph {
  margin-top: 0;
  margin-bottom: 0;
}

/* 画像ブロックのデフォルトスタイルをリセット */
.wp-block-image {
  margin: 0;
}

.wp-block-image img {
  display: block;
  max-width: 100%;
  height: auto;
}

.wp-block-image figcaption {
  margin-top: 0.5em;
}

/* リストブロックのデフォルトスタイルをリセット */
.wp-block-list {
  margin: 0;
  padding: 0;
}

/* テーブルブロックのデフォルトスタイルをリセット */
.wp-block-table {
  margin: 0;
}

.wp-block-table table {
  width: 100%;
  border-collapse: collapse;
}

/* Gutenbergのレイアウトクラスを完全に無効化 */
.is-layout-constrained,
.is-layout-flow,
.is-layout-flex {
  max-width: none !important;
}

/* WordPressが生成するレイアウトスタイルを上書き */
/* 注意: カスタムブロックのmargin: autoを保持するためunsetは使用しない */
.is-layout-constrained > *,
.is-layout-flow > *,
:where(.wp-block-post-content) > * {
  max-width: none !important;
}

/* コンテンツエリア内の直接子要素は margin: auto を許可 */
.wp-block-post-content > section,
.wp-block-post-content > article,
.wp-block-post-content > div:not([class*="__"]),
.wp-block-post-content > nav,
.entry-content > section,
.entry-content > article,
.entry-content > div:not([class*="__"]),
.entry-content > nav {
  margin-left: auto !important;
  margin-right: auto !important;
}

/* エディタ内のブロック間余白を調整 */
.wp-block-group + .wp-block-group,
.wp-block-heading + .wp-block-group,
.wp-block-paragraph + .wp-block-group {
  margin-top: 0;
}

/* ==========================================================================
   Site Layout
   ========================================================================== */

/* メインコンテンツエリア */
.site-main {
  width: 100%;
}

/* 下層ページレイアウト */
.lower-page {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
}

/* ページコンテナ */
.page-container {
  width: 100%;
}

/* コンテンツエリア */
.entry-content,
.wp-block-post-content {
  width: 100%;
}

/* wp:post-contentブロック - シンプルにブロックフローで */
.wp-block-post-content {
  width: 100%;
}

/* wp:htmlブロック - コンテンツの中央揃えを許可 */
.wp-block-html {
  width: 100%;
}

/* wp:htmlブロック内の直接子要素も中央揃え */
.wp-block-html > section,
.wp-block-html > article,
.wp-block-html > div:not([class*="__"]) {
  margin-left: auto !important;
  margin-right: auto !important;
}

/* entry-contentコンテナ */
.entry-content {
  width: 100%;
}

/* ==========================================================================
   Block Container Defaults
   セクションやブロックの基本レイアウト
   ========================================================================== */

/* セクション要素はbox-sizingを明示 */
.wp-block-html > section,
.wp-block-html > article,
.wp-block-html > div {
  box-sizing: border-box;
}

/* ==========================================================================
   Responsive - SP時の共通パディング
   ========================================================================== */
@media (max-width: 768px) {
  .entry-content > section,
  .entry-content > article,
  .entry-content > div:not([class*="__"]),
  .wp-block-post-content > section,
  .wp-block-post-content > article,
  .wp-block-post-content > div:not([class*="__"]) {
    padding-left: 24px;
    padding-right: 24px;
  }
}