/*
Theme Name:  MANNAKA CRAFT
Theme URI:   https://crieinc.co.jp/
Description: まんなかクラフト（MANNAKA CRAFT）コーポレートサイト専用テーマ。
             一般住宅リフォーム／中古住宅リノベーション／空き家活用。
             クラシックテーマ（ブロックテーマではない）。Advanced Custom Fields PRO 必須。
Author:      株式会社クリエ
Author URI:  https://crieinc.co.jp/
Version:     0.1.0
Requires at least: 6.4
Tested up to: 6.7
Requires PHP: 8.0
Text Domain: mannaka
License:     Proprietary
License URI: https://crieinc.co.jp/

このファイルはテーマ情報のヘッダーと、各ページ共通のスタイルを置く場所。
読み込み順は tokens.css → base.css → components.css → layout.css → style.css。
デザイントークンは assets/css/tokens.css、リセットは assets/css/base.css、
汎用コンポーネントは assets/css/components.css、
ヘッダー・フッター・ドロワーは assets/css/layout.css。
このファイルにはページ個別のスタイルを書く。
直値（カラーコード・px）はここに書かず、必ず tokens.css の変数を使うこと。
*/


/* ==========================================================================
   ガレージ（page-garage.php）
   Figma: /reform/garage 2168:6414
   ========================================================================== */
.p-garage__intro {
  padding-block: var(--sp-48);
  text-align: center;
}

.p-garage__intro-catch {
  margin-bottom: var(--sp-32);
  font-size: var(--fs-28);
  line-height: var(--lh-150);
  letter-spacing: var(--ls-wide);
  color: var(--c-accent);
}

.p-garage__intro-text {
  max-width: var(--measure-md);
  margin-inline: auto;
  font-size: var(--fs-16);
  line-height: var(--lh-200);
  letter-spacing: var(--ls-wide);
  text-align: left;
}

.p-garage__reason .c-heading {
  margin-bottom: var(--sp-48);
}

.p-garage__reason-list {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--sp-40);
}

/* プラン紹介は全幅で写真とテキストを並べるので、見出しだけコンテナに入れる */
.p-garage__plan-head {
  padding-block: var(--sp-96) var(--sp-48);
}

.p-garage__plan-lead {
  margin-top: var(--sp-20);
  font-size: var(--fs-16);
  line-height: var(--lh-200);
  letter-spacing: var(--ls-wide);
}

.p-garage__plan-note {
  margin-top: var(--sp-12);
  font-size: var(--fs-14);
  line-height: var(--lh-150);
  color: var(--c-text-sub);
}

.p-garage__faq .c-heading,
.p-garage__other .c-heading {
  margin-bottom: var(--sp-48);
}

.p-garage__faq-foot {
  display: flex;
  justify-content: flex-end;
  margin-top: var(--sp-48);
}

@media (max-width: 767px) {

  .p-garage__intro {
    padding-block: var(--sp-32);
  }

  .p-garage__intro-catch {
    margin-bottom: var(--sp-20);
    font-size: var(--fs-20);
  }

  .p-garage__reason-list {
    grid-template-columns: 1fr;
    gap: var(--sp-20);
  }

  .p-garage__plan-head {
    padding-block: var(--sp-56) var(--sp-32);
  }

  .p-garage__reason .c-heading,
  .p-garage__faq .c-heading,
  .p-garage__other .c-heading {
    margin-bottom: var(--sp-32);
  }

  .p-garage__faq-foot {
    margin-top: var(--sp-32);
  }
}


/* ==========================================================================
   省エネ・断熱リフォーム（page-insulation.php）
   Figma: /reform/insulation 2168:6238
   ========================================================================== */
.p-insulation__intro {
  padding-block: var(--sp-48);
}

.p-insulation__intro-text {
  max-width: var(--measure-md);
  margin-inline: auto;
  font-size: var(--fs-16);
  line-height: var(--lh-200);
  letter-spacing: var(--ls-wide);
}

.p-insulation__problem .inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--sp-48);
}

.p-insulation__problem-box {
  width: min(800px, 100%);
  padding: var(--sp-40);
  background: var(--c-bg);
  border-radius: var(--radius-lg);
}

.p-insulation__problem-close {
  font-size: var(--fs-16);
  line-height: var(--lh-200);
  letter-spacing: var(--ls-wide);
  text-align: center;
}

.p-insulation__menu .inner {
  display: flex;
  flex-direction: column;
  gap: var(--sp-48);
}

.p-insulation__menu-head {
  display: flex;
  flex-direction: column;
  gap: var(--sp-20);
}

.p-insulation__menu-lead,
.p-insulation__price-lead {
  font-size: var(--fs-16);
  line-height: var(--lh-200);
  letter-spacing: var(--ls-wide);
}

.p-insulation__menu-list {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  column-gap: var(--sp-72);
}

.p-insulation__price-head {
  display: flex;
  flex-direction: column;
  gap: var(--sp-20);
  margin-bottom: var(--sp-48);
}

.p-insulation__price-notes {
  margin-top: var(--sp-16);
  font-size: var(--fs-14);
  line-height: var(--lh-150);
  color: var(--c-text-sub);
}

.p-insulation__subsidy {
  padding-block: var(--sp-72);
  background: url("assets/img/insulation/subsidy-bg.jpg") no-repeat center / cover;
}

.p-insulation__faq .c-heading,
.p-insulation__other .c-heading {
  margin-bottom: var(--sp-48);
}

.p-insulation__faq-foot {
  display: flex;
  justify-content: flex-end;
  margin-top: var(--sp-48);
}

@media (max-width: 767px) {

  .p-insulation__intro {
    padding-block: var(--sp-32);
  }

  .p-insulation__problem .inner,
  .p-insulation__menu .inner {
    gap: var(--sp-32);
  }

  .p-insulation__problem-box {
    padding: var(--sp-20);
  }

  .p-insulation__problem-close {
    text-align: left;
  }

  .p-insulation__menu-list {
    grid-template-columns: 1fr;
  }

  .p-insulation__price-head,
  .p-insulation__faq .c-heading,
  .p-insulation__other .c-heading {
    margin-bottom: var(--sp-32);
  }

  .p-insulation__subsidy {
    padding-block: var(--sp-40);
  }

  .p-insulation__faq-foot {
    margin-top: var(--sp-32);
  }
}


/* ==========================================================================
   内装リフォーム（page-interior.php）
   Figma: /reform/interior 2168:6094
   ========================================================================== */
.p-interior__intro {
  padding-block: var(--sp-48);
}

.p-interior__intro-text {
  max-width: var(--measure-md);
  margin-inline: auto;
  font-size: var(--fs-16);
  line-height: var(--lh-200);
  letter-spacing: var(--ls-wide);
}

.p-interior__problem .inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--sp-48);
}

.p-interior__problem-box {
  width: min(800px, 100%);
  padding: var(--sp-40);
  background: var(--c-bg);
  border-radius: var(--radius-lg);
}

.p-interior__problem-close {
  font-size: var(--fs-16);
  line-height: var(--lh-200);
  letter-spacing: var(--ls-wide);
  text-align: center;
}

