/* =========================================================
   Fu-Garden 下層ページの枠（fugarden-frame）
   ヘッダー・フッターは子テーマのトップの CSS（.fg）。本文は .fuf-main の中で、ここだけで整える。
   本文の決まりは :where() で弱くしてあるので、記事の中に自分の CSS を持つ部品（会社概要の書籍の枠など）は、そちらが勝つ。
   ========================================================= */
body.fu-sub {
  --washi: #f2f0ea; --washi-2: #e8e4d9; --washi-3: #f7f5f0;
  --ink: #080706; --ink-2: #2c2924; --ink-3: #4a463e; --rule: #d9d4c7;
  --gold: #9c7a18; --gold-text: #7a5f12; --moss: #5d6b3a;
  --serif: "Noto Serif JP", "Hiragino Mincho ProN", "Yu Mincho", serif;
  --latin: "Cormorant Garamond", Georgia, "Times New Roman", serif;
  --pad: clamp(20px, 5.5vw, 80px);
  margin: 0; background: var(--washi); color: var(--ink);
}
/* ヘッダーとフッターを包む .fg は、箱を作らない（ヘッダーの「上に貼りつく」をページ全体で効かせるため） */
.fg.fuf-part { display: contents; }
.fg-nav a[aria-current="page"]:not(.fg-nav__cta) { color: var(--gold-text); }

.fuf-main {
  font-family: var(--serif); font-size: 16px; line-height: 2; letter-spacing: 0.04em; color: var(--ink);
  -webkit-font-smoothing: antialiased; text-size-adjust: 100%;
  padding: clamp(48px, 7vw, 96px) var(--pad) clamp(64px, 8vw, 112px);
}
.fuf-main *, .fuf-main *::before, .fuf-main *::after { box-sizing: border-box; }
.fuf-article { max-width: 780px; margin: 0 auto; }

/* 題 */
.fuf-head { margin: 0 0 clamp(40px, 5vw, 64px); padding-bottom: clamp(24px, 3vw, 36px); border-bottom: 1px solid var(--ink); }
.fuf-kicker { margin: 0 0 10px; font-family: var(--latin); font-style: italic; font-size: 15px; letter-spacing: 0.22em; color: var(--gold-text); }
.fuf-lead { margin: 0 0 6px; font-size: 14px; letter-spacing: 0.12em; color: var(--ink-3); }
.fuf-title { margin: 0; font-size: clamp(30px, 4.2vw, 46px); font-weight: 500; line-height: 1.4; letter-spacing: 0.08em; overflow-wrap: anywhere; }

