@charset "utf-8";
/* ============================================================
   KASUMI NOGI — additional.css
   静的サイト（段階A）の CSS を .hidamari にスコープして移植したもの。
   生成元: assets/css/{base,layout,components,home,pages}.css
   再生成: themes/swell_child/build/build-css.mjs
   ヘッダー・フッターはSWELLのものを使うので、静的サイトの header.css /
   footer.css は持ち込んでいない。
   ============================================================ */

/* ------------------------------------------------------------
   1. SWELL の既定装飾を打ち消す
   `:where()` は詳細度0なので、クラス2つで確実に上回る（gotchas 5）
   ------------------------------------------------------------ */

.hidamari .wp-block-heading {
  background: none;
  color: inherit;
  padding: 0;
  border: 0;
  border-radius: 0;
}
.hidamari .wp-block-heading::before,
.hidamari .wp-block-heading::after { content: none; display: none; }

.hidamari blockquote { border: 0; padding: 0; background: none; }
.hidamari blockquote::before,
.hidamari blockquote::after { content: none; }

.hidamari ul, .hidamari ol { padding: 0; list-style: none; }   /* ol の 40px ずれ対策（gotchas 7） */
.hidamari li::before, .hidamari li::marker { content: none; }
.hidamari .wp-block-list { padding: 0; }

.hidamari a { text-decoration: none; box-shadow: none; }
.hidamari a:hover { text-decoration: none; }

/* SWELL は .post_content 直下に margin-bottom: 2em を付ける（gotchas 6）。
   セクションは自前で上下パディングを持つので相殺する */
.lu-page .post_content > * { margin-top: 0; margin-bottom: 0; }
.lu-page .post_content { margin-top: 0; }

/* ------------------------------------------------------------
   2. コアブロックが持ち込む既定を .hidamari 内で無効化
   ------------------------------------------------------------ */

/* wp:image は <figure>。frame クラスを figure に直接載せるので余白を消す */
.hidamari .wp-block-image { margin: 0; }
.hidamari .wp-block-image figcaption { display: none; }

/* is-layout-* が付ける子要素マージン */
.hidamari :where(.wp-block-group.is-layout-flow) > * { margin-block-start: 0; margin-block-end: 0; }
.hidamari .wp-block-group { margin: 0; }

/* columns */
.hidamari .wp-block-columns {
  margin: 0;
  gap: 0;
  align-items: stretch;
  flex-wrap: nowrap;
}
.hidamari .wp-block-column { margin: 0; min-width: 0; }

/* buttons */
.hidamari .wp-block-buttons { margin: 0; gap: 0; }
.hidamari .wp-block-button { margin: 0; }
.hidamari .wp-block-button__link {
  background: none;
  color: inherit;
  border-radius: 0;
  padding: 0;
  font-size: inherit;
  line-height: inherit;
  box-shadow: none;
}
.hidamari .wp-block-button__link:hover { background: none; color: inherit; }

/* table */
.hidamari .wp-block-table { margin: 0; }
.hidamari .wp-block-table table { border-collapse: collapse; width: 100%; }

/* 段落の既定マージン */
.hidamari p { margin: 0; }


/* ============================================================
   4. 静的サイトからの移植（自動生成。直接編集しないこと）
   ・margin 系には !important が付く
   ・セレクタは .post_content .hidamari …（詳細度を上げるため）
   どちらも SWELL が最初/最後の子に当てる 0 !important に勝つために必要。
   CSS を足したいときは build/_swell-tail.css を編集して作り直す。
   ============================================================ */

/* ---- base.css より ---- */
/* ============================================================
   KASUMI NOGI — base
   色 §43-45 / 文字 §46-53 / 角丸 §63 / 罫線 §64
   ============================================================ */

.post_content .hidamari {
  /* --- Color (§43) --- */
  --background: #F4F1EB;
  --white: #FAF9F6;
  --text: #242421;
  /* §43 の #77746E は背景 #F4F1EB に対して 4.13:1。本文サイズには使わない */
  --text-light: #77746E;
  /* 本文サブ・キャプション用。背景 #F4F1EB に対して 6.90:1 (§76) */
  --text-sub: #55524D;
  --accent: #938C80;      /* 2.96:1。文字には使わない。罫線・装飾のみ (§44) */
  --secondary: #DDD8CF;
  /* #DDD8CF の上では --text-sub が 4.16:1 しか出ない。淡色背景の上の小さい文字はこちら (#DDD8CF に対して 6.04:1) */
  --text-on-tint: #4E4C48;
  --dark: #292A27;
  --border: rgba(36, 36, 33, .18);   /* §64 */
  --border-strong: rgba(36, 36, 33, .34);

  /* --- Font (§46-49) --- */
  --font-display: "Cormorant Garamond", "EB Garamond", "Times New Roman", serif;
  --font-ui: "Inter", "Helvetica Neue", Helvetica, Arial, sans-serif;
  --font-jp-serif: "Noto Serif JP", "Hiragino Mincho ProN", "Yu Mincho", serif;
  --font-jp-sans: "Noto Sans JP", "Hiragino Sans", "Yu Gothic", Meiryo, sans-serif;

  /* --- Layout (§54-55) --- */
  --wrap: 1360px;
  --pad-inline: 48px;
  --section-y: 160px;
  --header-h: 88px;

  /* --- Motion (§69-70, §73) --- */
  --ease: cubic-bezier(.22, .61, .36, 1);
}

@media (max-width: 1199px) {
  .post_content .hidamari { --pad-inline: 32px; --section-y: 120px; --header-h: 80px; }
}
@media (max-width: 767px) {
  .post_content .hidamari { --pad-inline: 20px; --section-y: 88px; --header-h: 64px; }
}

/* ============================================================
   Reset
   ============================================================ */

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


@media (prefers-reduced-motion: reduce) {  }

.post_content .hidamari,
.post_content .hidamari h1,
.post_content .hidamari h2,
.post_content .hidamari h3,
.post_content .hidamari h4,
.post_content .hidamari p,
.post_content .hidamari figure,
.post_content .hidamari blockquote,
.post_content .hidamari dl,
.post_content .hidamari dd,
.post_content .hidamari ul,
.post_content .hidamari ol,
.post_content .hidamari li,
.post_content .hidamari fieldset {
  margin: 0 !important;
  padding: 0;
}

/* §7 gotchas: ol の既定 padding-inline-start が残ると1箇所だけ右にずれる */
.post_content .hidamari ul,
.post_content .hidamari ol { list-style: none; }

.post_content .hidamari {
  background: var(--background);
  color: var(--text);
  font-family: var(--font-jp-sans);
  font-size: 16px;
  font-weight: 400;
  line-height: 1.8;               /* 依頼により 1.8。仕様 §52 は 2 */
  letter-spacing: .05em;          /* §53 */
  overflow-x: hidden;             /* 320px でも横スクロールを出さない */
  -webkit-font-smoothing: antialiased;
}
/* 依頼により SP も 16px。仕様 §51 は 14〜15px */
@media (max-width: 767px) { .post_content .hidamari { font-size: 16px; } }

.post_content .hidamari img,
.post_content .hidamari svg,
.post_content .hidamari video { display: block; max-width: 100%; height: auto; }

.post_content .hidamari a { color: inherit; text-decoration: none; }

.post_content .hidamari button,
.post_content .hidamari input,
.post_content .hidamari select,
.post_content .hidamari textarea {
  font: inherit;
  letter-spacing: inherit;
  color: inherit;
  background: none;
  border: 0;
  border-radius: 0;               /* §63 */
}
.post_content .hidamari button { cursor: pointer; }

/* §63 角丸ゼロを全体の既定にする */
.post_content .hidamari * { border-radius: 0; }

/* §76 keyboard focus を消さない */
.post_content .hidamari :focus-visible {
  outline: 2px solid var(--text);
  outline-offset: 3px;
}

.post_content .hidamari ::selection { background: var(--secondary); color: var(--text); }

.post_content .hidamari .lu-visually-hidden {
  position: absolute;
  width: 1px; height: 1px;
  margin: -1px !important; padding: 0;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
}

/* スキップリンク */



/* ============================================================
   Typography (§49-53)
   ============================================================ */

.post_content .hidamari .lu-en {
  font-family: var(--font-display);
  font-weight: 300;
  line-height: .95;               /* §52 */
  letter-spacing: .02em;
}

/* 小さい英字・ナビ・カテゴリー (§47) */
.post_content .hidamari .lu-label {
  font-family: var(--font-ui);
  font-size: 13px;
  font-weight: 400;
  line-height: 1.7;
  letter-spacing: .14em;          /* §53 caption */
  text-transform: uppercase;
  color: var(--text-sub);
}

/* セクション見出しの英字 (§50: 64-86px / §51: 44-56px) */
.post_content .hidamari .lu-section-title {
  font-family: var(--font-display);
  font-weight: 300;
  font-size: clamp(2.75rem, 6vw, 5.375rem);
  line-height: .95;
  letter-spacing: .01em;
}

/* ヒーロー英字 (§50: 80-110px / §51: 46-58px) */
.post_content .hidamari .lu-hero-title {
  font-family: var(--font-display);
  font-weight: 300;
  font-size: clamp(2.875rem, 8.2vw, 6.875rem);
  line-height: .95;
  letter-spacing: .005em;
}

/* 作品タイトル (§50: 34-48px / §51: 28-34px) */
.post_content .hidamari .lu-project-title {
  font-family: var(--font-display);
  font-weight: 400;
  font-size: clamp(1.75rem, 3.2vw, 3rem);
  line-height: 1.15;
  letter-spacing: .015em;
}

/* 日本語見出し (§50: 28-34px / §51: 24-28px) */
.post_content .hidamari .lu-jp-heading {
  font-family: var(--font-jp-serif);
  font-weight: 400;
  font-size: clamp(1.5rem, 2.4vw, 2.125rem);
  line-height: 1.6;               /* §52 */
  letter-spacing: .05em;
  word-break: auto-phrase;
  line-break: strict;
}