.p-interior__menu .inner {
  display: flex;
  flex-direction: column;
  gap: var(--sp-48);
}

.p-interior__menu-list {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  column-gap: var(--sp-72);
}

/* 「間取り」のメッセージ帯。写真とグラデーションだけ差し込む */
.p-interior__message {
  --band-image: url("assets/img/band-bg.jpg");
  --band-overlay: linear-gradient(
    109.76deg,
    rgb(152 124 108 / .8) 0%,
    rgb(188 103 55 / .5) 50%,
    rgb(230 222 218 / .3) 100%
  );
}

.p-interior__message-text {
  padding-left: var(--sp-20);
}

.p-interior__faq .c-heading,
.p-interior__other .c-heading {
  margin-bottom: var(--sp-48);
}

.p-interior__faq-foot {
  display: flex;
  justify-content: flex-end;
  margin-top: var(--sp-48);
}

@media (max-width: 767px) {

  .p-interior__intro {
    padding-block: var(--sp-32);
  }

  .p-interior__problem .inner,
  .p-interior__menu .inner {
    gap: var(--sp-32);
  }

  .p-interior__problem-box {
    padding: var(--sp-20);
  }

  .p-interior__problem-close {
    text-align: left;
  }

  .p-interior__menu-list {
    grid-template-columns: 1fr;
  }

  .p-interior__message-text {
    padding-left: 0;
  }

  .p-interior__faq .c-heading,
  .p-interior__other .c-heading {
    margin-bottom: var(--sp-32);
  }

  .p-interior__faq-foot {
    margin-top: var(--sp-32);
  }
}


/* ==========================================================================
   外壁・屋根リフォーム（page-exterior.php）
   Figma: /reform/exterior 2168:5873
   ========================================================================== */
.p-exterior__intro {
  padding-block: var(--sp-48);
}

.p-exterior__intro-text {
  max-width: var(--measure-md);
  margin-inline: auto;
  font-size: var(--fs-16);
  line-height: var(--lh-200);
  letter-spacing: var(--ls-wide);
}

/* このページのMVリードだけカンプが太字。
   Google Fontsで読んでいるのは400/500なので、Medium で表現する */
.p-exterior .c-sub-mv__lead {
  font-weight: var(--fw-medium);
}

/* 無料劣化診断 */
.p-exterior__problem .inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--sp-48);
}

.p-exterior__problem-head {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--sp-20);
}

.p-exterior__problem-lead {
  font-size: var(--fs-16);
  line-height: var(--lh-200);
  letter-spacing: var(--ls-wide);
  text-align: center;
}

.p-exterior__problem-box {
  width: min(600px, 100%);
  padding: var(--sp-40);
  background: var(--c-bg);
  border-radius: var(--radius-lg);
}

/* 診断の申込CTA */
.p-exterior__diagnosis {
  padding-block: var(--sp-72);
  background: url("assets/img/exterior/diagnosis-bg.jpg") no-repeat center / cover;
}

/* 対応箇所 */
.p-exterior__menu .inner {
  display: flex;
  flex-direction: column;
  gap: var(--sp-48);
}

.p-exterior__menu-list {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  column-gap: var(--sp-72);
}

/* 料金 */
.p-exterior__price-head {
  display: flex;
  flex-direction: column;
  gap: var(--sp-20);
  margin-bottom: var(--sp-48);
}

.p-exterior__price-lead {
  font-size: var(--fs-16);
  line-height: var(--lh-150);
}

.p-exterior__price-notes {
  margin-top: var(--sp-16);
  font-size: var(--fs-14);
  line-height: var(--lh-150);
  color: var(--c-text-sub);
}

/* FAQ・その他メニュー */
.p-exterior__faq .c-heading,
.p-exterior__other .c-heading {
  margin-bottom: var(--sp-48);
}

.p-exterior__faq-foot {
  display: flex;
  justify-content: flex-end;
  margin-top: var(--sp-48);
}

@media (max-width: 767px) {

  .p-exterior__intro {
    padding-block: var(--sp-32);
  }

  .p-exterior__problem .inner,
  .p-exterior__menu .inner {
    gap: var(--sp-32);
  }

  .p-exterior__problem-lead {
    text-align: left;
  }

  .p-exterior__problem-box {
    padding: var(--sp-20);
  }

  .p-exterior__diagnosis {
    padding-block: var(--sp-40);
  }

  .p-exterior__menu-list {
    grid-template-columns: 1fr;
  }

  .p-exterior__price-head,
  .p-exterior__faq .c-heading,
  .p-exterior__other .c-heading {
    margin-bottom: var(--sp-32);
  }

  .p-exterior__faq-foot {
    margin-top: var(--sp-32);
  }
}


/* ==========================================================================
   水回りリフォーム（page-water.php）
   Figma: /reform/water 2168:5946
   共通で使えるものは components.css 側にあるので、ここは /reform/water 固有のみ
   ========================================================================== */
.p-water__intro {
  padding-block: var(--sp-48);
}

.p-water__intro-text {
  max-width: var(--measure-md);
  margin-inline: auto;
  font-size: var(--fs-16);
  line-height: var(--lh-200);
  letter-spacing: var(--ls-wide);
}

/* お悩み */
.p-water__problem .inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--sp-48);
}

.p-water__problem-box {
  width: min(600px, 100%);
  padding: var(--sp-40);
  background: var(--c-bg);
  border-radius: var(--radius-lg);
}

.p-water__problem-close {
  font-size: var(--fs-16);
  line-height: var(--lh-200);
  letter-spacing: var(--ls-wide);
  text-align: center;
}

/* 対応箇所 */
.p-water__menu .inner {
  display: flex;
  flex-direction: column;
  gap: var(--sp-48);
}

.p-water__menu-list {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  column-gap: var(--sp-72);
}

/* 料金 */
.p-water__price .c-heading {
  margin-bottom: var(--sp-48);
}

.p-water__price-notes {
  margin-top: var(--sp-16);
  font-size: var(--fs-14);
  line-height: var(--lh-150);
  color: var(--c-text-sub);
}

/* 3点セットプラン */
.p-water__plan {
  padding: var(--sp-72) 0;
  background: url("assets/img/water/plan-bg.jpg") no-repeat center / cover;
}

/* FAQ */
.p-water__faq .c-heading {
  margin-bottom: var(--sp-48);
}

.p-water__faq-foot {
  display: flex;
  justify-content: flex-end;
  margin-top: var(--sp-48);
}

/* その他メニュー */
.p-water__other .c-heading {
  margin-bottom: var(--sp-48);
}

@media (max-width: 767px) {

  .p-water__intro {
    padding-block: var(--sp-32);
  }

  .p-water__problem .inner,
  .p-water__menu .inner {
    gap: var(--sp-32);
  }

  .p-water__problem-box {
    padding: var(--sp-20);
  }

  .p-water__problem-close {
    text-align: left;
  }

  /* 対応箇所は1列に */
  .p-water__menu-list {
    grid-template-columns: 1fr;
  }

  .p-water__price .c-heading,
  .p-water__faq .c-heading,
  .p-water__other .c-heading {
    margin-bottom: var(--sp-32);
  }

  .p-water__plan {
    padding-block: var(--sp-40);
  }

  .p-water__faq-foot {
    margin-top: var(--sp-32);
  }
}


