/*
Theme Name: Wellness 2026
Theme URI: https://example.com/
Author: Satoko Abe
Description: 食事改善・ウェルネス系サイト向けオリジナルテーマ。ピンク・ブルー・イエローのテーマカラー、色面を途中で切って白を残す非対称レイアウト、ずらした色ブロックの写真フレームが特徴。
Version: 1.3.0
Requires at least: 6.4
Tested up to: 6.7
Requires PHP: 8.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: wellness2026
Tags: blog, one-column, custom-menu, custom-logo, featured-images, translation-ready
*/

/* ==========================================================================
   1. デザイントークン
   ========================================================================== */
:root {
  /* 色 — テーマカラー：ピンク #ef7993／ブルー #4ac2c9／イエロー #f5cd2e */
  --c-ink:         #33303a;
  --c-ink-soft:    #5a5661;
  --c-ink-mute:    #99949f;
  --c-accent:      #ef7993;   /* ピンク（メイン） */
  --c-accent-dark: #e25c7b;
  --c-tint:        #fde4ea;   /* 淡いピンク */
  --c-tint-soft:   #fff3f6;
  --c-deep:        #4ac2c9;   /* ブルー */
  --c-blue-ink:    #2a9aa1;   /* 文字用のブルー（白地で読みやすい濃さ） */
  --c-blue-soft:   #e2f5f6;
  --c-mustard:     #f5cd2e;   /* イエロー */
  --c-cream:       #fff7da;   /* 淡いイエロー */
  --c-white:       #ffffff;
  --c-line:        rgba(51, 48, 58, .14);

  /* 書体 */
  --f-display: "Shippori Mincho", "Hiragino Mincho ProN", serif;
  --f-body:    "Zen Kaku Gothic New", "Hiragino Kaku Gothic ProN", sans-serif;
  --f-label:   "Jost", "Zen Kaku Gothic New", sans-serif;
  --f-script:  "Shippori Mincho", "Hiragino Mincho ProN", serif;

  /* 寸法 */
  --wrap:      1200px;
  --wrap-text: 720px;
  --gutter:    clamp(1.25rem, 5vw, 3.5rem);
  --sec-y:     clamp(4rem, 9vw, 8rem);
  --radius:    6px;
  --shift:     clamp(.9rem, 2vw, 1.6rem);   /* 写真の後ろの色ブロックのずらし幅 */
  /* 画面幅いっぱいのセクション内で、中身を --wrap 幅に収めるための左右余白 */
  --edge:      max(var(--gutter), calc((100% - var(--wrap)) / 2 + var(--gutter)));
}

/* ==========================================================================
   2. ベース
   ========================================================================== */
*, *::before, *::after { box-sizing: border-box; }

html {
  -webkit-text-size-adjust: 100%;
  scroll-behavior: smooth;
  /* 画面外に退避したモバイルメニューで横スクロールが出ないようにする。
     overflow-x: hidden と違い clip は position: sticky を壊さない。 */
  overflow-x: clip;
}

body {
  margin: 0;
  overflow-x: clip;
  background: var(--c-white);
  color: var(--c-ink);
  font-family: var(--f-body);
  font-size: 1.0625rem;
  font-weight: 400;
  line-height: 1.85;
  letter-spacing: .04em;
  -webkit-font-smoothing: antialiased;
}

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

a { color: inherit; text-decoration: none; transition: color .25s ease, opacity .25s ease; }
a:hover { color: var(--c-accent); }

h1, h2, h3, h4 {
  font-family: var(--f-display);
  font-weight: 500;
  line-height: 1.12;
  letter-spacing: -.005em;
  margin: 0 0 .5em;
}
h1 { font-size: clamp(2.6rem, 6vw, 4.25rem); }
h2 { font-size: clamp(2.1rem, 4.6vw, 3.4rem); }
h3 { font-size: clamp(1.5rem, 2.6vw, 2.1rem); }
h4 { font-size: 1.25rem; }

p { margin: 0 0 1.4em; }
p:last-child { margin-bottom: 0; }

::selection { background: var(--c-tint); color: var(--c-ink); }

/* フォーカス表示（アクセシビリティ） */
a:focus-visible, button:focus-visible, input:focus-visible, textarea:focus-visible {
  outline: 2px solid var(--c-deep);
  outline-offset: 3px;
}

.skip-link {
  position: absolute; left: -9999px; top: 0; z-index: 999;
  background: var(--c-ink); color: #fff; padding: .75rem 1.25rem;
}
.skip-link:focus { left: 0; }

.screen-reader-text {
  position: absolute !important; width: 1px; height: 1px;
  overflow: hidden; clip: rect(1px, 1px, 1px, 1px); white-space: nowrap;
}

/* ==========================================================================
   3. レイアウト用ユーティリティ
   ========================================================================== */
.wrap      { width: 100%; max-width: var(--wrap); margin-inline: auto; padding-inline: var(--gutter); }
.wrap--text{ max-width: var(--wrap-text); }
.section   { padding-block: var(--sec-y); }
.section--cream { background: var(--c-cream); }
.section--tint { background: var(--c-tint-soft); }
.text-center { text-align: center; }

/* 小さな大文字ラベル */
.eyebrow {
  display: inline-flex; align-items: center; gap: .75rem;
  font-family: var(--f-label);
  font-size: .8125rem;
  font-weight: 600;
  line-height: 1.7;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--c-blue-ink);
  margin: 0 0 1.25rem;
}
.eyebrow::before { content: ""; width: 24px; height: 1px; background: currentColor; }
.text-center .eyebrow, .eyebrow.text-center { justify-content: center; }
.eyebrow--accent  { color: var(--c-accent); }
.eyebrow--light { color: rgba(255,255,255,.85); }

/* 区切り線 */
.rule { width: 68px; height: 1px; background: var(--c-line); border: 0; margin: 1.75rem 0; }
.rule--center { margin-inline: auto; }
.rule--light { background: rgba(255,255,255,.4); }

/* 筆記体アクセント */
.script { font-family: var(--f-script); font-weight: 400; letter-spacing: .01em; }

.lead { font-size: 1.1875rem; line-height: 1.85; color: var(--c-ink-soft); }

/* ==========================================================================
   4. ボタン
   ========================================================================== */
.btn {
  display: inline-block;
  font-family: var(--f-body);
  font-size: .8125rem;
  font-weight: 700;
  letter-spacing: .1em;
  text-transform: uppercase;
  line-height: 1;
  padding: 1.1rem 2.25rem;
  border: 1px solid transparent;
  border-radius: var(--radius);
  cursor: pointer;
  transition: background-color .3s ease, color .3s ease, border-color .3s ease, transform .3s ease;
}
.btn::after { content: "→"; display: inline-block; margin-left: .75em; transition: transform .3s ease; }
.btn:hover { color: inherit; }
.btn:hover::after { transform: translateX(4px); }
button.btn::after { content: none; }