.post_content .hidamari .lu-body { font-size: 1rem; line-height: 1.8; }


.post_content .hidamari .lu-body-sub { color: var(--text-sub); }

.post_content .hidamari .lu-caption {
  font-family: var(--font-ui);
  font-size: 13px;
  line-height: 1.8;
  letter-spacing: .14em;
  color: var(--text-sub);
}

/* ------------------------------------------------------------
   日本語の折り返し
   放っておくと文節の途中で切れ（「流れてい／る空気まで」）、
   最終行に1〜2文字だけ残る。まとめて抑える。
   ------------------------------------------------------------ */
.post_content .hidamari .lu-concept__body,
.post_content .hidamari .lu-concept__body p,
.post_content .hidamari .lu-prose,
.post_content .hidamari .lu-prose p,
.post_content .hidamari .lu-legal p,
.post_content .hidamari .lu-legal li,
.post_content .hidamari .lu-svc-block__lead,
.post_content .hidamari .lu-about__body,
.post_content .hidamari .lu-about__body p,
.post_content .hidamari .lu-post__excerpt,
.post_content .hidamari .lu-cat__desc,
.post_content .hidamari .lu-project__note,
.post_content .hidamari .lu-note,
.post_content .hidamari .lu-demo-notice p,
.post_content .hidamari .lu-feature__jp,
.post_content .hidamari .lu-pagehead__sub,
.post_content .hidamari .lu-hero__jp,
.post_content .hidamari .lu-contact-cta__sub,
.post_content .hidamari .lu-form__msg {
  word-break: auto-phrase;   /* 文節で折る */
  line-break: strict;        /* 禁則を厳しく */
  text-wrap: pretty;         /* 最終行に1〜2文字だけ残さない */
}

.post_content .hidamari .lu-lead {
  font-family: var(--font-jp-serif);
  font-size: clamp(1rem, 1.4vw, 1.125rem);
  line-height: 1.9;
  letter-spacing: .06em;
}


/* ---- layout.css より ---- */
/* ============================================================
   KASUMI NOGI — layout
   コンテンツ幅 §54 / セクション余白 §55 / 余白 §61
   ============================================================ */

.post_content .hidamari .lu-wrap {
  width: 100%;
  max-width: var(--wrap);
  margin-inline: auto;
  padding-inline: var(--pad-inline);
}

/* 少し狭い読み物幅 */
.post_content .hidamari .lu-wrap-narrow {
  width: 100%;
  max-width: 880px;
  margin-inline: auto;
  padding-inline: var(--pad-inline);
}

/* 全幅（左右余白なし） */
.post_content .hidamari.lu-bleed, .post_content .hidamari .lu-bleed { width: 100%; }

.post_content .hidamari.lu-section, .post_content .hidamari .lu-section { padding-block: var(--section-y); }
.post_content .hidamari.lu-section-sm, .post_content .hidamari .lu-section-sm { padding-block: calc(var(--section-y) * .62); }

/* 下層ページ：ヘッダーが不透過なので、その高さぶんを空ける */
.post_content .hidamari.lu-page-top, .post_content .hidamari .lu-page-top { padding-top: calc(var(--header-h) + clamp(56px, 9vw, 128px)); }

/* セクション見出しのかたまり (§8 gotchas: 最後の子ではなく親に下マージン) */
.post_content .hidamari .lu-head { margin-bottom: clamp(48px, 6vw, 96px) !important; }
.post_content .hidamari .lu-head__label { display: block; margin-bottom: 20px !important; }
.post_content .hidamari .lu-head__sub {
  margin-top: 24px !important;
  font-family: var(--font-display);
  font-size: clamp(1.0625rem, 1.6vw, 1.375rem);
  font-weight: 300;
  line-height: 1.5;
  letter-spacing: .04em;
  color: var(--text-sub);
}
.post_content .hidamari .lu-head-center { text-align: center; }

/* セクション末尾のリンク行 */
.post_content .hidamari .lu-section-foot {
  margin-top: clamp(48px, 6vw, 88px) !important;
  display: flex;
  justify-content: flex-end;
}
.post_content .hidamari .lu-section-foot-center { justify-content: center; }

/* 罫線 (§64) */
.post_content .hidamari .lu-rule { border-top: 1px solid var(--border); }

/* 背景 */
.post_content .hidamari .lu-bg-secondary { background: var(--secondary); }
.post_content .hidamari .lu-bg-white { background: var(--white); }
.post_content .hidamari .lu-bg-dark { background: var(--dark); color: var(--background); }

/* 汎用グリッド */
.post_content .hidamari .lu-grid { display: grid; gap: clamp(40px, 5vw, 88px); }   /* §61 40-120px */
.post_content .hidamari .lu-grid-2 { grid-template-columns: repeat(2, 1fr); }
.post_content .hidamari .lu-grid-3 { grid-template-columns: repeat(3, 1fr); }
.post_content .hidamari .lu-grid-6 { grid-template-columns: repeat(6, 1fr); gap: 4px; }

@media (max-width: 1199px) {
  .post_content .hidamari .lu-grid-3 { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 767px) {
  .post_content .hidamari .lu-grid-2,
.post_content .hidamari .lu-grid-3 { grid-template-columns: 1fr; }
  .post_content .hidamari .lu-grid-6 { grid-template-columns: repeat(3, 1fr); }
}


/* ---- components.css より ---- */
/* ============================================================
   KASUMI NOGI — components
   ボタン §62 / 画像枠・プレースホルダ / hover §69 / scroll §70
   ============================================================ */

/* ------------------------------------------------------------
   画像枠 + 未投入プレースホルダ
   画像が1枚も無くても枠が潰れず、何の画像かが分かるようにする
   ------------------------------------------------------------ */

.post_content .hidamari .lu-frame {
  position: relative;
  display: block;
  overflow: hidden;
  background: var(--secondary);
}

.post_content .hidamari .lu-frame-16x9 { aspect-ratio: 16 / 9; }
.post_content .hidamari .lu-frame-3x2 { aspect-ratio: 3 / 2; }
.post_content .hidamari .lu-frame-3x4 { aspect-ratio: 3 / 4; }
.post_content .hidamari .lu-frame-1x1 { aspect-ratio: 1 / 1; }

.post_content .hidamari .lu-frame > img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .8s var(--ease);   /* §69 */
}

/* 画像がまだ無いとき：壊れアイコンを消してラベルを見せる */
.post_content .hidamari .lu-frame > img.is-missing { opacity: 0; }

.post_content .hidamari .lu-frame__label {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: 16px;
  text-align: center;
  font-family: var(--font-ui);
  font-size: 12px;
  line-height: 1.7;
  letter-spacing: .1em;
  color: var(--text-on-tint);
}
.post_content .hidamari .lu-frame__label b {
  font-weight: 500;
  font-size: 12px;
  letter-spacing: .06em;
  color: var(--text);
  word-break: break-all;
}
.post_content .hidamari .lu-frame__label::before {
  content: "";
  width: 28px;
  height: 1px;
  margin-bottom: 8px !important;
  background: var(--border-strong);
}

/* 画像を入れたので枠のラベルは隠す。
   画像を差し替える作業に戻すときは、この 2 行を消せばまた出る */
.post_content .hidamari .lu-frame__label,
.post_content .hidamari .lu-frame__label::before { display: none; }

/* hover で少しだけ寄る (§69) */
@media (hover: hover) {
  .post_content .hidamari a:hover > .lu-frame > img,
.post_content .hidamari .lu-frame:hover > img,
.post_content .hidamari a:hover .lu-frame > img { transform: scale(1.025); }
}

/* ------------------------------------------------------------
   ボタン・リンク (§62)
   ------------------------------------------------------------ */

.post_content .hidamari .lu-link {
  display: inline-flex;
  align-items: center;
  gap: 14px;
  min-height: 44px;                 /* §76 タップ領域 */
  padding-block: 8px;
  border-bottom: 1px solid var(--text);
  background: none;
  font-family: var(--font-ui);
  font-size: 13px;
  letter-spacing: .12em;            /* §53 */
  text-transform: uppercase;
  color: var(--text);
}
.post_content .hidamari .lu-link__arrow { transition: transform .4s var(--ease); }
@media (hover: hover) {
  .post_content .hidamari .lu-link:hover .lu-link__arrow { transform: translateX(6px); }   /* §69 */
}

/* CONTACT のみ枠付き (§62) */
.post_content .hidamari .lu-btn {
  display: inline-flex;
  align-items: center;
  gap: 16px;
  min-height: 44px;
  padding: 18px 36px;
  border: 1px solid var(--text);
  background: none;
  font-family: var(--font-ui);
  font-size: 13px;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--text);
  transition: background-color .4s var(--ease), color .4s var(--ease);
}
.post_content .hidamari .lu-btn__arrow { transition: transform .4s var(--ease); }
@media (hover: hover) {
  .post_content .hidamari .lu-btn:hover { background: var(--text); color: var(--background); }
  .post_content .hidamari .lu-btn:hover .lu-btn__arrow { transform: translateX(6px); }
}

/* 写真の上に置くリンク（ヒーロー） */
.post_content .hidamari .lu-link-light { border-bottom-color: var(--white); color: var(--white); }

/* 日本語を入れるボタン。--font-ui (Inter) には日本語が無いので字体を差し替える */
.post_content .hidamari .lu-btn-jp {
  font-family: var(--font-jp-sans);
  font-size: 14px;
  letter-spacing: .08em;
  text-transform: none;
}

.post_content .hidamari .lu-btn-light { border-color: var(--background); color: var(--background); }
@media (hover: hover) {
  .post_content .hidamari .lu-btn-light:hover { background: var(--background); color: var(--text); }
}

/* ------------------------------------------------------------
   スクロールフェード (§70)
   JS が動かない環境では最初から見えている（html.js が付いたときだけ隠す）
   ------------------------------------------------------------ */