/* ==========================================================================
   リフォーム（page-reform.php）
   Figma: /reform 2168:5759
   共通で使えるものは components.css 側にあるので、ここは /reform 固有のみ
   ========================================================================== */

/* --------------------------------------------------------------------------
   導入
   Figma: text 2168:5762
   -------------------------------------------------------------------------- */
.p-reform__intro {
  padding-block: var(--sp-48);
}

.p-reform__intro-text {
  max-width: var(--measure-md);
  margin-inline: auto;
  font-size: var(--fs-16);
  line-height: var(--lh-200);
  letter-spacing: var(--ls-wide);
}


/* --------------------------------------------------------------------------
   サービスメニュー
   Figma: service 2168:5764
   -------------------------------------------------------------------------- */
.p-reform__service .c-heading {
  margin-bottom: var(--sp-48);
}

.p-reform__service-list {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: var(--sp-48) var(--sp-40);
}


/* --------------------------------------------------------------------------
   選ばれる理由
   Figma: SECTION-204 2168:5798
   -------------------------------------------------------------------------- */
.p-reform__reason .c-heading {
  margin-bottom: var(--sp-48);
}

.p-reform__reason-list {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--sp-40);
}

.p-reform__reason-foot {
  display: flex;
  justify-content: flex-end;
  margin-top: var(--sp-48);
}


/* --------------------------------------------------------------------------
   ガレージ特集
   Figma: Frame 439 2192:25702
   背景写真の上に斜めのグラデーションを重ね、白文字を乗せている
   -------------------------------------------------------------------------- */
.p-reform__garage {
  position: relative;
  padding-block: var(--sp-72);
  background: url("assets/img/reform/garage-bg.jpg") no-repeat center / cover;
  color: var(--c-text-invert);
  isolation: isolate;
}

.p-reform__garage::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background: var(--c-garage-grad);
}

.p-reform__garage .inner {
  display: flex;
  flex-direction: column;
  gap: var(--sp-32);
}

.p-reform__garage-label {
  display: flex;
  align-items: center;
  gap: var(--sp-8);
  font-size: var(--fs-20);
  line-height: var(--lh-150);
}

.p-reform__garage-line {
  width: 16px;
  height: 1px;
  background: currentColor;
}

.p-reform__garage-title {
  font-weight: var(--fw-regular);
  font-size: var(--fs-36);
  line-height: var(--lh-150);
  text-shadow: 0 0 10px var(--c-shadow-garage);
}

.p-reform__garage-text {
  font-size: var(--fs-16);
  line-height: var(--lh-200);
  letter-spacing: var(--ls-wide);
  text-shadow: 0 0 10px var(--c-shadow-garage);
}


/* --------------------------------------------------------------------------
   押さえるポイント ＋ プラン表 ＋ CTA
   Figma: price 2192:25586
   -------------------------------------------------------------------------- */
.p-reform__plan .inner {
  display: flex;
  flex-direction: column;
  gap: var(--sp-48);
}

.p-reform__plan-table {
  display: flex;
  flex-direction: column;
  gap: var(--sp-32);
}


/* --------------------------------------------------------------------------
   よくある質問
   -------------------------------------------------------------------------- */
.p-reform__faq .c-heading {
  margin-bottom: var(--sp-48);
}

.p-reform__faq-foot {
  display: flex;
  justify-content: flex-end;
  margin-top: var(--sp-48);
}


/* --------------------------------------------------------------------------
   /reform の767px以下
   -------------------------------------------------------------------------- */
@media (max-width: 767px) {

  .p-reform__intro {
    padding-block: var(--sp-32);
  }

  /* サービス・理由とも1列に */
  .p-reform__service-list,
  .p-reform__reason-list {
    grid-template-columns: 1fr;
    gap: var(--sp-32);
  }

  .p-reform__service .c-heading,
  .p-reform__reason .c-heading,
  .p-reform__faq .c-heading {
    margin-bottom: var(--sp-32);
  }

  .p-reform__reason-foot,
  .p-reform__faq-foot {
    margin-top: var(--sp-32);
  }

  .p-reform__garage {
    padding-block: var(--sp-40);
  }

  .p-reform__garage-label {
    font-size: var(--fs-16);
  }

  .p-reform__garage-title {
    font-size: var(--fs-24);
  }

  .p-reform__plan .inner {
    gap: var(--sp-32);
  }
}


/* ==========================================================================
   私たちについて（page-about.php）
   Figma: /about 2168:7436
   共通で使えるものは components.css 側にあるので、ここは /about 固有のみ
   ========================================================================== */

/* --------------------------------------------------------------------------
   導入 ＋ 強み
   Figma: text 2168:7451
   背景は木目写真の上に白〜クリームのグラデーションを重ねている
   -------------------------------------------------------------------------- */
.p-about__intro {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--sp-72);
  padding-block: var(--sp-72);
  isolation: isolate;
}

.p-about__intro-bg {
  position: absolute;
  inset: 0;
  z-index: -1;
  background: url("assets/img/about/about-strength-bg.jpg") no-repeat center / cover;
}

.p-about__intro-bg::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(
    to right,
    var(--c-white-30) 0%,
    var(--c-cream-70) 48.745%,
    var(--c-white-30) 100%
  );
}

.p-about__lead {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--sp-32);
  text-align: center;
}

.p-about__lead-title {
  font-weight: var(--fw-regular);
  font-size: var(--fs-40);
  line-height: var(--lh-150);
  color: var(--c-accent);
}

.p-about__lead-text {
  max-width: var(--measure-md);
  font-size: var(--fs-16);
  line-height: var(--lh-200);
  letter-spacing: var(--ls-wide);
  text-align: left;
}

.p-about__strength {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--sp-48);
  width: min(var(--container-wide), 100% - var(--gutter) * 2);
}

.p-about__strength-list {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: var(--sp-48) var(--sp-40);
  width: 100%;
}


/* --------------------------------------------------------------------------
   代表挨拶
   Figma: message 2168:7483
   -------------------------------------------------------------------------- */
.p-about__message .c-heading {
  margin-bottom: var(--sp-40);
}

.p-about__message-body {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--sp-72);
}

.p-about__message-photo img {
  width: 682px;
  max-width: 100%;
  height: auto;
  object-fit: cover;
  object-position: bottom;
  aspect-ratio: 682 / 400;
}

.p-about__message-text {
  display: flex;
  flex-direction: column;
  gap: var(--sp-40);
  width: min(var(--measure-lg), 100%);
}

.p-about__message-catch {
  align-self: center;
  font-weight: var(--fw-regular);
  font-size: var(--fs-28);
  line-height: var(--lh-120);
  letter-spacing: var(--ls-wider);
  color: var(--c-accent);
  text-align: center;
}