/* 本文：記事のブロック（:where で弱く） */
:where(.fuf-prose) { overflow-wrap: anywhere; }
:where(.fuf-prose) :where(p) { margin: 0 0 1.4em; }
:where(.fuf-prose) :where(h2) { margin: 2.6em 0 1em; padding-top: 1.1em; border-top: 1px solid var(--ink); font-size: clamp(22px, 2.6vw, 28px); font-weight: 500; line-height: 1.55; letter-spacing: 0.08em; }
:where(.fuf-prose) > :where(h2:first-child) { margin-top: 0; padding-top: 0; border-top: 0; }
:where(.fuf-prose) :where(h3) { margin: 2.2em 0 0.8em; padding-left: 14px; border-left: 2px solid var(--gold); font-size: clamp(18px, 2vw, 21px); font-weight: 600; line-height: 1.6; letter-spacing: 0.06em; }
:where(.fuf-prose) :where(h4) { margin: 1.8em 0 0.6em; font-size: 17px; font-weight: 600; line-height: 1.6; color: var(--ink-2); }
:where(.fuf-prose) :where(ul, ol) { margin: 0 0 1.4em; padding-left: 1.5em; }
:where(.fuf-prose) :where(li) { margin: 0.3em 0; }
:where(.fuf-prose) :where(li)::marker { color: var(--gold); }
:where(.fuf-prose) :where(strong, b) { font-weight: 700; }
:where(.fuf-prose) :where(a) { color: var(--ink); text-decoration: underline; text-decoration-color: var(--gold); text-underline-offset: 3px; }
:where(.fuf-prose) :where(a:hover) { color: var(--gold-text); }
:where(.fuf-prose) :where(hr) { margin: 3em auto; width: 48px; height: 0; border: 0; border-top: 1px solid var(--sand, #c9b98f); background: none; opacity: 1; }
:where(.fuf-prose) :where(blockquote) { margin: 1.8em 0; padding: 0.4em 0 0.4em 1.4em; border-left: 1px solid var(--ink); color: var(--ink-2); font-size: 17px; }
:where(.fuf-prose) :where(blockquote p:last-child) { margin-bottom: 0; }
:where(.fuf-prose) :where(pre) { margin: 0 0 1.4em; padding: 16px 18px; background: var(--washi-3); border: 1px solid var(--rule); font-family: var(--serif); font-size: 14px; line-height: 1.8; white-space: pre-wrap; }
:where(.fuf-prose) :where(img) { max-width: 100%; height: auto; }
:where(.fuf-prose) :where(figure) { margin: 2em 0; }
:where(.fuf-prose) :where(figcaption) { margin-top: 8px; font-size: 13px; color: var(--ink-3); text-align: center; }
:where(.fuf-prose) :where(iframe, video) { max-width: 100%; border: 0; }
:where(.fuf-prose) :where(.wp-block-gallery) { margin: 2em 0; }

/* 表（テーマの横スクロールの枠 .s_table も） */
:where(.fuf-prose) :where(.s_table, .wp-block-table) { margin: 2em 0; overflow-x: auto; -webkit-overflow-scrolling: touch; }
:where(.fuf-prose) :where(table) { width: 100%; border-collapse: collapse; font-size: 15px; line-height: 1.75; }
:where(.fuf-prose) :where(th, td) { padding: 12px 14px; border: 0; border-bottom: 1px solid var(--rule); text-align: left; vertical-align: top; background: none; }
:where(.fuf-prose) :where(thead th, thead td) { border-bottom: 1px solid var(--ink); font-weight: 600; }
:where(.fuf-prose) :where(tr > th:first-child) { font-weight: 600; white-space: nowrap; }

/* ボタン（ブロックのボタン） */
:where(.fuf-prose) :where(.wp-block-buttons) { margin: 2em 0; gap: 12px; }
.fuf-prose .wp-block-button__link { display: inline-flex; text-align: center; line-height: 1.6; align-items: center; justify-content: center; min-height: 52px; padding: 0 28px; border-radius: 0; background: var(--ink); color: var(--washi); border: 1px solid var(--ink); font-size: 15px; letter-spacing: 0.08em; text-decoration: none; }
.fuf-prose .wp-block-button__link:hover { background: var(--ink-2); color: var(--washi); }
.fuf-prose .is-style-outline .wp-block-button__link { background: transparent; color: var(--ink); }

/* お問合せのフォーム（Jetpack） */
:where(.fuf-prose) :where(input[type="text"], input[type="email"], input[type="tel"], input[type="url"], input[type="number"], input[type="date"], select, textarea) { max-width: 100%; padding: 12px 14px; border: 1px solid var(--rule); border-radius: 0; background: #fff; font-family: var(--serif); font-size: 16px; color: var(--ink); }
:where(.fuf-prose) :where(input:focus, select:focus, textarea:focus) { outline: 2px solid var(--gold); outline-offset: 1px; }
:where(.fuf-prose) :where(button[type="submit"], input[type="submit"]) { min-height: 52px; padding: 0 32px; border: 1px solid var(--ink); border-radius: 0; background: var(--ink); color: var(--washi); font-family: var(--serif); font-size: 15px; letter-spacing: 0.1em; cursor: pointer; }

/* 本文の後ろ：ご相談 */
.fuf-next { max-width: 780px; margin: clamp(56px, 7vw, 88px) auto 0; padding: clamp(28px, 4vw, 44px); background: var(--washi-2); text-align: center; }
.fuf-next__words { margin: 0 0 20px; font-size: clamp(17px, 2vw, 21px); line-height: 1.8; letter-spacing: 0.08em; }
.fuf-next__btns { margin: 0; display: flex; flex-wrap: wrap; justify-content: center; gap: 12px; }
.fuf-btn { display: inline-flex; align-items: center; justify-content: center; min-height: 52px; padding: 0 26px; background: var(--ink); color: var(--washi); border: 1px solid var(--ink); font-size: 15px; letter-spacing: 0.08em; text-decoration: none; }
.fuf-btn:hover { background: var(--ink-2); color: var(--washi); }
.fuf-btn--line { background: transparent; color: var(--ink); }
.fuf-btn--line:hover { background: var(--ink); color: var(--washi); }
.fuf-btn:focus-visible { outline: 2px solid var(--gold); outline-offset: 3px; }

@media (max-width: 600px) {
  .fuf-main { font-size: 15.5px; }
  /* 表は、狭い画面では縮めずに横へ送る（枠の中だけが動く） */
  :where(.fuf-prose) :where(.s_table, .wp-block-table) :where(table) { min-width: 560px; }
  :where(.fuf-prose) :where(.s_table, .wp-block-table) { margin-right: calc(-1 * var(--pad)); padding-right: var(--pad); }
  .fuf-prose .wp-block-button__link { padding: 10px 18px; font-size: 14px; letter-spacing: 0.04em; }
  .fuf-next__btns { flex-direction: column; }
  .fuf-btn { width: 100%; }
}

/* 1.0.1：記事の中に書かれた色と線を、枠の体系にそろえる
   ・ボタン：ブロックの色（オレンジ・赤などの「色の設定」）は !important で付くので、こちらも !important で墨に
   ・表：表の編集で入った背景色（表全体の灰色・見出しの行の色）と border 属性の外枠を消し、横の細い罫だけに */
.fuf-prose .wp-block-button__link.has-background,
.fuf-prose .wp-block-button__link.has-text-color { background-color: var(--ink) !important; color: var(--washi) !important; }
.fuf-prose .wp-block-button__link.has-background:hover { background-color: var(--ink-2) !important; }
.fuf-prose table { background: transparent !important; border: 0 !important; }
.fuf-prose table :is(td, th)[style*="background"] { background: transparent !important; font-weight: 600; }
.fuf-prose table tr:first-child > :is(td, th) { border-bottom: 1px solid var(--ink); }
/* 色の設定がされた段落（お問合せの「A：施主様用フォーム」「B：職人様用フォーム」の見出しなど）は、和紙の帯＋左に金の線 */
.fuf-prose .has-background:not(.wp-block-button__link) { background-color: var(--washi-2) !important; color: var(--ink) !important; border-left: 2px solid var(--gold); }
.fuf-prose .has-background:not(.wp-block-button__link) .has-text-color,
.fuf-prose .has-text-color:not(.wp-block-button__link) { color: var(--ink) !important; }