.btn--accent    { background: var(--c-accent); color: #fff; }
.btn--accent:hover { background: var(--c-accent-dark); color: #fff; }

.btn--ink     { background: var(--c-ink); color: #fff; }
.btn--ink:hover { background: #000; color: #fff; }

.btn--white   { background: #fff; color: var(--c-ink); }
.btn--white:hover { background: var(--c-cream); color: var(--c-ink); }

.btn--outline { background: transparent; border-color: var(--c-ink); color: var(--c-ink); }
.btn--outline:hover { background: var(--c-ink); color: #fff; }

.btn--line    { background: transparent; border-color: rgba(255,255,255,.6); color: #fff; }
.btn--line:hover { background: #fff; color: var(--c-deep); }

/* テキストリンク（下線つき小文字リンク） */
.link-more {
  display: inline-block;
  font-family: var(--f-body);
  font-size: .75rem;
  font-weight: 700;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: var(--c-accent);
  padding-bottom: .4rem;
  border-bottom: 1px solid currentColor;
}
.link-more:hover { color: var(--c-accent); }

/* ==========================================================================
   5. 告知バー
   ========================================================================== */
.announce {
  background: var(--c-mustard);
  color: var(--c-ink);
  text-align: center;
  padding: .7rem 3rem;
}
.announce__inner {
  display: flex; flex-wrap: wrap; align-items: center; justify-content: center;
  gap: .85rem 1.75rem;
  max-width: var(--wrap); margin-inline: auto;
}
.announce__text { font-size: .875rem; font-weight: 500; letter-spacing: .01em; margin: 0; }
.announce .btn { padding: 0 0 .15rem; font-size: .75rem; border: 0; border-bottom: 1px solid currentColor; border-radius: 0; color: var(--c-ink); }
.announce .btn:hover { background: none; color: var(--c-ink); opacity: .7; }
.announce .btn::after { content: none; }
.announce__close {
  position: absolute; right: var(--gutter); top: 50%; transform: translateY(-50%);
  background: none; border: 0; color: var(--c-ink); font-size: 1.5rem; line-height: 1;
  cursor: pointer; opacity: .8; padding: .25rem .5rem;
}
.announce__close:hover { opacity: 1; }
.announce-wrap { position: relative; }

/* ==========================================================================
   6. ヘッダー
   ========================================================================== */
.site-header {
  position: sticky; top: 0; z-index: 100;
  /* backdrop-filter は使わない：fixed のモバイルメニューの基準がヘッダーになり、メニューが潰れるため */
  background: var(--c-white);
  border-bottom: 1px solid rgba(17,17,17,.06);
}
.site-header__inner {
  display: flex; align-items: center; justify-content: space-between;
  gap: 2rem;
  min-height: 92px;
  max-width: var(--wrap); margin-inline: auto; padding-inline: var(--gutter);
}

.site-brand { display: flex; align-items: center; }
.site-brand__text {
  font-family: var(--f-display);
  font-size: clamp(1.25rem, 2.4vw, 1.75rem);
  font-weight: 600;
  letter-spacing: .12em;
  text-transform: uppercase;
  line-height: 1;
  margin: 0;
}
.site-brand__text .thin { font-weight: 400; font-size: .7em; color: var(--c-blue-ink); margin-left: .35em; }
.site-brand img { max-height: 54px; width: auto; }
.site-brand__tagline { display: none; }

/* ナビゲーション */
.nav-primary ul {
  display: flex; align-items: center; gap: clamp(1.1rem, 2.4vw, 2.2rem);
  list-style: none; margin: 0; padding: 0;
}
.nav-primary a {
  font-size: .8125rem; font-weight: 700;
  letter-spacing: .13em; text-transform: uppercase;
  padding-block: .5rem;
  position: relative;
}
.nav-primary a::after {
  content: ""; position: absolute; left: 0; bottom: 0;
  width: 100%; height: 1px; background: currentColor;
  transform: scaleX(0); transform-origin: right; transition: transform .3s ease;
}
.nav-primary a:hover::after { transform: scaleX(1); transform-origin: left; }
.nav-primary .current-menu-item > a::after { transform: scaleX(1); }

/* ハンバーガー */
.nav-toggle {
  display: none;
  flex-direction: column; justify-content: center; gap: 7px;
  width: 44px; height: 44px; padding: 0;
  background: none; border: 0; cursor: pointer;
}
.nav-toggle span {
  display: block; width: 32px; height: 2px; background: var(--c-ink);
  transition: transform .3s ease, opacity .3s ease;
}
.nav-toggle[aria-expanded="true"] span:nth-child(1) { transform: translateY(9px) rotate(45deg); }
.nav-toggle[aria-expanded="true"] span:nth-child(2) { opacity: 0; }
.nav-toggle[aria-expanded="true"] span:nth-child(3) { transform: translateY(-9px) rotate(-45deg); }

@media (max-width: 900px) {
  .nav-toggle { display: flex; }
  .nav-primary {
    position: fixed; inset: var(--nav-top, 92px) 0 0; z-index: 99;   /* --nav-top は JS でヘッダーの下端に合わせる */
    background: var(--c-white);
    padding: 2.5rem var(--gutter);
    overflow-y: auto;
    /* 閉じている間はリンクにタブ移動できないよう visibility も切り替える */
    visibility: hidden;
    transform: translateX(100%);
    transition: transform .35s ease, visibility 0s linear .35s;
  }
  .nav-primary.is-open {
    visibility: visible;
    transform: translateX(0);
    transition: transform .35s ease, visibility 0s;
  }
  .nav-primary ul { flex-direction: column; align-items: flex-start; gap: 1.75rem; }
  .nav-primary a { font-size: 1rem; letter-spacing: .18em; }
}

/* ==========================================================================
   7. 写真フレーム（後ろに色ブロックをずらして置く）
   ========================================================================== */
.frame { position: relative; isolation: isolate; }
.frame::before {
  content: ""; position: absolute; z-index: -1;
  inset: var(--shift) calc(var(--shift) * -1) calc(var(--shift) * -1) var(--shift);
  background: var(--frame-color, var(--c-mustard));
}
/* 写真は枠いっぱいに敷き詰める。枠の高さが min-height で決まる場合、
   height:100% だと高さが決まらず写真が上に縮んでしまうため absolute にする */
.frame > img {
  position: absolute; inset: 0;
  width: 100%; height: 100%; object-fit: cover; object-position: 50% 35%;
}

/* 写真未設定時のプレースホルダー。
   要素自身の背景だと ::before（z-index:-1）の色ブロックに覆われるため、::after に描く */
.ph-pink::after, .ph-blue::after, .ph-yellow::after { content: ""; position: absolute; inset: 0; }
.ph-pink::after   { background: linear-gradient(160deg, #fbd3dc 0%, #fff0f3 100%); }
.ph-blue::after   { background: linear-gradient(160deg, #c6ecee 0%, #f0fafa 100%); }
.ph-yellow::after { background: linear-gradient(160deg, #fdeaa6 0%, #fffaf0 100%); }

/* ==========================================================================
   8. ヒーロー
   ========================================================================== */
/* 淡いピンクの面を右上だけに敷き、左と下に白を残す */
.hero {
  background:
    linear-gradient(var(--c-tint), var(--c-tint)) no-repeat right top / 82% 78%,
    var(--c-white);
  padding: clamp(2.5rem, 6vw, 5rem) 0 clamp(3rem, 7vw, 6rem);
}
.hero__inner { display: grid; grid-template-columns: 1fr; }
.hero__media {
  --frame-color: var(--c-mustard);
  aspect-ratio: 1 / 1;              /* スマホは正方形にして人物を大きく見せる */
  margin-left: calc(var(--gutter) * 2.5);
  margin-right: calc(var(--gutter) + var(--shift));
}
.hero__card {
  position: relative; z-index: 2;
  background: var(--c-white);
  margin: -3.5rem calc(var(--gutter) * 1.5) 0 var(--gutter);
  padding: clamp(2rem, 4vw, 3.5rem) clamp(1.5rem, 3.5vw, 3.25rem);
  box-shadow: 0 20px 50px rgba(51, 48, 58, .08);
}
.hero__title { font-size: clamp(2.2rem, 4.6vw, 3.6rem); line-height: 1.3; margin-bottom: 1.25rem; }
.hero__title::after {               /* 見出し下のピンクの短いライン */
  content: ""; display: block; width: 56px; height: 4px; margin-top: 1.25rem;
  background: var(--c-accent); border-radius: 2px;
}
.hero__card .rule { display: none; }
.hero__text  { max-width: 30em; }
.hero__actions { margin-top: 2rem; }

@media (min-width: 900px) {
  .hero__inner {
    grid-template-columns: repeat(12, 1fr);
    align-items: end;
    padding-inline: var(--edge);
  }
  /* カードと写真は横に並べ、重なりはカードの右下の角だけにする。
     カードが写真の左側を縦いっぱいに覆うと、写っている人物が左に寄って見えるため。 */
  .hero__media {
    grid-column: 7 / 13; grid-row: 1;
    aspect-ratio: 4 / 5; min-height: 0;
    margin: 0 var(--shift) 0 0;
  }
  .hero__card {
    grid-column: 1 / 7; grid-row: 1;
    margin: 0 calc(clamp(2rem, 4vw, 3.5rem) * -1) calc(var(--sec-y) * -.35) 0;
  }
  .hero__title { font-size: clamp(2.2rem, 3.8vw, 3.25rem); }
  /* カードの角が写真の左端にかかるぶん、写真を少し右寄りに見せて人物を中央に保つ */
  .hero__media img { object-position: 42% 35%; }
}

/* ==========================================================================
   9. ページ見出し（下層ページ共通）
   ========================================================================== */
.page-hero {
  background:
    linear-gradient(var(--c-tint), var(--c-tint)) no-repeat left top / 70% 100%,
    var(--c-white);
  padding-block: clamp(3.5rem, 7vw, 6rem);
  text-align: center;
}
.page-hero h1 { margin-bottom: 0; }

/* ==========================================================================
   10. 掲載メディア帯
   ========================================================================== */
.featured-strip { padding-block: clamp(3rem, 6vw, 4.5rem) clamp(2rem, 4vw, 3rem); }
.featured-strip .eyebrow { display: flex; justify-content: center; margin-bottom: 1.75rem; }
.featured-strip__logos {
  display: flex; flex-wrap: wrap; align-items: center; justify-content: center;
  gap: 1rem clamp(1.75rem, 5vw, 3.75rem);
}
.featured-strip__logos span {
  font-family: var(--f-display);
  font-size: clamp(1.05rem, 2vw, 1.4rem);
  letter-spacing: .06em;
  color: var(--c-ink-mute);
}

/* ==========================================================================
   11. 2分割セクション（写真 × 白いテキストカード）
   ========================================================================== */
/* 淡いブルーの面を左下だけに敷く */
.split {
  display: grid; grid-template-columns: 1fr;
  padding-block: var(--sec-y);
  background:
    linear-gradient(var(--c-blue-soft), var(--c-blue-soft)) no-repeat left bottom / 72% 70%,
    var(--c-white);
}
.split__media {
  --frame-color: var(--c-accent);
  aspect-ratio: 4 / 5;
  margin-inline: var(--gutter) calc(var(--gutter) * 2.5);
}
.split__body {
  position: relative; z-index: 2;
  background: var(--c-white);
  margin: -4rem var(--gutter) 0 calc(var(--gutter) * 2);
  padding: clamp(2rem, 4vw, 3.5rem);
  box-shadow: 0 20px 50px rgba(51, 48, 58, .07);
}
.split__body > * { max-width: 34em; }

@media (min-width: 900px) {
  .split {
    grid-template-columns: repeat(12, 1fr);
    align-items: center;
    padding-inline: var(--edge);
  }
  .split__media { grid-column: 1 / 6; grid-row: 1; margin: 0; min-height: 580px; aspect-ratio: auto; }
  .split__body  { grid-column: 5 / 12; grid-row: 1; margin: 6rem 0 0; }
  /* テキストカードが写真の右端にかかるぶん、写真を右寄りに見せて人物を見えている範囲の中央に保つ */
  .split__media img { object-position: 63% 35%; }
  .split--reverse .split__media { grid-column: 8 / 13; }
  .split--reverse .split__body  { grid-column: 2 / 9; }
}

/* ==========================================================================
   12. 番号つきカード（01 / 02 / 03）
   ========================================================================== */
/* 淡いイエローの面を右上だけに敷く */
.section--cream {
  background:
    linear-gradient(var(--c-cream), var(--c-cream)) no-repeat right top / 86% 62%,
    var(--c-white);
}
.cards { display: grid; grid-template-columns: 1fr; gap: clamp(1.5rem, 3vw, 2.5rem); }
@media (min-width: 760px) {
  .cards { grid-template-columns: repeat(3, 1fr); align-items: start; }
  .card:nth-child(2) { margin-top: 3rem; }        /* 真ん中だけ下げて段差をつける */
}

.card {
  --card-color: var(--c-accent);
  --card-soft:  var(--c-tint);
  --card-pad-y: clamp(2.25rem, 3.5vw, 3rem);
  --card-pad-x: clamp(1.75rem, 3vw, 2.5rem);
  background: var(--c-white);
  padding: var(--card-pad-y) var(--card-pad-x);
  display: flex; flex-direction: column; align-items: flex-start;
  border-top: 4px solid var(--card-color);
  box-shadow: 0 14px 40px rgba(51, 48, 58, .07);
  transition: transform .35s ease, box-shadow .35s ease;
}
.card:nth-child(2) { --card-color: var(--c-deep);    --card-soft: var(--c-blue-soft); }
.card:nth-child(3) { --card-color: var(--c-mustard); --card-soft: var(--c-cream); }
.card:hover { transform: translateY(-6px); box-shadow: 0 22px 50px rgba(51, 48, 58, .11); }
.card__head { display: flex; flex-direction: column; align-items: flex-start; gap: 1.25rem; margin-bottom: 1.25rem; }
.card__num {
  display: grid; place-items: center;
  width: 3rem; height: 3rem; border-radius: 50%;
  background: var(--card-soft); color: var(--c-ink);
  font-family: var(--f-label); font-size: .9375rem; font-weight: 600; line-height: 1;
}
.card__title { font-size: clamp(1.35rem, 2.1vw, 1.7rem); margin: 0; }
.card__text { color: var(--c-ink-soft); font-size: 1rem; margin-bottom: 2rem; }
.card .link-more { margin-top: auto; }

/* ==========================================================================
   13. 引用（推薦文）
   ========================================================================== */
.quote { background: var(--c-deep); color: var(--c-ink); text-align: center; }
.quote blockquote::before {
  content: "“"; display: block; font-size: 3.4em; line-height: .42;
  color: var(--c-white); margin: 0 0 .06em;
}
.quote blockquote {
  margin: 0 auto; max-width: 22em;
  font-family: var(--f-display); font-weight: 500;
  font-size: clamp(1.6rem, 3.4vw, 2.5rem); line-height: 1.6;
}
.quote cite {
  display: block; margin-top: 1.75rem;
  font-family: var(--f-label); font-style: normal;
  font-size: .8125rem; font-weight: 600; letter-spacing: .16em; text-transform: uppercase;
}

/* ==========================================================================
   14. CTA 帯
   ========================================================================== */
/* ピンクの面を右端だけ切り、白を残す */
.cta-band {
  text-align: center;
  background:
    linear-gradient(var(--c-tint), var(--c-tint)) no-repeat left top / 90% 100%,
    var(--c-white);
}
.cta-band h2 { max-width: 20ch; margin-inline: auto; }
.cta-band p  { max-width: 36em; margin-inline: auto; color: var(--c-ink-soft); }
.cta-band .btn { margin-top: 2rem; }

/* ==========================================================================
   15. ニュースレター
   ========================================================================== */
.newsletter {
  display: grid; grid-template-columns: 1fr; align-items: center;
  gap: clamp(2.5rem, 5vw, 4rem);
  padding-block: var(--sec-y);
  background:
    linear-gradient(var(--c-cream), var(--c-cream)) no-repeat right bottom / 66% 80%,
    var(--c-white);
}
.newsletter__media {
  --frame-color: var(--c-deep);
  aspect-ratio: 1 / 1;
  margin-inline: var(--gutter) calc(var(--gutter) + var(--shift) + 2rem);
}
.newsletter__body { padding-inline: var(--gutter); }
.newsletter__body > * { max-width: 30em; }

.form-inline { display: flex; flex-wrap: wrap; gap: .75rem; margin-top: 1.75rem; }
.form-inline input[type="email"],
.form-inline input[type="text"],
.form-inline input[type="search"] {
  flex: 1 1 15rem;
  font-family: var(--f-body); font-size: 1rem;
  padding: 1.05rem 1.25rem;
  border: 1px solid var(--c-line); border-radius: var(--radius);
  background: #fff; color: var(--c-ink);
}
.form-inline input::placeholder { color: var(--c-ink-mute); }
.form-note { font-size: .8125rem; color: var(--c-ink-mute); margin-top: 1rem; }

@media (min-width: 900px) {
  .newsletter { grid-template-columns: 5fr 7fr; padding-inline: var(--edge); }
  .newsletter__media { margin: 0 calc(var(--shift) + 1rem) 0 0; aspect-ratio: 4 / 5; }
  .newsletter__body { padding-inline: clamp(1rem, 4vw, 4rem) 0; }
}

/* ==========================================================================
   16. 記事一覧・記事本文
   ========================================================================== */
.post-grid { display: grid; grid-template-columns: 1fr; gap: clamp(2rem, 4vw, 3.5rem); }
@media (min-width: 680px)  { .post-grid { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1000px) { .post-grid { grid-template-columns: repeat(3, 1fr); } }

.post-card__thumb {
  display: block; aspect-ratio: 4 / 3; overflow: hidden;
  background: linear-gradient(140deg, var(--c-tint), var(--c-cream));
  margin-bottom: 1.5rem;
}
.post-card__thumb img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s ease; }
.post-card:hover .post-card__thumb img { transform: scale(1.05); }
.post-card__meta {
  font-family: var(--f-label); font-size: .75rem; font-weight: 600;
  letter-spacing: .18em; text-transform: uppercase; color: var(--c-ink-mute);
  margin-bottom: .75rem;
}
.post-card__title { font-size: clamp(1.35rem, 2vw, 1.7rem); margin-bottom: .75rem; }
.post-card__excerpt { font-size: 1rem; color: var(--c-ink-soft); margin-bottom: 1.25rem; }

/* 単一記事 */
.entry-header { text-align: center; padding-block: clamp(3rem, 6vw, 5rem) 0; }
.entry-header .eyebrow { margin-bottom: 1rem; }
.entry-thumb { margin-block: clamp(2.5rem, 5vw, 4rem); }
.entry-thumb img { width: 100%; max-height: 640px; object-fit: cover; }

.entry-content { font-size: 1.125rem; line-height: 1.95; }
.entry-content > * { margin-inline: auto; max-width: var(--wrap-text); }
.entry-content h2 { margin-top: 2.5em; }
.entry-content h3 { margin-top: 2em; }
.entry-content a { color: var(--c-accent); border-bottom: 1px solid currentColor; }
.entry-content blockquote {
  border-left: 2px solid var(--c-accent);
  padding-left: 1.75rem; margin-block: 2.5rem;
  font-family: var(--f-display); font-size: 1.5rem; line-height: 1.5; color: var(--c-ink-soft);
}
.entry-content img, .entry-content figure { max-width: 100%; }
.entry-content ul, .entry-content ol { padding-left: 1.4em; }
.entry-content li { margin-bottom: .6em; }
.entry-content code {
  background: var(--c-cream); padding: .15em .45em; border-radius: 4px; font-size: .9em;
}
.entry-footer { margin-top: clamp(3rem, 5vw, 4.5rem); padding-top: 2rem; border-top: 1px solid var(--c-line); }

/* ページネーション */
.pagination { margin-top: clamp(3rem, 5vw, 4.5rem); text-align: center; }
.pagination .page-numbers {
  display: inline-block; min-width: 44px; padding: .65rem .5rem; margin: 0 .2rem;
  font-family: var(--f-label); font-size: .875rem; font-weight: 600; letter-spacing: .08em;
  border-radius: 999px;
}
.pagination .page-numbers.current { background: var(--c-accent); color: #fff; }

/* コメント */
.comments-area { margin-top: clamp(3rem, 6vw, 5rem); }
.comment-list { list-style: none; margin: 0; padding: 0; }
.comment-list li { border-top: 1px solid var(--c-line); padding-block: 1.75rem; }
.comment-form input[type="text"], .comment-form input[type="email"],
.comment-form input[type="url"], .comment-form textarea {
  width: 100%; font-family: var(--f-body); font-size: 1rem;
  padding: .9rem 1.25rem; border: 1px solid var(--c-line); border-radius: 8px; background: #fff;
}
.comment-form textarea { border-radius: 16px; }
.comment-form .submit { all: unset; }
.comment-form input[type="submit"] {
  background: var(--c-accent); color: #fff; border: 0; border-radius: var(--radius);
  font-family: var(--f-body); font-size: .8125rem; font-weight: 700;
  letter-spacing: .14em; text-transform: uppercase;
  padding: 1.15rem 2.5rem; cursor: pointer; width: auto;
}

/* ==========================================================================
   17. フッター
   ========================================================================== */
.site-footer { background: linear-gradient(var(--c-blue-soft), var(--c-blue-soft)) no-repeat right top / 80% 100%, var(--c-white); padding-block: clamp(3.5rem, 6vw, 5.5rem); text-align: center; }
.site-footer .site-brand__text { justify-content: center; margin-bottom: 2rem; }
.nav-footer ul {
  display: flex; flex-wrap: wrap; justify-content: center; gap: 1rem 2.25rem;
  list-style: none; margin: 0 0 2.25rem; padding: 0;
}
.nav-footer a {
  font-size: .75rem; font-weight: 700; letter-spacing: .18em; text-transform: uppercase;
}
.site-footer__copy { font-size: .75rem; letter-spacing: .06em; color: var(--c-ink-soft); margin: 0; }

/* ==========================================================================
   18. WordPress 標準クラス
   ========================================================================== */
.alignleft  { float: left;  margin: .5rem 1.75rem 1.25rem 0; }
.alignright { float: right; margin: .5rem 0 1.25rem 1.75rem; }
.aligncenter{ display: block; margin-inline: auto; }
.alignwide  { max-width: min(1100px, 100%) !important; }
.alignfull  { max-width: 100% !important; width: 100%; }
.wp-caption-text, .wp-element-caption {
  font-size: .8125rem; color: var(--c-ink-mute); text-align: center; margin-top: .75rem;
}
.sticky, .gallery-caption, .bypostauthor { /* テーマチェック用 */ }

/* ==========================================================================
   19. スクロール時のフェードイン
   ========================================================================== */
.reveal { opacity: 0; transform: translateY(28px); transition: opacity .8s ease, transform .8s ease; }
.reveal.is-visible { opacity: 1; transform: none; }

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .reveal { opacity: 1; transform: none; transition: none; }
  * { animation-duration: .01ms !important; transition-duration: .01ms !important; }
}

/* ==========================================================================
   20. ページ本文のブロック（About / Speaking / Coaching / Videos）
   ========================================================================== */
.entry-content > h2 { font-size: clamp(1.8rem, 3.6vw, 2.5rem); }
.entry-content > h2::after {
  content: ""; display: block; width: 44px; height: 3px; margin-top: .9rem;
  background: var(--c-accent); border-radius: 2px;
}
.entry-content .has-text-align-center::after,
.entry-content h2.has-text-align-center::after { margin-inline: auto; }
.entry-content .lead { font-size: 1.25rem; color: var(--c-ink-soft); }

/* ボタン */
.entry-content .wp-block-buttons { margin-block: 2rem; gap: .75rem; }
.entry-content .wp-block-button__link {
  display: inline-block;
  background: var(--c-accent); color: #fff;
  font-family: var(--f-body); font-size: .8125rem; font-weight: 700;
  letter-spacing: .1em; text-transform: uppercase; line-height: 1;
  padding: 1.1rem 2.25rem; border: 1px solid transparent; border-radius: var(--radius);
  transition: background-color .3s ease, color .3s ease;
}
.entry-content .wp-block-button__link::after { content: "→"; margin-left: .75em; }
.entry-content .wp-block-button__link:hover { background: var(--c-accent-dark); color: #fff; }
.entry-content .is-style-outline .wp-block-button__link { background: transparent; color: var(--c-ink); border-color: var(--c-ink); }
.entry-content .is-style-outline .wp-block-button__link:hover { background: var(--c-ink); color: #fff; }
.entry-content a.wp-block-button__link { border-bottom-width: 1px; }

/* 動画 */
.entry-content .wp-block-embed { margin-block: 0 1rem; }
.entry-content .wp-block-embed iframe { width: 100%; height: auto; aspect-ratio: 16 / 9; }
.entry-content .wp-block-embed figcaption { text-align: left; font-size: .9375rem; color: var(--c-ink); }
.entry-content .wp-block-columns { gap: clamp(1.5rem, 3vw, 2.5rem); margin-block: 2rem; }
.entry-content .wp-block-column > h3 { font-size: 1.45rem; margin: 1rem 0 .6rem; }
.entry-content .wp-block-column > p { color: var(--c-ink-soft); }   /* 本文と同じ大きさにする */

/* 色つきの囲み（非対称：左に色の線） */
.entry-content .wp-block-group.is-style-panel,
.entry-content .panel {
  background: var(--c-tint-soft);
  border-left: 4px solid var(--c-accent);
  padding: clamp(1.5rem, 4vw, 2.5rem);
  margin-block: 2.5rem;
}
.entry-content .panel--blue   { background: var(--c-blue-soft); border-left-color: var(--c-deep); }
.entry-content .panel--yellow { background: var(--c-cream);     border-left-color: var(--c-mustard); }
.entry-content .panel > :first-child { margin-top: 0; }
.entry-content .panel h3 { font-size: 1.4rem; }

/* 登壇・イベントの一覧 */
.entry-content .event {
  display: grid; grid-template-columns: 1fr; gap: .25rem 2rem;
  padding-block: 1.5rem; border-top: 1px solid var(--c-line);
}
.entry-content .event:last-of-type { border-bottom: 1px solid var(--c-line); }
.entry-content .event > * { margin: 0; }
.entry-content .event__date {
  font-family: var(--f-label); font-size: .8125rem; font-weight: 600;
  letter-spacing: .12em; text-transform: uppercase; color: var(--c-blue-ink);
}
.entry-content .event h3 { font-size: 1.35rem; margin: 0; }
.entry-content .event p:not(.event__date) { font-size: 1rem; color: var(--c-ink-soft); }
@media (min-width: 700px) {
  .entry-content .event { grid-template-columns: 11rem 1fr; }
  .entry-content .event__date { grid-row: span 2; padding-top: .35rem; }
}

/* 箇条書き：ピンクの点 */
.entry-content ul:not([class*="wp-block-social"]) { list-style: none; padding-left: 0; }
.entry-content ul:not([class*="wp-block-social"]) > li { position: relative; padding-left: 1.5rem; }
.entry-content ul:not([class*="wp-block-social"]) > li::before {
  content: ""; position: absolute; left: 0; top: .8em;
  width: 7px; height: 7px; border-radius: 50%; background: var(--c-accent);
}

/* Speaking ページ：縦長の登壇写真（後ろにピンクの色ブロックをずらして置く） */
.entry-content .speaking-photo { position: relative; isolation: isolate; margin: 0 var(--shift) var(--shift) 0; }
.entry-content .speaking-photo::before {
  content: ""; position: absolute; z-index: -1;
  inset: var(--shift) calc(var(--shift) * -1) calc(var(--shift) * -1) var(--shift);
  background: var(--c-accent);
}
.entry-content .speaking-photo img { width: 100%; aspect-ratio: 3 / 4; object-fit: cover; object-position: 50% 30%; }
.entry-content .invite { margin-block: 3rem; }
.entry-content .invite .panel { margin-block: 0; }

/* 下層ページ上部の写真：人物の顔が切れないよう上寄りに */
.entry-thumb img { object-position: 50% 30%; }


/* ==========================================================================
   追加: スローガン・引用の補足・CTA写真・ブログ サムネイル
   ========================================================================== */
.hero__slogan {
  font-family: var(--f-label); font-weight: 700; text-transform: uppercase;
  letter-spacing: .12em; font-size: 1rem; color: var(--c-ink); margin-top: 1.25rem;
}
.quote blockquote { font-weight: 700; }
.quote .quote__sub {
  margin: 1.25rem auto 0; max-width: 32em;
  font-family: var(--f-display); font-size: clamp(1.1rem, 2vw, 1.4rem); line-height: 1.7;
}
/* Substack のサムネイル（16:9）を切らずに全体表示する */
.post-card__thumb--video { aspect-ratio: 16 / 9; }
.post-card__thumb--video img { object-fit: contain; }
.post-card:hover .post-card__thumb--video img { transform: none; }
/* CTA 帯に写真を入れる場合 */
.cta-band--photo .wrap { display: grid; gap: 2rem; align-items: center; }
.cta-band__media img { width: 100%; height: auto; display: block; }
@media (min-width: 800px) {
  .cta-band--photo .wrap { grid-template-columns: 5fr 6fr; gap: clamp(2rem, 5vw, 4rem); }
  .cta-band--photo { text-align: left; }
  .cta-band--photo h2, .cta-band--photo p { margin-inline: 0; }
}
.hero__card .eyebrow { display: block; letter-spacing: .1em; }
.hero__card .eyebrow::before { display: none; }

/* ホームのスローガン強調・SNS・Health Coaching ページ・動画カード */
.hero__card .eyebrow { font-weight: 700; text-transform: uppercase; }
.hero__card .eyebrow .hl { color: var(--c-accent); }
.social-row { margin-top: clamp(2.5rem, 5vw, 3.5rem); text-align: center; }
.social-row__label {
  font-family: var(--f-label); font-size: .8125rem; font-weight: 600;
  letter-spacing: .16em; text-transform: uppercase; color: var(--c-ink-mute); margin-bottom: 1rem;
}
.social-row__list { list-style: none; margin: 0; padding: 0; display: flex; justify-content: center; gap: 1rem; }
.social-row__list a {
  display: grid; place-items: center; width: 48px; height: 48px; border-radius: 50%;
  background: var(--c-white); color: var(--c-ink); border: 1px solid var(--c-line);
  transition: background .2s, color .2s, border-color .2s;
}
.social-row__list a:hover { background: var(--c-accent); border-color: var(--c-accent); color: var(--c-white); }

/* Health Coaching: 写真とスローガンの間の余白をなくす */
.page-health-coaching .entry-thumb { margin-bottom: clamp(1rem, 2vw, 1.5rem); }
.page-health-coaching .entry-content { padding-top: 0 !important; }
.slogan-title {
  font-family: var(--f-display); font-weight: 700; color: var(--c-accent);
  font-size: clamp(2.25rem, 5.5vw, 3.75rem); line-height: 1.25; text-align: center;
  margin: 0 0 1.5rem; text-transform: none;
}
.label-pill {
  display: inline-block; background: var(--c-accent); color: var(--c-white);
  font-family: var(--f-label); font-weight: 600; font-size: .8125rem;
  letter-spacing: .16em; text-transform: uppercase; padding: .45em 1.1em; margin: 0 0 .75rem;
}

/* 動画ページ */
.video-card { margin: 0 0 1.5rem; }
.video-card figcaption { margin-top: .75rem; }
.video-card__title { display: block; font-weight: 700; line-height: 1.5; }
.video-card__views {
  display: block; margin-top: .2rem; font-family: var(--f-label); font-size: .8125rem;
  letter-spacing: .08em; color: var(--c-ink-mute);
}
/* 「Food Creates Your Future」は必ず1行に収める（折り返さず、画面幅に応じて縮める） */
.entry-content .slogan-title {
  font-size: min(4.25rem, 6.4vw); font-weight: 700; text-align: center;
  margin: 0 0 1.5rem; white-space: nowrap;
}
.entry-content .slogan-title::after, .entry-content .slogan-title::before { display: none; }
.video-card__embed { position: relative; aspect-ratio: 16 / 9; }
.video-card__embed iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
/* ラベルは上に余白、見出しとはぴったり近づける */
.entry-content .label-pill { margin: 3rem 0 0; }
.entry-content .label-pill + h2 { margin-top: .6rem; }

/* ヒーローの直後に自己紹介が来るときは、余白を詰める（「掲載実績の帯」を非表示にしたため） */
.hero:has(+ .split) { padding-bottom: clamp(1rem, 2vw, 1.5rem); }
.hero + .split { padding-top: clamp(2rem, 4vw, 3.5rem); }

/* Speaking & Events: 写真と本文の間の余白を詰める／縦型ショート動画 */
.page-speaking-events .entry-thumb { margin-bottom: clamp(1rem, 2vw, 1.5rem); }
.page-speaking-events .entry-content { padding-top: 0 !important; }
.video-short { max-width: 340px; aspect-ratio: 9 / 16; margin: 2rem auto; }
.video-short iframe { width: 100%; height: 100%; border: 0; display: block; }

/* About: 本の表紙 */
.book-panel { gap: clamp(1.25rem, 3vw, 2.5rem); }
.book-panel .book-cover { margin: 0; }
.book-panel .book-cover img { width: 100%; max-width: 240px; height: auto; display: block; margin-inline: auto; box-shadow: 0 10px 28px rgba(51, 48, 58, .22); }

/* About: 写真と本文の間の余白を詰める／本文中の写真 */
.page-about .entry-thumb { margin-bottom: clamp(1rem, 2vw, 1.5rem); }
.page-about .entry-content { padding-top: 0 !important; }
.entry-content .about-photo { margin: clamp(2.5rem, 5vw, 4rem) 0 0; }
.entry-content .about-photo img { width: 100%; height: auto; display: block; }

/* About: 「What I believe」の左に縦長の小さな写真 */
.believe-split { gap: clamp(1.5rem, 4vw, 3rem); align-items: flex-start; margin-top: clamp(2.5rem, 5vw, 4rem); }
.believe-split h2 { margin-top: 0; }
.entry-content .believe-split .about-photo { margin: 0; }
.entry-content .believe-split .about-photo img { aspect-ratio: 4 / 5; object-fit: cover; object-position: 45% 25%; }
@media (max-width: 781px) {
  .entry-content .believe-split .about-photo { max-width: 340px; }
}

/* About: 小見出しを太字に */
.entry-content .believe-split h3, .entry-content .book-panel h3 { font-weight: 700; }

/* ==========================================================================
   21. ページ上部の写真に重ねるロゴ（Life is Beautiful）
   ========================================================================== */
.entry-thumb__media { position: relative; display: block; }
.thumb-badge {
  position: absolute; top: clamp(.75rem, 2.5vw, 1.75rem); left: clamp(.75rem, 2.5vw, 1.75rem);
  display: flex; flex-direction: column; align-items: flex-start;
  gap: .6rem; max-width: min(62%, 17rem); text-align: left;
}
.entry-thumb .thumb-badge__logo {
  /* .entry-thumb img の width:100% / object-fit より優先させる */
  width: clamp(5rem, 9vw, 9rem); height: auto; max-height: none; object-fit: contain; display: block;
  box-shadow: 0 10px 28px rgba(51, 48, 58, .18);
}
.thumb-badge__text {
  background: rgba(255, 255, 255, .92);
  color: var(--c-ink);
  font-family: var(--f-label); font-size: clamp(.6875rem, 1.5vw, .8125rem);
  font-weight: 600; letter-spacing: .1em; text-transform: uppercase; line-height: 1.5;
  padding: .5rem .85rem;
}

/* スマホでは文字を写真の左下へ（ロゴは左上のまま）。顔や首にかからないようにする */
@media (max-width: 699px) {
  .thumb-badge { bottom: clamp(.75rem, 2.5vw, 1.75rem); justify-content: space-between; }
}

/* ラベルの横に添える注記（例：Coming soon for English speakers） */
.label-pill__note {
  display: inline-block;
  margin-left: .9em; padding-left: .9em;
  border-left: 1px solid rgba(255, 255, 255, .5);
  font-weight: 500; letter-spacing: .1em;
}
@media (max-width: 560px) {
  .label-pill__note { display: block; margin: .35em 0 0; padding: 0; border: 0; }
}

/* 動画の上の見出し */
.entry-content .video-title { font-size: 1.25rem; margin: 0 0 .9rem; }

/* ==========================================================================
   22. 問い合わせフォーム（Contact Form 7）
   ========================================================================== */
.entry-content .wpcf7 { margin-block: 2.5rem; }
.entry-content .cf7-field { margin-bottom: 1.5rem; }
.entry-content .cf7-field > label {   /* 項目名のみ。中のラジオのラベルには効かせない */
  display: block; margin-bottom: .5rem;
  font-family: var(--f-label); font-size: .8125rem; font-weight: 600;
  letter-spacing: .12em; text-transform: uppercase; color: var(--c-ink);
}
.entry-content .cf7-field > label .req { color: var(--c-accent); }
.entry-content .wpcf7 input[type="text"],
.entry-content .wpcf7 input[type="email"],
.entry-content .wpcf7 select,
.entry-content .wpcf7 textarea {
  width: 100%;
  font-family: var(--f-body); font-size: 1.0625rem; line-height: 1.6;
  color: var(--c-ink); background: var(--c-white);
  border: 1px solid var(--c-line); border-radius: var(--radius);
  padding: .9rem 1.1rem;
  transition: border-color .25s ease, box-shadow .25s ease;
}
.entry-content .wpcf7 select { appearance: none; background-image: none; }
.entry-content .wpcf7 textarea { resize: vertical; min-height: 10rem; }
.entry-content .wpcf7 input:focus,
.entry-content .wpcf7 select:focus,
.entry-content .wpcf7 textarea:focus {
  outline: none; border-color: var(--c-accent);
  box-shadow: 0 0 0 3px rgba(239, 121, 147, .18);
}
.entry-content .wpcf7 input[type="submit"] {
  background: var(--c-accent); color: var(--c-white);
  font-family: var(--f-body); font-size: .8125rem; font-weight: 700;
  letter-spacing: .1em; text-transform: uppercase; line-height: 1;
  padding: 1.1rem 2.25rem; border: 0; border-radius: var(--radius); cursor: pointer;
  transition: background-color .3s ease;
}
.entry-content .wpcf7 input[type="submit"]:hover { background: var(--c-accent-dark); }
.entry-content .wpcf7 .wpcf7-spinner { margin-left: .75rem; }

/* エラー・確認メッセージ */
.entry-content .wpcf7 .wpcf7-not-valid-tip {
  color: var(--c-accent-dark); font-size: .875rem; margin-top: .4rem;
}
.entry-content .wpcf7 .wpcf7-response-output {
  margin: 1.5rem 0 0; padding: 1rem 1.25rem;
  border: 0; border-left: 4px solid var(--c-deep);
  background: var(--c-blue-soft); font-size: 1rem;
}
.entry-content .wpcf7 form.invalid .wpcf7-response-output,
.entry-content .wpcf7 form.failed .wpcf7-response-output {
  border-left-color: var(--c-accent); background: var(--c-tint-soft);
}

/* 用件の選択：OS 任せのドロップダウンではなく、ブランド色のボタンで選ぶ */
.entry-content .wpcf7 .cf7-label {
  display: block; margin-bottom: .6rem;
  font-family: var(--f-label); font-size: .8125rem; font-weight: 600;
  letter-spacing: .12em; text-transform: uppercase; color: var(--c-ink);
}
.entry-content .wpcf7-radio { display: flex; flex-wrap: wrap; gap: .6rem; }
.entry-content .wpcf7-radio .wpcf7-list-item { margin: 0; }
.entry-content .wpcf7-radio label { display: block; position: relative; cursor: pointer; }
.entry-content .wpcf7-radio input[type="radio"] {
  position: absolute; inset: 0; width: 100%; height: 100%;
  margin: 0; opacity: 0; cursor: pointer;
}
.entry-content .wpcf7-radio .wpcf7-list-item-label {
  display: block;
  padding: .7rem 1.25rem;
  border: 1px solid var(--c-line); border-radius: var(--radius);
  background: var(--c-white); color: var(--c-ink-soft);
  font-size: .9375rem; line-height: 1.4;
  transition: background-color .25s ease, border-color .25s ease, color .25s ease;
}
.entry-content .wpcf7-radio label:hover .wpcf7-list-item-label {
  border-color: var(--c-accent); color: var(--c-ink);
}
.entry-content .wpcf7-radio input[type="radio"]:checked + .wpcf7-list-item-label {
  background: var(--c-accent); border-color: var(--c-accent); color: var(--c-white); font-weight: 600;
}
.entry-content .wpcf7-radio input[type="radio"]:focus-visible + .wpcf7-list-item-label {
  outline: 2px solid var(--c-deep); outline-offset: 2px;
}

/* イベントに添える写真・ショート動画 */
.entry-content .event__photo { margin: 1.5rem 0 0; }
.entry-content .event__photo img { width: 100%; height: auto; border-radius: var(--radius); }

/* ショート動画は必ず横並び（2本ぶんを等分） */
.entry-content .event__shorts {
  display: grid; grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: clamp(.6rem, 2vw, 1rem); margin-top: 1.5rem; max-width: 32rem;
}
.entry-content .event__shorts .video-short { max-width: none; width: 100%; margin: 0; }
.entry-content .event__shorts .video-short iframe { border-radius: var(--radius); }

/* 写真・動画は日付の列ではなく、見出しと本文と同じ列に置く */
@media (min-width: 700px) {
  .entry-content .event > .event__photo,
  .entry-content .event > .event__shorts { grid-column: 2; }
  .entry-content .event__photo img { max-width: 34rem; }
}

/* イベント内の外部リンク（例：登壇先のサイト） */
.entry-content .event__link { margin-top: 1rem; }
@media (min-width: 700px) { .entry-content .event > .event__link { grid-column: 2; } }

/* イベント名の横に添える言語表記（例：(in English)） */
.entry-content .event__lang {
  display: inline-block; margin-left: .4em;
  font-family: inherit; font-size: inherit; font-weight: 400;   /* イベント名と同じ大きさ */
  color: var(--c-ink-soft); white-space: nowrap;
}

/* 登壇テーマのタイトルはブランドのピンクで */
.entry-content .event .talk { color: var(--c-accent); }

/* スローガンの下のサブタイトルと、ikigai の一節 */
.entry-content .slogan-sub {
  margin: -.5rem 0 1.5rem; text-align: center;
  font-family: var(--f-display); font-size: clamp(1.1rem, 2.6vw, 1.6rem);
  font-weight: 600; letter-spacing: .08em; color: var(--c-deep);
}
.entry-content .ikigai-note {
  max-width: 34em; margin-inline: auto; text-align: center;
  font-family: var(--f-display); font-size: clamp(1.1rem, 2.2vw, 1.35rem);
  line-height: 1.9; color: var(--c-ink-soft);
}
.entry-content .ikigai-note em { font-style: italic; font-weight: 600; color: var(--c-deep); }

/* 動画の一覧（再生回数の多い順に自動表示） */
.entry-content .video-grid {
  display: grid; grid-template-columns: 1fr;
  gap: clamp(1.5rem, 3vw, 2.5rem);
  margin: 2rem auto;
  /* 本文幅（720px）ではなく、広い幅いっぱいに置いてサムネイルを大きく見せる */
  width: 100%; max-width: min(1100px, 100%);
}
@media (min-width: 620px) { .entry-content .video-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
/* 1行2本まで（3本だと1本が小さくなりすぎるため） */
.entry-content .video-grid .video-card { margin: 0; }

/* カード上部の写真（カードの端まで広げる） */
.card__media {
  margin: calc(var(--card-pad-y) * -1) calc(var(--card-pad-x) * -1) clamp(1.5rem, 2.5vw, 2rem);
  aspect-ratio: 4 / 3; overflow: hidden; background: var(--c-tint-soft);
}
.card__media img { width: 100%; height: 100%; object-fit: cover; display: block; }

/* YouTube のサムネイルは 16:9。4:3 の枠に収め、余りはカードの色で埋める */
.card__media--video {
  display: grid; place-items: center;
  background: var(--card-soft);
  padding: clamp(.6rem, 1.5vw, 1rem);
}
.card__media--video img {
  height: auto; max-height: 100%; object-fit: contain;
  box-shadow: 0 6px 18px rgba(51, 48, 58, .12);
}

/* ==========================================================================
   23. セクション同士の余白の調整（上下の余白が二重になる箇所を詰める）
   ========================================================================== */
/* 固定ページ：見出しの帯のすぐ下から本文を始める */
.entry-content--page { padding-block: clamp(1.5rem, 3vw, 2.5rem) var(--sec-y); }

/* SNSアイコンで終わるセクションは、下の余白を詰める */
.section:has(> .wrap > .social-row) { padding-bottom: clamp(2rem, 3.5vw, 3rem); }

/* ニュースレターは上の余白を詰める（前のセクションの下余白と重なるため） */
.newsletter { padding-top: clamp(2rem, 4vw, 3.5rem); }

/* 引用セクション：上下の余白を詰める */
.quote { padding-block: clamp(2.5rem, 5vw, 4rem); }

/* SNSアイコンで終わるセクションの次は、上の余白を詰める */
.section:has(> .wrap > .social-row) + .section { padding-top: clamp(2rem, 4vw, 3.5rem); }

/* CTA帯の次に来るセクションは、上の余白を詰める */
.cta-band + .section { padding-top: clamp(2rem, 4vw, 3.5rem); }

/* トップページの最後の CTA 帯：フッターの水色とくっつかないよう、間に白を残す */
.newsletter + .cta-band { margin-bottom: clamp(2.5rem, 5vw, 4rem); }

/* ニュースレターの直前のセクションは、下の余白を詰める */
.section:has(+ .newsletter) { padding-bottom: clamp(2rem, 4vw, 3.5rem); }

/* ニュースレターの黄色い面は下端まで届かせず、フッターとの間に白を残す */
.newsletter {
  background:
    linear-gradient(var(--c-cream), var(--c-cream)) no-repeat right bottom 3rem / 66% 72%,
    var(--c-white);
  padding-bottom: clamp(3.5rem, 7vw, 6rem);
}

/* フッターの法的ページへのリンク */
.site-footer__legal {
  display: flex; justify-content: center; flex-wrap: wrap; gap: .4rem .9rem;
  margin: 0 0 .75rem; font-size: .8125rem; letter-spacing: .04em;
}
.site-footer__legal a { color: var(--c-ink-soft); }
.site-footer__legal a:hover { color: var(--c-accent); }
.site-footer__legal span { color: var(--c-ink-mute); }

/* 利用規約・プライバシーポリシーのページ */
.entry-content .legal-updated { font-size: .875rem; color: var(--c-ink-mute); }
.entry-content .legal-contact { line-height: 1.9; }

/* 問い合わせフォームの下の同意文 */
.entry-content .cf7-consent { font-size: .875rem; color: var(--c-ink-soft); margin-top: 1rem; }

/* イベントの写真を2枚並べる（同じ比率で揃える） */
.entry-content .event__photos {
  display: grid; grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: clamp(.6rem, 2vw, 1rem); margin-top: 1.5rem; max-width: 34rem;
}
.entry-content .event__photos .wp-block-image { margin: 0; }
.entry-content .event__photos img {
  width: 100%; aspect-ratio: 4 / 3; object-fit: cover; border-radius: var(--radius); display: block;
}
@media (min-width: 700px) { .entry-content .event > .event__photos { grid-column: 2; } }

/* イベントの写真の下の説明文 */
.entry-content .event p.event__caption { margin-top: .6rem; font-size: .8125rem; font-weight: 700; color: var(--c-ink-mute); }
@media (min-width: 700px) { .entry-content .event > .event__caption { grid-column: 2; } }

/* 登壇・イベント：ピン留めした項目（一覧の一番上に置く、いちばん見てほしいもの） */
.entry-content .event--pinned {
  background: var(--c-tint-soft);
  padding-inline: clamp(1rem, 3vw, 1.5rem);
  border-top-color: transparent;
}
.entry-content .event--pinned + .event--pinned { margin-top: .75rem; }
.entry-content .event--pinned + .event:not(.event--pinned) { margin-top: 1.5rem; }
/* 日付の前に画鋲のアイコン（Material Symbols「push_pin」） */
.entry-content .event--pinned .event__date::before {
  content: ""; display: inline-block;
  width: 1.15rem; height: 1.15rem; margin-right: .45rem; vertical-align: -.25em;
  background: var(--c-accent);
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M16 9V4h1c.55 0 1-.45 1-1s-.45-1-1-1H7c-.55 0-1 .45-1 1s.45 1 1 1h1v5c0 1.66-1.34 3-3 3v2h5.97v7l1 1 1-1v-7H19v-2c-1.66 0-3-1.34-3-3z'/%3E%3C/svg%3E") center / contain no-repeat;
          mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M16 9V4h1c.55 0 1-.45 1-1s-.45-1-1-1H7c-.55 0-1 .45-1 1s.45 1 1 1h1v5c0 1.66-1.34 3-3 3v2h5.97v7l1 1 1-1v-7H19v-2c-1.66 0-3-1.34-3-3z'/%3E%3C/svg%3E") center / contain no-repeat;
  transform: rotate(30deg);
}

/* ページの最後が「Invite me to speak」のときは、フッターとの間の白を詰める */
.entry-content > .invite:last-child { margin-bottom: 0; }
.entry-content--page:has(> .invite:last-child) { padding-bottom: clamp(2.5rem, 5vw, 4rem); }

/* Substack の記事に写真がないときのカード：クリーム地に色ブロックを左に寄せ、右に白を残す */
.post-card__thumb--brand {
  position: relative;
  --brand-block: var(--c-tint); --brand-accent: var(--c-accent); --brand-ink: var(--c-accent-dark);
  background:
    linear-gradient(var(--brand-block), var(--brand-block)) no-repeat left top / 72% 100%,
    var(--c-white);
  box-shadow: inset 0 0 0 1px var(--c-line);
}
.post-card__thumb--blue   { --brand-block: var(--c-blue-soft); --brand-accent: var(--c-deep);    --brand-ink: var(--c-blue-ink); }
.post-card__thumb--yellow { --brand-block: var(--c-cream);     --brand-accent: var(--c-mustard); --brand-ink: var(--c-ink-soft); }
.post-card__brand {
  position: absolute; inset: 0 28% 0 0;
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: .9rem;
  text-align: center;
}
/* 色ブロックの右端に、テーマカラーの細い帯 */
.post-card__brand::after {
  content: ""; position: absolute; top: 18%; bottom: 18%; right: -3px; width: 6px;
  background: var(--brand-accent);
}
.post-card__brand-name {
  font-family: var(--f-display); font-weight: 600; font-size: clamp(1.15rem, 1.8vw, 1.5rem);
  letter-spacing: .14em; text-transform: uppercase; color: var(--c-ink); line-height: 1;
}
.post-card__brand-label {
  font-family: var(--f-label); font-size: .7rem; font-weight: 600;
  letter-spacing: .3em; text-transform: uppercase; color: var(--brand-ink);
  padding-top: .9rem; border-top: 1px solid var(--brand-accent);
}
.post-card:hover .post-card__thumb--brand .post-card__brand { transform: translateY(-2px); transition: transform .4s ease; }