.p-about__message-lines {
  font-size: var(--fs-16);
  line-height: var(--lh-200);
  letter-spacing: var(--ls-wide);
}

.p-about__message-name {
  width: min(var(--measure-lg), 100%);
  font-size: var(--fs-16);
  line-height: var(--lh-150);
  text-align: right;
}


/* --------------------------------------------------------------------------
   サービスメニュー
   Figma: service 2168:7498
   -------------------------------------------------------------------------- */
.p-about__service .c-heading {
  margin-bottom: var(--sp-48);
}

.p-about__service-list {
  display: flex;
  flex-direction: column;
  gap: var(--sp-48);
  max-width: 838px;
  margin-inline: auto;
}

.p-about__service-item {
  display: flex;
  align-items: stretch;
  gap: var(--sp-32);
}

/* 最後の1件には区切り線を引かない */
.p-about__service-item:not(:last-child) {
  padding-bottom: var(--sp-48);
  border-bottom: 1px solid var(--c-border);
}

.p-about__service-body {
  display: flex;
  flex: 1 0 0;
  min-width: 0;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--sp-20);
}

.p-about__service-head {
  display: flex;
  align-items: baseline;
  gap: var(--sp-4);
  flex-wrap: wrap;
}

.p-about__service-en {
  font-family: var(--font-en);
  font-size: var(--fs-44);
  line-height: var(--lh-100);
  letter-spacing: var(--ls-wider);
  color: var(--c-text-sub);
}

.p-about__service-ja {
  font-weight: var(--fw-regular);
  font-size: var(--fs-16);
  line-height: var(--lh-150);
  letter-spacing: var(--ls-wider);
  color: var(--c-accent);
}

.p-about__service-text {
  font-size: var(--fs-16);
  line-height: var(--lh-200);
  letter-spacing: var(--ls-wide);
}

/* ボタンはカードの下端に揃える */
.p-about__service-body .c-btn-more {
  margin-top: auto;
  align-self: flex-end;
}

.p-about__service-photo {
  flex-shrink: 0;
  width: 308px;
}

.p-about__service-photo img {
  width: 100%;
  height: auto;
  object-fit: cover;
  aspect-ratio: 308 / 200;
}


/* --------------------------------------------------------------------------
   会社概要
   Figma: 2168:7529
   -------------------------------------------------------------------------- */
.p-about__company .c-heading {
  margin-bottom: var(--sp-48);
}

.p-about__company .c-dl {
  max-width: 800px;
  margin-inline: auto;
}


/* --------------------------------------------------------------------------
   /about の767px以下
   -------------------------------------------------------------------------- */
@media (max-width: 767px) {

  .p-about__intro {
    gap: var(--sp-40);
    padding-block: var(--sp-40);
  }

  .p-about__lead {
    gap: var(--sp-20);
    padding-inline: var(--gutter);
  }

  .p-about__lead-title {
    font-size: var(--fs-24);
  }

  .p-about__strength {
    gap: var(--sp-32);
  }

  /* カードは1列に */
  .p-about__strength-list {
    grid-template-columns: 1fr;
    gap: var(--sp-20);
  }

  .p-about__message-body {
    gap: var(--sp-32);
  }

  .p-about__message-photo img {
  aspect-ratio: 327 / 240;
}

  .p-about__message-catch {
    font-size: var(--fs-20);
    text-align: left;
    align-self: stretch;
  }

  /* 写真を上、本文を下の1カラムに */
  .p-about__service-item {
    flex-direction: column-reverse;
    gap: var(--sp-20);
  }

  .p-about__service-photo {
    width: 100%;
  }

  .p-about__service-photo img {
    aspect-ratio: 327 / 200;
  }

  .p-about__service-en {
    font-size: var(--fs-32);
  }

  .p-about__service-body .c-btn-more {
    align-self: flex-start;
  }

  .p-about__service .c-heading,
  .p-about__company .c-heading {
    margin-bottom: var(--sp-32);
  }
}


/* ==========================================================================
   汎用ページ（index.php / page.php）
   専用テンプレートができるまでの受け皿。最低限の体裁だけ整える
   ========================================================================== */
.l-page {
  padding-block: var(--sp-72) var(--sp-96);
}

.l-page__title {
  margin-bottom: var(--sp-32);
  font-size: var(--fs-32);
  line-height: var(--lh-150);
  letter-spacing: var(--ls-wide);
}

.l-page__content {
  line-height: var(--lh-200);
}

.l-page__content > * + * {
  margin-top: var(--sp-20);
}

.l-page__list {
  border-top: 1px solid var(--c-border);
}

.l-page__list a {
  display: flex;
  gap: var(--sp-24);
  padding-block: var(--sp-20);
  border-bottom: 1px solid var(--c-border);
}

.l-page__list a:hover {
  color: var(--c-accent);
}

.l-page__list-date {
  flex-shrink: 0;
  font-family: var(--font-en);
  color: var(--c-text-sub);
}

.l-page__empty {
  line-height: var(--lh-200);
}

.l-page__back {
  margin-top: var(--sp-32);
}

.l-page__back a {
  color: var(--c-accent);
  text-decoration: underline;
}

@media (max-width: 767px) {

  .l-page {
    padding-block: var(--sp-40) var(--sp-56);
  }

  .l-page__title {
    font-size: var(--fs-24);
  }

  .l-page__list a {
    flex-direction: column;
    gap: var(--sp-4);
  }
}



/* ==========================================================================
   プライバシーポリシー（page-privacy.php）
   下層MVができたら .p-privacy__head は template-parts/sub-mv.php に寄せる
   ========================================================================== */
.p-privacy__head {
  padding-block: var(--sp-72) var(--sp-56);
  background: var(--c-bg-beige);
}

.p-privacy__title {
  margin-bottom: var(--sp-24);
  font-size: var(--fs-32);
  line-height: var(--lh-150);
  letter-spacing: var(--ls-wide);
}

.p-privacy__lead {
  line-height: var(--lh-200);
  letter-spacing: var(--ls-wide);
}

.p-privacy__body {
  padding-block: var(--sp-72) var(--sp-96);
}

.p-privacy__section + .p-privacy__section {
  margin-top: var(--sp-56);
}

.p-privacy__section h2 {
  margin-bottom: var(--sp-20);
  padding-bottom: var(--sp-12);
  border-bottom: 1px solid var(--c-border);
  font-size: var(--fs-20);
  line-height: var(--lh-150);
}

.p-privacy__section p {
  line-height: var(--lh-200);
}

.p-privacy__section p + p,
.p-privacy__section p + .p-privacy__ul,
.p-privacy__section p + .p-privacy__list {
  margin-top: var(--sp-16);
}

.p-privacy__ul {
  list-style: disc;
  padding-left: 1.25em;
  line-height: var(--lh-200);
}

.p-privacy__list dt {
  margin-top: var(--sp-16);
  font-weight: var(--fw-medium);
  color: var(--c-text-sub);
}

.p-privacy__list dd {
  line-height: var(--lh-200);
}