.js .post_content .hidamari .lu-reveal {
  opacity: 0;
  transform: translateY(25px);
  transition: opacity .8s var(--ease), transform .8s var(--ease);
}
.js .post_content .hidamari .lu-reveal.is-visible { opacity: 1; transform: none; }

@media (prefers-reduced-motion: reduce) {
  .js .post_content .hidamari .lu-reveal { opacity: 1; transform: none; transition: none; }
  .post_content .hidamari .lu-frame > img { transition: none; }
  @media (hover: hover) {
    .post_content .hidamari a:hover > .lu-frame > img,
.post_content .hidamari .lu-frame:hover > img,
.post_content .hidamari a:hover .lu-frame > img { transform: none; }
  }
}

/* ------------------------------------------------------------
   作品メタ（タイトル + カテゴリー/年）
   ------------------------------------------------------------ */

.post_content .hidamari .lu-meta { margin-top: 28px !important; }
.post_content .hidamari .lu-meta__title { display: block; }
.post_content .hidamari .lu-meta__sub {
  display: block;
  margin-top: 12px !important;
  font-family: var(--font-ui);
  font-size: 13px;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--text-sub);
}
.post_content .hidamari .lu-meta__index {
  display: block;
  margin-bottom: 20px !important;
  font-family: var(--font-ui);
  font-size: 13px;
  letter-spacing: .16em;
  color: var(--text-sub);
}

/* ------------------------------------------------------------
   定義リスト（Information / Profile）
   ------------------------------------------------------------ */

.post_content .hidamari .lu-dl { display: grid; grid-template-columns: 200px 1fr; }
.post_content .hidamari .lu-dl > dt,
.post_content .hidamari .lu-dl > dd {
  padding-block: 22px;
  border-top: 1px solid var(--border);
}
.post_content .hidamari .lu-dl > dt {
  font-family: var(--font-ui);
  font-size: 13px;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--text-sub);
}
@media (max-width: 767px) {
  .post_content .hidamari .lu-dl { grid-template-columns: 1fr; }
  .post_content .hidamari .lu-dl > dt { padding-bottom: 0; }
  .post_content .hidamari .lu-dl > dd { padding-top: 8px; border-top: 0; }
}

/* ------------------------------------------------------------
   注記
   ------------------------------------------------------------ */

.post_content .hidamari .lu-note {
  margin-top: 32px !important;
  font-size: 14px;
  line-height: 1.8;
  color: var(--text-sub);
}


/* ---- home.css より ---- */
/* ============================================================
   KASUMI NOGI — HOME
   §11 構成 / §12-14 HERO / §15-17 SELECTED / §20 CONCEPT
   §21-23 WORK / §24 FEATURE / §25 ABOUT / §29-31 SERVICE
   §36-37 JOURNAL / §38 INSTAGRAM / §39-40 CONTACT
   ============================================================ */

/* ------------------------------------------------------------
   01 HERO (§12-14)
   ------------------------------------------------------------ */

.post_content .hidamari.lu-hero, .post_content .hidamari .lu-hero {
  position: relative;
  min-height: 100svh;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  padding: calc(var(--header-h) + 40px) var(--pad-inline) clamp(40px, 6vh, 72px);
  overflow: hidden;
  color: var(--white);
}

.post_content .hidamari .lu-hero__media { position: absolute; inset: 0; z-index: 0; background: var(--secondary); }

.post_content .hidamari .lu-hero__slide {
  position: absolute;
  inset: 0;
  opacity: 0;
  transition: opacity 1.2s var(--ease);
}
/* JS が動かない環境では1枚目が残る */
.post_content .hidamari .lu-hero__slide:first-child { opacity: 1; }
.post_content .hidamari.lu-hero.is-running .lu-hero__slide, .post_content .hidamari .lu-hero.is-running .lu-hero__slide { opacity: 0; }
.post_content .hidamari.lu-hero.is-running .lu-hero__slide.is-active, .post_content .hidamari .lu-hero.is-running .lu-hero__slide.is-active { opacity: 1; }

.post_content .hidamari .lu-hero__slide .lu-frame { height: 100%; aspect-ratio: auto; }
.post_content .hidamari .lu-hero__slide .lu-frame > img { transition: none; }

/* 写真の上に白文字を置くための覆い。画像未投入でも読める濃さにする */


.post_content .hidamari .lu-hero__inner {
  position: relative;
  z-index: 2;
  width: 100%;
  max-width: var(--wrap);
  margin-inline: auto;
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 32px;
}

.post_content .hidamari .lu-hero__copy { max-width: min(46rem, 100%); }
.post_content .hidamari .lu-hero__title { color: var(--white); }
.post_content .hidamari .lu-hero__jp {
  margin-top: 28px !important;
  font-family: var(--font-jp-serif);
  font-size: clamp(1rem, 1.3vw, 1.0625rem);
  line-height: 1.8;
  letter-spacing: .08em;
  color: var(--white);
}

.post_content .hidamari .lu-hero__actions {
  margin-top: clamp(28px, 3.2vw, 44px) !important;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 12px 32px;
}

.post_content .hidamari .lu-hero__count {
  flex: none;
  font-family: var(--font-ui);
  font-size: 13px;
  letter-spacing: .18em;
  color: var(--white);
}

.post_content .hidamari .lu-hero__scroll {
  position: absolute;
  left: 50%;
  bottom: 0;
  z-index: 2;
  transform: translateX(-50%);
  width: 1px;
  height: 56px;
  background: linear-gradient(to bottom, transparent, rgba(250,249,246,.7));
}

@media (max-width: 767px) {
  .post_content .hidamari.lu-hero, .post_content .hidamari .lu-hero { min-height: 88svh; }
  .post_content .hidamari .lu-hero__inner { flex-direction: column; align-items: flex-start; gap: 24px; }
  .post_content .hidamari .lu-hero__copy { max-width: none; }
  .post_content .hidamari .lu-hero__scroll { display: none; }
}

/* ------------------------------------------------------------
   02 SELECTED WORKS (§15-17)
   3列カードにしない。左右交互＋サイズ違い
   ------------------------------------------------------------ */

.post_content .hidamari .lu-selected__list { display: flex; flex-direction: column; gap: clamp(72px, 10vw, 160px); }

.post_content .hidamari .lu-selected__item { display: flex; }
.post_content .hidamari .lu-selected-01 { justify-content: flex-start; }
.post_content .hidamari .lu-selected-02 { justify-content: flex-end; }
.post_content .hidamari .lu-selected-03 { justify-content: flex-start; padding-left: clamp(0px, 8vw, 152px); }

.post_content .hidamari .lu-selected-01 .lu-selected__link { width: 64%; }
.post_content .hidamari .lu-selected-02 .lu-selected__link { width: 37%; }
.post_content .hidamari .lu-selected-03 .lu-selected__link { width: 48%; }

.post_content .hidamari .lu-selected__link { display: block; }

@media (max-width: 1023px) {
  .post_content .hidamari .lu-selected-01 .lu-selected__link { width: 78%; }
  .post_content .hidamari .lu-selected-02 .lu-selected__link { width: 52%; }
  .post_content .hidamari .lu-selected-03 .lu-selected__link { width: 64%; }
  .post_content .hidamari .lu-selected-03 { padding-left: 0; }
}
@media (max-width: 767px) {
  /* §74 SPでも写真を小さくしすぎない／すべて同じ幅にしない */
  .post_content .hidamari .lu-selected-01 .lu-selected__link { width: 100%; }
  .post_content .hidamari .lu-selected-02 .lu-selected__link { width: 76%; }
  .post_content .hidamari .lu-selected-03 .lu-selected__link { width: 90%; }
}

/* ------------------------------------------------------------
   03 CONCEPT (§20) — 画像なし・大きな余白
   ------------------------------------------------------------ */

.post_content .hidamari.lu-concept, .post_content .hidamari .lu-concept { text-align: center; }
.post_content .hidamari .lu-concept__label { margin-bottom: clamp(56px, 7vw, 104px) !important; }
.post_content .hidamari .lu-concept__jp {
  font-family: var(--font-jp-serif);
  font-weight: 400;
  font-size: clamp(1.5rem, 3.4vw, 2.5rem);
  line-height: 1.7;
  letter-spacing: .09em;
}
.post_content .hidamari .lu-concept__body {
  margin-top: clamp(56px, 7vw, 104px) !important;
  margin-inline: auto;
  max-width: 30em;
  font-family: var(--font-jp-serif);
  font-size: clamp(1rem, 1.2vw, 1.0625rem);
  line-height: 2;
  letter-spacing: .07em;
  color: var(--text-sub);
}
.post_content .hidamari .lu-concept__body p + p { margin-top: 1.6em !important; }

/* ------------------------------------------------------------
   04 WORK CATEGORY (§21-23)
   PC：文字リストの hover で右の写真が切り替わる／SP：各行の下に写真
   ------------------------------------------------------------ */

.post_content .hidamari .lu-cat { display: grid; grid-template-columns: minmax(0, 1fr) 38%; gap: clamp(48px, 6vw, 96px); align-items: start; }

.post_content .hidamari .lu-cat__list { border-top: 1px solid var(--border); }
.post_content .hidamari .lu-cat__row { border-bottom: 1px solid var(--border); }
.post_content .hidamari .lu-cat__link {
  display: flex;
  align-items: baseline;
  gap: clamp(16px, 2.4vw, 40px);
  padding-block: clamp(22px, 2.6vw, 36px);
  width: 100%;
  text-align: left;
}
.post_content .hidamari .lu-cat__num { flex: none; font-family: var(--font-ui); font-size: 13px; letter-spacing: .16em; color: var(--text-sub); }
.post_content .hidamari .lu-cat__name {
  font-family: var(--font-display);
  font-weight: 300;
  font-size: clamp(1.75rem, 3.6vw, 3.25rem);
  line-height: 1.1;
  letter-spacing: .03em;
  transition: opacity .4s var(--ease), transform .5s var(--ease);
}
.post_content .hidamari .lu-cat__desc { margin-left: auto; max-width: 20em; font-size: 14px; line-height: 1.8; color: var(--text-sub); }

