/* =========================================================================
   itonami-pages.css — 下層ページ（私たちについて／会社概要／FAQ／お問い合わせ／
                       ブログ／プライバシーポリシー）
   -------------------------------------------------------------------------
   トップは3Dが主役なので地を塗らない作りだが、下層は「読ませる」ページ。
   3Dは持たせず、そのぶん版面（余白・罫・級数）で世界観をつなぐ。

   つなぎ方は3つだけ。
     ・地の色と書体はトップと同じ（--bg / Zen Old Mincho ＋ Zen Kaku Gothic New）
     ・図面の言語を残す（細い罫・朱の差し色・番号・表題欄めいた見出し）
     ・余白を惜しまない。設計事務所の版面は余白が主役
   ========================================================================= */

body.itn-page {
  background: var(--bg);
  color: var(--ink);
  font-family: "Zen Kaku Gothic New", system-ui, sans-serif;
  font-weight: 300;
  letter-spacing: .04em;
}
.itn-page .bs-header { position: fixed; background: transparent; }
.itn-page main { position: relative; z-index: 1; }

/* ---------- ページの頭 ---------- */
.itn-phead {
  padding: clamp(9rem, 22svh, 14rem) var(--pad) clamp(3rem, 7svh, 5rem);
  border-bottom: 1px solid rgba(242, 239, 233, .1);
}
.itn-phead__in { width: min(72rem, 100%); margin-inline: auto; }
.itn-phead h1 {
  font-family: "Zen Old Mincho", "Times New Roman", serif;
  font-weight: 400;
  font-size: clamp(2rem, 4.4vw, 3.4rem);
  line-height: 1.24;
  letter-spacing: .04em;
  margin: .9rem 0 0;
  word-break: auto-phrase;
}
.itn-phead__lede {
  margin: 1.6rem 0 0;
  max-width: 40rem;
  font-size: clamp(.95rem, 1.2vw, 1.05rem);
  line-height: 2.05;
  color: var(--ink-dim);
}

/* ---------- 本文 ---------- */
.itn-body { padding: clamp(3.5rem, 9svh, 6.5rem) var(--pad) clamp(4rem, 10svh, 7rem); }
.itn-body__in { width: min(72rem, 100%); margin-inline: auto; }

.itn-sec { margin-top: clamp(3.2rem, 8svh, 5.5rem); }
.itn-sec:first-child { margin-top: 0; }
.itn-sec > h2 {
  font-family: "Zen Old Mincho", "Times New Roman", serif;
  font-weight: 400;
  font-size: clamp(1.35rem, 2.4vw, 1.95rem);
  line-height: 1.4;
  letter-spacing: .05em;
  margin: 0 0 1.6rem;
  padding-bottom: .9rem;
  border-bottom: 1px solid rgba(242, 239, 233, .13);
  word-break: auto-phrase;
}
.itn-sec p {
  font-size: clamp(.92rem, 1.15vw, 1.0rem);
  line-height: 2.05;
  color: var(--ink-dim);
  margin: 0 0 1.15rem;
  max-width: 44rem;
}
.itn-sec p:last-child { margin-bottom: 0; }
.itn-sec strong { color: var(--ink); font-weight: 400; }
.itn-lead {
  font-family: "Zen Old Mincho", "Times New Roman", serif;
  font-size: clamp(1.15rem, 2vw, 1.55rem) !important;
  line-height: 1.78 !important;
  color: var(--ink) !important;
  letter-spacing: .05em;
  word-break: auto-phrase;
}

/* ---------- 図版 ---------- */
.itn-fig { margin: 2.4rem 0 0; }
.itn-fig img {
  width: 100%; height: auto; display: block;
  border: 1px solid rgba(242, 239, 233, .1);
}
.itn-fig figcaption {
  margin-top: .85rem;
  font-size: .74rem;
  letter-spacing: .1em;
  color: rgba(242, 239, 233, .42);
}
.itn-figs { display: grid; grid-template-columns: 1fr 1fr; gap: 1.6rem; margin-top: 2.4rem; }
.itn-figs .itn-fig { margin: 0; }