.p-privacy__note {
  margin-top: var(--sp-16);
  font-size: var(--fs-14);
  color: var(--c-text-weak);
}

.p-privacy__section a {
  color: var(--c-accent);
  text-decoration: underline;
}

.p-privacy__company {
  display: grid;
  grid-template-columns: 8em 1fr;
  gap: var(--sp-12) var(--sp-24);
  line-height: var(--lh-150);
}

.p-privacy__company dt {
  font-weight: var(--fw-medium);
  color: var(--c-text-sub);
}

.p-privacy__date {
  margin-top: var(--sp-56);
  text-align: right;
  font-size: var(--fs-14);
  color: var(--c-text-weak);
}

@media (max-width: 767px) {

  .p-privacy__head {
    padding-block: var(--sp-40) var(--sp-32);
  }

  .p-privacy__title {
    font-size: var(--fs-24);
  }

  .p-privacy__body {
    padding-block: var(--sp-40) var(--sp-56);
  }

  .p-privacy__company {
    grid-template-columns: 1fr;
    gap: var(--sp-4);
  }

  .p-privacy__company dd + dt {
    margin-top: var(--sp-16);
  }
}


/* ==========================================================================
   中古住宅リノベーション（page-renovation.php）
   Figma: /renovation 2192:25728
   ========================================================================== */
.p-renovation__intro {
  padding-block: var(--sp-48);
}

.p-renovation__intro-text {
  max-width: var(--measure-md);
  margin-inline: auto;
  font-size: var(--fs-16);
  line-height: var(--lh-200);
  letter-spacing: var(--ls-wide);
}

.p-renovation__problem .inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--sp-48);
}

.p-renovation__problem-box {
  width: min(800px, 100%);
  padding: var(--sp-40);
  background: var(--c-bg);
  border-radius: var(--radius-lg);
}

.p-renovation__reason .c-heading,
.p-renovation__service .c-heading,
.p-renovation__faq .c-heading {
  margin-bottom: var(--sp-48);
}

/* 理由は2×2 */
.p-renovation__reason-list {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: var(--sp-40);
}

.p-renovation__service-list {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: var(--sp-48) var(--sp-40);
}

.p-renovation__service-note {
  margin-top: var(--sp-32);
  font-size: var(--fs-16);
  line-height: var(--lh-200);
  letter-spacing: var(--ls-wide);
}

.p-renovation__service .c-cta-box {
  margin-top: var(--sp-48);
}

.p-renovation__faq-foot {
  display: flex;
  justify-content: flex-end;
  margin-top: var(--sp-48);
}

@media (max-width: 767px) {

  .p-renovation__intro {
    padding-block: var(--sp-32);
  }

  .p-renovation__problem .inner {
    gap: var(--sp-32);
  }

  .p-renovation__problem-box {
    padding: var(--sp-20);
  }

  .p-renovation__reason-list,
  .p-renovation__service-list {
    grid-template-columns: 1fr;
    gap: var(--sp-24);
  }

  .p-renovation__reason .c-heading,
  .p-renovation__service .c-heading,
  .p-renovation__faq .c-heading {
    margin-bottom: var(--sp-32);
  }

  .p-renovation__service-note {
    margin-top: var(--sp-20);
  }

  .p-renovation__service .c-cta-box,
  .p-renovation__faq-foot {
    margin-top: var(--sp-32);
  }
}


/* ==========================================================================
   空き家活用（page-akiya.php）
   Figma: /akiya 2168:6567
   ========================================================================== */
.p-akiya__intro {
  padding-block: var(--sp-48);
  text-align: center;
}

.p-akiya__intro-catch {
  margin-bottom: var(--sp-32);
  font-size: var(--fs-28);
  line-height: var(--lh-150);
  letter-spacing: var(--ls-wide);
  color: var(--c-accent);
}

.p-akiya__intro-text {
  max-width: var(--measure-md);
  margin-inline: auto;
  font-size: var(--fs-16);
  line-height: var(--lh-200);
  letter-spacing: var(--ls-wide);
  text-align: left;
}

.p-akiya__problem .inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--sp-48);
}

.p-akiya__problem-box {
  width: min(800px, 100%);
  padding: var(--sp-40);
  background: var(--c-bg);
  border-radius: var(--radius-lg);
}

.p-akiya__service .c-heading,
.p-akiya__pattern .c-heading,
.p-akiya__faq .c-heading {
  margin-bottom: var(--sp-48);
}

.p-akiya__service-list {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: var(--sp-48) var(--sp-40);
}

/* 2フェーズFLOWのリード */
.p-akiya__flow-lead {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--sp-12);
  margin-bottom: var(--sp-48);
  text-align: center;
}

.p-akiya__flow-catch {
  font-size: var(--fs-28);
  line-height: var(--lh-150);
  letter-spacing: var(--ls-wide);
  color: var(--c-accent);
}

.p-akiya__flow-text {
  font-size: var(--fs-16);
  line-height: var(--lh-200);
  letter-spacing: var(--ls-wide);
}

.p-akiya__pattern-list {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--sp-40);
}

.p-akiya__faq-foot {
  display: flex;
  justify-content: flex-end;
  margin-top: var(--sp-48);
}

@media (max-width: 767px) {

  .p-akiya__intro {
    padding-block: var(--sp-32);
  }

  .p-akiya__intro-catch {
    margin-bottom: var(--sp-20);
    font-size: var(--fs-20);
  }

  .p-akiya__problem .inner {
    gap: var(--sp-32);
  }

  .p-akiya__problem-box {
    padding: var(--sp-20);
  }

  .p-akiya__service-list,
  .p-akiya__pattern-list {
    grid-template-columns: 1fr;
    gap: var(--sp-24);
  }

  .p-akiya__flow-lead {
    margin-bottom: var(--sp-32);
    text-align: left;
    align-items: flex-start;
  }

  .p-akiya__flow-catch {
    font-size: var(--fs-20);
  }

  .p-akiya__service .c-heading,
  .p-akiya__pattern .c-heading,
  .p-akiya__faq .c-heading {
    margin-bottom: var(--sp-32);
  }

  .p-akiya__faq-foot {
    margin-top: var(--sp-32);
  }
}


/* ==========================================================================
   空き家まるごと診断（page-diagnosis.php）
   Figma: /akiya/diagnosis 2168:6766
   ========================================================================== */
.p-diagnosis__intro {
  padding-block: var(--sp-48);
}

.p-diagnosis__intro-text {
  max-width: var(--measure-md);
  margin-inline: auto;
  font-size: var(--fs-16);
  line-height: var(--lh-200);
  letter-spacing: var(--ls-wide);
}

.p-diagnosis__problem .inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--sp-48);
}

.p-diagnosis__problem-box {
  width: min(800px, 100%);
  padding: var(--sp-40);
  background: var(--c-bg);
  border-radius: var(--radius-lg);
}

.p-diagnosis__menu .inner {
  display: flex;
  flex-direction: column;
  gap: var(--sp-32);
}

.p-diagnosis__menu-list {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--sp-48) var(--sp-40);
  margin-top: var(--sp-20);
}