@media (hover: hover) {
  .post_content .hidamari .lu-cat__link:hover .lu-cat__name { transform: translateX(10px); }
  .post_content .hidamari .lu-cat__list:has(.lu-cat__link:hover) .lu-cat__link:not(:hover) .lu-cat__name { opacity: .38; }
}

.post_content .hidamari .lu-cat__media { position: relative; }
.post_content .hidamari .lu-cat__figure { position: relative; aspect-ratio: 3 / 4; background: var(--secondary); }
.post_content .hidamari .lu-cat__figure .lu-frame {
  position: absolute;
  inset: 0;
  aspect-ratio: auto;
  opacity: 0;
  transition: opacity .7s var(--ease);
}
.post_content .hidamari .lu-cat__figure .lu-frame:first-child { opacity: 1; }
.post_content .hidamari .lu-cat__figure.is-running .lu-frame { opacity: 0; }
.post_content .hidamari .lu-cat__figure.is-running .lu-frame.is-active { opacity: 1; }

.post_content .hidamari .lu-cat__inline { display: none; margin: 4px 0 32px !important; }

@media (max-width: 1023px) {
  .post_content .hidamari .lu-cat { grid-template-columns: 1fr; }
  .post_content .hidamari .lu-cat__media { display: none; }
  .post_content .hidamari .lu-cat__inline { display: block; }
  .post_content .hidamari .lu-cat__desc { margin-left: 0; }
  .post_content .hidamari .lu-cat__link { flex-wrap: wrap; }
}

/* ------------------------------------------------------------
   05 FEATURE PROJECT (§24)
   ------------------------------------------------------------ */

.post_content .hidamari .lu-feature__head { margin-bottom: clamp(40px, 5vw, 72px) !important; }
.post_content .hidamari .lu-feature__body {
  margin-top: clamp(40px, 5vw, 72px) !important;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: clamp(32px, 4vw, 72px);
  align-items: end;
}
.post_content .hidamari .lu-feature__text {
  font-family: var(--font-display);
  font-size: clamp(1.0625rem, 1.7vw, 1.375rem);
  font-weight: 300;
  line-height: 1.6;
  letter-spacing: .04em;
  color: var(--text-sub);
}
.post_content .hidamari .lu-feature__jp {
  margin-top: 20px !important;
  font-family: var(--font-jp-sans);
  font-size: 15px;
  line-height: 1.8;
  letter-spacing: .05em;
  color: var(--text-sub);
}
@media (max-width: 767px) {
  .post_content .hidamari .lu-feature__body { grid-template-columns: 1fr; align-items: start; gap: 32px; }
}

/* ------------------------------------------------------------
   06 ABOUT (§25-26)
   ------------------------------------------------------------ */

.post_content .hidamari .lu-about { display: grid; grid-template-columns: 44% minmax(0, 1fr); gap: clamp(48px, 7vw, 120px); align-items: center; }
.post_content .hidamari .lu-about__text { padding-top: clamp(0px, 4vw, 64px); }
.post_content .hidamari .lu-about__name {
  font-family: var(--font-display);
  font-weight: 400;
  font-size: clamp(1.75rem, 3vw, 2.5rem);
  line-height: 1.1;
  letter-spacing: .04em;
}
.post_content .hidamari .lu-about__role {
  margin-top: 14px !important;
  font-family: var(--font-ui);
  font-size: 13px;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: var(--text-sub);
}
.post_content .hidamari .lu-about__copy {
  margin-top: clamp(32px, 4vw, 56px) !important;
  font-family: var(--font-jp-serif);
  font-size: clamp(1.125rem, 1.8vw, 1.5rem);
  line-height: 1.8;
  letter-spacing: .07em;
}
.post_content .hidamari .lu-about__body { margin-top: 28px !important; font-size: 16px; line-height: 1.8; color: var(--text-sub); }
.post_content .hidamari .lu-about__foot { margin-top: clamp(32px, 4vw, 56px) !important; }
@media (max-width: 767px) {
  .post_content .hidamari .lu-about { grid-template-columns: 1fr; gap: 40px; }
  .post_content .hidamari .lu-about__media { width: 88%; }
}

/* ------------------------------------------------------------
   07 SERVICE (§29-31)
   ------------------------------------------------------------ */

.post_content .hidamari .lu-service__list { border-top: 1px solid var(--border); }
.post_content .hidamari .lu-service__row { border-bottom: 1px solid var(--border); }
.post_content .hidamari .lu-service__link {
  display: grid;
  grid-template-columns: 56px minmax(0, 1fr) 26% auto;
  gap: clamp(20px, 3vw, 56px);
  align-items: center;
  padding-block: clamp(24px, 3vw, 40px);
}
.post_content .hidamari .lu-service__num { font-family: var(--font-ui); font-size: 13px; letter-spacing: .16em; color: var(--text-sub); }
.post_content .hidamari .lu-service__name {
  font-family: var(--font-display);
  font-weight: 300;
  font-size: clamp(1.625rem, 3vw, 2.75rem);
  line-height: 1.1;
  letter-spacing: .04em;
  transition: transform .5s var(--ease);
}
.post_content .hidamari .lu-service__tags { font-family: var(--font-ui); font-size: 13px; letter-spacing: .1em; line-height: 1.8; color: var(--text-sub); }
.post_content .hidamari .lu-service__thumb { width: 132px; }
@media (hover: hover) { .post_content .hidamari .lu-service__link:hover .lu-service__name { transform: translateX(10px); } }

@media (max-width: 1023px) {
  .post_content .hidamari .lu-service__link {
    grid-template-columns: 40px minmax(0, 1fr) 108px;
    grid-template-areas: "num name thumb" "num tags thumb";
    row-gap: 10px;
  }
  .post_content .hidamari .lu-service__num { grid-area: num; align-self: start; padding-top: 10px; }
  .post_content .hidamari .lu-service__name { grid-area: name; }
  .post_content .hidamari .lu-service__tags { grid-area: tags; }
  .post_content .hidamari .lu-service__thumb { grid-area: thumb; width: 108px; }
}
@media (max-width: 480px) {
  .post_content .hidamari .lu-service__link { grid-template-columns: 32px minmax(0, 1fr) 84px; gap: 16px; }
  .post_content .hidamari .lu-service__thumb { width: 84px; }
}

/* ------------------------------------------------------------
   08 JOURNAL (§36-37)
   ------------------------------------------------------------ */

.post_content .hidamari .lu-journal__list { display: grid; grid-template-columns: repeat(3, 1fr); gap: clamp(32px, 4vw, 56px); }
.post_content .hidamari .lu-journal__date { display: block; margin-top: 24px !important; font-family: var(--font-ui); font-size: 13px; letter-spacing: .16em; color: var(--text-sub); }
.post_content .hidamari .lu-journal__cat { display: block; margin-top: 10px !important; font-family: var(--font-ui); font-size: 13px; letter-spacing: .16em; text-transform: uppercase; color: var(--text-sub); }
.post_content .hidamari .lu-journal__title {
  margin-top: 14px !important;
  font-family: var(--font-display);
  font-weight: 400;
  font-size: clamp(1.25rem, 1.9vw, 1.625rem);
  line-height: 1.35;
  letter-spacing: .02em;
}
.post_content .hidamari .lu-journal__more { margin-top: 20px !important; }
@media (max-width: 1023px) { .post_content .hidamari .lu-journal__list { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 767px) { .post_content .hidamari .lu-journal__list { grid-template-columns: 1fr; gap: 48px; } }

/* ------------------------------------------------------------
   09 INSTAGRAM (§38) — ウィジェット風にしない。写真6枚だけ
   ------------------------------------------------------------ */

.post_content .hidamari .lu-insta__head {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: clamp(32px, 4vw, 56px) !important;
}
.post_content .hidamari .lu-insta__handle { display: inline-flex; align-items: center; min-height: 44px; font-family: var(--font-ui); font-size: 13px; letter-spacing: .14em; color: var(--text-sub); }
.post_content .hidamari .lu-insta__grid { display: grid; grid-template-columns: repeat(6, 1fr); gap: 6px; }
@media (max-width: 767px) { .post_content .hidamari .lu-insta__grid { grid-template-columns: repeat(3, 1fr); } }

/* ------------------------------------------------------------
   10 CONTACT (§39-40) — 無地背景で静かな余韻
   ------------------------------------------------------------ */

/* CONTACT の地。無地のままだと寂しいので粒子を敷く。
   画像トーンの「粒子感のあるフィルム調」と同じ語彙。SVGをインラインで持つので転送量は増えない。
   overlay で合成しているため平均の明るさは変わらず、地色 #DDD8CF はそのまま。 */
.post_content .hidamari.lu-contact-cta, .post_content .hidamari .lu-contact-cta {
  position: relative;
  isolation: isolate;          /* 粒子がページ背面と混ざらないように */
  background: var(--secondary);
  text-align: center;
}
.post_content .hidamari.lu-contact-cta::before, .post_content .hidamari .lu-contact-cta::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='g' color-interpolation-filters='sRGB'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='4' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3CfeColorMatrix type='matrix' values='1 0 0 0 0 0 1 0 0 0 0 0 1 0 0 0 0 0 0 1'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23g)'/%3E%3C/svg%3E");
  background-size: 160px 160px;
  mix-blend-mode: overlay;
  opacity: .55;
}
/* 文字は粒子より前に置く（粒子が文字に乗るとコントラストが落ちる） */
.post_content .hidamari.lu-contact-cta > .lu-wrap, .post_content .hidamari .lu-contact-cta > .lu-wrap { position: relative; z-index: 1; }