/* ---------- 定義表（会社概要）---------- */
.itn-dl { margin: 0; border-top: 1px solid rgba(242, 239, 233, .13); }
.itn-dl > div {
  display: grid;
  grid-template-columns: 11rem 1fr;
  gap: 1.6rem;
  padding: 1.15rem 0;
  border-bottom: 1px solid rgba(242, 239, 233, .09);
}
.itn-dl dt {
  font-family: "Zen Old Mincho", "Times New Roman", serif;
  font-size: .95rem; letter-spacing: .12em; color: var(--ink);
}
.itn-dl dd {
  margin: 0; font-size: .92rem; line-height: 1.95; color: var(--ink-dim);
}

/* ---------- 番号つきの箇条（私たちについて）---------- */
.itn-num { list-style: none; margin: 2rem 0 0; padding: 0; display: grid; gap: 2.2rem; }
.itn-num > li {
  display: grid; grid-template-columns: 3.2rem 1fr; gap: 1.3rem;
  padding-top: 1.4rem; border-top: 1px solid rgba(242, 239, 233, .12);
}
.itn-num > li > i {
  font-style: normal; font-size: .72rem; letter-spacing: .14em;
  color: var(--accent, #E7A93C); padding-top: .35rem;
}
.itn-num h3 {
  font-family: "Zen Old Mincho", "Times New Roman", serif;
  font-weight: 400; font-size: clamp(1.05rem, 1.6vw, 1.28rem);
  margin: 0 0 .7rem; letter-spacing: .04em; word-break: auto-phrase;
}
.itn-num p { margin: 0; font-size: .9rem; line-height: 2.0; color: var(--ink-dim); }

/* ---------- よくある質問 ---------- */
.itn-faq { margin: 0; border-top: 1px solid rgba(242, 239, 233, .13); }
.itn-faq details {
  border-bottom: 1px solid rgba(242, 239, 233, .09);
}
.itn-faq summary {
  display: grid; grid-template-columns: 2.1rem 1fr; gap: .9rem;
  align-items: baseline;
  padding: 1.3rem 0;
  cursor: pointer;
  list-style: none;
  font-family: "Zen Old Mincho", "Times New Roman", serif;
  font-size: clamp(1.0rem, 1.4vw, 1.15rem);
  line-height: 1.65;
  letter-spacing: .04em;
  word-break: auto-phrase;
  transition: color .3s ease;
}
.itn-faq summary::-webkit-details-marker { display: none; }
.itn-faq summary::before {
  content: "Q"; font-size: .8rem; letter-spacing: .1em;
  color: var(--accent, #E7A93C);
}
.itn-faq summary:hover { color: var(--accent, #E7A93C); }
.itn-faq details[open] summary { color: var(--accent, #E7A93C); }
.itn-faq .itn-faq__a {
  display: grid; grid-template-columns: 2.1rem 1fr; gap: .9rem;
  padding: 0 0 1.5rem;
}
.itn-faq .itn-faq__a::before {
  content: "A"; font-size: .8rem; letter-spacing: .1em;
  color: rgba(242, 239, 233, .34);
}
.itn-faq .itn-faq__a p {
  margin: 0 0 .9rem; font-size: .9rem; line-height: 2.0; color: var(--ink-dim);
}
.itn-faq .itn-faq__a p:last-child { margin-bottom: 0; }

/* ---------- 問い合わせの導線 ---------- */
.itn-contact { display: grid; grid-template-columns: 1fr 1fr; gap: 2.4rem; margin-top: 2.2rem; }
.itn-card {
  padding: 1.9rem 1.8rem 1.8rem;
  border: 1px solid rgba(242, 239, 233, .14);
}
.itn-card h3 {
  font-family: "Zen Old Mincho", "Times New Roman", serif;
  font-weight: 400; font-size: 1.15rem; margin: .55rem 0 .8rem; letter-spacing: .05em;
}
.itn-card p { font-size: .88rem; line-height: 1.95; color: var(--ink-dim); margin: 0 0 1.3rem; }
.itn-card .bs-btn { margin-top: 0; }
.itn-steps { list-style: none; margin: 1.7rem 0 0; padding: 0; display: grid; gap: 1.5rem; }
.itn-steps li { display: grid; grid-template-columns: 2.6rem 1fr; gap: 1rem; }
.itn-steps b {
  font-weight: 400; font-size: .72rem; letter-spacing: .14em;
  color: var(--accent, #E7A93C); padding-top: .2rem;
}
.itn-steps p { margin: 0; font-size: .88rem; line-height: 1.95; color: var(--ink-dim); }
.itn-steps p strong { display: block; color: var(--ink); font-weight: 400; margin-bottom: .2rem; }

/* ---------- ブログ ---------- */
.itn-posts { list-style: none; margin: 0; padding: 0; display: grid; gap: 2.6rem; }
.itn-posts > li { border-top: 1px solid rgba(242, 239, 233, .12); padding-top: 1.7rem; }
.itn-post-link { display: grid; grid-template-columns: 15rem 1fr; gap: 2rem; align-items: start; }
.itn-post-link img {
  width: 100%; height: auto; display: block;
  border: 1px solid rgba(242, 239, 233, .1);
  transition: opacity .4s ease;
}
.itn-post-link:hover img { opacity: .82; }
.itn-post-link h2 {
  font-family: "Zen Old Mincho", "Times New Roman", serif;
  font-weight: 400; font-size: clamp(1.1rem, 1.7vw, 1.42rem);
  line-height: 1.55; margin: .5rem 0 .7rem; letter-spacing: .04em;
  word-break: auto-phrase; transition: color .3s ease;
}
.itn-post-link:hover h2 { color: var(--accent, #E7A93C); }
.itn-post-link p { margin: 0; font-size: .88rem; line-height: 1.95; color: var(--ink-dim); }

/* 記事本文 */
.itn-article { width: min(46rem, 100%); margin-inline: auto; }
.itn-article h2 {
  font-family: "Zen Old Mincho", "Times New Roman", serif;
  font-weight: 400; font-size: clamp(1.25rem, 2.1vw, 1.7rem);
  line-height: 1.5; letter-spacing: .04em;
  margin: 3.2rem 0 1.3rem; padding-bottom: .8rem;
  border-bottom: 1px solid rgba(242, 239, 233, .13);
  word-break: auto-phrase;
}
.itn-article p {
  font-size: clamp(.94rem, 1.15vw, 1.02rem); line-height: 2.15;
  color: var(--ink-dim); margin: 0 0 1.4rem;
}
.itn-article blockquote {
  margin: 2rem 0; padding: 0 0 0 1.3rem;
  border-left: 1px solid rgba(231, 169, 60, .55);
  font-family: "Zen Old Mincho", "Times New Roman", serif;
  font-size: clamp(1.05rem, 1.6vw, 1.28rem); line-height: 1.85;
  color: var(--ink); letter-spacing: .04em; word-break: auto-phrase;
}
.itn-article .itn-fig { margin: 2.4rem 0; }
.itn-back { margin-top: 3.4rem; padding-top: 1.6rem; border-top: 1px solid rgba(242, 239, 233, .12); }

/* ---------- 規約類（プライバシーポリシー）---------- */
.itn-terms h2 { font-size: clamp(1.1rem, 1.7vw, 1.35rem); }
.itn-terms ul { margin: 0 0 1.3rem; padding-left: 1.2rem; }
.itn-terms li {
  font-size: .9rem; line-height: 2.0; color: var(--ink-dim); margin-bottom: .45rem;
}

/* ---------- 縦画面 ---------- */
@media (max-width: 760px) {
  .itn-figs,
  .itn-contact { grid-template-columns: 1fr; }
  .itn-dl > div { grid-template-columns: 1fr; gap: .45rem; }
  .itn-post-link { grid-template-columns: 1fr; gap: 1.1rem; }
  .itn-num > li { grid-template-columns: 2.6rem 1fr; gap: .9rem; }
}

/* 大見出しは行長を抑える。画面幅いっぱいまで伸ばすと、
   長い一文が1行になって読みにくくなる（word-break だけでは足りない） */
.itn-phead h1 { max-width: 26em; }