/* なぜまんなかクラフトを通すのか */
.p-diagnosis__message {
  padding-block: var(--sp-72);
  background: url("assets/img/diagnosis/message-bg.jpg") no-repeat center bottom / cover;
  position: relative;
  isolation: isolate;
}

.p-diagnosis__message::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background: var(--c-white-50);
}

.p-diagnosis__message .inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--sp-48);
}

.p-diagnosis__message-body {
  display: flex;
  flex-direction: column;
  gap: var(--sp-20);
  width: min(494px, 100%);
  margin-right: auto;
}

.p-diagnosis__message-title {
  font-weight: var(--fw-regular);
  font-size: var(--fs-32);
  line-height: var(--lh-150);
  color: var(--c-accent);
}

.p-diagnosis__message-text {
  font-size: var(--fs-16);
  line-height: var(--lh-200);
  letter-spacing: var(--ls-wide);
}

.p-diagnosis__faq .c-heading,
.p-diagnosis__other .c-heading {
  margin-bottom: var(--sp-48);
}

.p-diagnosis__faq-foot {
  display: flex;
  justify-content: flex-end;
  margin-top: var(--sp-48);
}

@media (max-width: 767px) {

  .p-diagnosis__intro {
    padding-block: var(--sp-32);
  }

  .p-diagnosis__problem .inner {
    gap: var(--sp-32);
  }

  .p-diagnosis__problem-box {
    padding: var(--sp-20);
  }

  .p-diagnosis__menu-list {
    grid-template-columns: 1fr;
    gap: var(--sp-20);
  }

  .p-diagnosis__message {
    padding-block: var(--sp-40);
  }

  .p-diagnosis__message .inner {
    gap: var(--sp-32);
  }

  .p-diagnosis__message-title {
    font-size: var(--fs-24);
  }

  .p-diagnosis__faq .c-heading,
  .p-diagnosis__other .c-heading {
    margin-bottom: var(--sp-32);
  }

  .p-diagnosis__faq-foot {
    margin-top: var(--sp-32);
  }
}


/* ==========================================================================
   管理・見守りサポート（page-management.php）
   Figma: /akiya/management 2168:6911
   ========================================================================== */
.p-management__intro {
  padding-block: var(--sp-48);
}

.p-management__intro-text {
  max-width: var(--measure-md);
  margin-inline: auto;
  font-size: var(--fs-16);
  line-height: var(--lh-200);
  letter-spacing: var(--ls-wide);
}

.p-management__problem .inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--sp-48);
}

.p-management__problem-box {
  width: min(800px, 100%);
  padding: var(--sp-40);
  background: var(--c-bg);
  border-radius: var(--radius-lg);
}

.p-management__menu .c-heading,
.p-management__faq .c-heading,
.p-management__other .c-heading {
  margin-bottom: var(--sp-48);
}

.p-management__menu-list {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--sp-48) var(--sp-40);
}

.p-management__plan .c-heading {
  margin-bottom: var(--sp-48);
}

/* 単発対応のボックスは背景写真だけ差し替える */
.p-management__spot {
  margin-top: var(--sp-48);
  background-image: url("assets/img/cta-box-bg-alt.jpg");
}

.p-management__faq-foot {
  display: flex;
  justify-content: flex-end;
  margin-top: var(--sp-48);
}

@media (max-width: 767px) {

  .p-management__intro {
    padding-block: var(--sp-32);
  }

  .p-management__problem .inner {
    gap: var(--sp-32);
  }

  .p-management__problem-box {
    padding: var(--sp-20);
  }

  .p-management__menu-list {
    grid-template-columns: 1fr;
    gap: var(--sp-20);
  }

  .p-management__menu .c-heading,
  .p-management__plan .c-heading,
  .p-management__faq .c-heading,
  .p-management__other .c-heading {
    margin-bottom: var(--sp-32);
  }

  .p-management__spot {
    margin-top: var(--sp-32);
  }

  .p-management__faq-foot {
    margin-top: var(--sp-32);
  }
}


/* ==========================================================================
   残置物スッキリプラン（page-cleanup.php）
   Figma: /akiya/cleanup 2168:7110
   ========================================================================== */
.p-cleanup__intro {
  padding-block: var(--sp-48);
}

.p-cleanup__intro-text {
  max-width: var(--measure-md);
  margin-inline: auto;
  font-size: var(--fs-16);
  line-height: var(--lh-200);
  letter-spacing: var(--ls-wide);
}

.p-cleanup__change .c-heading,
.p-cleanup__price .c-heading,
.p-cleanup__menu .c-heading,
.p-cleanup__faq .c-heading,
.p-cleanup__other .c-heading {
  margin-bottom: var(--sp-48);
}

.p-cleanup__price-notes {
  margin-top: var(--sp-16);
  font-size: var(--fs-14);
  line-height: var(--lh-150);
  color: var(--c-text-sub);
}

/* 買い取り訴求の帯。背景は /reform/interior と同じ写真 */
.p-cleanup__band {
  --band-image: url("assets/img/band-bg.jpg");
  --band-overlay: linear-gradient(
    113.54deg,
    rgb(152 124 108 / .8) 0%,
    rgb(188 103 55 / .5) 50%,
    rgb(230 222 218 / .3) 100%
  );
}

.p-cleanup__band-text {
  padding-left: var(--sp-20);
}

.p-cleanup__menu-list {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--sp-40);
}

.p-cleanup__flow-note {
  padding-bottom: var(--sp-96);
  font-size: var(--fs-16);
  line-height: var(--lh-200);
  letter-spacing: var(--ls-wide);
}

.p-cleanup__faq-foot {
  display: flex;
  justify-content: flex-end;
  margin-top: var(--sp-48);
}

@media (max-width: 767px) {

  .p-cleanup__intro {
    padding-block: var(--sp-32);
  }

  .p-cleanup__change .c-heading,
  .p-cleanup__price .c-heading,
  .p-cleanup__menu .c-heading,
  .p-cleanup__faq .c-heading,
  .p-cleanup__other .c-heading {
    margin-bottom: var(--sp-32);
  }

  .p-cleanup__band-text {
    padding-left: 0;
  }

  .p-cleanup__menu-list {
    grid-template-columns: 1fr;
    gap: var(--sp-20);
  }

  .p-cleanup__flow-note {
    padding-bottom: var(--sp-56);
  }

  .p-cleanup__faq-foot {
    margin-top: var(--sp-32);
  }
}


/* ==========================================================================
   空き家一括サポート（page-package.php）
   Figma: /akiya/package 2168:7265
   ========================================================================== */
.p-package__intro {
  padding-block: var(--sp-48);
}

.p-package__intro-text {
  max-width: var(--measure-md);
  margin-inline: auto;
  font-size: var(--fs-16);
  line-height: var(--lh-200);
  letter-spacing: var(--ls-wide);
}

.p-package__steps-title {
  margin-bottom: var(--sp-32);
  font-weight: var(--fw-regular);
  font-size: var(--fs-36);
  line-height: var(--lh-150);
  letter-spacing: var(--ls-wider);
  color: var(--c-accent);
  text-align: center;
}