/* 粒子を出せない環境では、ただの無地に戻るだけ */
@supports not (mix-blend-mode: overlay) {
  .post_content .hidamari.lu-contact-cta::before, .post_content .hidamari .lu-contact-cta::before { display: none; }
}
.post_content .hidamari .lu-contact-cta__en {
  font-family: var(--font-display);
  font-weight: 300;
  font-size: clamp(2.5rem, 6.4vw, 5.5rem);
  line-height: .98;
  letter-spacing: .01em;
}
.post_content .hidamari .lu-contact-cta__jp {
  margin-top: clamp(32px, 4vw, 48px) !important;
  font-family: var(--font-jp-serif);
  font-size: clamp(1.0625rem, 1.8vw, 1.375rem);
  line-height: 1.9;
  letter-spacing: .08em;
}
.post_content .hidamari .lu-contact-cta__sub { margin-top: 24px !important; font-size: 16px; line-height: 1.8; color: var(--text-on-tint); }
.post_content .hidamari .lu-contact-cta__btn { margin-top: clamp(40px, 5vw, 64px) !important; }


/* ---- pages.css より ---- */
/* ============================================================
   KASUMI NOGI — 下層ページ
   ============================================================ */

/* ------------------------------------------------------------
   ページ見出し
   ------------------------------------------------------------ */

.post_content .hidamari .lu-pagehead { padding-bottom: clamp(48px, 6vw, 96px); }
.post_content .hidamari .lu-pagehead__label { display: block; margin-bottom: 20px !important; }
.post_content .hidamari .lu-pagehead__title {
  font-family: var(--font-display);
  font-weight: 300;
  font-size: clamp(2.75rem, 7vw, 6rem);
  line-height: .95;
  letter-spacing: .01em;
}
.post_content .hidamari .lu-pagehead__sub {
  margin-top: 28px !important;
  font-family: var(--font-jp-serif);
  font-size: clamp(1rem, 1.5vw, 1.1875rem);
  line-height: 1.9;
  letter-spacing: .07em;
  color: var(--text-sub);
}

/* パンくず */
.post_content .hidamari .lu-crumb {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 12px;
  margin-bottom: 28px !important;
  font-family: var(--font-ui);
  font-size: 13px;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--text-sub);
}
.post_content .hidamari .lu-crumb a { display: inline-flex; align-items: center; min-height: 44px; border-bottom: 1px solid transparent; }
@media (hover: hover) { .post_content .hidamari .lu-crumb a:hover { border-bottom-color: currentColor; } }

/* ------------------------------------------------------------
   WORK 一覧 — エディトリアルグリッド (§60)。Masonry にしない
   ------------------------------------------------------------ */

.post_content .hidamari .lu-filter {
  display: flex;
  flex-wrap: wrap;
  gap: 4px 28px;
  padding-bottom: 24px;
  border-bottom: 1px solid var(--border);
  margin-bottom: clamp(56px, 7vw, 112px) !important;
}
.post_content .hidamari .lu-filter__btn {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  font-family: var(--font-ui);
  font-size: 13px;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--text-sub);
  border-bottom: 1px solid transparent;
  transition: color .3s var(--ease), border-color .3s var(--ease);
}
.post_content .hidamari .lu-filter__btn[aria-pressed="true"] { color: var(--text); border-bottom-color: var(--text); }
@media (hover: hover) { .post_content .hidamari .lu-filter__btn:hover { color: var(--text); } }

.post_content .hidamari .lu-works { display: grid; grid-template-columns: repeat(12, 1fr); gap: clamp(48px, 6vw, 112px) clamp(24px, 3vw, 48px); }

/* 意図的なズレを作る (§60) */
.post_content .hidamari .lu-works-a { grid-column: 1 / span 7; }
.post_content .hidamari .lu-works-b { grid-column: 9 / span 4; align-self: end; }
.post_content .hidamari .lu-works-c { grid-column: 2 / span 4; }
.post_content .hidamari .lu-works-d { grid-column: 7 / span 5; align-self: end; }
.post_content .hidamari .lu-works-e { grid-column: 1 / span 5; }
.post_content .hidamari .lu-works-f { grid-column: 8 / span 4; align-self: center; }

.post_content .hidamari .lu-works__item[hidden] { display: none; }
.post_content .hidamari .lu-works__link { display: block; }

@media (max-width: 1023px) {
  .post_content .hidamari .lu-works-a { grid-column: 1 / span 9; }
  .post_content .hidamari .lu-works-b { grid-column: 6 / span 7; }
  .post_content .hidamari .lu-works-c { grid-column: 1 / span 7; }
  .post_content .hidamari .lu-works-d { grid-column: 4 / span 9; }
  .post_content .hidamari .lu-works-e { grid-column: 1 / span 8; }
  .post_content .hidamari .lu-works-f { grid-column: 5 / span 8; }
}
@media (max-width: 767px) {
  .post_content .hidamari .lu-works { gap: 56px 0; }
  .post_content .hidamari .lu-works-a { grid-column: 1 / span 12; }
  .post_content .hidamari .lu-works-b { grid-column: 3 / span 10; }
  .post_content .hidamari .lu-works-c { grid-column: 1 / span 11; }
  .post_content .hidamari .lu-works-d { grid-column: 2 / span 11; }
  .post_content .hidamari .lu-works-e { grid-column: 1 / span 10; }
  .post_content .hidamari .lu-works-f { grid-column: 3 / span 10; }
}

.post_content .hidamari .lu-works__empty { margin-top: 24px !important; color: var(--text-sub); font-size: 15px; }

/* ------------------------------------------------------------
   作品詳細 (§18-19)
   ------------------------------------------------------------ */

.post_content .hidamari .lu-project__head { padding-bottom: clamp(40px, 5vw, 72px); }
.post_content .hidamari .lu-project__title {
  font-family: var(--font-display);
  font-weight: 300;
  font-size: clamp(2.25rem, 5.6vw, 4.5rem);
  line-height: 1;
  letter-spacing: .02em;
}
.post_content .hidamari .lu-project__meta {
  margin-top: 24px !important;
  font-family: var(--font-ui);
  font-size: 13px;
  line-height: 1.8;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: var(--text-sub);
}
.post_content .hidamari .lu-project__note {
  margin-top: clamp(32px, 4vw, 48px) !important;
  max-width: 34em;
  font-family: var(--font-jp-serif);
  font-size: 16px;
  line-height: 1.9;
  letter-spacing: .06em;
  color: var(--text-sub);
}

/* エディトリアルグリッド。全部同じ幅にしない (§60 / §74) */
.post_content .hidamari .lu-project__grid { display: grid; grid-template-columns: repeat(12, 1fr); gap: clamp(40px, 5vw, 96px) clamp(24px, 3vw, 48px); }
.post_content .hidamari .lu-cell-full { grid-column: 1 / span 12; }
.post_content .hidamari .lu-cell-l { grid-column: 1 / span 5; }
.post_content .hidamari .lu-cell-r { grid-column: 7 / span 4; align-self: end; }
.post_content .hidamari .lu-cell-wide { grid-column: 3 / span 10; }
.post_content .hidamari .lu-cell-mid { grid-column: 1 / span 7; }

@media (max-width: 767px) {
  .post_content .hidamari .lu-project__grid { gap: 40px 0; }
  .post_content .hidamari .lu-cell-full { grid-column: 1 / span 12; }
  .post_content .hidamari .lu-cell-l { grid-column: 1 / span 9; }
  .post_content .hidamari .lu-cell-r { grid-column: 4 / span 9; }
  .post_content .hidamari .lu-cell-wide { grid-column: 1 / span 12; }
  .post_content .hidamari .lu-cell-mid { grid-column: 2 / span 11; }
}

.post_content .hidamari .lu-project__next {
  margin-top: clamp(72px, 9vw, 144px) !important;
  padding-top: 32px;
  border-top: 1px solid var(--border);
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: space-between;
  gap: 16px 32px;
}
.post_content .hidamari .lu-project__next-name {
  font-family: var(--font-display);
  font-weight: 300;
  font-size: clamp(1.75rem, 3.4vw, 2.75rem);
  line-height: 1.1;
  letter-spacing: .03em;
}

/* ------------------------------------------------------------
   ABOUT ページ
   ------------------------------------------------------------ */

.post_content .hidamari .lu-about-hero { display: grid; grid-template-columns: 46% minmax(0, 1fr); gap: clamp(40px, 6vw, 96px); align-items: end; }
.post_content .hidamari .lu-about-hero__copy {
  font-family: var(--font-jp-serif);
  font-size: clamp(1.375rem, 2.8vw, 2.125rem);
  line-height: 1.7;
  letter-spacing: .08em;
}
@media (max-width: 767px) {
  .post_content .hidamari .lu-about-hero { grid-template-columns: 1fr; align-items: start; }
  .post_content .hidamari .lu-about-hero__media { width: 90%; }
}

.post_content .hidamari .lu-prose { max-width: 34em; font-size: 16px; line-height: 1.9; letter-spacing: .06em; }
.post_content .hidamari .lu-prose p + p { margin-top: 1.8em !important; }
.post_content .hidamari .lu-prose-serif { font-family: var(--font-jp-serif); }

.post_content .hidamari .lu-split { display: grid; grid-template-columns: 260px minmax(0, 1fr); gap: clamp(24px, 4vw, 72px); }
@media (max-width: 767px) { .post_content .hidamari .lu-split { grid-template-columns: 1fr; gap: 20px; } }

/* 経歴（罫線のみ） */
.post_content .hidamari .lu-history { border-top: 1px solid var(--border); }
.post_content .hidamari .lu-history__row { display: grid; grid-template-columns: 120px minmax(0, 1fr); gap: 24px; padding-block: 22px; border-bottom: 1px solid var(--border); }
.post_content .hidamari .lu-history__year { font-family: var(--font-ui); font-size: 14px; letter-spacing: .16em; color: var(--text-sub); }
.post_content .hidamari .lu-history__text { font-family: var(--font-ui); font-size: 15px; letter-spacing: .04em; }
@media (max-width: 767px) { .post_content .hidamari .lu-history__row { grid-template-columns: 84px minmax(0, 1fr); gap: 16px; } }