.p-package__options .c-heading,
.p-package__faq .c-heading,
.p-package__other .c-heading {
  margin-bottom: var(--sp-48);
}

.p-package__options-list {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: var(--sp-48) var(--sp-40);
}

.p-package__why {
  margin-top: var(--sp-48);
}

.p-package__faq-foot {
  display: flex;
  justify-content: flex-end;
  margin-top: var(--sp-48);
}

@media (max-width: 767px) {

  .p-package__intro {
    padding-block: var(--sp-32);
  }

  .p-package__steps-title {
    margin-bottom: var(--sp-24);
    font-size: var(--fs-24);
  }

  .p-package__options-list {
    grid-template-columns: 1fr;
    gap: var(--sp-24);
  }

  .p-package__options .c-heading,
  .p-package__faq .c-heading,
  .p-package__other .c-heading {
    margin-bottom: var(--sp-32);
  }

  .p-package__why,
  .p-package__faq-foot {
    margin-top: var(--sp-32);
  }
}


/* ==========================================================================
   お取引の流れ（page-flow.php）
   Figma: /flow 2168:7581
   ========================================================================== */
.p-flow__intro {
  padding-block: var(--sp-48);
}

.p-flow__intro-text {
  max-width: var(--measure-md);
  margin-inline: auto;
  font-size: var(--fs-16);
  line-height: var(--lh-200);
  letter-spacing: var(--ls-wide);
}

.p-flow__steps .c-heading {
  margin-bottom: var(--sp-48);
}

@media (max-width: 767px) {

  .p-flow__intro {
    padding-block: var(--sp-32);
  }

  .p-flow__steps .c-heading {
    margin-bottom: var(--sp-32);
  }
}


/* ==========================================================================
   料金目安（page-price.php）
   Figma: /price 2168:7662
   ========================================================================== */
.p-price__intro {
  padding-block: var(--sp-48);
}

.p-price__intro-text {
  max-width: var(--measure-md);
  margin-inline: auto;
  font-size: var(--fs-16);
  line-height: var(--lh-200);
  letter-spacing: var(--ls-wide);
}

.p-price__policy {
  padding-bottom: var(--sp-48);
}

.p-price__block .c-cat-heading {
  margin-bottom: var(--sp-32);
}

.p-price__lead {
  margin-bottom: var(--sp-32);
  font-size: var(--fs-16);
  line-height: var(--lh-200);
  letter-spacing: var(--ls-wide);
}

.p-price__table-2nd {
  margin-top: var(--sp-48);
}

.p-price__foot {
  display: flex;
  justify-content: flex-end;
  margin-top: var(--sp-32);
}

.p-price__notes {
  padding-block: var(--sp-48) var(--sp-96);
}

@media (max-width: 767px) {

  .p-price__intro {
    padding-block: var(--sp-32);
  }

  .p-price__policy {
    padding-bottom: var(--sp-32);
  }

  .p-price__block .c-cat-heading,
  .p-price__lead {
    margin-bottom: var(--sp-20);
  }

  .p-price__table-2nd {
    margin-top: var(--sp-32);
  }

  .p-price__notes {
    padding-block: var(--sp-32) var(--sp-56);
  }
}


/* ==========================================================================
   /faq よくある質問
   Figma: 2168:7784
   ========================================================================== */
.p-faq__category {
  padding-block: var(--sp-48);
  border-bottom: 1px solid var(--c-border);
}

.p-faq__category .c-minihead {
  margin-bottom: var(--sp-32);
}

/* カテゴリ別Q&Aのブロック間 */
.p-faq__list .inner {
  display: flex;
  flex-direction: column;
  gap: var(--sp-72);
}

.p-faq__group {
  display: flex;
  flex-direction: column;
  gap: var(--sp-32);
}

/* フィルタで隠されたブロック */
.p-faq__group[hidden] {
  display: none;
}

.p-faq__empty {
  font-size: var(--fs-16);
  line-height: var(--lh-200);
  letter-spacing: var(--ls-wide);
}

@media (max-width: 767px) {

  .p-faq__category {
    padding-block: var(--sp-32);
  }

  .p-faq__category .c-minihead {
    margin-bottom: var(--sp-20);
  }

  .p-faq__list .inner {
    gap: var(--sp-40);
  }

  .p-faq__group {
    gap: var(--sp-20);
  }
}


/* ==========================================================================
   /contact お問い合わせ
   Figma: 2168:7875
   ========================================================================== */
.p-contact__form .inner {
  display: flex;
  flex-direction: column;
  gap: var(--sp-32);
}

.p-contact__form-head {
  display: flex;
  flex-direction: column;
  gap: var(--sp-4);
  padding-left: var(--sp-40);
}

.p-contact__form-title {
  font-weight: var(--fw-regular);
  font-size: var(--fs-36);
  line-height: var(--lh-120);
  letter-spacing: var(--ls-wider);
  color: var(--c-accent);
}

.p-contact__form-note {
  font-size: var(--fs-16);
  line-height: var(--lh-200);
  letter-spacing: var(--ls-wide);
}

.p-contact__info .inner {
  display: flex;
  flex-direction: column;
  gap: var(--sp-48);
}

.p-contact__band img,
.p-contact__photo img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.p-contact__band {
  height: 300px;
}

.p-contact__info-body {
  display: flex;
  align-items: stretch;
}

.p-contact__company {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: var(--sp-20);
  width: 500px;
  flex-shrink: 0;
}

.p-contact__company-name {
  font-family: var(--font-en);
  font-size: var(--fs-32);
  line-height: var(--lh-150);
  letter-spacing: var(--ls-wider);
}

.p-contact__company-list {
  display: flex;
  flex-direction: column;
  gap: var(--sp-4);
  font-size: var(--fs-16);
  line-height: var(--lh-200);
  letter-spacing: var(--ls-wide);
}

/* dt／dd を「所在地：〜」の1行に見せる */
.p-contact__company-row {
  display: flex;
}

.p-contact__company-row dt::after {
  content: "：";
}

.p-contact__company-row dd a {
  text-decoration: underline;
}

.p-contact__photo {
  flex: 1 0 0;
  min-width: 0;
  aspect-ratio: 5 / 3;
  align-self: flex-start;
}

@media (max-width: 767px) {

  .p-contact__form .inner {
    gap: var(--sp-20);
  }

  .p-contact__form-head {
    padding-left: 0;
  }

  .p-contact__form-title {
    font-size: var(--fs-28);
  }

  .p-contact__info .inner {
    gap: var(--sp-32);
  }

  .p-contact__band {
    height: 200px;
  }

  .p-contact__info-body {
    flex-direction: column;
    gap: var(--sp-24);
  }

  .p-contact__company {
    width: 100%;
  }

  .p-contact__company-name {
    font-size: var(--fs-24);
  }

  .p-contact__company-row {
    flex-direction: column;
  }

  .p-contact__company-row dt::after {
    content: "";
  }

  .p-contact__company-row dt {
    font-size: var(--fs-14);
    color: var(--c-text-sub);
  }

  .p-contact__photo {
  aspect-ratio: 327 / 220;
}
}