/* ------------------------------------------------------------
   SERVICE ページ — 料金は罫線＋余白のみ (§34)。カード禁止
   ------------------------------------------------------------ */

.post_content .hidamari .lu-svc-block { padding-block: clamp(64px, 8vw, 128px); border-top: 1px solid var(--border); }
.post_content .hidamari .lu-svc-block:first-of-type { border-top: 0; padding-top: 0; }

.post_content .hidamari .lu-svc-block__head { display: grid; grid-template-columns: minmax(0, 1fr) 42%; gap: clamp(32px, 5vw, 80px); align-items: end; }
.post_content .hidamari .lu-svc-block__name {
  font-family: var(--font-display);
  font-weight: 300;
  font-size: clamp(2rem, 4.4vw, 3.5rem);
  line-height: 1;
  letter-spacing: .04em;
}
.post_content .hidamari .lu-svc-block__tags {
  margin-top: 20px !important;
  font-family: var(--font-ui);
  font-size: 13px;
  line-height: 1.8;
  letter-spacing: .12em;
  color: var(--text-sub);
}
.post_content .hidamari .lu-svc-block__lead { margin-top: 24px !important; font-size: 16px; line-height: 1.8; color: var(--text-sub); }
@media (max-width: 767px) { .post_content .hidamari .lu-svc-block__head { grid-template-columns: 1fr; align-items: start; } }

.post_content .hidamari .lu-plans { margin-top: clamp(48px, 6vw, 88px) !important; border-top: 1px solid var(--border); }
.post_content .hidamari .lu-plan {
  display: grid;
  grid-template-columns: 200px 160px minmax(0, 1fr) auto;
  gap: clamp(16px, 3vw, 48px);
  align-items: baseline;
  padding-block: clamp(28px, 3.4vw, 44px);
  border-bottom: 1px solid var(--border);
}
.post_content .hidamari .lu-plan__name { font-family: var(--font-ui); font-size: 13px; letter-spacing: .18em; text-transform: uppercase; }
.post_content .hidamari .lu-plan__price { font-family: var(--font-display); font-size: clamp(1.5rem, 2.6vw, 2.125rem); font-weight: 300; letter-spacing: .02em; }
.post_content .hidamari .lu-plan__spec { font-family: var(--font-ui); font-size: 14px; line-height: 1.8; letter-spacing: .06em; color: var(--text-sub); }
@media (max-width: 1023px) {
  .post_content .hidamari .lu-plan { grid-template-columns: minmax(0, 1fr) auto; row-gap: 12px; }
  .post_content .hidamari .lu-plan__spec { grid-column: 1 / -1; }
  .post_content .hidamari .lu-plan__link-cell { grid-column: 1 / -1; }
}

/* FLOW (§35) */
.post_content .hidamari .lu-flow { border-top: 1px solid var(--border); }
.post_content .hidamari .lu-flow__row { display: grid; grid-template-columns: 72px 220px minmax(0, 1fr); gap: clamp(16px, 3vw, 40px); align-items: baseline; padding-block: clamp(24px, 3vw, 36px); border-bottom: 1px solid var(--border); }
.post_content .hidamari .lu-flow__num { font-family: var(--font-ui); font-size: 13px; letter-spacing: .16em; color: var(--text-sub); }
.post_content .hidamari .lu-flow__name { font-family: var(--font-display); font-size: clamp(1.25rem, 2.2vw, 1.75rem); font-weight: 300; letter-spacing: .06em; }
.post_content .hidamari .lu-flow__text { font-size: 15px; line-height: 1.8; color: var(--text-sub); }
@media (max-width: 767px) {
  .post_content .hidamari .lu-flow__row { grid-template-columns: 44px minmax(0, 1fr); row-gap: 6px; }
  .post_content .hidamari .lu-flow__text { grid-column: 2 / -1; }
}

/* ------------------------------------------------------------
   JOURNAL 一覧
   ------------------------------------------------------------ */

.post_content .hidamari .lu-posts { display: grid; grid-template-columns: repeat(3, 1fr); gap: clamp(48px, 5vw, 72px) clamp(24px, 3vw, 48px); }
@media (max-width: 1023px) { .post_content .hidamari .lu-posts { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 767px) { .post_content .hidamari .lu-posts { grid-template-columns: 1fr; gap: 56px; } }

.post_content .hidamari .lu-post__body { margin-top: 22px !important; }
.post_content .hidamari .lu-post__title {
  margin-top: 14px !important;
  font-family: var(--font-display);
  font-weight: 400;
  font-size: clamp(1.1875rem, 1.8vw, 1.5rem);
  line-height: 1.35;
  letter-spacing: .02em;
}
.post_content .hidamari .lu-post__excerpt { margin-top: 14px !important; font-size: 15px; line-height: 1.8; color: var(--text-sub); }

/* ------------------------------------------------------------
   CONTACT ページ — フォーム (§41)
   ------------------------------------------------------------ */

.post_content .hidamari .lu-form { display: grid; gap: clamp(28px, 3.4vw, 44px); max-width: 720px; }
.post_content .hidamari .lu-field { display: grid; gap: 12px; }
.post_content .hidamari .lu-field__label {
  display: flex;
  align-items: baseline;
  gap: 12px;
  font-family: var(--font-ui);
  font-size: 13px;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: var(--text-sub);
}
.post_content .hidamari .lu-field__req { font-size: 12px; letter-spacing: .1em; color: var(--text); }

.post_content .hidamari .lu-input,
.post_content .hidamari .lu-select,
.post_content .hidamari .lu-textarea {
  width: 100%;
  min-height: 48px;
  padding: 12px 0;
  border-bottom: 1px solid var(--border-strong);
  background: none;
  font-size: 16px;               /* iOS のズームを防ぐ */
  line-height: 1.8;
  color: var(--text);
  transition: border-color .3s var(--ease);
}
.post_content .hidamari .lu-textarea { min-height: 168px; resize: vertical; }
.post_content .hidamari .lu-select {
  appearance: none;
  padding-right: 28px;
  background-image: linear-gradient(45deg, transparent 50%, var(--text) 50%), linear-gradient(135deg, var(--text) 50%, transparent 50%);
  background-position: right 10px center, right 5px center;
  background-size: 5px 5px, 5px 5px;
  background-repeat: no-repeat;
}
.post_content .hidamari .lu-input:focus,
.post_content .hidamari .lu-select:focus,
.post_content .hidamari .lu-textarea:focus { border-bottom-color: var(--text); }
.post_content .hidamari .lu-input::placeholder,
.post_content .hidamari .lu-textarea::placeholder { color: var(--text-sub); opacity: .7; }

.post_content .hidamari .lu-form__foot { margin-top: 8px !important; display: flex; flex-wrap: wrap; align-items: center; gap: 24px; }
.post_content .hidamari .lu-form__msg {
  font-size: 15px;
  line-height: 1.8;
  color: var(--text);
  border-left: 1px solid var(--border-strong);
  padding-left: 16px;
}
.post_content .hidamari .lu-form__msg[hidden] { display: none; }

.post_content .hidamari .lu-contact-info { border-top: 1px solid var(--border); margin-top: clamp(64px, 8vw, 112px) !important; padding-top: clamp(32px, 4vw, 56px); }

/* ------------------------------------------------------------
   PRIVACY POLICY
   ------------------------------------------------------------ */

.post_content .hidamari .lu-legal { max-width: 42em; }
.post_content .hidamari .lu-legal h2 {
  margin-top: clamp(48px, 5vw, 72px) !important;
  font-family: var(--font-display);
  font-weight: 400;
  font-size: clamp(1.375rem, 2.2vw, 1.75rem);
  line-height: 1.3;
  letter-spacing: .04em;
}
.post_content .hidamari .lu-legal h2:first-child { margin-top: 0 !important; }
.post_content .hidamari .lu-legal h2 + p { margin-top: 20px !important; }
.post_content .hidamari .lu-legal p { font-size: 16px; line-height: 1.8; color: var(--text-sub); }
.post_content .hidamari .lu-legal p + p { margin-top: 1.4em !important; }
.post_content .hidamari .lu-legal ul { margin-top: 16px !important; }
.post_content .hidamari .lu-legal li {
  position: relative;
  padding-left: 20px;
  font-size: 16px;
  line-height: 1.8;
  color: var(--text-sub);
}
.post_content .hidamari .lu-legal li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 1.05em;
  width: 8px;
  height: 1px;
  background: var(--border-strong);
}


/* ============================================================
   3. WordPress 版だけの上書き
   ここから下は静的サイトには無い、SWELL と組み合わせるための調整。
   ============================================================ */

/* ------------------------------------------------------------
   ページ全体の地色。SWELL のコンテンツ背景を静的サイトに合わせる
   ------------------------------------------------------------ */
body.lu-page,
body.lu-page #content,
body.lu-page .l-mainContent { background: #F4F1EB; }
body.lu-page .l-mainContent__inner { padding: 0; }
body.lu-page .post_content { font-size: inherit; }

/* ------------------------------------------------------------
   ヒーロー（フロントページ）
   静的サイトでは覆いを <div> で持っていたが、コアブロックで表せないので
   ::after に移した。中身は z-index で前に出す。
   ------------------------------------------------------------ */
.post_content .hidamari.lu-hero { padding-top: clamp(120px, 14vh, 200px); }
.post_content .hidamari.lu-hero::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  background:
    radial-gradient(140% 105% at 0% 100%, rgba(28,27,24,.52) 0%, rgba(28,27,24,.26) 48%, rgba(28,27,24,0) 78%),
    linear-gradient(to top, rgba(28,27,24,.70) 0%, rgba(28,27,24,.44) 42%, rgba(28,27,24,.26) 70%, rgba(28,27,24,.34) 100%);
}
.post_content .hidamari.lu-hero > .lu-hero__inner { position: relative; z-index: 2; }
.post_content .hidamari .lu-hero__media { z-index: 0; }

/* 透過ヘッダー（フロントのみ）。SWELL の追従ヘッダーはそのまま使う（gotchas 11） */
.home #header {
  position: absolute;
  inset: 0 0 auto 0;
  z-index: 20;
  background: transparent;
}
.home #header .l-header__inner { background: transparent; }
.home #header .c-headLogo__link,
.home #header .c-iconBtn,
.home #header .p-spMenu__btn,
.home #header .w-header,
.home #header .l-header__menuBtn { color: #FAF9F6; }
.home #header .c-gnav > li > a { color: #FAF9F6; }
/* ヘッダーの文字が写真に潜らないよう、帯だけ覆う */
.home #header::before {
  content: "";
  position: absolute;
  inset: 0 0 auto 0;
  height: 180px;
  pointer-events: none;
  background: linear-gradient(to bottom, rgba(28,27,24,.62) 0%, rgba(28,27,24,.42) 72%, rgba(28,27,24,0) 100%);
}
.home .l-fixHeader { background: rgba(244, 241, 235, .92); backdrop-filter: blur(8px); }

/* ------------------------------------------------------------
   下層ページ：ヘッダーは通常配置なので、静的サイトの固定ヘッダー用
   余白（--header-h 分）は不要。上の余白だけ残す。
   ------------------------------------------------------------ */
.post_content .hidamari .lu-page-top { padding-top: clamp(56px, 9vw, 128px); }

/* ------------------------------------------------------------
   全幅セクション
   SWELL の .alignfull に任せる。自前で margin-inline を足すと二重にずれる（gotchas 3）
   ------------------------------------------------------------ */
.post_content .hidamari.alignfull { width: 100vw; position: relative; left: calc(50% - 50vw); }

/* ------------------------------------------------------------
   カードのホバー
   静的サイトは <a> でカード全体を包んでいたが、コアブロックでは包めないので
   グループ側の hover に付け替える
   ------------------------------------------------------------ */
@media (hover: hover) {
  .post_content .hidamari .lu-selected-01:hover .lu-frame > img,
.post_content .hidamari .lu-selected-02:hover .lu-frame > img,
.post_content .hidamari .lu-selected-03:hover .lu-frame > img,
.post_content .hidamari .lu-works__item:hover .lu-frame > img,
.post_content .hidamari .lu-post:hover .lu-frame > img,
.post_content .hidamari .lu-journal__card:hover .lu-frame > img { transform: scale(1.025); }
}

/* ------------------------------------------------------------
   フッターのデモ注記（.hidamari の外に出るのでここで指定）
   ------------------------------------------------------------ */
.lu-demo-notice {
  max-width: 1360px;
  margin-inline: auto;
  padding: 24px 20px 0;
  font-family: "Noto Sans JP", "Hiragino Sans", "Yu Gothic", Meiryo, sans-serif;
  font-size: 14px;
  line-height: 1.8;
  letter-spacing: .05em;
  color: #55524D;
}
.lu-demo-notice p + p { margin-top: 10px !important; }
.lu-demo-notice__en { font-family: "Inter", Helvetica, Arial, sans-serif; font-size: 12px; letter-spacing: .08em; }

/* ------------------------------------------------------------
   wp:button はクラスが外側の <div> に付き、色や枠は内側の <a> に要る。
   静的サイトの .lu-link / .lu-btn を、この構造向けに移し替えたもの。
   ------------------------------------------------------------ */
.post_content .hidamari .lu-btn-underline .wp-block-button__link {
  display: inline-flex;
  align-items: center;
  gap: 14px;
  min-height: 44px;
  padding-block: 8px;
  border-bottom: 1px solid currentColor;
  font-family: var(--font-ui);
  font-size: 13px;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--text);
  transition: color .4s var(--ease);
}
.post_content .hidamari .lu-btn-outline .wp-block-button__link {
  display: inline-flex;
  align-items: center;
  gap: 16px;
  min-height: 44px;
  padding: 18px 36px;
  border: 1px solid currentColor;
  font-family: var(--font-ui);
  font-size: 13px;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--text);
  transition: background-color .4s var(--ease), color .4s var(--ease);
}
@media (hover: hover) {
  .post_content .hidamari .lu-btn-outline .wp-block-button__link:hover { background: var(--text); color: var(--background); }
}
/* 写真の上に置くとき */
.post_content .hidamari .lu-btn-light .wp-block-button__link { color: var(--white); }
@media (hover: hover) {
  .post_content .hidamari .lu-btn-outline.lu-btn-light .wp-block-button__link:hover { background: var(--white); color: var(--text); }
}
/* 日本語ボタンは Inter に日本語が無いので字体を差し替える */
.post_content .hidamari .lu-btn-jp .wp-block-button__link {
  font-family: var(--font-jp-sans);
  font-size: 14px;
  letter-spacing: .08em;
  text-transform: none;
}
.post_content .hidamari .lu-hero__actions {
  margin-top: clamp(28px, 3.2vw, 44px) !important;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 12px 32px;
}

/* ------------------------------------------------------------
   WORK CATEGORY：行は group、名前だけリンク。
   data 属性はコアブロックで持てないので、JS 側は行の並び順で判定する。
   ------------------------------------------------------------ */
.post_content .hidamari .lu-cat__name a { color: inherit; }
.post_content .hidamari .lu-cat__link { cursor: default; }
.post_content .hidamari .lu-cat__name a:focus-visible { outline-offset: 6px; }

/* 絞り込みボタン。wp:button の外側 div に is-current が付く */
.post_content .hidamari .lu-filter { display: flex; flex-wrap: wrap; gap: 4px 28px; }
.post_content .hidamari .lu-filter .wp-block-button__link {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  border-bottom: 1px solid transparent;
  font-family: var(--font-ui);
  font-size: 13px;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--text-sub);
  transition: color .3s var(--ease), border-color .3s var(--ease);
}
.post_content .hidamari .lu-filter .is-current .wp-block-button__link { color: var(--text); border-bottom-color: var(--text); }
@media (hover: hover) { .post_content .hidamari .lu-filter .wp-block-button__link:hover { color: var(--text); } }
.post_content .hidamari .lu-works__item[hidden] { display: none; }

/* ------------------------------------------------------------
   リンク付き画像。wp:image のリンクは figure > a > img になるので、
   .lu-frame > img だけでは当たらない。a を枠いっぱいに広げ、
   その中で img を敷く（当たり判定も枠全体になる）。
   ------------------------------------------------------------ */
.post_content .hidamari .lu-frame > a {
  position: absolute;
  inset: 0;
  display: block;
  z-index: 1;
}
.post_content .hidamari .lu-frame > img,
.post_content .hidamari .lu-frame > a > img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .8s var(--ease);
}
@media (hover: hover) {
  .post_content .hidamari .lu-frame:hover > a > img { transform: scale(1.025); }
  .post_content .hidamari .lu-selected__item:hover .lu-frame > a > img,
.post_content .hidamari .lu-works__item:hover .lu-frame > a > img,
.post_content .hidamari .lu-post:hover .lu-frame > a > img,
.post_content .hidamari .lu-journal__card:hover .lu-frame > a > img { transform: scale(1.025); }
}
@media (prefers-reduced-motion: reduce) {
  .post_content .hidamari .lu-frame > a > img { transition: none; }
}

/* Instagram のハンドル。静的サイトでは <a> 自体にクラスが付いていたが、
   WP では <p> に付くので、内側の <a> にタップ領域を持たせる（§76） */
.post_content .hidamari .lu-insta__handle a {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
}

/* CONTACT のデモフォーム（段階C で Contact Form 7 に差し替える） */
.post_content .hidamari .lu-form__submit {
  display: inline-flex;
  align-items: center;
  gap: 16px;
  min-height: 44px;
  padding: 18px 36px;
  border: 1px solid var(--text);
  background: none;
  font-family: var(--font-ui);
  font-size: 13px;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--text);
  cursor: pointer;
  transition: background-color .4s var(--ease), color .4s var(--ease);
}
@media (hover: hover) {
  .post_content .hidamari .lu-form__submit:hover { background: var(--text); color: var(--background); }
}

/* ------------------------------------------------------------
   静的サイト（確定版）との差を埋める分
   ------------------------------------------------------------ */

/* CONCEPT のラベル：静的は <span>（inline）。WP は <p> なので block になり、
   .lu-concept__label の margin-bottom が効いて 88px ぶん間隔が開いてしまう。
   静的の見た目に合わせて inline に戻す。
   （静的側では inline に margin-bottom を書いていて実際には効いていない。
     仕様 §20 の「大きな余白」を出したいなら、両方を block に揃えるほうが本来は正しい） */
.post_content .hidamari .lu-concept__label { display: inline; }

/* JOURNAL の「Read →」。wp:buttons なので flex になる */
.post_content .hidamari .lu-journal__more { margin-top: 20px !important; display: flex; }

/* FEATURE の日本語は段落内の <span>。静的サイトでは inline のままなので
   margin-top は効かず、英文と同じ流れで続く。ここを block にすると静的とズレる。 */

/* 全幅セクション：100vw はスクロールバーを含むので、静的より15px広くなる。
   スクロールバー幅を引いて静的と揃える */
.post_content .hidamari.alignfull {
  width: calc(100vw - var(--lu-sbw, 0px));
  left: calc(50% - (100vw - var(--lu-sbw, 0px)) / 2);
}

/* ------------------------------------------------------------
   SWELL の SP 既定を静的サイトに合わせる
   ・--swl-fz--root は SP で 3.6vw（375px なら約13.5px）。
     静的サイトは 16px 前提で組んであるので、rem 由来の文字が軒並み縮む。
   ・--swl-pad_post_content は SP で本文コンテナに左右余白を足す。
     こちらは .lu-wrap 側で余白を持っているので二重になる。
   どちらも SWELL が用意している変数なので、値だけ差し替える。
   ------------------------------------------------------------ */