/* ==========================================================================
   TOP
   Figma: 2168:5558
   ========================================================================== */
.p-top__about .inner,
.p-top__service .inner,
.p-top__reason .inner,
.p-top__faq .inner {
  display: flex;
  flex-direction: column;
  gap: var(--sp-32);
}

/* about us の写真とリードはカンプでは800px幅・中央寄せ */
.p-top__about-img {
  width: min(800px, 100%);
  margin-inline: auto;
}

.p-top__about-img img {
  display: block;
  width: 100%;
  height: auto;
}

.p-top__about-text {
  width: min(800px, 100%);
  margin-inline: auto;
  font-size: var(--fs-16);
  line-height: var(--lh-200);
  letter-spacing: var(--ls-wide);
}

/* View more は右寄せ */
.p-top__foot {
  display: flex;
  justify-content: flex-end;
}

.p-top__service .inner,
.p-top__reason .inner {
  gap: var(--sp-48);
}

/* コラム ＋ お客様の声。720px × 2 で画面いっぱいに割る */
.p-top__split {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  border-top: 1px solid var(--c-border);
  background: var(--c-bg-beige);
}

.p-top__split-col {
  display: flex;
  flex-direction: column;
  gap: var(--sp-48);
  padding: var(--sp-96) var(--sp-40);
}

/* 左右の仕切り。片方しか出ないときは線を引かない */
.p-top__split-col:first-child:not(:last-child) {
  border-right: 1px solid var(--c-border);
}

/* 声のカードは共通コンポーネント（.c-voice__list）を流用する */
.p-top__split .c-voice__list {
  flex: 1 0 auto;
}

@media (max-width: 767px) {

  .p-top__about .inner,
  .p-top__service .inner,
  .p-top__reason .inner,
  .p-top__faq .inner {
    gap: var(--sp-20);
  }

  .p-top__service .inner,
  .p-top__reason .inner {
    gap: var(--sp-32);
  }

  .p-top__split {
    grid-template-columns: 1fr;
  }

  .p-top__split-col {
    gap: var(--sp-24);
    padding: var(--sp-56) var(--sp-20);
  }

  /* 縦に積むので、仕切りは右ではなく下 */
  .p-top__split-col:first-child:not(:last-child) {
    border-right: 0;
    border-bottom: 1px solid var(--c-border);
  }
}


/* ==========================================================================
   投稿系（一覧・詳細）
   Figma: 投稿ページ セクション 2168:8005
   ========================================================================== */

/* ---- 一覧の共通枠（/works /column /news /voice /search） ---- */
.p-archive .inner {
  display: flex;
  flex-direction: column;
  gap: var(--sp-48);
}

.p-archive__empty {
  font-size: var(--fs-16);
  line-height: var(--lh-200);
  letter-spacing: var(--ls-wide);
}


/* ---- お知らせ詳細（single.php） ---- */
.p-single .inner {
  display: flex;
  flex-direction: column;
  gap: var(--sp-48);
}

.p-single__hero img {
  display: block;
  width: 100%;
  height: auto;
  object-fit: cover;
  aspect-ratio: 5 / 3;
}

.p-single__foot {
  display: flex;
  justify-content: flex-end;
}


/* ---- 施工実績 詳細（single-works.php） ---- */
.p-works .inner {
  display: flex;
  flex-direction: column;
  gap: var(--sp-48);
}

.p-works__hero img {
  display: block;
  width: 100%;
  height: auto;
  object-fit: cover;
  aspect-ratio: 5 / 3;
}

.p-works__story-title {
  margin-bottom: var(--sp-32);
  font-weight: var(--fw-regular);
  font-size: var(--fs-28);
  line-height: var(--lh-150);
  letter-spacing: var(--ls-wide);
  color: var(--c-accent);
}

.p-works__story-body {
  display: flex;
  flex-direction: column;
  gap: var(--sp-32);
}

.p-works__story-label {
  margin-bottom: var(--sp-12);
  font-weight: var(--fw-medium);
  font-size: var(--fs-20);
  line-height: var(--lh-150);
  color: var(--c-text-sub);
}

.p-works__story-text {
  font-size: var(--fs-16);
  line-height: var(--lh-200);
  letter-spacing: var(--ls-wide);
}


/* ---- コラム 詳細（single-column.php） ---- */
.p-column__layout {
  display: grid;
  grid-template-columns: 300px 1fr;
  gap: var(--sp-72);
  align-items: start;
}

/* 目次が無い記事は1カラムにする */
.p-column__layout:not(:has(.c-toc)) {
  grid-template-columns: 1fr;
}

.p-column__main {
  display: flex;
  flex-direction: column;
  gap: var(--sp-32);
  min-width: 0;
}

.p-column__hero img {
  display: block;
  width: 100%;
  height: auto;
  object-fit: cover;
  aspect-ratio: 700 / 405;
}

.p-column__cta {
  display: flex;
  justify-content: center;
  margin-top: var(--sp-20);
}


/* ---- お客様の声（page-voice.php） ---- */
.p-voice__intro {
  padding-block: var(--sp-96) 0;
  background: var(--c-bg-beige);
}

.p-voice__intro-text {
  text-align: center;
  font-size: var(--fs-16);
  line-height: var(--lh-200);
  letter-spacing: var(--ls-wide);
}

.p-voice__list .inner {
  display: flex;
  flex-direction: column;
  gap: var(--sp-48);
}


/* ---- 404 / 検索 ---- */
.p-404 .inner {
  display: flex;
  flex-direction: column;
  gap: var(--sp-32);
}

.p-404__text {
  font-size: var(--fs-16);
  line-height: var(--lh-200);
  letter-spacing: var(--ls-wide);
}

.p-404__links {
  display: flex;
  flex-wrap: wrap;
  gap: var(--sp-12) var(--sp-20);
  list-style: none;
}

.p-404__links a {
  text-decoration: underline;
}

.p-search__summary {
  font-size: var(--fs-16);
  line-height: var(--lh-200);
  letter-spacing: var(--ls-wide);
}

@media (max-width: 767px) {

  .p-archive .inner,
  .p-single .inner,
  .p-works .inner,
  .p-voice__list .inner {
    gap: var(--sp-32);
  }

  .p-single__hero img,
  .p-works__hero img {
    height: auto;
    aspect-ratio: 5 / 3;
  }

  .p-works__story-title {
    margin-bottom: var(--sp-20);
    font-size: var(--fs-24);
  }

  .p-works__story-body {
    gap: var(--sp-24);
  }

  .p-works__story-label {
    font-size: var(--fs-18);
  }

  .p-column__layout {
    grid-template-columns: 1fr;
    gap: var(--sp-32);
  }

  .p-column__hero img {
    height: auto;
    aspect-ratio: 700 / 405;
  }

  .p-voice__intro {
    padding-block: var(--sp-56) 0;
  }

  .p-404 .inner {
    gap: var(--sp-20);
  }
}