/* SWELL は :root（詳細度 0,1,0）で定義しているので、html では勝てない */
:root { --swl-fz--root: 16px; }
.lu-page .post_content { --swl-pad_post_content: 0px; }

/* ------------------------------------------------------------
   Information（作品詳細）
   静的サイトは <dl> のグリッド。コアブロックに dl が無いので wp:table を使っている。
   見た目を静的サイトの .lu-dl に揃える。
   ------------------------------------------------------------ */
.post_content .hidamari figure.lu-dl { display: block; margin: 32px 0 0 !important; }
/* 静的サイトの <dl> は要素ごとに border-top を持つ。collapse だと
   境界が統合されて行が縮むので、separate にして同じ数え方にする。 */
.post_content .hidamari .lu-dl table { width: 100%; border-collapse: separate; border-spacing: 0; }
.post_content .hidamari .lu-dl th,
.post_content .hidamari .lu-dl td {
  padding-block: 22px;
  border-top: 1px solid var(--border);
  text-align: left;
  vertical-align: top;
}
.post_content .hidamari .lu-dl th {
  width: 200px;
  font-family: var(--font-ui);
  font-weight: 400;
  font-size: 13px;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--text-sub);
}
@media (max-width: 767px) {
  .post_content .hidamari .lu-dl th,
.post_content .hidamari .lu-dl td { display: block; width: auto; }
  .post_content .hidamari .lu-dl td { padding-top: 8px; border-top: 0; }
  .post_content .hidamari .lu-dl th { padding-bottom: 0; }
}

/* NEXT PROJECT の作品名。静的サイトでは <a> の中の <span> が大きい文字になる */
.post_content .hidamari .lu-btn-next .wp-block-button__link { text-transform: none; letter-spacing: 0; }
.post_content .hidamari .lu-project__next-name { display: inline-block; }
/* SWELL がテーブルのセルに line-height:1.6 を当てるので、本文と同じ 1.8 に戻す。
   継承任せにすると 1.6 になり、静的サイトの <dl> より行が詰まる。 */
.post_content .hidamari .lu-dl th,
.post_content .hidamari .lu-dl td { line-height: 1.8; }

/* ------------------------------------------------------------
   ボタン行の寄せ
   静的サイトは <p> の中の inline-flex なリンクだったので text-align が効いた。
   wp:buttons は flex コンテナなので text-align が効かない。justify-content で揃える。
   ------------------------------------------------------------ */
.post_content .hidamari .lu-contact-cta__btn { justify-content: center; }
.post_content .hidamari .lu-section-foot { justify-content: flex-end; }
.post_content .hidamari .lu-section-foot-center { justify-content: center; }
.post_content .hidamari .lu-about__foot,
.post_content .hidamari .lu-journal__more,
.post_content .hidamari .lu-plan__link-cell,
.post_content .hidamari .lu-hero__actions { justify-content: flex-start; }

/* SERVICE の番号ラベル。静的サイトでは <span>（inline）で、親の行間ぶんの
   行ボックスを占める。WP は <p> なので自前の行間になり 7px 縮む。
   CONCEPT のラベルと同じ理由。 */
.post_content .hidamari .lu-svc-block__head .lu-label { display: inline; }

/* ============================================================
   5. Contact Form 7
   静的サイトのデモフォームと同じ見た目にする。
   CF7 は入力欄を <span class="wp-block-form-input__label"> 相当ではなく
   <span class="wpcf7-form-control-wrap"> で包むので、その分の指定が要る。
   ============================================================ */

.post_content .hidamari .wpcf7 { max-width: 720px; }
.post_content .hidamari .wpcf7-form .lu-form { display: grid; gap: clamp(28px, 3.4vw, 44px); }
.post_content .hidamari .lu-field { display: grid; gap: 12px; }
.post_content .hidamari .wpcf7-form-control-wrap { display: block; }

/* 入力欄 */
.post_content .hidamari .wpcf7 .lu-input,
.post_content .hidamari .wpcf7 .lu-textarea {
  width: 100%;
  min-height: 48px;
  padding: 12px 0;
  border: 0;
  border-bottom: 1px solid var(--border-strong);
  border-radius: 0;
  background: none;
  font-family: var(--font-jp-sans);
  font-size: 16px;            /* iOS のズームを防ぐ */
  line-height: 1.8;
  letter-spacing: .05em;
  color: var(--text);
  transition: border-color .3s var(--ease);
}
.post_content .hidamari .wpcf7 .lu-textarea { min-height: 168px; resize: vertical; }
.post_content .hidamari .wpcf7 .lu-input:focus,
.post_content .hidamari .wpcf7 .lu-textarea:focus { border-bottom-color: var(--text); outline: 2px solid transparent; }
.post_content .hidamari .wpcf7 .lu-input:focus-visible,
.post_content .hidamari .wpcf7 .lu-textarea:focus-visible { outline: 2px solid var(--text); outline-offset: 3px; }
.post_content .hidamari .wpcf7 .lu-input::placeholder,
.post_content .hidamari .wpcf7 .lu-textarea::placeholder { color: var(--text-sub); opacity: .7; }

/* 送信ボタン */
.post_content .hidamari .wpcf7 .lu-form__submit {
  display: inline-flex;
  align-items: center;
  gap: 16px;
  min-height: 44px;
  padding: 18px 36px;
  border: 1px solid var(--text);
  border-radius: 0;
  background: none;
  font-family: var(--font-ui);
  font-size: 13px;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--text);
  cursor: pointer;
  transition: background-color .4s var(--ease), color .4s var(--ease);
}
@media (hover: hover) {
  .post_content .hidamari .wpcf7 .lu-form__submit:hover { background: var(--text); color: var(--background); }
}
.post_content .hidamari .wpcf7 .lu-form__foot { margin-top: 8px !important; display: flex; flex-wrap: wrap; align-items: center; gap: 24px; }

/* CF7 のメッセージ・エラー表示 */
.post_content .hidamari .wpcf7 .wpcf7-not-valid-tip {
  margin-top: 8px !important;
  font-size: 13px;
  line-height: 1.8;
  color: #A03A2C;                       /* 背景 #F4F1EB に対して 5.4:1 */
}
.post_content .hidamari .wpcf7 .lu-input.wpcf7-not-valid,
.post_content .hidamari .wpcf7 .lu-textarea.wpcf7-not-valid { border-bottom-color: #A03A2C; }
.post_content .hidamari .wpcf7 .wpcf7-response-output {
  margin: 32px 0 0 !important;
  padding: 16px 20px;
  border: 1px solid var(--border-strong);
  border-radius: 0;
  font-size: 15px;
  line-height: 1.8;
  color: var(--text);
}
.post_content .hidamari .wpcf7 form.invalid .wpcf7-response-output,
.post_content .hidamari .wpcf7 form.failed .wpcf7-response-output { border-color: #A03A2C; color: #8A3125; }
.post_content .hidamari .wpcf7-spinner { margin-inline: 12px; }
/* 送信中はボタンを押せないことが分かるように */
.post_content .hidamari .wpcf7 form.submitting .lu-form__submit { opacity: .5; pointer-events: none; }

/* ------------------------------------------------------------
   CONCEPT セクションの背景（綿毛）
   画像の地は #F5F0E7 で、セクション背景 #F4F1EB との輝度差は -0.7%。
   継ぎ目が見えないので blend も不透明度調整もせず、そのまま敷く。
   実測：中央域の最暗部で 本文 6.67:1 / 見出し 13.34:1（AA を満たす）

   URL は additional.css からの相対パス。
   uploads の絶対URLにするとドメインが焼き付き、本番へ移したときに切れる。
   ------------------------------------------------------------ */
.post_content .hidamari.lu-concept {
  background-color: var(--background);
  background-image: url("assets/img/bg-concept-fluff.jpg");
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

/* SP は縦長（360x675 = 比率0.53）。横長の PC 版を cover で敷くと横幅の64%が切られ、
   周縁に置いた綿毛が全部画面外に出てしまう。縦構図（9:16）に差し替える。
   画像は地の色を #F4F1EB に合わせ、暗部だけ持ち上げ済み（文字帯で本文 4.98:1）。 */
@media (max-width: 767px) {
  .post_content .hidamari.lu-concept {
    background-image: url("assets/img/bg-concept-fluff-sp.jpg");
  }
}

/* ------------------------------------------------------------
   SP のヒーロー：被写体が画面から外れる問題

   ヒーロー画像は 16:9（2400x1350）。SP のヒーロー枠は 375x790 前後（比率0.47）なので
   cover で高さを埋めると、元画像の横 30%（711px）しか見えない。
   4枚とも被写体を左右どちらかの端に寄せてある（PC で文字を重ねる余白を作るため）ので、
   既定の center では「空けておいた中央」だけが映り、人物が1人も見えない。

   暗部（＝髪）の横分布を実測し、被写体が窓に入る位置へずらす。
     hero-01 家族   暗部中央値 横75%  → 85%（窓 60〜90%）
     hero-02 女性   暗部中央値 横67%  → 75%（窓 52〜81%）
     hero-03 椅子   暗部中央値 横24%  → 10%（窓  9〜38%）
     hero-04 カフェ 暗部中央値 横88%  → 100%（窓 70〜100%）
   ------------------------------------------------------------ */
@media (max-width: 767px) {
  .post_content .hidamari .lu-hero__media > .lu-hero__slide:nth-of-type(1) .lu-frame > img { object-position: 85% center; }
  .post_content .hidamari .lu-hero__media > .lu-hero__slide:nth-of-type(2) .lu-frame > img { object-position: 75% center; }
  .post_content .hidamari .lu-hero__media > .lu-hero__slide:nth-of-type(3) .lu-frame > img { object-position: 10% center; }
  .post_content .hidamari .lu-hero__media > .lu-hero__slide:nth-of-type(4) .lu-frame > img { object-position: 100% center; }
}
