/* ============================================================
   style-new.css ／ 目次（INDEX）
   ============================================================
   ▼ 共通基盤
   §00  変数・トークン                       :root（フォント／トップ色／紙面・カード／余白トークン）
   §01  body / .page-home / main             ベース＋共通紙面幅セレクタ列
   §02  メイン共通                            main section / h2（下層中心）
   ▼ ヘッダー
   §10  下層ページ用ヘッダー                  body:not(.page-home) header …
   §11  旧トップヘッダー                      （削除済み：.hero-site-header 系）
   §12  TOPページ用ヘッダー                   .page-home .home-hero .header（※実体は §20 付近：HERO 内に配置）
   ▼ HERO（TOPページ）
   §20  HERO 単一ソース                       .page-home main section.hero.home-hero
   §21  HERO テキスト                       .hero-inner / .hero-text
   §22  HERO 旧構成                           （削除済み：.hero-pc / .hero-sp / .home-hero-container 系）
   ▼ TOP 共通レイアウト
   §30  コンテナ／バンド／グリッド            .home-container / .home-band / .home-card-grid
   ▼ TOP セクション群（index-new.html の流れに沿った見出し）
   §39  （削除済み：FIND YOUR STORY / .home-find-story）
   §40  ② GO FORTH 特集                        .home-go-forth（§40 GO FORTH：最終・他帯とセレクタ非併記）
   §41  ③ BACK STORY 記事帯                   .home-backstory-strip（旧 EMOTION／問題提起の枠を転用）
   §41b ④ DOG CARE 実用棚【最終】            .home-dogcare（5列×2段・§41b 末尾）
   §42  （削除済み：.home-backstory 思想ブロック）
   §43  ⑥ RECRUIT                             .home-recruit
   §44  ⑦ EDITOR'S PICKS                      .home-picks（チャコール・3カラム）
   §45  Footer                               .site-footer（下層）／.footer-home-*（トップ白系）
   §46  共通装飾                              .section-eyebrow
   ▼ 旧トップ／下層用（残置）
   §50  旧トップ：イントロ                    （削除済み：.intro-section / .intro-*）
   §51  共通カード                            .story-card / .thumb 等（stories.html 等）
   §52  旧トップ：reality                     （削除済み）
   §53  旧トップ：jobs                        （削除済み）
   §54  旧トップ：EDITOR PICKS                （削除済み）
   §55  旧フッター記述                        → §45 へ統合済み（本文は削除、目次のみ）
   §56  記事ページ                            .article-* / .related-* / .breadcrumb / .stories-archive
   §58  ABOUT（完成版）                       .page-about / .about-*（about.html）
   §59  RECRUIT（完成版）                     .page-recruit / .recruit-*（recruit.html）
   §60  CONTACT（完成版）                     .page-contact / .contact-*（about/contact.html）※EP一覧は別ブロック
   §60a PRIVACY（完成版）                    .page-privacy / .privacy-*（about/privacy-policy.html）
   §60  EDITOR'S PICKS 一覧（完成版）         .page-editors-picks / .ep-*（editors-picks.html）
   §60b 5ページ共通コンテンツ幅（PC）         ABOUT/PRIVACY/CONTACT/RECRUIT/EP一覧のみ・76%
   §61  EDITOR'S PICKS 記事                  .page-editors-picks-article / .ep-article-*
   ▼ メディアクエリ（トップ調整の要）
   §90  @media (max-width: 980px)            HERO／トップ HEADER のみ
   §91  @media (max-width: 768px)            RECRUIT・PICKS・カテゴリバー・記事帯・フッター等
   §99  末尾                                  （旧 .hero-line 等削除済み）
   ============================================================
   ※ ファイル内の並びは「カスケード優先」で厳密には目次と一致しません。
     例：§90 が §30 より前にある／§12 HEADER が §20 HERO ブロックの後に続く 等。
   ※ HOME PC/SP の現行カスケード（特に §90・§91 の上書き）は完成表示の正。短縮・統合しない。
   ※ HTML に存在しないセレクタと、コメントアウト済みの未参照変数のみ整理済み。
   ※ 現行トップで必須：.home-container / .home-band / .page-home / カード共通 / スライダー／§90・§91。
   ▼ 保護ゾーン（第1段階整理ラベル — 削除・統合・移動禁止）
   §01b  紙面幅・ガター基準セレクタ列
   §12   .page-home .home-hero .header-inner（padding-right 含む）
   §20   HERO ::before / ::after
   §21   .hero-inner / .hero-text transform
   §30   .page-home .home-container
   §39   （削除済み：FIND YOUR STORY）
   §40+  GO FORTH 以降 .home-container / .home-band
   §90   @media (max-width: 980px) ヘッダー SP 化
   §91   @media (max-width: 768px) HERO/SP 上書き＋SP コンテナグループ
   ============================================================ */

/* §00 ─────── 変数・トークン ─────── */
/* 全体：Noto Serif JP ベース（style-new を読む全ページ） */
:root {
  /* --- フォント（全ページ） --- */
  --font-page-serif: "Noto Serif JP", "Shippori Mincho", "Yu Mincho", YuMincho,
    "Hiragino Mincho ProN", serif;
  --font-page-sans: var(--font-page-serif);
  /* STORIES カード：カテゴリ・日付などメタ行（本文扱い・サンセリフ） */
  --font-story-meta: "Noto Sans JP", "Hiragino Sans", "Hiragino Kaku Gothic ProN",
    "Yu Gothic", YuGothic, Meiryo, sans-serif;

  /* --- ヘッダーロゴ変数（下層互換・トップは PNG .logo-img） --- */
  --font-logo-name: "Work Sans", "IBM Plex Sans", "Helvetica Neue", "Arial", sans-serif;
  --font-logo-eyebrow: "Work Sans", "IBM Plex Sans", "Noto Sans JP", sans-serif;
  --font-logo-name-weight: 600;
  --font-logo-name-tracking: 0.045em;
  --font-logo-name-shadow: 0 1px 16px rgba(0, 0, 0, 0.22);
  --font-logo-eyebrow-weight: 400;
  --font-logo-eyebrow-tracking: 0.46em;
  --font-logo-eyebrow-color: rgba(255, 255, 255, 0.6);

  /* --- トップ：セクション背景色・アクセント --- */
  --home-student-feature-bg: #f7f4ee;
  /* --- §39–§40 編集帯：共通紙面背景 #ebe8e1 --- */
  --home-article-strip-bg: #ffffff;
  --home-go-forth-bg: #ffffff;
  /* §40 GO FORTH 見出しアクセント（背景は白統一） */
  --home-go-forth-shelf-accent: rgba(12, 10, 8, 0.06);
  /* GO FORTH 見出し：編集赤（#8f3a32） */
  --home-go-forth-accent-red-bg: #8f3a32;
  --home-go-forth-accent-red-text: #8f3a32;
  --home-go-forth-accent-red-muted: rgba(143, 58, 50, 0.92);
  --home-go-forth-accent-red-line: rgba(143, 58, 50, 0.38);
  --home-backstory-strip-bg: #ffffff;
  --home-dogcare-bg: #ffffff;
  --home-editorial-paper: var(--home-article-strip-bg); /* 後方互換 */

  --home-recruit-bg: #e6e0dc;
  /* 夜の入口（FOOTER #060504 よりわずかに浅いチャコール） */
  --home-editor-picks-bg: #121212;
  /* ヒーロー緊張・求人アクセント（ワイン系） */
  --home-accent: #8f2d3b;
  --home-accent-hover: #74252f;
  --home-gap: clamp(20px, 2vw, 28px);
  --home-section-y: clamp(80px, 7vw, 120px);

  /* --- 編集LP：紙面幅・ガター（読み物寄り・LP感を抑える共通幅＝1530px） --- */
  --home-editorial-max: 1530px;
  --home-editorial-gutter: clamp(49px, 4.65vw, 85px);
  /* HOME本文：右余白の視覚微調整（ヘッダー／フッターは対象外） */
  --home-body-right-trim: 4px;
  --home-editorial-card-ratio: 5 / 3;
  --home-editorial-card-gap: clamp(12px, 1.05vw, 18px);
  --home-editorial-section-y: clamp(32px, 3.6vw, 48px);
  --home-editorial-section-y-tight: clamp(20px, 2.2vw, 28px);
  --home-editorial-heading-card: clamp(6px, calc(2.5vw - 20px), 16px);
  /* §40.1b 編集ラベル型見出し（棚の入口） */
  --home-editorial-label-size: clamp(13px, 0.52vw + 10px, 17px);
  --home-editorial-label-tracking: 0.42em;
  --home-editorial-accent-w: 5px;
  --home-editorial-head-gap: clamp(13px, 1.15vw, 18px);
  --home-editorial-copy-gap: clamp(6px, 0.55vw, 9px);
  --home-editorial-subcopy-indent: calc(
    var(--home-editorial-accent-w, 5px) + var(--home-editorial-head-gap, clamp(13px, 1.15vw, 18px))
  );
  --home-editorial-accent-h: calc(var(--home-editorial-label-size, clamp(13px, 0.52vw + 10px, 17px)) * 1.15);
  --home-editorial-title-outdent: var(--home-editorial-subcopy-indent);
  /* 英字ラベル上余白（PICKS 見出し＝RECRUIT テキスト上端で統一） */
  --home-editorial-label-top-band: clamp(52px, 5.6vw, 68px);
  --home-editorial-label-top-head: clamp(16px, 1.75vw, 24px);
  --home-editorial-label-top-total: calc(
    var(--home-editorial-label-top-band) + var(--home-editorial-label-top-head)
  );
  /* 日本語タイトル：5帯 .section-lead 共通（PC・SP・HERO 下第2階層） */
  --home-editorial-title-size: clamp(25px, calc(1.512vw + 19px), 35px);
  --home-editorial-title-size-strong: clamp(25px, calc(1.512vw + 19px), 35px);
  --home-editorial-title-size-sp: clamp(19px, calc(4.383vw + 6.85px), 24px);
  --home-editorial-title-size-strong-sp: clamp(19px, calc(4.383vw + 6.85px), 24px);
  --home-go-forth-label: var(--home-go-forth-accent-red-text, #8f3a32);
  --home-backstory-label: #b89428;
  --home-dogcare-label: #5a8589;
  /* RECRUIT：落ち着いたローズブラウン（写真上でも識別できる暖色） */
  --home-recruit-label: #c9a090;
  --home-recruit-accent: #c9a090;
  /* PICKS：チャコール上のシャンパングレー（編集後記・RECRUITより中性） */
  --home-picks-label: #c4b8a8;
  --home-picks-accent: #c4b8a8;

  /* --- §40 記事帯3セクション：英字 eyebrow（帯別） --- */
  --home-go-forth-eyebrow-green: #b6911f;
  --home-backstory-eyebrow-brown: #7a6a56;
  --home-dogcare-eyebrow-blue: #4f7f83;

  /* --- §40 記事帯3セクション：右 CTA「すべての〜を見る」 --- */
  --home-article-strip-heading-link-color: #5f5a47;
  --home-article-strip-heading-link-hover: #b6911f;

  /* --- §40 記事帯3セクション：カード編集タグ .home-feature-badge（帯別） --- */
  --home-feature-badge-bg: #d4ad1f;
  --home-feature-badge-border: #b99312;
  --home-backstory-badge-bg: #8e5a45;
  --home-backstory-badge-border: #744634;
  --home-dogcare-badge-bg: #4f7780;
  --home-dogcare-badge-border: #3d6068;

  --home-recruit-eyebrow-pink: #c8b0b6;
  --home-recruit-cta-pink: rgba(158, 118, 126, 0.84);
  --home-recruit-cta-pink-hover: rgba(145, 106, 116, 0.92);
  --home-recruit-cta-border: rgba(255, 250, 246, 0.22);
  --home-recruit-visual-ratio: 1800 / 380;
  --home-recruit-visual-ratio-sp: 5 / 2;
  --home-picks-eyebrow-light: #c9b8a8;
  --home-editorial-card-caption-bg: #ebe6e2;

  /* --- 英字 eyebrow タイポ（複数セクション共通） --- */
  --home-editorial-eyebrow-size: clamp(15px, 0.62vw + 11px, 17px);
  --home-editorial-eyebrow-font: "Jost", "Work Sans", "IBM Plex Sans", "Helvetica Neue", Arial, sans-serif;
  --home-editorial-eyebrow-weight: 600;
  --home-editorial-eyebrow-tracking: 0.32em;

  /* --- 縦余白トークン（.home-band 既定／§42 思想ブロック用 deep） --- */
  --home-section-pt: clamp(80px, 7vw, 120px);
  --home-section-pb: clamp(80px, 7vw, 120px);
  --home-section-pt--deep: clamp(120px, 12vw, 200px);
  --home-section-pb--deep: clamp(120px, 12vw, 200px);
}

/* ===== Home: Base（§01） ===== */
/* §01 ─────── body / .page-home / main ベース ─────── */
body {
  margin: 0;
  font-family: var(--font-page-serif);
  font-weight: 300;
  font-size: 17px;
  line-height: 1.8;
  font-optical-sizing: auto;
}

.page-home {
  overflow-x: hidden;
  font-family: var(--font-page-serif);
  font-weight: 300;
  font-size: 17px;
  line-height: 1.8;
  font-optical-sizing: auto;
}

.page-home main {
  background-color: transparent;
}

/* トップ：セクション背景は画面幅いっぱい、中身のみ max-width で中央へ */
.page-home main > section {
  width: 100%;
  max-width: none;
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

/* ⚠ PROTECTED — §01b トップ共通・紙面幅・ガター基準（削除・統合・移動禁止）
   全セクション inner の max-width / padding-left / padding-right をここで一元定義。
   トークン：--home-editorial-max（1530px）／--home-editorial-gutter（clamp 49–85px）
   整理時：セレクタ列の分割・他ブロックへの統合は PC レイアウト崩れの原因になるため禁止。 */
.page-home .home-hero .header-inner,
.page-home .home-hero .hero-inner,
.page-home .home-container,
.home-go-forth .home-container,
.home-backstory-strip .home-container,
.home-dogcare .home-container,
.home-recruit-inner,
.home-picks .home-container {
  max-width: var(--home-editorial-max);
  padding-left: var(--home-editorial-gutter);
  padding-right: var(--home-editorial-gutter);
  box-sizing: border-box;
}

/* §50/§52/§53/§54 削除に伴い、旧 .page-home .section-inner /
   .page-home section.reality .section-inner も使用箇所が消滅したため削除済み。 */

/* §10 ─────── 下層ページ用ヘッダー ─────── */
/* ヘッダー：下層は白帯／トップはヒーロー画像上に統合 */
body:not(.page-home) header {
  border-bottom: 1px solid #ddd;
  background: #fff;
}

body:not(.page-home) .header-inner {
  max-width: 1000px;
  margin: 0 auto;
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 20px;
}

body:not(.page-home) .logo a {
  font-weight: 500;
  letter-spacing: 0.06em;
  text-decoration: none;
  color: #1a1816;
}

body:not(.page-home) .nav-list {
  display: flex;
  list-style: none;
  gap: 20px;
  margin: 0;
  padding: 0;
}

body:not(.page-home) .nav-list a {
  text-decoration: none;
  color: #1a1816;
  font-weight: 400;
  font-size: 13px;
  letter-spacing: 0.06em;
}

body:not(.page-home) .cta a {
  display: inline-block;
  text-decoration: none;
  border: 1px solid #2a2623;
  padding: 8px 16px;
  color: #2a2623;
  font-size: 13px;
  font-weight: 500;
  letter-spacing: 0.08em;
  transition: background 0.2s ease, color 0.2s ease;
}

body:not(.page-home) .cta a:hover {
  background: #2a2623;
  color: #faf8f5;
}

.visually-hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

/* §02 ─────── メイン共通（main section / h2）／主に下層ページ ─────── */
/* トップ各セクションは .page-home main > section で max-width:none 等を上書き済み */
/* メイン：セクション共通 */
main section {
  max-width: 1000px;
  margin: 0 auto;
  padding: 80px clamp(24px, 5vw, 40px);
  box-sizing: border-box;
}

h2 {
  font-size: clamp(29px, 2.85vw + 12px, 31px);
}

/* 下層 HERO 用（トップ .home-hero は §21 の .hero-title が優先） */
.page-home main section.hero:not(.home-hero) h1 {
  margin: 0;
  padding: 0;
  border: none;
  font-family: var(--font-page-serif);
  font-size: clamp(62px, 4.6vw + 16px, 70px);
  line-height: 1.2;
  font-weight: 600;
  letter-spacing: 0.03em;
  color: #ffffff;
  text-shadow: 0 2px 12px rgba(0, 0, 0, 0.25);
  font-feature-settings: "palt" 1;
}

/* §20 ─────── HERO 単一ソース（.page-home main section.hero.home-hero） ─────── */
/* ⚠ PROTECTED — HERO 背景レイヤー（::before ベージュグラデ／::after 写真）— 削除・統合禁止
   z-index 0=写真 / 1=オーバーレイ / 2=テキスト。filter は ::after のみ（コピー汚染防止）。 */
.page-home main section.hero.home-hero {
  position: relative;
  max-width: none;
  margin: 0;
  width: 100%;
  padding: 0;
  /* 編集LPヒーロー：ファーストビュー密度（横長すぎない高さ） */
  min-height: min(82vh, 860px);
  /* 写真は ::after に分離（filter がコピーに乗らないよう） */
  background-color: #ffffff;
  color: rgba(255, 255, 255, 0.96);
  overflow: hidden;
  box-sizing: border-box;
}

.page-home main section.hero.home-hero::before {
  content: "";
  position: absolute;
  inset: 0;
  /* PC：左＝コピー可読（強め）→中央で減衰→右＝写真質感（ほぼなし）。境界線なし */
  background: linear-gradient(
    to right,
    rgba(250, 246, 240, 0.97) 0%,
    rgba(250, 246, 240, 0.9) 8%,
    rgba(249, 245, 238, 0.74) 16%,
    rgba(248, 243, 236, 0.4) 28%,
    rgba(247, 242, 234, 0.12) 40%,
    rgba(246, 241, 233, 0.02) 50%,
    transparent 58%
  );
  z-index: 1;
  pointer-events: none;
}

.page-home main section.hero.home-hero::after {
  content: "";
  position: absolute;
  inset: 0;
  background-image: url("assets/img/home/hero-008.jpg");
  /* PC：coverだと縦方向の余白がなく動けないため、わずかに拡大して右下へ大きく寄せる */
  background-size: auto 126%;
  /* PC：横のみ。%下げ=画面上は右へ（56→50：目視で分かる小さめの右寄せ） */
  background-position: 50% 0%;
  background-repeat: no-repeat;
  /* 全面フィルムなし（左右差は ::before の横グラデのみ） */
  filter: none;
  z-index: 0;
  pointer-events: none;
}

/* HERO 直下はカテゴリーバー（§39）を挟むため、旧 .hero + .home-go-forth の負マージンは未使用 */

/* §12 ─────── TOPページ用ヘッダー（.page-home .home-hero .header） ─────── */
/* ⚠ PROTECTED — .page-home .home-hero .header-inner（削除・統合禁止）
   §01b でガター取得後、padding-right のみ追加微調整（ロゴ右端と紙面端のバランス）。
   この padding-right 行を削除・§01b へ統合すると PC ロゴ位置がずれる。 */
.page-home .home-hero .header {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  padding: 38px 0 24px;
  min-height: 108px;
  box-sizing: border-box;
  z-index: 10;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

.page-home .home-hero .header-inner {
  margin: 0 auto;
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 32px;
  padding-right: calc(var(--home-editorial-gutter) + clamp(8px, 0.55vw, 14px));
}

/* 採用ロゴ：assets/img/logo/logo-988.png */
.page-home .home-hero .logo {
  flex: 0 0 auto;
  margin-top: 0;
  line-height: 0;
}

.page-home .home-hero .logo-img {
  display: block;
  height: clamp(82px, 3.55vw + 65px, 91px);
  width: auto;
  aspect-ratio: 663 / 200;
  object-fit: contain;
  object-position: left center;
  transform: translateY(-2px);
  filter: drop-shadow(0 1px 8px rgba(0, 0, 0, 0.08));
  opacity: 0.82;
  -webkit-user-drag: none;
  user-select: none;
}

.page-home .home-hero .nav {
  display: flex;
  align-items: center;
  gap: clamp(28px, 2.2vw, 40px);
  margin-top: 16px;
}

/* PCではアクション（検索・メニュー）アイコンは非表示 */
.page-home .home-hero .header-actions {
  display: none;
}

.page-home .home-hero .logo,
.page-home .home-hero .nav {
  position: static;
  top: auto;
  transform: none;
}

.page-home .home-hero .nav a {
  color: #222;
  text-decoration: none;
  font-family: var(--font-story-meta, var(--font-page-serif));
  font-size: clamp(15px, 0.42vw + 13px, 16px);
  font-weight: 600;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  white-space: nowrap;
  transition: color 0.22s ease, opacity 0.22s ease;
}

.page-home .home-hero .nav a:hover {
  color: #111;
  opacity: 1;
}

/* §21 ─────── HERO テキスト（.hero-inner / .hero-text） ─────── */
/* ⚠ PROTECTED — .page-home .home-hero .hero-inner（削除・統合禁止）
   §01b ガター + flex-end 配置。PC コピー左軸の基準ブロック。 */
.page-home .home-hero .hero-inner {
  position: relative;
  z-index: 2;
  margin: 0 auto;
  padding-top: clamp(48px, 6vh, 72px);
  padding-bottom: clamp(48px, 7vh, 80px);
  height: 100%;
  min-height: inherit;
  display: flex;
  justify-content: flex-start;
  align-items: flex-end;
}

/* ⚠ PROTECTED — .hero-text transform（削除・統合禁止／横軸のみ意図的に±調整可）
   HOME PC HERO 画面高対応 完成版。
   高さ900px超：translate(-4px, calc(0.4vh - 148px))。
   幅981px以上かつ高さ900px以下：直後の指定 translate(-4px, calc(545px - 75vh))。
   横は左へ4px。§91 SP で Y=0 に上書き。 */
.page-home .home-hero .hero-text {
  max-width: min(700px, 50vw);
  text-align: left;
  z-index: 2;
  position: relative;
  margin-top: 0;
  margin-right: 0;
  /* 空気調整：コピー塊全体を上げ、FVの圧と視線の入りを強める（左軸は維持） */
  transform: translate(-4px, calc(0.4vh - 148px));
  transform-origin: left bottom;
}

/* HOME PC HERO 画面高対応 完成版。コピー上端を header 下端の20px下に保つ。 */
@media (min-width: 981px) and (max-height: 900px) {
  .page-home .home-hero .hero-text {
    transform: translate(-4px, calc(545px - 75vh));
  }
}

.page-home .home-hero .hero-eyebrow {
  margin: 0 0 16px;
  font-family: var(--font-story-meta, var(--font-page-serif));
  /* テーマ導入：存在感は残しつつ見出しへ自然に馴染む */
  font-size: clamp(18px, 0.72vw + 14px, 20px);
  font-weight: 500;
  letter-spacing: 0.3em;
  text-transform: uppercase;
  color: #222;
}

.page-home .home-hero .hero-title,
.page-home main section.hero.home-hero h1.hero-title {
  margin: 0;
  font-family: var(--font-page-serif);
  font-size: calc(clamp(42px, 4vw + 15px, 60px) * 1.065);
  line-height: 1.32;
  font-weight: 600;
  letter-spacing: 0.02em;
  color: rgba(12, 10, 8, 0.9);
  text-shadow: none;
  font-feature-settings: "palt" 1;
}

.page-home .home-hero .hero-title span {
  display: block;
}

/* 改行を span で分けた場合も同トーン（単一行 h1 でも害なし） */
.page-home .home-hero .hero-title span:first-child,
.page-home .home-hero .hero-title span:last-child {
  font-size: inherit;
  font-weight: 600;
  color: rgba(12, 10, 8, 0.9);
  white-space: normal;
  letter-spacing: 0.02em;
}

.page-home .home-hero .hero-lead {
  margin: 22px 0 0;
  max-width: 645px;
  font-family: var(--font-story-meta, var(--font-page-serif));
  font-size: calc(clamp(15px, 1vw + 11.5px, 17px) * 1.025);
  line-height: 1.98;
  color: rgba(12, 10, 8, 0.65);
  letter-spacing: 0.06em;
  font-weight: 400;
}

.page-home .home-hero .hero-lead-break {
  display: inline;
}

.page-home .home-hero .hero-lead-break-pc {
  display: block;
}

.page-home .home-hero .hero-lead-break-sp {
  display: none;
}

/* HERO：編集導線 CTA（サイトアクセントと連動） */
.page-home .home-hero .hero-cta {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin-top: 20px;
  padding: 9px 18px 9px 16px;
  border-radius: 4px;
  background: transparent;
  color: rgba(18, 15, 12, 0.9);
  text-decoration: none;
  font-family: var(--font-story-meta, var(--font-page-serif));
  font-size: calc(11px * 1.025);
  font-weight: 500;
  letter-spacing: 0.1em;
  border: 0.85px solid rgba(12, 10, 8, 0.24);
  box-shadow: none;
  transition: background 0.25s ease, transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease, color 0.25s ease;
}

.page-home .home-hero .hero-cta:hover {
  background: transparent;
  color: #111;
  border-color: rgba(12, 10, 8, 0.34);
  transform: translateY(-1px);
  box-shadow: none;
}

/* HERO：右下の手書きタグライン（写真になじむ控え目な一言。見出し扱いにしない） */
.page-home .home-hero .hero-go-forth {
  position: absolute;
  right: clamp(28px, 2.8vw, 48px);
  bottom: calc(clamp(28px, 2.6vw, 44px) - 15px);
  z-index: 2;
  margin: 0;
  padding: 0;
  pointer-events: none;
  font-family: "Nothing You Could Do", cursive;
  font-size: 25.2px;
  font-weight: 400;
  line-height: 1.15;
  letter-spacing: 0.03em;
  text-transform: none;
  color: rgba(255, 252, 248, 0.56);
  text-shadow: 0 1px 10px rgba(18, 14, 10, 0.28);
  transform: scaleY(1.08);
  transform-origin: right bottom;
}

/* ===== Home: SP ≤980px — Hero / Header only（§90） ===== */
/* §90 ─────── @media (max-width: 980px)：トップ HEADER ＋ HERO のみ（記事帯・フッター等は §91） ─────── */
@media (max-width: 980px) {
  .page-home .home-hero .header {
    padding: 16px 18px 12px;
    min-height: 64px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
  }

  .page-home .home-hero .header-inner {
    flex-wrap: nowrap;
    row-gap: 0;
    padding-left: 0;
    padding-right: 0;
    align-items: center;
    gap: 14px;
  }

  .page-home .home-hero .logo {
    margin-top: 0;
  }

  .page-home .home-hero .logo-img {
    height: clamp(38px, 4.5vw + 28px, 45px);
    transform: translateY(2px);
    filter: drop-shadow(0 1px 6px rgba(0, 0, 0, 0.12));
  }

  /* SPはサイト内ナビを非表示にして、検索/メニューのアイコン操作に */
  .page-home .home-hero .nav {
    display: none;
  }

  .page-home .home-hero .header-actions {
    display: flex;
    margin-left: auto;
    align-items: center;
    gap: 10px;
  }

  .page-home .home-hero .header-icon {
    width: 38px;
    height: 38px;
    padding: 0;
    border: 1px solid rgba(255, 255, 255, 0.22);
    background: transparent;
    border-radius: 50%;
    color: #fff;
    cursor: pointer;
    position: relative;
  }

  .page-home .home-hero .header-icon--search span {
    position: absolute;
    inset: 0;
    margin: auto;
    width: 12px;
    height: 12px;
    border: 1.5px solid rgba(255, 255, 255, 0.85);
    border-radius: 50%;
    transform: translate(-2px, -2px);
  }

  .page-home .home-hero .header-icon--search::after {
    content: "";
    position: absolute;
    right: 10px;
    bottom: 10px;
    width: 7px;
    height: 1.5px;
    background: rgba(255, 255, 255, 0.85);
    transform: rotate(45deg);
    transform-origin: left center;
  }

  .page-home .home-hero .header-icon--menu {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 4px;
  }

  .page-home .home-hero .header-icon--menu span {
    display: block;
    width: 14px;
    height: 1.5px;
    background: rgba(255, 255, 255, 0.85);
  }

  .page-home .home-hero .hero-inner {
    max-width: 100%;
    padding: clamp(104px, 23vw, 140px) 22px clamp(72px, 15vw, 100px);
    justify-content: flex-start;
    align-items: flex-start;
    height: auto;
    min-height: 0;
  }

  .page-home .home-hero .hero-text {
    margin-right: 0;
    max-width: min(100%, 32rem);
    transform: translate(-4px, calc(8px - 70px));
    transform-origin: left top;
  }

  .page-home .home-hero .hero-title {
    font-size: clamp(28px, 6.5vw + 10px, 44px);
    letter-spacing: 0.02em;
  }

  .page-home .home-hero .hero-title span:first-child {
    white-space: normal;
  }

  .page-home .home-hero .hero-lead {
    font-size: 13px;
    line-height: 1.95;
    margin-top: 18px;
  }

  .page-home .home-hero .hero-cta {
    margin-top: 22px;
    padding: 12px 22px;
    font-size: 11px;
  }

  .page-home .home-hero .hero-scroll {
    bottom: 18px;
  }

  .page-home .home-hero .hero-scroll-line {
    height: 26px;
  }
}

/* ===== Home: Layout — container / band / card grid（§30） ===== */
/* ⚠ PROTECTED — .page-home .home-container（削除・統合禁止）
   §01b と同トークンで紙面幅を補完。GO FORTH 以降各セクションの inner 基準。 */
/* .home-container は幅100%＋中央寄せ。max-width／ガターは §01b 列と同トークン（詳細度差で補完）。 */
.home-container {
  width: 100%;
  max-width: var(--home-editorial-max);
  margin-left: auto;
  margin-right: auto;
  padding-left: var(--home-editorial-gutter);
  padding-right: var(--home-editorial-gutter);
  box-sizing: border-box;
}

/* 各 .home-*.home-band で個別上書きするまでの縦余白の既定値 */
.home-band {
  padding-top: var(--home-section-pt);
  padding-bottom: var(--home-section-pb);
}

/* TOP PAGE — コンテンツセクション一覧（index-new.html 並び順の目安）
   ① .home-go-forth ② .home-backstory-strip ③ .home-dogcare
   ④ .home-recruit ⑤ .home-picks ⑥ .site-footer.home-footer
   ※黒背景 .home-backstory は HTML / CSS とも削除済み。
   ※ FIND YOUR STORY（.home-find-story）は HTML / CSS とも削除済み。 */

/* ===== Home: GO FORTH（特集）／Back Story／Dog Care（§40） ===== */
/* §40 ─ 記事帯（.home-backstory-strip / .home-dogcare ＋ GO FORTH は §40 GO FORTH：最終）
 *
 * 【色・CTA トークン一覧】→ :root
 *   背景         --home-article-strip-bg（帯共通 #ebe8e1）
 *   英字 eyebrow   --home-go-forth-eyebrow-green / --home-backstory-eyebrow-brown / --home-dogcare-eyebrow-blue
 *   右 CTA リンク  --home-article-strip-heading-link-color / -hover
 *   カード編集タグ --home-feature-badge-* / --home-backstory-badge-* / --home-dogcare-badge-*
 *
 * 【カスケード】index-new.html（.page-home）
 *   英字 eyebrow  → §40.1b（タイポ＋帯別 color）【最終】
 *   h2 日本語     → §40.1b（PICKS 同一タイポ）【最終】／§40.2 は下層・非 page-home 向け
 *   右 CTA リンク → §40.1b（サイズ・padding 含む）【最終】／§40.2 は下層向け
 *   カード編集タグ → §40.3b（レイアウト §40.3 共通 + 帯別色）【最終】
 *
 * ▼ 構成マップ
 *   §40.1   （BACK STORY / DOG CARE の帯背景・padding → §41 / §41b【最終】）
 *           .home-go-forth 帯色は §40 GO FORTH：最終
 *   §40 GO FORTH：最終  特集棚一式（調整はここ）
 *   §40.1b  BACK STORY / DOG CARE 見出し・白箱カード
 *   §40.2   見出しレイアウト基底（非 .page-home）
 *   §40.3   カード本体（BACK STORY / DOG CARE）
 *   §40.5   カルーセル共通
 *   §40.6   ページャ
 *   §40.7   .home-card 汎用
 *
 * ▼ .thumb 上書き順（記事帯カード）
 *   [a] §51 .thumb { height:0; padding-bottom:62% }
 *   [b] §40.7 .page-home .home-card .thumb { aspect-ratio:3/2 }
 *   [c] §40.3 …card .thumb { aspect-ratio:5/3 } ← 最終
 *
 * ▼ SP：§91 @media (max-width:768px)「Home: Article strips SP」
 * ====================================================================== */


/* ⚠ PROTECTED — GO FORTH 以降 .home-container / .home-band（削除・統合禁止）
   各記事帯の padding-top/bottom・margin-top 負値は §40.1 / §40 GO FORTH：最終 / §41 / §41b に分散。
   帯単位の統合や .home-band 既定値への一本化は GO FORTH 見出し・カード幅崩れの原因。 */
/* ────────────────────────────────────────────────────────────
   §40.1  base / band / コンテナ
   BACK STORY / DOG CARE の background・.home-band padding は
   index-new（.page-home）では §41 / §41b が最終。旧 beige 指定は削除済み。
   ──────────────────────────────────────────────────────────── */

/* ────────────────────────────────────────────────────────────
   §40.1a  GO FORTH → §40 GO FORTH：最終 へ統合（帯・見出し・カードは下記ブロック）
   ──────────────────────────────────────────────────────────── */

/* ────────────────────────────────────────────────────────────
   §40.1b  見出し・eyebrow・heading-link・カードキャプション（.page-home）【最終】
   ※ index-new では本ブロックが §40.2 より優先。色は :root トークン参照。
   ──────────────────────────────────────────────────────────── */

/* 見出しブロック余白 — GO FORTH / BACK STORY STRIP / DOG CARE 共通（§40 GO FORTH：最終） */

/* --- カード写真トーン（BACK STORY / DOG CARE。GO FORTH は §40 GO FORTH：最終） --- */
.page-home .home-backstory-strip-card .thumb img,
.page-home .home-dogcare-card .thumb img {
  filter: contrast(1.05) saturate(0.98) brightness(0.93);
}

/* --- カード本文エリア（白箱・BACK STORY / DOG CARE 用） --- */
.page-home .home-backstory-strip .home-backstory-strip-card .story-card-text,
.page-home .home-dogcare .home-dogcare-card .story-card-text {
  padding: clamp(6px, 0.55vw, 9px) clamp(16px, 1.1vw, 20px) clamp(9px, 0.75vw, 12px);
  margin-top: 0;
  gap: clamp(5px, 0.5vw, 7px);
  border-radius: 0;
  background-color: #fdfcfb;
  background-image: none;
  flex: 1 1 auto;
  min-height: clamp(84px, 6.5vw, 100px);
}

/* §40.1 見出しラッパー … 第3-3で §40.1b へ集約済み（旧 .home-backstory-strip-heading / .home-dogcare-heading 削除） */

/* ────────────────────────────────────────────────────────────
   §40.3  カード本体（BACK STORY / DOG CARE。GO FORTH は §40 GO FORTH：最終）
       .home-backstory-strip-card.story-card / .home-dogcare-card.story-card
       .home-backstory-strip-card .thumb::before / ::after
       .home-feature-badge（§40.3b 画像上・編集タグ）
       .home-backstory-strip-card .story-card-text / .home-dogcare-card .story-card-text
       .story-card-text .story-title（記事帯／DOG CARE）
       .home-backstory-strip-byline / .home-dogcare-byline
   ──────────────────────────────────────────────────────────── */
/* 共通 .story-card の「白箱＋枠＋強い影」（BACK STORY / DOG CARE のみ） */
.page-home .home-backstory-strip .home-backstory-strip-card.story-card,
.page-home .home-dogcare .home-dogcare-card.story-card {
  width: auto;
  max-width: none;
  background: #fdfcfb;
  border: 1px solid rgba(42, 36, 30, 0.09);
  box-shadow: 0 2px 12px rgba(42, 34, 28, 0.06);
  padding-bottom: 0;
  border-radius: 8px;
  overflow: hidden;
}

.page-home .home-backstory-strip .home-backstory-strip-card.story-card:hover,
.page-home .home-dogcare .home-dogcare-card.story-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 6px 18px rgba(42, 34, 28, 0.1);
}

.home-backstory-strip-card,
.home-dogcare-card {
  position: relative;
  background: #fdfcfb;
  border: 1px solid rgba(42, 36, 30, 0.09);
  border-radius: 8px;
  overflow: hidden;
  box-shadow: 0 2px 12px rgba(42, 34, 28, 0.06);
  display: flex;
  flex-direction: column;
  height: 100%;
  color: inherit;
  text-decoration: none;
  box-sizing: border-box;
}

/* thumb：§51 旧ハック無効化 + aspect-ratio（BACK STORY / DOG CARE） */
.page-home .home-backstory-strip .home-backstory-strip-card .thumb,
.page-home .home-dogcare .home-dogcare-card .thumb {
  position: relative;
  overflow: hidden;
  margin-bottom: 0;
  height: auto;
  padding-bottom: 0;
  aspect-ratio: var(--home-editorial-card-ratio);
  border-radius: 0;
  box-shadow: none;
}

/* 画像下：ごく薄いグラデ（BACK STORY / DOG CARE） */
.page-home .home-backstory-strip-card .thumb::before,
.page-home .home-dogcare-card .thumb::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  background: linear-gradient(
    180deg,
    transparent 52%,
    rgba(8, 6, 5, 0.22) 78%,
    rgba(8, 6, 5, 0.42) 100%
  );
}

.page-home .home-backstory-strip-card .thumb::after,
.page-home .home-dogcare-card .thumb::after {
  display: none;
}

.page-home .home-backstory-strip-card .thumb img,
.page-home .home-dogcare-card .thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* §40.3b 【最終】カード編集タグ .home-feature-badge
 *   レイアウト：3帯共通（下記ブロック）
 *   帯別 color：:root --home-*-badge-bg / -border → 各セレクタで上書き
 * ─────────────────────────────────────────────────────────── */
.page-home .home-backstory-strip-card .thumb .home-feature-badge,
.page-home .home-dogcare-card .thumb .home-feature-badge {
  position: absolute;
  left: clamp(12px, 1.1vw, 16px);
  bottom: clamp(12px, 1.1vw, 16px);
  z-index: 2;
  display: inline-block;
  margin: 0;
  max-width: calc(100% - clamp(56px, 5vw, 72px));
  padding: 4px 10px;
  border: 1px solid transparent;
  border-radius: 4px;
  color: #ffffff;
  font-family: var(--font-story-meta, var(--font-page-serif));
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.08em;
  line-height: 1.35;
  text-shadow: none;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}

.page-home .home-backstory-strip-card .thumb .home-feature-badge {
  background: var(--home-backstory-badge-bg, #8e5a45);
  border-color: var(--home-backstory-badge-border, #744634);
}

.page-home .home-dogcare-card .thumb .home-feature-badge {
  background: var(--home-dogcare-badge-bg, #4f7780);
  border-color: var(--home-dogcare-badge-border, #3d6068);
}

/* 文章エリア：flex 骨格（BACK STORY / DOG CARE。GO FORTH は §40 GO FORTH：最終） */
.home-backstory-strip-card .story-card-text,
.home-dogcare-card .story-card-text {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: stretch;
  padding: 0;
  min-height: 0;
  flex: 1 1 auto;
  box-sizing: border-box;
  background: transparent;
  gap: clamp(8px, 0.65vw, 10px);
}

.page-home .home-backstory-strip .home-backstory-strip-card .story-card-text .story-title,
.page-home .home-dogcare .home-dogcare-card .story-card-text .story-title {
  margin: 0;
  padding: 0;
  position: static;
  font-family: var(--font-page-serif);
  font-size: clamp(15px, 0.48vw + 13px, 18px);
  font-weight: 700;
  line-height: 1.38;
  letter-spacing: 0.02em;
  color: rgba(16, 12, 9, 0.94);
  font-feature-settings: "palt" 1;
  text-shadow: none;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/* 職種・名前（BACK STORY / DOG CARE） */
.page-home .home-backstory-strip .home-backstory-strip-byline,
.page-home .home-dogcare .home-dogcare-byline {
  margin: 0;
  font-family: var(--font-story-meta, var(--font-page-serif));
  font-size: clamp(11.5px, 0.32vw + 10px, 12.5px);
  font-weight: 500;
  line-height: 1.5;
  letter-spacing: 0.03em;
  color: rgba(40, 34, 30, 0.58);
}

/* ────────────────────────────────────────────────────────────
   §40.4  共通カード系（GO FORTH 専用ではない・残置／移動禁止）
       .page-home .home-main .story-card             ← .story-card 全般のベース
       .home-card-grid / .home-card-grid--4          ← グリッドのベース（GO FORTH は flex で上書き）
   注意：GO FORTH 内で flex 化（§40.5）され grid-template-columns は無効化されている。
        他セクションのカード一覧でも参照されるため、ここに残置。
   ──────────────────────────────────────────────────────────── */
.page-home .home-main .story-card {
  width: 100%;
  max-width: none;
  flex: initial;
}

.home-card-grid {
  display: grid;
  gap: var(--home-gap);
  margin: 0;
}

.home-card-grid--4 {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}


/* ────────────────────────────────────────────────────────────
   §40.5  スライダー（carousel / viewport / track / arrows）— BACK STORY
   ※ GO FORTH は §40 GO FORTH：最終
   ──────────────────────────────────────────────────────────── */
.home-backstory-strip-carousel {
  position: relative;
  --home-go-forth-gap: var(--home-editorial-card-gap);
}

.home-backstory-strip-viewport {
  overflow: hidden;
}

.home-backstory-strip .home-card-grid--4 {
  display: flex;
  flex-wrap: nowrap;
  gap: var(--home-go-forth-gap);
  transition: transform 0.4s ease;
  will-change: transform;
}

/* BACK STORY カルーセル矢印 — §41 で GO FORTH 同一仕様 */

/* ============================================================
   §40 GO FORTH：最終 — 特集棚（.page-home .home-go-forth）
   帯 / 編集見出し / カルーセル / カードシェル / テキスト（タイトル＋下部情報）
   ※ 微調整は --home-go-forth-* 変数と本ブロックのみ編集（§40.3 白箱系と分離済み）
   ============================================================ */

/* --- 帯 --- */
.page-home .home-go-forth {
  background-color: var(--home-go-forth-bg, #ffffff);
  border-top: 1px solid var(--home-go-forth-shelf-accent, rgba(12, 10, 8, 0.06));
}

.page-home .home-go-forth.home-band {
  padding-top: clamp(3px, 0.55vw, 6px);
  padding-bottom: clamp(14px, 1.2vw, 20px);
}

/* --- カルーセル --- */
.page-home .home-go-forth .home-go-forth-carousel {
  --home-go-forth-gap: clamp(8px, 0.65vw, 12px);
  --home-go-forth-main-ratio: 0.4; /* 2/5 — 主役（2 : 1 : 1 : 1） */
  --home-go-forth-sub-ratio: calc((1 - var(--home-go-forth-main-ratio)) / 3); /* 1/5 × 3枚 */
  /* 主役 thumb 高さ：基準 1.75/1 から +20% 後、さらに +10%（幅は不変）→ 1.2 × 1.1 = 1.32 */
  --home-go-forth-main-thumb-aspect-w: 1.75;
  --home-go-forth-main-thumb-aspect-h: 1.32;
  position: relative;
  margin-top: 0;
  padding-right: clamp(8px, 0.75vw, 14px);
}

.page-home .home-go-forth .home-go-forth-viewport {
  overflow: hidden;
}

.page-home .home-go-forth .home-go-forth-track,
.page-home .home-go-forth .home-card-grid--4.home-go-forth-track,
.page-home .home-go-forth #home-go-forth-track {
  display: flex;
  flex-wrap: nowrap;
  align-items: stretch;
  height: auto;
  gap: var(--home-go-forth-gap, 8px);
  grid-template-columns: none;
  transition: transform 0.4s ease;
  will-change: transform;
}

/* カルーセル矢印（GO FORTH）— 2本線の山形 */
.page-home .home-go-forth .home-go-forth-prev,
.page-home .home-go-forth .home-go-forth-next {
  --home-go-forth-arrow-w: 52px;
  --home-go-forth-arrow-line: 38px;
  --home-go-forth-arrow-color: #ececec;
  position: absolute;
  z-index: 4;
  top: 50%;
  transform: translateY(-50%);
  width: var(--home-go-forth-arrow-w);
  height: var(--home-go-forth-arrow-w);
  padding: 0;
  margin: 0;
  border: none;
  border-radius: 0;
  background: none;
  box-shadow: none;
  color: transparent;
  font-size: 0;
  line-height: 0;
  cursor: pointer;
  overflow: visible;
}

.page-home .home-go-forth .home-go-forth-prev {
  display: none;
  left: 24px;
  right: auto;
  transform: translateY(-50%) scaleX(-1);
}

.page-home .home-go-forth .home-go-forth-prev.is-visible {
  display: block;
}

.page-home .home-go-forth .home-go-forth-next {
  right: 24px;
}

.page-home .home-go-forth .home-go-forth-prev::before,
.page-home .home-go-forth .home-go-forth-prev::after,
.page-home .home-go-forth .home-go-forth-next::before,
.page-home .home-go-forth .home-go-forth-next::after {
  content: "";
  position: absolute;
  top: 50%;
  right: 0;
  width: var(--home-go-forth-arrow-line);
  height: 6px;
  background: var(--home-go-forth-arrow-color, #ececec);
  border: none;
  border-radius: 999px;
  transform-origin: 100% 50%;
}

.page-home .home-go-forth .home-go-forth-prev::before,
.page-home .home-go-forth .home-go-forth-next::before {
  transform: translate3d(0, calc(-50% + 2px), 0) rotate(54deg) scale(1.1);
}

.page-home .home-go-forth .home-go-forth-prev::after,
.page-home .home-go-forth .home-go-forth-next::after {
  transform: translate3d(0, calc(-50% - 2px), 0) rotate(-54deg) scale(1.1);
}

/* --- カードシェル（画像全面・白文字） --- */
.page-home .home-go-forth .home-go-forth-card,
.page-home .home-go-forth .home-go-forth-card.story-card {
  position: relative;
  display: block;
  width: auto;
  max-width: none;
  height: auto;
  padding: 0;
  background: #12100e;
  border: none;
  border-radius: 6px;
  box-shadow: 0 1px 8px rgba(12, 10, 8, 0.05);
  color: #fff;
  text-decoration: none;
  transition: box-shadow 0.22s ease, transform 0.22s ease;
}

.page-home .home-go-forth .home-go-forth-card:first-child {
  box-shadow: 0 2px 14px rgba(12, 10, 8, 0.09);
}

.page-home .home-go-forth .home-go-forth-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 22px rgba(12, 10, 8, 0.14);
}

.page-home .home-go-forth .home-go-forth-card:first-child:hover {
  box-shadow: 0 10px 26px rgba(12, 10, 8, 0.16);
}

.page-home .home-go-forth .home-go-forth-card::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;
  border-radius: inherit;
  background: linear-gradient(
    180deg,
    transparent 0%,
    transparent 50%,
    rgba(6, 5, 4, 0.12) 66%,
    rgba(6, 5, 4, 0.38) 80%,
    rgba(6, 5, 4, 0.74) 90%,
    rgba(6, 5, 4, 0.9) 100%
  );
}

.page-home .home-go-forth .home-go-forth-card:first-child::after {
  background: linear-gradient(
    180deg,
    transparent 0%,
    transparent 62%,
    rgba(6, 5, 4, 0.06) 78%,
    rgba(6, 5, 4, 0.18) 90%,
    rgba(6, 5, 4, 0.32) 100%
  );
}

.page-home .home-go-forth .home-go-forth-card:not(:first-child)::after {
  background: linear-gradient(
    180deg,
    transparent 0%,
    transparent 52%,
    rgba(6, 5, 4, 0.1) 68%,
    rgba(6, 5, 4, 0.34) 82%,
    rgba(6, 5, 4, 0.7) 94%,
    rgba(6, 5, 4, 0.86) 100%
  );
}

/* メイン：横長ビジュアルで行の高さを決定 */
.page-home .home-go-forth .home-go-forth-card:first-child .thumb {
  position: relative;
  display: block;
  width: 100%;
  height: auto;
  margin: 0;
  padding-bottom: 0;
  aspect-ratio: var(--home-go-forth-main-thumb-aspect-w, 1.75) / var(--home-go-forth-main-thumb-aspect-h, 1.32);
}

/* サブ：行高に合わせて画像フルブリード（主役と同じ高さ） */
.page-home .home-go-forth .home-go-forth-card:not(:first-child) {
  align-self: stretch;
  min-height: 0;
}

.page-home .home-go-forth .home-go-forth-card:not(:first-child) .thumb {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  margin: 0;
  padding-bottom: 0;
  aspect-ratio: auto;
}

.page-home .home-go-forth .home-go-forth-card .thumb {
  overflow: hidden;
  border-radius: 0;
  box-shadow: none;
  height: auto;
  padding-bottom: 0;
  background: transparent;
}

.page-home .home-go-forth .home-go-forth-card .thumb::before {
  z-index: 1;
  background: linear-gradient(
    180deg,
    transparent 0%,
    transparent 40%,
    rgba(0, 0, 0, 0.14) 56%,
    rgba(0, 0, 0, 0.48) 76%,
    rgba(0, 0, 0, 0.84) 100%
  );
}

.page-home .home-go-forth .home-go-forth-card:first-child .thumb::before {
  background: linear-gradient(
    180deg,
    transparent 0%,
    transparent 58%,
    rgba(0, 0, 0, 0.08) 74%,
    rgba(0, 0, 0, 0.22) 88%,
    rgba(0, 0, 0, 0.38) 100%
  );
}

.page-home .home-go-forth .home-go-forth-card:not(:first-child) .thumb::before {
  background: linear-gradient(
    180deg,
    transparent 0%,
    transparent 46%,
    rgba(0, 0, 0, 0.12) 62%,
    rgba(0, 0, 0, 0.42) 80%,
    rgba(0, 0, 0, 0.8) 100%
  );
}

.page-home .home-go-forth .home-go-forth-card .thumb::after {
  display: none;
}

.page-home .home-go-forth .home-go-forth-card .thumb img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  filter: contrast(1.05) saturate(0.87) brightness(0.84);
  transition: filter 0.35s ease, transform 0.45s ease;
}

.page-home .home-go-forth .home-go-forth-card:first-child .thumb img {
  filter: contrast(1.06) saturate(0.87) brightness(0.86);
}

.page-home .home-go-forth .home-go-forth-card:not(:first-child) .thumb img {
  filter: contrast(1.05) saturate(0.87) brightness(0.85);
}

.page-home .home-go-forth .home-go-forth-card:hover .thumb img {
  filter: contrast(1.08) saturate(0.86) brightness(0.84);
  transform: scale(1.02);
}

.page-home .home-go-forth .home-go-forth-card:first-child:hover .thumb img {
  filter: contrast(1.08) saturate(0.86) brightness(0.88);
}

.page-home .home-go-forth .home-go-forth-card .card-cta,
.page-home .home-go-forth .home-go-forth-card .thumb .home-feature-badge {
  display: none;
}

/* --- カードテキスト：タイトル（上固定）＋下部情報（下端固定） --- */
.page-home .home-go-forth .home-go-forth-card {
  --home-go-forth-text-pad-x: clamp(10px, 0.78vw, 12px);
  --home-go-forth-foot-bottom: clamp(10px, 0.78vw, 12px);
  --home-go-forth-foot-h: clamp(34px, 2.35vw, 40px);
  --home-go-forth-foot-rule-pad: 0.34em;
  --home-go-forth-title-top: calc(52% + clamp(12px, 1.1vw, 18px) + 10px);
  --home-go-forth-title-foot-gap: 12px;
  --home-go-forth-title-block-width: 68%;
  --home-go-forth-title-size-main: clamp(19px, 0.95vw + 13px, 26px);
  --home-go-forth-title-size-sub: clamp(15px, 0.48vw + 13px, 19px);
  --home-go-forth-title-line: 1.41;
  --home-go-forth-title-color-main: rgba(255, 255, 255, 0.92);
  --home-go-forth-title-color-sub: rgba(255, 255, 255, 0.9);
  --home-go-forth-title-weight-main: 575;
  --home-go-forth-title-weight-sub: 550;
}

.page-home .home-go-forth .home-go-forth-card:first-child {
  --home-go-forth-text-pad-x: clamp(13px, 1vw, 17px);
}

.page-home .home-go-forth .home-go-forth-card .card-text,
.page-home .home-go-forth .home-go-forth-card .card-body,
.page-home .home-go-forth .home-go-forth-card .story-card-text,
.page-home .home-go-forth .home-go-forth-card .story-card-text.card-body {
  position: absolute;
  inset: 0;
  z-index: 3;
  display: block;
  flex: none;
  margin: 0;
  padding: 0;
  min-height: 0;
  max-height: none;
  height: auto;
  gap: 0;
  border-radius: 0;
  background: transparent;
  background-color: transparent;
  background-image: none;
  pointer-events: none;
}

.page-home .home-go-forth .home-go-forth-card .card-text::before,
.page-home .home-go-forth .home-go-forth-card .card-body::before,
.page-home .home-go-forth .home-go-forth-card .story-card-text.card-body::before {
  display: none;
}

.page-home .home-go-forth .home-go-forth-card:first-child .card-text::before,
.page-home .home-go-forth .home-go-forth-card:first-child .card-body::before,
.page-home .home-go-forth .home-go-forth-card:first-child .story-card-text.card-body::before {
  display: block;
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 72%;
  z-index: -1;
  pointer-events: none;
  border-radius: 0 0 6px 6px;
  background: linear-gradient(
    180deg,
    transparent 0%,
    rgba(6, 5, 4, 0.12) 28%,
    rgba(6, 5, 4, 0.52) 58%,
    rgba(6, 5, 4, 0.82) 82%,
    rgba(6, 5, 4, 0.94) 100%
  );
}

/* タイトルブロック：カード上からの固定位置（行数で下部が押されない） */
.page-home .home-go-forth .home-go-forth-card .card-text-title {
  position: absolute;
  top: var(--home-go-forth-title-top);
  left: var(--home-go-forth-text-pad-x);
  right: auto;
  width: var(--home-go-forth-title-block-width, 68%);
  max-width: var(--home-go-forth-title-block-width, 68%);
  bottom: calc(
    var(--home-go-forth-foot-bottom) + var(--home-go-forth-foot-h) + var(--home-go-forth-title-foot-gap)
  );
  margin: 0;
  padding: 0;
  overflow: hidden;
}

.page-home .home-go-forth .home-go-forth-card .card-title,
.page-home .home-go-forth .home-go-forth-card .story-card-text .story-title {
  position: static;
  margin: 0;
  padding: 0;
  width: 100%;
  max-width: 100%;
  font-family: var(--font-page-serif);
  font-weight: 700;
  color: var(--home-go-forth-title-color-main, rgba(255, 255, 255, 0.92));
  letter-spacing: 0.02em;
  text-shadow:
    0 1px 3px rgba(0, 0, 0, 0.45),
    0 2px 8px rgba(0, 0, 0, 0.32);
  display: -webkit-box;
  -webkit-box-orient: vertical;
  overflow: hidden;
  -webkit-line-clamp: 3;
  line-clamp: 3;
}

.page-home .home-go-forth .home-go-forth-card:first-child .card-title,
.page-home .home-go-forth .home-go-forth-card:first-child .story-card-text .story-title {
  max-width: 100%;
  font-size: var(--home-go-forth-title-size-main, clamp(19px, 0.95vw + 13px, 26px));
  font-weight: var(--home-go-forth-title-weight-main, 575);
  color: var(--home-go-forth-title-color-main, rgba(255, 255, 255, 0.92));
  line-height: var(--home-go-forth-title-line, 1.41);
  -webkit-line-clamp: 3;
  line-clamp: 3;
}

.page-home .home-go-forth .home-go-forth-card:not(:first-child) .card-title,
.page-home .home-go-forth .home-go-forth-card:not(:first-child) .story-card-text .story-title {
  width: 100%;
  max-width: 100%;
  font-size: var(--home-go-forth-title-size-sub, clamp(15px, 0.48vw + 13px, 19px));
  font-weight: var(--home-go-forth-title-weight-sub, 550);
  line-height: var(--home-go-forth-title-line, 1.41);
  color: var(--home-go-forth-title-color-sub, rgba(255, 255, 255, 0.9));
  text-shadow:
    0 1px 2px rgba(0, 0, 0, 0.38),
    0 2px 6px rgba(0, 0, 0, 0.26);
  -webkit-line-clamp: 3;
  line-clamp: 3;
}

.page-home .home-go-forth .home-go-forth-card .card-subtitle,
.page-home .home-go-forth .home-go-forth-card .home-go-forth-byline {
  display: none;
}

/* 下部情報ブロック：カード下端基準で4枚統一 */
.page-home .home-go-forth .home-go-forth-card .card-text-foot {
  position: absolute;
  left: var(--home-go-forth-text-pad-x);
  right: var(--home-go-forth-text-pad-x);
  bottom: var(--home-go-forth-foot-bottom);
  height: var(--home-go-forth-foot-h);
  margin: 0;
  padding: var(--home-go-forth-foot-rule-pad) 0 0;
  box-sizing: border-box;
  border-top: 1px solid rgba(255, 255, 255, 0.08);
}

.page-home .home-go-forth .home-go-forth-card .card-meta {
  display: flex;
  flex-direction: row;
  align-items: baseline;
  justify-content: space-between;
  gap: 8px;
  width: 100%;
  height: 100%;
  margin: 0;
  padding: 0;
  border: none;
  font-family: var(--font-story-meta, var(--font-page-serif));
  font-size: 9px;
  font-weight: 500;
  line-height: 1.3;
  text-shadow: 0 1px 3px rgba(0, 0, 0, 0.32);
}

.page-home .home-go-forth .home-go-forth-card .card-meta-label {
  display: none;
}

.page-home .home-go-forth .home-go-forth-card .card-meta-role {
  margin: 0;
  flex: 1 1 auto;
  min-width: 0;
  font-size: clamp(9px, 0.28vw + 8px, 11px);
  font-weight: 500;
  line-height: 1.35;
  letter-spacing: 0.03em;
  color: rgba(255, 255, 255, 0.74);
  text-transform: none;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.page-home .home-go-forth .home-go-forth-card .card-meta-date {
  margin: 0;
  flex: 0 0 auto;
  font-size: clamp(10px, 0.32vw + 9px, 12px);
  color: rgba(255, 255, 255, 0.46);
  font-weight: 400;
  letter-spacing: 0.06em;
  font-variant-numeric: tabular-nums;
  text-transform: none;
  white-space: nowrap;
}

/* --- 編集見出し帯（GO FORTH / BACK STORY STRIP / DOG CARE 共通） --- */
.page-home .home-go-forth > .home-container,
.page-home .home-backstory-strip > .home-container,
.page-home .home-dogcare > .home-container {
  margin-top: clamp(-10px, -0.75vw, -8px);
}

/* §40.1b 編集ラベル型見出し（棚の入口・人格差あり） */
.page-home .home-go-forth .home-go-forth-heading,
.page-home .home-backstory-strip .home-backstory-heading,
.page-home .home-backstory-strip .home-backstory-strip-heading,
.page-home .home-backstory-strip .section-head,
.page-home .home-dogcare .home-dogcare-heading,
.page-home .home-dogcare .section-head {
  text-align: left;
  padding-top: clamp(44px, 5.1vw, 58px);
  padding-bottom: var(--home-editorial-heading-card, clamp(6px, calc(2.5vw - 20px), 16px));
  margin-bottom: 0;
}

.page-home .home-go-forth .section-head,
.page-home .home-backstory-strip .section-head,
.page-home .home-dogcare .section-head {
  margin-bottom: 0;
}

.page-home .home-go-forth .home-go-forth-heading-row,
.page-home .home-backstory-strip .home-backstory-heading-row,
.page-home .home-backstory-strip .home-backstory-strip-heading-row,
.page-home .home-dogcare .home-dogcare-heading-row {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  justify-content: flex-start;
  gap: clamp(14px, 1.35vw, 22px);
  margin: 0;
}

/* 左：縦アクセント ／ 右：英字ラベル＋日本語タイトル（縦積み） */
.page-home .section-editorial-head {
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  flex: 1 1 auto;
  min-width: 0;
  margin: 0;
  gap: var(--home-editorial-head-gap, clamp(13px, 1.15vw, 18px));
}

.page-home .section-editorial-copy {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-start;
  flex: 1 1 auto;
  min-width: 0;
  gap: var(--home-editorial-copy-gap, clamp(6px, 0.55vw, 9px));
}

.page-home .section-editorial-label {
  margin: 0;
  padding: 0;
  font-family: var(--home-editorial-eyebrow-font);
  font-size: var(--home-editorial-label-size, clamp(13px, 0.52vw + 10px, 17px));
  font-weight: 700;
  letter-spacing: var(--home-editorial-label-tracking, 0.42em);
  text-transform: uppercase;
  line-height: 1.15;
  font-feature-settings: "kern" 1, "liga" 1;
  -webkit-font-smoothing: antialiased;
}

.page-home .section-editorial-accent {
  flex: 0 0 var(--home-editorial-accent-w, 5px);
  width: var(--home-editorial-accent-w, 5px);
  align-self: flex-start;
  height: var(--home-editorial-accent-h);
  margin: 0.12em 0 0;
  min-height: 0;
  background: currentColor;
  border: 0;
  border-radius: 1px;
}

/* 補助文：タイトル文字の左端に揃える（縦線列には入れない） */
.page-home .section-editorial-subcopy {
  margin: clamp(10px, 0.95vw, 14px) 0 0;
  margin-left: var(--home-editorial-subcopy-indent);
  padding: 0;
  text-align: left;
  align-self: flex-start;
  box-sizing: border-box;
  max-width: 100%;
}

/* §40.1b — 編集見出しタイトル .section-lead（5セクション共通タイポ + 帯別色） */
.page-home .home-go-forth .section-lead,
.page-home .home-backstory-strip .section-lead,
.page-home .home-dogcare .section-lead,
.page-home .home-recruit .section-lead,
.page-home .home-picks .section-lead {
  margin: 0;
  padding: 0;
  min-width: 0;
  font-family: var(--font-page-serif);
  font-size: var(--home-editorial-title-size, clamp(25px, calc(1.512vw + 19px), 35px));
  font-weight: 700;
  line-height: 1.38;
  letter-spacing: 0.042em;
  font-feature-settings: "palt" 1;
  white-space: normal;
}

/* HOME 見出し：SP専用改行（PCでは非表示＝HERO .hero-lead-break-* と同趣旨） */
.page-home .section-lead-br-sp {
  display: none;
}

.page-home .home-go-forth .section-lead,
.page-home .home-backstory-strip .section-lead,
.page-home .home-dogcare .section-lead {
  flex: 1 1 auto;
}

.page-home .home-go-forth .section-lead {
  color: #343331;
  overflow: visible;
  text-overflow: unset;
}

.page-home .home-backstory-strip .section-lead {
  color: #3b3833;
}

.page-home .home-dogcare .section-lead {
  color: #383c3a;
}

.page-home .home-recruit .section-lead {
  color: rgba(255, 255, 255, 0.99);
  text-shadow: 0 2px 22px rgba(8, 6, 8, 0.42);
}

.page-home .home-picks .section-lead {
  color: rgba(255, 255, 255, 0.96);
}

/* GO FORTH — 赤・やや緊張 */
.page-home .home-go-forth .section-editorial-accent {
  color: var(--home-go-forth-label, #8f3a32);
}

.page-home .home-go-forth .section-editorial-label {
  letter-spacing: 0.4em;
  font-weight: 750;
  color: var(--home-go-forth-label, #8f3a32);
}

/* BACK STORY — マスタード・柔らか */
.page-home .home-backstory-strip .section-editorial-accent {
  color: var(--home-backstory-label, #b89428);
}

.page-home .home-backstory-strip .section-editorial-label {
  letter-spacing: 0.44em;
  font-weight: 680;
  color: var(--home-backstory-label, #b89428);
}

.page-home .home-backstory-strip .section-editorial-copy {
  gap: clamp(7px, 0.62vw, 10px);
}

/* DOG CARE — 緑・生活感 */
.page-home .home-dogcare .section-editorial-accent {
  color: var(--home-dogcare-label, #5a8589);
}

.page-home .home-dogcare .section-editorial-label {
  letter-spacing: 0.38em;
  font-weight: 700;
  color: var(--home-dogcare-label, #5a8589);
}

/* HOME 全見出し — 縦線は英字ラベル横のみ／日本語タイトルは左へ（GO FORTH〜PICKS 統一） */
.page-home .home-go-forth .section-editorial-accent,
.page-home .home-backstory-strip .section-editorial-accent,
.page-home .home-dogcare .section-editorial-accent,
.page-home .home-recruit .section-editorial-accent,
.page-home .home-picks .section-editorial-accent {
  align-self: flex-start;
  flex: 0 0 var(--home-editorial-accent-w, 5px);
  height: var(--home-editorial-accent-h);
  min-height: 0;
  margin-top: 0.12em;
  margin-bottom: 0;
}

.page-home .home-go-forth .section-editorial-copy > .section-lead,
.page-home .home-backstory-strip .section-editorial-copy > .section-lead,
.page-home .home-dogcare .section-editorial-copy > .section-lead,
.page-home .home-recruit .section-editorial-copy > .section-lead,
.page-home .home-picks .section-editorial-copy > .section-lead {
  margin-left: calc(-1 * var(--home-editorial-title-outdent, var(--home-editorial-subcopy-indent)));
}

.page-home .home-go-forth .home-go-forth-heading-link,
.page-home .home-backstory-strip .home-backstory-heading-link,
.page-home .home-backstory-strip .home-backstory-strip-heading-link,
.page-home .home-dogcare .home-dogcare-heading-link {
  flex: 0 0 auto;
  align-self: flex-end;
  margin: 0 0 0.06em auto;
  padding-left: clamp(7px, 0.65vw, 12px);
  font-family: var(--font-story-meta, var(--font-page-serif));
  font-size: clamp(12px, 0.34vw + 10px, 15px);
  font-weight: 500;
  line-height: 1.35;
  letter-spacing: 0.04em;
  color: rgba(12, 10, 8, 0.48);
  text-decoration: none;
  white-space: nowrap;
  opacity: 1;
  transition: color 0.2s ease;
}

.page-home .home-go-forth .home-go-forth-heading-link:hover {
  color: var(--home-go-forth-accent-red-text, #8f3a32);
  text-decoration: none;
}

.page-home .home-backstory-strip .home-backstory-strip-heading-link:hover {
  color: var(--home-backstory-label, #b89428);
  text-decoration: none;
}

.page-home .home-dogcare .home-dogcare-heading-link:hover {
  color: var(--home-dogcare-label, #5a8589);
  text-decoration: none;
}

/* HOME 記事帯 — SP専用 MORE（PCでは非表示・§91 で表示） */
.page-home .home-section-sp-more-wrap {
  display: none;
  margin: 0;
  padding: 0;
}

.page-home .home-backstory-strip .home-backstory-strip-heading-link span,
.page-home .home-dogcare .home-dogcare-heading-link span {
  margin-left: 0;
}

/* --- PC：横一列棚 — 表示4枚の実幅＝.home-dogcare-grid と同じコンテナ全幅 --- */
@media (min-width: 769px) {
  .page-home .home-go-forth .home-go-forth-carousel {
    padding-right: 0;
  }

  .page-home .home-go-forth .home-go-forth-viewport {
    width: 100%;
    container-type: inline-size;
  }

  .page-home .home-go-forth .home-go-forth-track > .home-go-forth-card,
  .page-home .home-go-forth .home-card-grid--4 > .home-go-forth-card {
    flex: 0 0 calc((100cqw - (var(--home-go-forth-gap) * 3)) * var(--home-go-forth-sub-ratio));
    min-width: 0;
    align-self: stretch;
  }

  .page-home .home-go-forth .home-go-forth-track > .home-go-forth-card:first-child,
  .page-home .home-go-forth .home-card-grid--4 > .home-go-forth-card:first-child {
    flex: 0 0 calc((100cqw - (var(--home-go-forth-gap) * 3)) * var(--home-go-forth-main-ratio));
  }
}

/* --- SP：主役1枚 + 2カラム2枚（レイアウト本体は §91） --- */
@media (max-width: 768px) {
  .page-home .home-go-forth .home-go-forth-card:first-child {
    --home-go-forth-title-top: calc(
      52% + clamp(12px, 1.1vw, 18px) + 10px -
        var(--home-go-forth-title-size-main, clamp(19px, 0.95vw + 13px, 26px)) *
        var(--home-go-forth-title-line, 1.41)
    );
    --home-go-forth-text-pad-x: clamp(13px, 1vw, 17px);
  }

  .page-home .home-go-forth .home-go-forth-card:first-child .card-text-title {
    left: var(--home-go-forth-text-pad-x);
    right: auto;
    width: var(--home-go-forth-title-block-width, 68%);
    max-width: var(--home-go-forth-title-block-width, 68%);
    overflow: hidden;
  }

  .page-home .home-go-forth .home-go-forth-card:first-child .card-title,
  .page-home .home-go-forth .home-go-forth-card:first-child .story-card-text .story-title {
    width: 100%;
    max-width: 100%;
    font-size: var(--home-go-forth-title-size-main, clamp(19px, 0.95vw + 13px, 26px));
    font-weight: var(--home-go-forth-title-weight-main, 575);
    line-height: var(--home-go-forth-title-line, 1.41);
    -webkit-line-clamp: 3;
    line-clamp: 3;
  }
}

/* ===== §40 GO FORTH：最終 ここまで ===== */

/* ────────────────────────────────────────────────────────────
   §40.7  共通カード系②（GO FORTH 専用ではない・残置／移動禁止）
       .page-home .home-card .thumb                ← cheat-sheet [b]：GO FORTH では §40.3 の [c] が勝つ
       .page-home .home-card .story-title          ← 共通カードタイトル基本値（GO FORTH では §40.3 の .story-card-text .story-title が勝つ）
   注意：GO FORTH は §40.3 で特異度を 1段上げて上書きしている（cheat-sheet 参照）。
        ここを動かすと他セクションのカード比率・タイトルに波及するため移動禁止。
   ──────────────────────────────────────────────────────────── */
.page-home .home-card:not(.home-go-forth-card) .thumb {
  aspect-ratio: 3 / 2;
}

.page-home .home-card:not(.home-go-forth-card) .story-title {
  font-size: 16px;
  font-weight: 600;
  line-height: 1.55;
}


/* §40 ─────── TOP ② 特集（.home-go-forth）— レイアウトは §40 GO FORTH：最終 ─────── */

/* §41 ─────── TOP ③ BACK STORY ストリップ（.home-backstory-strip）【最終】 ───────
   静かなドキュメンタリー横スクロール。GO FORTH より控えめ。HTML: #backstory-articles
   帯：background / .home-band padding の単一ソース（旧 §40.1 は整理済み）
   ──────────────────────────────────────────────────────────────────────────── */

.page-home .home-backstory-strip {
  --home-backstory-gap: 6px;
  --home-backstory-accent-bg: #a82a20;
  --home-backstory-accent-muted: rgba(142, 90, 69, 0.88);
  background-color: var(--home-backstory-strip-bg, #ffffff);
  border-top: 1px solid rgba(12, 10, 8, 0.05);
}

.page-home .home-backstory-strip.home-band,
.page-home .home-backstory.home-band {
  padding-top: clamp(3px, 0.55vw, 6px);
  padding-bottom: clamp(14px, 1.2vw, 20px);
}

/* --- 見出し帯 — §40 GO FORTH：最終 の共通編集見出しを使用 --- */

/* --- カルーセル：GO FORTH と同一の表示幅・gap・操作感 --- */
.page-home .home-backstory-strip .home-backstory-strip-carousel,
.page-home .home-backstory-strip .home-backstory-carousel {
  --home-go-forth-gap: clamp(8px, 0.65vw, 12px);
  --home-go-forth-main-ratio: 0.4;
  --home-go-forth-sub-ratio: calc((1 - var(--home-go-forth-main-ratio)) / 3);
  --home-go-forth-main-thumb-aspect-w: 1.75;
  --home-go-forth-main-thumb-aspect-h: 1.32;
  position: relative;
  margin-top: 0;
  padding-right: clamp(8px, 0.75vw, 14px);
}

.page-home .home-backstory-strip .home-backstory-strip-viewport,
.page-home .home-backstory-strip .home-backstory-viewport {
  overflow: hidden;
}

.page-home .home-backstory-strip .home-backstory-track,
.page-home .home-backstory-strip #home-backstory-strip-track,
.page-home .home-backstory-strip .home-card-grid--4.home-backstory-track {
  display: flex;
  flex-wrap: nowrap;
  align-items: stretch;
  height: auto;
  gap: var(--home-go-forth-gap, 8px);
  grid-template-columns: none;
  transition: transform 0.4s ease;
  will-change: transform;
}

.page-home .home-backstory-strip .home-backstory-track > .home-backstory-card,
.page-home .home-backstory-strip .home-backstory-track > .home-backstory-strip-card,
.page-home .home-backstory-strip .home-card-grid--4 > .home-backstory-card,
.page-home .home-backstory-strip .home-card-grid--4 > .home-backstory-strip-card {
  flex: 0 0 calc((100% - (var(--home-go-forth-gap) * 3)) * var(--home-go-forth-sub-ratio));
  min-width: 0;
  align-self: stretch;
}

.page-home .home-backstory-strip .home-backstory-track > .home-backstory-card:first-child,
.page-home .home-backstory-strip .home-backstory-track > .home-backstory-strip-card:first-child,
.page-home .home-backstory-strip .home-card-grid--4 > .home-backstory-card:first-child,
.page-home .home-backstory-strip .home-card-grid--4 > .home-backstory-strip-card:first-child {
  flex: 0 0 calc((100% - (var(--home-go-forth-gap) * 3)) * var(--home-go-forth-main-ratio));
}

/* カルーセル矢印（BACK STORY）— GO FORTH と同一：2本線の山形 */
.page-home .home-backstory-strip .home-backstory-strip-prev,
.page-home .home-backstory-strip .home-backstory-strip-next,
.page-home .home-backstory-strip .home-backstory-prev,
.page-home .home-backstory-strip .home-backstory-next {
  --home-go-forth-arrow-w: 52px;
  --home-go-forth-arrow-line: 38px;
  --home-go-forth-arrow-color: #ececec;
  position: absolute;
  z-index: 4;
  top: 50%;
  transform: translateY(-50%);
  width: var(--home-go-forth-arrow-w);
  height: var(--home-go-forth-arrow-w);
  padding: 0;
  margin: 0;
  border: none;
  border-radius: 0;
  background: none;
  box-shadow: none;
  color: transparent;
  font-size: 0;
  line-height: 0;
  cursor: pointer;
  overflow: visible;
}

.page-home .home-backstory-strip .home-backstory-strip-prev,
.page-home .home-backstory-strip .home-backstory-prev {
  display: none;
  left: 24px;
  right: auto;
  transform: translateY(-50%) scaleX(-1);
}

.page-home .home-backstory-strip .home-backstory-strip-prev.is-visible,
.page-home .home-backstory-strip .home-backstory-prev.is-visible {
  display: block;
}

.page-home .home-backstory-strip .home-backstory-strip-next,
.page-home .home-backstory-strip .home-backstory-next {
  right: 24px;
}

.page-home .home-backstory-strip .home-backstory-strip-prev::before,
.page-home .home-backstory-strip .home-backstory-strip-prev::after,
.page-home .home-backstory-strip .home-backstory-strip-next::before,
.page-home .home-backstory-strip .home-backstory-strip-next::after,
.page-home .home-backstory-strip .home-backstory-prev::before,
.page-home .home-backstory-strip .home-backstory-prev::after,
.page-home .home-backstory-strip .home-backstory-next::before,
.page-home .home-backstory-strip .home-backstory-next::after {
  content: "";
  position: absolute;
  top: 50%;
  right: 0;
  width: var(--home-go-forth-arrow-line);
  height: 6px;
  background: var(--home-go-forth-arrow-color, #ececec);
  border: none;
  border-radius: 999px;
  transform-origin: 100% 50%;
}

.page-home .home-backstory-strip .home-backstory-strip-prev::before,
.page-home .home-backstory-strip .home-backstory-strip-next::before {
  transform: translate3d(0, calc(-50% + 2px), 0) rotate(54deg) scale(1.1);
}

.page-home .home-backstory-strip .home-backstory-strip-prev::after,
.page-home .home-backstory-strip .home-backstory-strip-next::after {
  transform: translate3d(0, calc(-50% - 2px), 0) rotate(-54deg) scale(1.1);
}

@media (min-width: 769px) {
  .page-home .home-backstory-strip .home-backstory-strip-carousel,
  .page-home .home-backstory-strip .home-backstory-carousel {
    padding-right: 0;
  }

  .page-home .home-backstory-strip .home-backstory-strip-viewport,
  .page-home .home-backstory-strip .home-backstory-viewport {
    width: 100%;
    container-type: inline-size;
  }

  .page-home .home-backstory-strip .home-backstory-track > .home-backstory-card,
  .page-home .home-backstory-strip .home-backstory-track > .home-backstory-strip-card,
  .page-home .home-backstory-strip .home-card-grid--4 > .home-backstory-card,
  .page-home .home-backstory-strip .home-card-grid--4 > .home-backstory-strip-card {
    flex: 0 0 calc((100cqw - (var(--home-go-forth-gap) * 3)) * var(--home-go-forth-sub-ratio));
  }

  .page-home .home-backstory-strip .home-backstory-track > .home-backstory-card:first-child,
  .page-home .home-backstory-strip .home-backstory-track > .home-backstory-strip-card:first-child,
  .page-home .home-backstory-strip .home-card-grid--4 > .home-backstory-card:first-child,
  .page-home .home-backstory-strip .home-card-grid--4 > .home-backstory-strip-card:first-child {
    flex: 0 0 calc((100cqw - (var(--home-go-forth-gap) * 3)) * var(--home-go-forth-main-ratio));
  }
}

/* --- カード：GO FORTH と同一の編集カード構成 --- */
.page-home .home-backstory-strip .home-backstory-strip-card.story-card,
.page-home .home-backstory-strip .home-backstory-card {
  position: relative;
  display: block;
  width: auto;
  max-width: none;
  height: auto;
  padding: 0;
  background: #12100e;
  border: none;
  border-radius: 6px;
  box-shadow: 0 1px 8px rgba(12, 10, 8, 0.05);
  overflow: hidden;
  color: #fff;
  text-decoration: none;
  transition: box-shadow 0.22s ease, transform 0.22s ease;
  --home-go-forth-text-pad-x: clamp(10px, 0.78vw, 12px);
  --home-go-forth-foot-bottom: clamp(10px, 0.78vw, 12px);
  --home-go-forth-foot-h: clamp(34px, 2.35vw, 40px);
  --home-go-forth-foot-rule-pad: 0.34em;
  --home-go-forth-title-top: calc(52% + clamp(12px, 1.1vw, 18px) + 10px);
  --home-go-forth-title-foot-gap: 12px;
  --home-go-forth-title-block-width: 68%;
  --home-go-forth-title-size-main: clamp(19px, 0.95vw + 13px, 26px);
  --home-go-forth-title-size-sub: clamp(15px, 0.48vw + 13px, 19px);
  --home-go-forth-title-line: 1.41;
  --home-go-forth-title-color-main: rgba(255, 255, 255, 0.92);
  --home-go-forth-title-color-sub: rgba(255, 255, 255, 0.9);
  --home-go-forth-title-weight-main: 575;
  --home-go-forth-title-weight-sub: 550;
}

.page-home .home-backstory-strip .home-backstory-strip-card.story-card:first-child,
.page-home .home-backstory-strip .home-backstory-card:first-child {
  box-shadow: 0 2px 14px rgba(12, 10, 8, 0.09);
  --home-go-forth-text-pad-x: clamp(13px, 1vw, 17px);
}

.page-home .home-backstory-strip .home-backstory-strip-card.story-card:hover,
.page-home .home-backstory-strip .home-backstory-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 22px rgba(12, 10, 8, 0.14);
}

.page-home .home-backstory-strip .home-backstory-card:first-child:hover {
  box-shadow: 0 10px 26px rgba(12, 10, 8, 0.16);
}

.page-home .home-backstory-strip .home-backstory-card::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;
  border-radius: inherit;
  background: linear-gradient(
    180deg,
    transparent 0%,
    transparent 50%,
    rgba(6, 5, 4, 0.12) 66%,
    rgba(6, 5, 4, 0.38) 80%,
    rgba(6, 5, 4, 0.74) 90%,
    rgba(6, 5, 4, 0.9) 100%
  );
}

.page-home .home-backstory-strip .home-backstory-card:first-child::after {
  background: linear-gradient(
    180deg,
    transparent 0%,
    transparent 62%,
    rgba(6, 5, 4, 0.06) 78%,
    rgba(6, 5, 4, 0.18) 90%,
    rgba(6, 5, 4, 0.32) 100%
  );
}

.page-home .home-backstory-strip .home-backstory-card:not(:first-child)::after {
  background: linear-gradient(
    180deg,
    transparent 0%,
    transparent 52%,
    rgba(6, 5, 4, 0.1) 68%,
    rgba(6, 5, 4, 0.34) 82%,
    rgba(6, 5, 4, 0.7) 94%,
    rgba(6, 5, 4, 0.86) 100%
  );
}

.page-home .home-backstory-strip .home-backstory-card .thumb {
  overflow: hidden;
  margin: 0;
  padding: 0;
  border-radius: 0;
  box-shadow: none;
  background: transparent;
}

.page-home .home-backstory-strip .home-backstory-strip-card:first-child .thumb,
.page-home .home-backstory-strip .home-backstory-card:first-child .thumb {
  position: relative;
  display: block;
  width: 100%;
  height: auto;
  margin: 0;
  padding-bottom: 0;
  aspect-ratio: var(--home-go-forth-main-thumb-aspect-w, 1.75) / var(--home-go-forth-main-thumb-aspect-h, 1.32);
}

.page-home .home-backstory-strip .home-backstory-strip-card:not(:first-child),
.page-home .home-backstory-strip .home-backstory-card:not(:first-child) {
  align-self: stretch;
  min-height: 0;
}

.page-home .home-backstory-strip .home-backstory-strip-card:not(:first-child) .thumb,
.page-home .home-backstory-strip .home-backstory-card:not(:first-child) .thumb {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  margin: 0;
  padding-bottom: 0;
  aspect-ratio: auto;
}

.page-home .home-backstory-strip .home-backstory-card .thumb::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  background: linear-gradient(
    180deg,
    transparent 0%,
    transparent 46%,
    rgba(0, 0, 0, 0.12) 62%,
    rgba(0, 0, 0, 0.42) 80%,
    rgba(0, 0, 0, 0.8) 100%
  );
}

.page-home .home-backstory-strip .home-backstory-card:first-child .thumb::before {
  background: linear-gradient(
    180deg,
    transparent 0%,
    transparent 58%,
    rgba(0, 0, 0, 0.08) 74%,
    rgba(0, 0, 0, 0.28) 88%,
    rgba(0, 0, 0, 0.52) 100%
  );
}

.page-home .home-backstory-strip .home-backstory-card:not(:first-child) .thumb::before {
  background: linear-gradient(
    180deg,
    transparent 0%,
    transparent 46%,
    rgba(0, 0, 0, 0.12) 62%,
    rgba(0, 0, 0, 0.42) 80%,
    rgba(0, 0, 0, 0.8) 100%
  );
}

.page-home .home-backstory-strip .home-backstory-card .thumb::after {
  display: none;
}

.page-home .home-backstory-strip .home-backstory-card .thumb img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  filter: contrast(1.05) saturate(0.87) brightness(0.85);
  transition: filter 0.35s ease, transform 0.45s ease;
}

.page-home .home-backstory-strip .home-backstory-card:first-child .thumb img {
  filter: contrast(1.04) saturate(0.9) brightness(0.88);
}

.page-home .home-backstory-strip .home-backstory-card:not(:first-child) .thumb img {
  filter: contrast(1.05) saturate(0.87) brightness(0.85);
}

.page-home .home-backstory-strip .home-backstory-card:hover .thumb img {
  filter: contrast(1.08) saturate(0.86) brightness(0.84);
  transform: scale(1.02);
}

.page-home .home-backstory-strip .home-backstory-card:first-child:hover .thumb img {
  filter: contrast(1.06) saturate(0.89) brightness(0.87);
}

.page-home .home-backstory-strip .home-backstory-card .thumb .home-feature-badge {
  display: none;
}

/* カードテキスト：タイトル（上固定）＋下部情報（下端固定）— GO FORTH 右3枚準拠 */
.page-home .home-backstory-strip .home-backstory-card .card-text,
.page-home .home-backstory-strip .home-backstory-card .card-body,
.page-home .home-backstory-strip .home-backstory-card .story-card-text,
.page-home .home-backstory-strip .home-backstory-card .story-card-text.card-body {
  position: absolute;
  inset: 0;
  z-index: 3;
  display: block;
  flex: none;
  margin: 0;
  padding: 0;
  min-height: 0;
  max-height: none;
  height: auto;
  gap: 0;
  border-radius: 0;
  background: transparent;
  background-color: transparent;
  background-image: none;
  pointer-events: none;
}

.page-home .home-backstory-strip .home-backstory-card .card-text::before,
.page-home .home-backstory-strip .home-backstory-card .card-body::before,
.page-home .home-backstory-strip .home-backstory-card .story-card-text.card-body::before {
  display: none;
}

.page-home .home-backstory-strip .home-backstory-card:first-child .card-text::before,
.page-home .home-backstory-strip .home-backstory-card:first-child .card-body::before,
.page-home .home-backstory-strip .home-backstory-card:first-child .story-card-text.card-body::before {
  display: block;
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 72%;
  z-index: -1;
  pointer-events: none;
  border-radius: 0 0 6px 6px;
  background: linear-gradient(
    180deg,
    transparent 0%,
    rgba(6, 5, 4, 0.12) 28%,
    rgba(6, 5, 4, 0.52) 58%,
    rgba(6, 5, 4, 0.82) 82%,
    rgba(6, 5, 4, 0.94) 100%
  );
}

.page-home .home-backstory-strip .home-backstory-card .card-text-title {
  position: absolute;
  top: var(--home-go-forth-title-top);
  left: var(--home-go-forth-text-pad-x);
  right: auto;
  width: var(--home-go-forth-title-block-width, 68%);
  max-width: var(--home-go-forth-title-block-width, 68%);
  bottom: calc(
    var(--home-go-forth-foot-bottom) + var(--home-go-forth-foot-h) + var(--home-go-forth-title-foot-gap)
  );
  margin: 0;
  padding: 0;
  overflow: hidden;
}

.page-home .home-backstory-strip .home-backstory-card .card-title,
.page-home .home-backstory-strip .home-backstory-card .story-card-text .story-title {
  position: static;
  margin: 0;
  padding: 0;
  width: 100%;
  max-width: 100%;
  font-family: var(--font-page-serif);
  font-weight: 700;
  color: var(--home-go-forth-title-color-main, rgba(255, 255, 255, 0.92));
  letter-spacing: 0.02em;
  text-shadow:
    0 1px 3px rgba(0, 0, 0, 0.45),
    0 2px 8px rgba(0, 0, 0, 0.32);
  display: -webkit-box;
  -webkit-box-orient: vertical;
  overflow: hidden;
  -webkit-line-clamp: 3;
  line-clamp: 3;
}

.page-home .home-backstory-strip .home-backstory-card:first-child .card-title,
.page-home .home-backstory-strip .home-backstory-card:first-child .story-card-text .story-title {
  max-width: 100%;
  font-size: var(--home-go-forth-title-size-main, clamp(19px, 0.95vw + 13px, 26px));
  font-weight: var(--home-go-forth-title-weight-main, 575);
  color: var(--home-go-forth-title-color-main, rgba(255, 255, 255, 0.92));
  line-height: var(--home-go-forth-title-line, 1.41);
  -webkit-line-clamp: 3;
  line-clamp: 3;
}

.page-home .home-backstory-strip .home-backstory-card:not(:first-child) .card-title,
.page-home .home-backstory-strip .home-backstory-card:not(:first-child) .story-card-text .story-title {
  width: 100%;
  max-width: 100%;
  font-size: var(--home-go-forth-title-size-sub, clamp(15px, 0.48vw + 13px, 19px));
  font-weight: var(--home-go-forth-title-weight-sub, 550);
  line-height: var(--home-go-forth-title-line, 1.41);
  color: var(--home-go-forth-title-color-sub, rgba(255, 255, 255, 0.9));
  text-shadow:
    0 1px 2px rgba(0, 0, 0, 0.38),
    0 2px 6px rgba(0, 0, 0, 0.26);
  -webkit-line-clamp: 3;
  line-clamp: 3;
}

.page-home .home-backstory-strip .home-backstory-card .card-series {
  display: none;
}

.page-home .home-backstory-strip .home-backstory-card .card-text-foot {
  position: absolute;
  left: var(--home-go-forth-text-pad-x);
  right: var(--home-go-forth-text-pad-x);
  bottom: var(--home-go-forth-foot-bottom);
  height: var(--home-go-forth-foot-h);
  margin: 0;
  padding: var(--home-go-forth-foot-rule-pad) 0 0;
  box-sizing: border-box;
  border-top: 1px solid rgba(255, 255, 255, 0.08);
}

.page-home .home-backstory-strip .home-backstory-card .card-meta {
  display: flex;
  flex-direction: row;
  align-items: baseline;
  justify-content: space-between;
  gap: 8px;
  width: 100%;
  height: 100%;
  margin: 0;
  padding: 0;
  border: none;
  font-family: var(--font-story-meta, var(--font-page-serif));
  font-size: 9px;
  font-weight: 500;
  line-height: 1.3;
  text-shadow: 0 1px 3px rgba(0, 0, 0, 0.32);
}

.page-home .home-backstory-strip .home-backstory-card .card-meta-role {
  margin: 0;
  flex: 1 1 auto;
  min-width: 0;
  font-size: clamp(9px, 0.28vw + 8px, 11px);
  font-weight: 500;
  line-height: 1.35;
  letter-spacing: 0.03em;
  color: rgba(255, 255, 255, 0.74);
  text-transform: none;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.page-home .home-backstory-strip .home-backstory-card .card-meta-date {
  margin: 0;
  flex: 0 0 auto;
  font-size: clamp(10px, 0.32vw + 9px, 12px);
  color: rgba(255, 255, 255, 0.46);
  font-weight: 400;
  letter-spacing: 0.06em;
  font-variant-numeric: tabular-nums;
  text-transform: none;
  white-space: nowrap;
}

.page-home .home-backstory-strip .home-backstory-strip-byline {
  display: none;
}

@media (max-width: 768px) {
  .page-home .home-backstory-strip .home-backstory-card:first-child {
    /* SP主役だけ見出し開始が下がり、2行目が見出し枠の下端で欠ける。20px上げて2行を収める */
    --home-go-forth-title-top: calc(52% + clamp(12px, 1.1vw, 18px) + 5px - 20px);
    --home-go-forth-text-pad-x: clamp(13px, 1vw, 17px);
  }

  .page-home .home-backstory-strip .home-backstory-card:first-child .card-text-title {
    left: var(--home-go-forth-text-pad-x);
    right: auto;
    width: var(--home-go-forth-title-block-width, 68%);
    max-width: var(--home-go-forth-title-block-width, 68%);
    overflow: hidden;
  }

  .page-home .home-backstory-strip .home-backstory-card:first-child .card-title,
  .page-home .home-backstory-strip .home-backstory-card:first-child .story-card-text .story-title {
    width: 100%;
    max-width: 100%;
    font-size: var(--home-go-forth-title-size-main, clamp(19px, 0.95vw + 13px, 26px));
    font-weight: var(--home-go-forth-title-weight-main, 575);
    line-height: var(--home-go-forth-title-line, 1.41);
    -webkit-line-clamp: 3;
    line-clamp: 3;
  }
}

/* §41 ここまで */

/* §41b ─────── TOP ④ DOG CARE 実用カテゴリ棚（.home-dogcare）【最終】 ───────
   明るい白ベース・5列×2段。GO FORTH／BACK STORY の暗い棚とは別系統。
   帯：background / .home-band padding の単一ソース（旧 §40.1 は整理済み）
   ──────────────────────────────────────────────────────────────────────────── */

.page-home .home-dogcare {
  --home-dogcare-gap: clamp(14px, 1.1vw, 18px);
  --home-dogcare-accent-bg: #a82a20;
  --home-dogcare-accent-muted: rgba(168, 42, 32, 0.78);
  background-color: var(--home-dogcare-bg, #ffffff);
  border-top: 1px solid rgba(12, 10, 8, 0.04);
}

.page-home .home-dogcare.home-band {
  padding-top: clamp(5px, 0.7vw, 9px);
  padding-bottom: calc(clamp(20px, 2.2vw, 32px) + clamp(40px, 3.5vw, 60px));
}

/* --- 見出し帯 — §40 GO FORTH：最終 の共通編集見出しを使用 --- */

/* --- カードグリッド：PC 5列×2段 ---
   新着順の単一リスト。PCは最大10件、SPは先頭から最大6件。
   上限未満はその件数だけ。複製で埋めない。 */
.page-home .home-dogcare .home-dogcare-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: var(--home-dogcare-gap, clamp(14px, 1.1vw, 18px));
  align-items: stretch;
}

/* --- カード：白ベース・画像上／文章下 --- */
.page-home .home-dogcare .home-dogcare-card.story-card,
.page-home .home-dogcare .home-dogcare-card {
  position: relative;
  display: flex;
  flex-direction: column;
  height: 100%;
  margin: 0;
  padding: 0;
  background: #ffffff;
  border: 1px solid rgba(12, 10, 8, 0.08);
  border-radius: 6px;
  box-shadow: 0 1px 10px rgba(12, 10, 8, 0.05);
  overflow: hidden;
  color: inherit;
  text-decoration: none;
  transition: box-shadow 0.22s ease, transform 0.22s ease;
}

.page-home .home-dogcare .home-dogcare-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 6px 18px rgba(12, 10, 8, 0.08);
}

.page-home .home-dogcare .home-dogcare-card.story-card:nth-child(n + 11) {
  display: none;
}

.page-home .home-dogcare .home-dogcare-card .thumb {
  position: relative;
  flex: 0 0 auto;
  height: auto;
  margin: 0;
  padding: 0;
  aspect-ratio: 3 / 2;
  border-radius: 0;
  box-shadow: none;
  overflow: hidden;
}

.page-home .home-dogcare .home-dogcare-card .thumb::before,
.page-home .home-dogcare .home-dogcare-card .thumb::after {
  display: none;
  content: none;
}

.page-home .home-dogcare .home-dogcare-card .thumb img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  filter: none;
  transition: transform 0.35s ease;
}

.page-home .home-dogcare .home-dogcare-card:hover .thumb img {
  transform: scale(1.02);
}

.page-home .home-dogcare .home-dogcare-card .thumb .home-feature-badge,
.page-home .home-dogcare .home-dogcare-card .thumb .card-new {
  position: absolute;
  z-index: 2;
  margin: 0;
}

.page-home .home-dogcare .home-dogcare-card .thumb .home-feature-badge {
  display: none;
}

.page-home .home-dogcare .home-dogcare-card .thumb .card-new {
  top: clamp(8px, 0.65vw, 10px);
  left: clamp(8px, 0.65vw, 10px);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 22px;
  height: 22px;
  padding: 0;
  border: none;
  border-radius: 3px;
  background: #d63b2f;
  color: #ffffff;
  font-family: var(--font-story-meta, var(--font-page-serif));
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.02em;
  line-height: 1;
  text-shadow: none;
  backdrop-filter: none;
}

.page-home .home-dogcare .home-dogcare-card .card-body,
.page-home .home-dogcare .home-dogcare-card .story-card-text.card-body {
  position: static;
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
  align-items: stretch;
  justify-content: flex-start;
  gap: 0.35em;
  min-height: 0;
  margin: 0;
  padding: clamp(10px, 0.85vw, 14px) clamp(11px, 0.9vw, 13px) clamp(11px, 0.9vw, 13px);
  background: #ffffff;
  pointer-events: none;
}

.page-home .home-dogcare .home-dogcare-card .card-category {
  margin: 0;
  font-family: var(--font-story-meta, var(--font-page-serif));
  font-size: 11px;
  font-weight: 500;
  letter-spacing: 0.06em;
  line-height: 1.3;
  color: rgba(12, 10, 8, 0.42);
}

.page-home .home-dogcare .home-dogcare-card .card-title,
.page-home .home-dogcare .home-dogcare-card .story-card-text .story-title {
  margin: 0;
  padding: 0;
  max-width: none;
  font-family: var(--font-page-serif);
  font-size: clamp(14px, 0.38vw + 12px, 16px);
  font-weight: 700;
  line-height: 1.45;
  letter-spacing: 0.02em;
  color: rgba(12, 10, 8, 0.92);
  text-shadow: none;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  overflow: hidden;
  -webkit-line-clamp: 2;
  line-clamp: 2;
}

.page-home .home-dogcare .home-dogcare-card .card-text {
  margin: 0;
  flex: 1 1 auto;
  font-family: var(--font-story-meta, var(--font-page-serif));
  font-size: clamp(11px, 0.28vw + 9px, 12px);
  font-weight: 400;
  line-height: 1.55;
  letter-spacing: 0.02em;
  color: rgba(12, 10, 8, 0.52);
  display: -webkit-box;
  -webkit-box-orient: vertical;
  overflow: hidden;
  -webkit-line-clamp: 2;
  line-clamp: 2;
}

.page-home .home-dogcare .home-dogcare-card .card-date {
  margin: 0.15em 0 0;
  padding: 0;
  font-family: var(--font-story-meta, var(--font-page-serif));
  font-size: 10px;
  font-weight: 500;
  letter-spacing: 0.06em;
  line-height: 1.35;
  color: rgba(12, 10, 8, 0.38);
  font-variant-numeric: tabular-nums;
}

.page-home .home-dogcare .home-dogcare-byline {
  display: none;
}

/* §41b ここまで */


/* ===== Home: Recruit（§43） ===== */
/* §43 ─────── TOP ⑥ RECRUIT（.home-recruit：recruit-996 横長広告バナー） ─────── */
/* 紙面3帯とは別空気。見出しサイズ・CTA寸法・紙面幅の“芯”は共通、
   白カードは使わず写真上に直接コピー。左のみ薄いグラデで視認性。 */
.page-home .home-recruit {
  position: relative;
  background: transparent;
  color: rgba(255, 250, 246, 0.94);
  border-top: none;
  overflow: hidden;
}

/* 上下のブラウン余白なし：画像がセクションそのものになる */
.home-recruit.home-band {
  padding-top: 0;
  padding-bottom: 0;
  min-height: 0;
}

.page-home .home-recruit-inner {
  position: relative;
  z-index: 1;
  width: 100%;
  max-width: none;
  margin: 0;
  padding: 0;
}

/* 画面幅いっぱいの横長ビジュアル（枠・帯なし） */
.page-home .home-recruit-layout {
  position: relative;
  display: flex;
  align-items: stretch;
  justify-content: flex-start;
  width: 100vw;
  max-width: none;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
  min-height: clamp(360px, calc(28vw + 100px), 520px);
  aspect-ratio: var(--home-recruit-visual-ratio, 1800 / 380);
  border-radius: 0;
  overflow: hidden;
  background-color: #1a1614;
  background-image: url("assets/img/home/recruit-996.jpg");
  background-size: cover;
  background-position: 60% 44%;
  background-repeat: no-repeat;
  box-shadow: none;
}

/* 左寄り：落ち着いた明るさ（濁りを抑え、人物・空気感を残す） */
.page-home .home-recruit-layout::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(
    90deg,
    rgba(16, 13, 14, 0.44) 0%,
    rgba(20, 16, 18, 0.28) 26%,
    rgba(22, 20, 24, 0.12) 44%,
    transparent 58%
  );
  pointer-events: none;
  z-index: 0;
}

.page-home .home-recruit-layout::after {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(12, 11, 14, 0.06);
  pointer-events: none;
  z-index: 1;
}

.page-home .home-recruit-text {
  position: relative;
  z-index: 2;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-start;
  align-self: stretch;
  flex: 0 1 auto;
  min-height: 100%;
  max-width: min(28rem, 44vw);
  /* 他セクション .home-container と同じ左ライン：中央寄せオフセット + ガター */
  margin: 0;
  margin-left: max(0px, calc((100vw - var(--home-editorial-max)) / 2));
  padding: var(--home-editorial-label-top-total) clamp(24px, 3vw, 40px)
    clamp(28px, 2.8vw, 44px) var(--home-editorial-gutter);
  text-align: left;
}

/* HTML整理後：見出しブロック（header）内の縦積み・左揃えを維持 */
.page-home .home-recruit .home-recruit-heading.section-head {
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  width: 100%;
  max-width: 100%;
}

.page-home .home-recruit .home-recruit-heading .home-recruit-cta {
  align-self: flex-start;
}

.page-home .home-recruit .home-recruit-editorial-head.section-editorial-head {
  flex: 0 1 auto;
  width: 100%;
  max-width: 100%;
  margin: 0;
}

.page-home .home-recruit .section-editorial-accent {
  color: var(--home-recruit-accent, #c9a090);
  --home-editorial-accent-h: calc(clamp(12px, 0.42vw + 9px, 15px) * 1.15);
}

.page-home .home-recruit .section-editorial-label {
  font-size: clamp(12px, 0.42vw + 9px, 15px);
  letter-spacing: 0.44em;
  font-weight: 650;
  color: var(--home-recruit-label, #c9a090);
  text-shadow: 0 1px 12px rgba(8, 6, 8, 0.42);
}

.page-home .home-recruit .section-editorial-copy {
  gap: clamp(7px, 0.62vw, 10px);
}

.page-home .home-recruit .home-recruit-lead.section-editorial-subcopy {
  margin-top: clamp(14px, 1.35vw, 18px);
  margin-left: 0;
  margin-bottom: clamp(24px, 2.4vw, 32px);
  font-family: var(--font-story-meta, var(--font-page-serif));
  font-size: clamp(11px, calc(0.34vw + 8.93px), 12px);
  line-height: 1.7;
  letter-spacing: 0.038em;
  color: rgba(255, 248, 242, 0.92);
  font-weight: 400;
  max-width: min(29em, 100%);
  text-shadow: 0 1px 14px rgba(8, 6, 8, 0.32);
}

.page-home .home-recruit-cta {
  display: inline-flex;
  align-items: center;
  align-self: flex-start;
  width: fit-content;
  max-width: none;
  padding: 9px 14px;
  border: 1px solid var(--home-recruit-cta-border, rgba(255, 250, 246, 0.22));
  background: var(--home-recruit-cta-pink, rgba(158, 118, 126, 0.84));
  color: rgba(255, 255, 255, 0.98);
  text-decoration: none;
  font-family: var(--font-page-serif);
  font-size: 12px;
  font-weight: 500;
  letter-spacing: 0.045em;
  white-space: nowrap;
  transition: background 0.25s ease, border-color 0.25s ease, color 0.25s ease;
  box-shadow: 0 1px 8px rgba(12, 8, 10, 0.16);
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}

.page-home .home-recruit-cta span {
  margin-left: 6px;
}

.page-home .home-recruit-cta:hover {
  background: var(--home-recruit-cta-pink-hover, rgba(145, 106, 116, 0.82));
  border-color: rgba(255, 248, 244, 0.42);
  color: #fff;
}


/* ===== Home: Editor's Picks（§44） ===== */
/* §44 ─────── TOP ⑦ EDITOR'S PICKS（.home-picks：チャコール背景・3カラム） ───────
   巻末の静かな締め。カードは白箱にせず、横長サムネ＋店名＋地域のみ。 */
.home-picks {
  /* 編集圧の黒（単色 #18）。FOOTER（#11）より浅く、差は色のみ */
  background: #181818;
  background-color: #181818;
  color: rgba(255, 255, 255, 0.9);
  border-top: 1px solid rgba(80, 74, 70, 0.1);
}

.home-picks.home-band {
  padding-top: var(--home-editorial-label-top-band, clamp(52px, 5.6vw, 68px));
  /* FOOTER 手前の余韻（padding-bottom のみ・静かな呼吸） */
  padding-bottom: calc(clamp(120px, 5.8vw + 92px, 188px) - clamp(20px, 2.5vw, 40px));
}

.page-home .home-picks .home-picks-heading.section-head {
  padding-top: var(--home-editorial-label-top-head, clamp(16px, 1.75vw, 24px));
}

.home-picks-heading {
  margin-bottom: clamp(30px, 2.9vw, 42px);
}

.page-home .home-picks .home-picks-editorial-head.section-editorial-head {
  flex: 1 1 auto;
  min-width: 0;
}

.page-home .home-picks .section-editorial-accent {
  color: var(--home-picks-accent, #c4b8a8);
  --home-editorial-accent-h: calc(clamp(12px, 0.38vw + 9px, 15px) * 1.15);
}

.page-home .home-picks .section-editorial-label {
  font-size: clamp(12px, 0.38vw + 9px, 15px);
  letter-spacing: 0.48em;
  font-weight: 650;
  color: var(--home-picks-label, #c4b8a8);
}

.page-home .home-picks .section-editorial-copy {
  gap: clamp(6px, 0.55vw, 9px);
}

.home-picks-heading-row {
  display: flex;
  align-items: flex-end;
  justify-content: flex-start;
  gap: clamp(14px, 1.35vw, 22px);
  flex-wrap: wrap;
}

.page-home .home-picks .home-picks-lead.section-editorial-subcopy {
  margin-top: clamp(11px, 1.05vw, 15px);
  margin-left: 0;
  max-width: min(34em, 100%);
  font-family: var(--font-story-meta, var(--font-page-serif));
  font-size: clamp(13px, 0.4vw + 11px, 14.5px);
  font-weight: 400;
  line-height: 1.88;
  letter-spacing: 0.06em;
  color: rgba(255, 255, 255, 0.5);
}

.home-picks-heading-link {
  flex: 0 0 auto;
  align-self: flex-end;
  margin: 0 0 0.08em 0;
  font-family: var(--font-story-meta, var(--font-page-serif));
  font-size: clamp(15px, 0.55vw + 12px, 17px);
  font-weight: 500;
  letter-spacing: 0.06em;
  color: rgba(255, 255, 255, 0.58);
  text-decoration: none;
  white-space: nowrap;
  opacity: 0.9;
  transition: color 0.2s ease, opacity 0.2s ease;
}

.home-picks-heading-link span {
  margin-left: 8px;
}

.home-picks-heading-link:hover {
  color: rgba(255, 255, 255, 0.88);
  opacity: 1;
}

.home-picks-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: clamp(7px, 0.65vw, 10px);
  /* 既存の外側 bleed を起点に、画像群全体の外周だけ左右 10px 内側へ（カード個別余白は不変） */
  --home-picks-bleed: clamp(18px, 1.6vw, 28px);
  --home-picks-outer-inset: 10px;
  width: calc(100% + var(--home-picks-bleed) - 2 * var(--home-picks-outer-inset));
  max-width: none;
  margin-inline: calc(var(--home-picks-bleed) / -2 + var(--home-picks-outer-inset));
}

/* 編集部の選：サムネ上に字を載せ、一覧カード感を外す */
.page-home .home-picks-card {
  display: grid;
  grid-template-areas: "visual";
  align-items: stretch;
  text-decoration: none;
  color: inherit;
  background: transparent;
  border: none;
  box-shadow: none;
  border-radius: 0;
  transition: opacity 0.3s ease;
}

.page-home .home-picks-card:hover {
  opacity: 0.94;
}

.page-home .home-picks-thumb {
  grid-area: visual;
  position: relative;
  margin: 0;
  border-radius: 2px;
  overflow: hidden;
  aspect-ratio: 8 / 5;
  box-shadow: none;
}

.page-home .home-picks-thumb::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(
    180deg,
    rgba(8, 6, 5, 0.08) 0%,
    rgba(8, 6, 5, 0.02) 42%,
    rgba(8, 6, 5, 0.55) 78%,
    rgba(8, 6, 5, 0.78) 100%
  );
  pointer-events: none;
  z-index: 1;
}

.page-home .home-picks-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 40%;
  display: block;
  transform: scale(1);
  filter: brightness(0.78) contrast(1.14) saturate(0.88);
  transition: transform 0.45s ease, filter 0.45s ease;
}

.page-home .home-picks-card:hover .home-picks-thumb img {
  transform: scale(1.03);
  filter: brightness(0.82) contrast(1.1) saturate(0.92);
}

.page-home .home-picks-shop {
  grid-area: visual;
  align-self: end;
  position: relative;
  z-index: 2;
  margin: 0 0 calc(clamp(12px, 1.35vw, 16px) + 1.35em);
  padding: 0 clamp(14px, 1.35vw, 18px) 2px;
  font-family: var(--font-page-serif);
  font-size: clamp(14px, 0.6vw + 11px, 16px);
  font-weight: 600;
  letter-spacing: 0.045em;
  line-height: 1.34;
  color: rgba(255, 255, 255, 0.98);
  font-feature-settings: "palt" 1;
  text-shadow: 0 1px 12px rgba(0, 0, 0, 0.45);
}

.page-home .home-picks-loc {
  grid-area: visual;
  align-self: end;
  position: relative;
  z-index: 2;
  margin: 0 0 clamp(12px, 1.35vw, 16px);
  padding: 0 clamp(14px, 1.35vw, 18px);
  font-family: var(--font-story-meta, var(--font-page-serif));
  font-size: 11px;
  font-weight: 400;
  letter-spacing: 0.06em;
  line-height: 1.4;
  color: rgba(255, 255, 255, 0.52);
  text-shadow: 0 1px 8px rgba(0, 0, 0, 0.4);
}

/* §45 ─ Footer（黒系・編集メディア型）
 * §45.1  下層共通 … stories.html / story*.html（.site-footer / .footer-inner）
 * §45.2  トップ … index-new.html（.site-footer.home-footer / .footer-home-*）
 * §45.3  トップ SP … @media (max-width: 768px)
 * 要確認: .footer-line … style.css のみ定義（下層 stories 系）
 * 削除済み: .footer-brand / .footer-copy / .footer-home-top / .footer-home-editorial-* 等（旧黒フッター）
 * ──────────────────────────────────────────────────────────── */

/* §45.1  下層共通フッター */
.site-footer {
  margin-top: 0;
  padding: clamp(72px, 9vw, 112px) 26px 40px;
  background: #14161c;
  color: rgba(247, 241, 234, 0.72);
  text-align: center;
  border-top: none;
}

.footer-inner {
  max-width: 720px;
  margin: 0 auto;
}

/* §45.2  トップフッター（index-new.html） */
.page-home .site-footer {
  font-family: var(--font-page-serif);
  font-weight: 400;
  line-height: 1.85;
}

.page-home .site-footer.home-footer {
  position: relative;
  overflow: hidden;
  width: 100vw;
  max-width: none;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
  margin-top: 0;
  padding: 0;
  border-top: none;
  background-color: #111111;
  color: rgba(243, 243, 243, 0.72);
  text-align: left;
}

.page-home .site-footer.home-footer::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: 0;
  opacity: 0.045;
  mix-blend-mode: soft-light;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 256 256'%3E%3Cfilter id='a'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.8' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23a)'/%3E%3C/svg%3E");
  background-size: 180px 180px;
}

.page-home .footer-home-inner {
  position: relative;
  z-index: 1;
  max-width: var(--home-editorial-max);
  margin-left: auto;
  margin-right: auto;
  padding: clamp(108px, 11vw, 168px) var(--home-editorial-gutter) clamp(44px, 4.5vw, 68px);
  box-sizing: border-box;
}

/* 締めメッセージ */
.page-home .footer-home-closing {
  margin: 0;
}

.page-home .footer-home-closing-inner {
  display: flex;
  align-items: stretch;
  gap: clamp(22px, 2.6vw, 36px);
  max-width: min(620px, 64%);
  margin: 0 0 0 clamp(24px, 5vw, 96px);
}

.page-home .footer-home-closing-rule {
  flex-shrink: 0;
  display: block;
  width: 1px;
  align-self: stretch;
  min-height: 0;
  background: rgba(255, 255, 255, 0.22);
}

.page-home .footer-home-closing-text {
  flex: 1 1 auto;
  min-width: 0;
}

.page-home .footer-home-closing-lead,
.page-home .footer-home-closing-body {
  margin: 0;
  font-family: var(--font-page-serif);
  font-weight: 400;
  letter-spacing: 0.06em;
  line-height: 2.48;
  color: rgba(243, 243, 243, 0.76);
  font-feature-settings: "palt" 1;
}

.page-home .footer-home-closing-lead {
  font-size: clamp(18px, 0.72vw + 15px, 22px);
  margin-bottom: 0.55em;
}

.page-home .footer-home-closing-body {
  font-size: clamp(13px, 0.38vw + 11px, 15px);
  color: rgba(243, 243, 243, 0.58);
}

.page-home .footer-home-closing-body + .footer-home-closing-body {
  margin-top: 0;
}

/* 罫線 */
.page-home .footer-home-divider {
  display: block;
  width: 100%;
  height: 0;
  margin: clamp(104px, 10vw, 152px) 0 clamp(40px, 3.6vw, 58px);
  padding: 0;
  border: none;
  border-top: 1px solid rgba(255, 255, 255, 0.12);
  background: none;
}

/* フッター本体 */
.page-home .footer-home-body {
  position: relative;
}

.page-home .footer-home-body-main {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: clamp(32px, 5vw, 72px);
  margin-bottom: clamp(44px, 5vw, 68px);
}

.page-home .footer-home-brand {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: clamp(8px, 0.9vw, 12px);
  flex: 0 0 auto;
}

.page-home .footer-home-brand-name {
  margin: 0;
  font-family: "Work Sans", "IBM Plex Sans", "Helvetica Neue", sans-serif;
  font-size: clamp(22px, 1.45vw + 16px, 28px);
  font-weight: 700;
  letter-spacing: 0.08em;
  line-height: 1.32;
  text-transform: uppercase;
  color: #d8d8d8;
}

.page-home .footer-home-brand-tag,
.page-home .footer-home-brand-copy {
  margin: 0;
  font-family: "Work Sans", "IBM Plex Sans", "Helvetica Neue", sans-serif;
  font-weight: 500;
  letter-spacing: 0.28em;
  text-transform: uppercase;
  line-height: 1.6;
}

.page-home .footer-home-brand-tag {
  font-size: clamp(10px, 0.2vw + 8px, 11px);
  letter-spacing: 0.24em;
  color: rgba(243, 243, 243, 0.52);
}

.page-home .footer-home-brand-copy {
  font-size: clamp(9px, 0.17vw + 7.5px, 10px);
  letter-spacing: 0.18em;
  color: rgba(243, 243, 243, 0.38);
}

.page-home .footer-home-meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-end;
  gap: clamp(20px, 2.8vw, 40px);
  flex: 1 1 auto;
  min-width: 0;
}

.page-home .footer-home-nav {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: clamp(14px, 1.6vw, 20px);
}

.page-home .footer-home-nav a,
.page-home .footer-home-follow-label,
.page-home .footer-home-follow a {
  font-family: "Work Sans", "IBM Plex Sans", "Helvetica Neue", sans-serif;
  font-size: clamp(11px, 0.38vw + 9px, 13px);
  font-weight: 500;
  letter-spacing: 0.26em;
  text-transform: uppercase;
  text-decoration: none;
  line-height: 1.65;
}

.page-home .footer-home-nav a {
  color: rgba(243, 243, 243, 0.66);
  transition: color 0.25s ease;
}

.page-home .footer-home-nav a:hover {
  color: rgba(243, 243, 243, 0.82);
}

.page-home .footer-home-nav-sep {
  font-family: "Work Sans", "IBM Plex Sans", sans-serif;
  font-size: clamp(11px, 0.38vw + 9px, 13px);
  font-weight: 400;
  letter-spacing: 0.08em;
  color: rgba(255, 255, 255, 0.26);
  user-select: none;
}

.page-home .footer-home-follow {
  --footer-home-follow-gap: clamp(16px, 1.8vw, 24px);
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--footer-home-follow-gap);
}

.page-home .footer-home-follow-label {
  color: rgba(243, 243, 243, 0.52);
}

.page-home .footer-home-follow a {
  font-weight: 400;
  letter-spacing: 0.2em;
  color: rgba(243, 243, 243, 0.66);
  transition: color 0.25s ease;
}

.page-home .footer-home-follow a:hover {
  color: rgba(243, 243, 243, 0.82);
}

.page-home .footer-home-bottom {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: clamp(24px, 3vw, 40px);
}

.page-home .footer-home-pagetop {
  display: inline-flex;
  flex-direction: column;
  align-items: flex-end;
  gap: clamp(14px, 1.4vw, 20px);
  text-decoration: none;
  color: rgba(243, 243, 243, 0.6);
  transition: color 0.25s ease;
  flex-shrink: 0;
}

.page-home .footer-home-pagetop:hover {
  color: rgba(243, 243, 243, 0.78);
}

.page-home .footer-home-pagetop-label {
  font-family: "Work Sans", "IBM Plex Sans", "Helvetica Neue", sans-serif;
  font-size: clamp(11px, 0.38vw + 9px, 13px);
  font-weight: 500;
  letter-spacing: 0.26em;
  text-transform: uppercase;
  line-height: 1.65;
}

.page-home .footer-home-pagetop-mark {
  display: inline-flex;
  align-items: center;
  gap: clamp(12px, 1.2vw, 18px);
}

.page-home .footer-home-pagetop-line {
  display: block;
  width: clamp(128px, 13vw, 196px);
  height: 1px;
  background: rgba(255, 255, 255, 0.32);
}

.page-home .footer-home-pagetop-arrow {
  font-family: "Work Sans", "IBM Plex Sans", sans-serif;
  font-size: clamp(13px, 0.38vw + 11px, 16px);
  letter-spacing: 0;
  line-height: 1;
}

/* §45.3  SPフッター完成版（max-width: 768px）
   正本は HOME の実装値。ページクラスではなく .site-footer.home-footer に一本化し、
   下層のページ別 SP 指定（§57 / EDITOR'S PICKS）より詳細度を上げて同じ結果にする。
   PC（769px以上）は各ページの既存指定のまま。 */
@media (max-width: 768px) {
  .site-footer.home-footer {
    --home-sp-content-edge: 12px;
  }

  /* 左右は紙面基準12pxに対し左+11px / 右+5px。上書き前の --home-sp-editorial-x は使わない。 */
  .site-footer.home-footer .footer-home-inner {
    max-width: 100%;
    padding-top: clamp(72px, 10.5vw, 100px);
    padding-right: calc(var(--home-sp-content-edge) + 5px);
    padding-bottom: clamp(42px, 4.5vw, 60px);
    padding-left: calc(var(--home-sp-content-edge) + 11px);
  }

  .site-footer.home-footer .footer-home-closing-inner {
    max-width: 100%;
    margin-left: 0;
    gap: clamp(20px, 5vw, 32px);
  }

  .site-footer.home-footer .footer-home-closing-lead {
    font-size: calc(clamp(17px, 0.78vw + 14px, 20px) * 0.9);
    margin-bottom: calc(0.55 * clamp(17px, 0.78vw + 14px, 20px));
  }

  .site-footer.home-footer .footer-home-closing-body {
    font-size: calc(clamp(12px, 0.45vw + 10px, 14px) * 0.9);
  }

  .site-footer.home-footer .footer-home-divider {
    margin: clamp(88px, 12vw, 116px) 0 clamp(32px, 4.2vw, 46px);
    /* 内側paddingは左+11px / 右+5px。左余白に合わせて右を6px縮める */
    width: calc(100% - 6px);
  }

  .site-footer.home-footer .footer-home-pagetop-line {
    width: clamp(100px, 28vw, 148px);
  }

  .site-footer.home-footer .footer-home-body-main {
    flex-direction: column;
    align-items: flex-start;
    gap: clamp(28px, 5.5vw, 38px);
    margin-bottom: clamp(36px, 5.8vw, 48px);
  }

  .site-footer.home-footer .footer-home-brand {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: clamp(8px, 0.9vw, 12px);
    flex: 0 0 auto;
  }

  .site-footer.home-footer .footer-home-meta {
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
    gap: calc(clamp(20px, 4vw, 28px) - 15px);
    margin-left: -6px;
  }

  .site-footer.home-footer .footer-home-nav {
    gap: clamp(14px, 1.6vw, 20px);
  }

  .site-footer.home-footer .footer-home-follow {
    --footer-home-follow-gap: clamp(16px, 1.8vw, 24px);
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--footer-home-follow-gap);
  }

  .site-footer.home-footer .footer-home-follow a {
    font-weight: 400;
    letter-spacing: 0.2em;
  }

  .site-footer.home-footer .footer-home-bottom {
    flex-direction: column;
    align-items: flex-start;
    gap: clamp(28px, 5.5vw, 38px);
  }

  .site-footer.home-footer .footer-home-pagetop {
    align-self: flex-end;
  }

  .site-footer.home-footer .footer-home-pagetop-arrow {
    font-family: "Work Sans", "IBM Plex Sans", sans-serif;
    font-size: clamp(13px, 0.38vw + 11px, 16px);
    letter-spacing: 0;
    line-height: 1;
  }

  .site-footer.home-footer .footer-home-brand,
  .site-footer.home-footer .footer-home-brand-copy {
    margin-left: -6px;
  }

  .site-footer.home-footer .footer-home-brand-name {
    font-size: calc(clamp(22px, 1.45vw + 16px, 28px) * 1.04);
  }

  .site-footer.home-footer .footer-home-brand-tag {
    font-size: calc(clamp(10px, 0.2vw + 8px, 11px) * 0.93 * 0.9);
    line-height: calc(clamp(10px, 0.2vw + 8px, 11px) * 0.93 * 1.6);
    letter-spacing: 0.24em;
    color: rgba(190, 190, 190, 0.4);
  }

  .site-footer.home-footer .footer-home-brand-copy {
    font-size: clamp(9px, 0.17vw + 7.5px, 10px);
    letter-spacing: 0.18em;
  }

  .site-footer.home-footer .footer-home-nav a,
  .site-footer.home-footer .footer-home-follow-label,
  .site-footer.home-footer .footer-home-follow a {
    font-size: calc(clamp(11px, 0.38vw + 9px, 13px) * 0.96);
  }

  .site-footer.home-footer .footer-home-nav-sep {
    font-size: calc(clamp(11px, 0.38vw + 9px, 13px) * 0.96);
  }
}

/* §46 ─────── 共通装飾：セクション上段ラベル ─────── */
/* セクション上段ラベル（英小文字・情報サイト風） */
.section-eyebrow {
  margin: 0 0 14px;
  font-family: var(--font-story-meta);
  font-size: 11px;
  font-weight: 500;
  letter-spacing: 0.28em;
  text-transform: uppercase;
  color: #7a736c;
}

.section-eyebrow--sans {
  font-family: var(--font-story-meta);
}

.section-eyebrow--warm {
  letter-spacing: 0.2em;
  text-transform: none;
  font-size: 12px;
  color: #924a3d;
  font-weight: 600;
}


/* §51 ─────── 共通カード（.story-card / .thumb 等・stories.html 等で使用） ─────── */

.stories-archive .stories-list {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
  gap: clamp(20px, 3vw, 28px);
  margin: 0 0 clamp(40px, 6vw, 56px);
}


.story-card {
  width: calc(33.333% - 20px);
  max-width: 312px;
  flex: 1 1 calc(33.333% - 22px);
  cursor: pointer;
  transition: transform 0.35s ease, box-shadow 0.35s ease;
  box-shadow:
    0 4px 8px rgba(42, 34, 28, 0.06),
    0 14px 36px rgba(42, 34, 28, 0.12);
  border-radius: 3px;
  overflow: hidden;
  background: #fff;
  padding-bottom: 8px;
  border: 1px solid rgba(58, 48, 40, 0.1);
}

.story-card:hover {
  transform: translateY(-5px);
  box-shadow:
    0 8px 16px rgba(42, 34, 28, 0.08),
    0 22px 48px rgba(42, 34, 28, 0.16);
}

.story-card a {
  display: flex;
  flex-direction: column;
  height: 100%;
  text-decoration: none;
  color: #2c2825;
  box-sizing: border-box;
}

.thumb {
  width: 100%;
  height: 0;
  padding-bottom: 62%;
  background: #d8d0c8;
  overflow: hidden;
  position: relative;
}

.thumb img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  filter: saturate(1.03) contrast(1.04);
}

/* STORIES カード：3階層（カテゴリ / タイトル / 日付） */
.story-card-text {
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
  min-height: 0;
  padding: 20px 18px 22px;
  box-sizing: border-box;
}

.story-card .thumb {
  margin-bottom: 12px;
}

.story-category {
  margin: 0 0 6px;
  font-family: var(--font-story-meta);
  font-size: 12px;
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: 0.02em;
  color: #888;
}

.story-title {
  margin: 0 0 10px;
  padding: 0;
  font-family: var(--font-page-serif);
  font-size: 17px;
  font-weight: 500;
  line-height: 1.7;
  letter-spacing: 0.02em;
  color: #2c2825;
  font-feature-settings: "palt" 1;
}

.story-card img {
  margin-bottom: 12px;
}

.story-date {
  display: block;
  margin: 0;
  margin-top: auto;
  padding-top: 0;
  font-family: var(--font-story-meta);
  font-size: 11px;
  font-weight: 400;
  line-height: 1.5;
  letter-spacing: 0.02em;
  color: #aaa;
}



/* §55 旧フッター記述 … §45 へ統合済み（本文削除） */

/* §56 ─────── 記事ページ（.article-* / .related-* / .breadcrumb / .stories-archive 等） ─────── */
/* 記事ページ（読みやすさ優先）
   構造: main.article-main > article.article-page > section.article-hero | section.article-content */
main section.article-hero {
  padding: 48px 20px 40px;
  border-bottom: 1px solid #eee;
}

.article-hero h1 {
  font-family: var(--font-page-serif);
  font-size: clamp(29px, 2.95vw + 10px, 32px);
  line-height: 1.42;
  font-weight: 600;
  letter-spacing: 0.06em;
  margin: 0;
  max-width: 40rem;
  font-feature-settings: "palt" 1;
}

.article-lead {
  margin: 17px 0 0;
  font-family: var(--font-page-serif);
  font-size: 17px;
  line-height: 1.82;
  font-weight: 300;
  letter-spacing: 0.03em;
  color: #444;
  max-width: 40rem;
  font-feature-settings: "palt" 1;
}

main section.article-content {
  padding: 40px 20px 96px;
}

.article-content p {
  margin: 0 0 1.35em;
  font-family: var(--font-page-serif);
  font-size: 17px;
  line-height: 1.82;
  font-weight: 300;
  letter-spacing: 0.02em;
  color: #444;
  max-width: 40rem;
  font-feature-settings: "palt" 1;
}

.article-content p:last-child {
  margin-bottom: 0;
}

.article-image {
  margin-bottom: 40px;
  border-radius: 8px;
  overflow: hidden;
}

.article-image img {
  width: 100%;
  height: 420px;
  object-fit: cover;
  display: block;
  transition: 0.4s;
}

.article-image img:hover {
  transform: scale(1.03);
}

.article-cta {
  margin-top: 80px;
  text-align: center;
  padding-top: 60px;
  border-top: 1px solid #ddd;
}

.article-cta h2 {
  font-family: var(--font-page-serif);
  font-size: 30px;
  font-weight: 500;
  letter-spacing: 0.09em;
  line-height: 1.35;
  font-feature-settings: "palt" 1;
}

.article-cta p {
  margin-top: 14px;
  font-family: var(--font-page-serif);
  font-size: 16px;
  font-weight: 300;
  line-height: 1.9;
  letter-spacing: 0.03em;
  color: #444;
  font-feature-settings: "palt" 1;
}

.article-cta a {
  display: inline-block;
  margin-top: 24px;
  text-decoration: none;
  border: 1px solid black;
  padding: 12px 24px;
  color: black;
}

.related-stories {
  margin-top: 80px;
  padding-top: 60px;
  border-top: 1px solid #ddd;
}

.related-stories h2 {
  font-family: var(--font-page-serif);
  font-size: 26px;
  font-weight: 500;
  letter-spacing: 0.09em;
  line-height: 1.35;
  margin-bottom: 24px;
  font-feature-settings: "palt" 1;
}

.related-list {
  display: flex;
  gap: 24px;
}

.related-card {
  width: 50%;
}

.related-card a {
  display: block;
  text-decoration: none;
  color: black;
}

.related-card img {
  width: 100%;
  height: 200px;
  object-fit: cover;
  display: block;
}

.related-card h3 {
  font-family: var(--font-page-serif);
  font-size: 16px;
  font-weight: 500;
  letter-spacing: 0.08em;
  line-height: 1.55;
  margin-top: 12px;
  font-feature-settings: "palt" 1;
}

.breadcrumb {
  font-family: var(--font-page-serif);
  font-size: 14px;
  font-weight: 300;
  margin: 40px 0 32px;
  color: #666;
  letter-spacing: 0.03em;
}

.breadcrumb a {
  text-decoration: none;
  color: #333;
}

.breadcrumb span {
  margin: 0 4px;
}

.breadcrumb-wrap {
  max-width: 1000px;
  margin: 0 auto;
  padding: 0 20px;
}

.stories-main {
  max-width: 1000px;
  margin: 0 auto;
  padding: 80px 20px;
}

.stories-hero {
  padding: 20px 0 40px;
  border-bottom: 1px solid #ddd;
}

.stories-hero h1 {
  font-family: var(--font-page-serif);
  font-size: clamp(43px, 6.38vw + 6px, 60px);
  font-weight: 600;
  letter-spacing: 0.09em;
  line-height: 1.22;
  margin: 0;
  font-feature-settings: "palt" 1;
}

.stories-hero p {
  margin-top: 8px;
  font-family: var(--font-page-serif);
  font-size: 16px;
  font-weight: 300;
  line-height: 1.9;
  letter-spacing: 0.03em;
  color: #444;
}

.stories-archive {
  padding-top: 40px;
}

.stories-archive .story-card {
  width: 32.5%;
}

.stories-archive .thumb {
  height: 220px;
}

.stories-hero p.stories-catch {
  margin-top: 24px;
  font-family: var(--font-page-serif);
  font-size: 18px;
  font-weight: 300;
  line-height: 1.9;
  letter-spacing: 0.03em;
  color: #444;
  font-feature-settings: "palt" 1;
}

.story-sub {
  margin-top: 8px;
  font-family: var(--font-page-serif);
  font-size: 15px;
  font-weight: 300;
  line-height: 1.9;
  color: #444;
  letter-spacing: 0.03em;
}

.stories-hero p.stories-sub {
  margin-top: 8px;
  font-family: var(--font-page-serif);
  font-size: 13px;
  font-weight: 300;
  line-height: 1.9;
  letter-spacing: 0.14em;
  color: #444;
}

.article-card {
  display: block;
  text-decoration: none;
  color: inherit;
  transition: 0.3s;
}

.article-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 10px 30px rgba(0,0,0,0.08);
}

/* 一覧：カード全体が <a> のとき、グリッドで高さを揃える */
a.article-card.story-card {
  display: flex;
  flex-direction: column;
  height: 100%;
  box-sizing: border-box;
}

/* 一覧ページなど：アスペクト比率指定のないカードサムネ */
.stories-archive .thumb {
  position: relative;
  height: 220px;
  padding-bottom: 0;
}

.stories-archive .thumb img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* HOME本文：右端白余白 bleed（§40 カード定義の後段で一括上書き・header/footer除外） */
.page-home .home-go-forth .home-go-forth-card,
.page-home .home-go-forth .home-go-forth-card.story-card {
  overflow: visible;
}

.page-home .home-go-forth .home-go-forth-card:first-child .thumb,
.page-home .home-go-forth .home-go-forth-card:not(:first-child) .thumb {
  width: calc(100% + var(--home-body-right-trim, 4px));
  max-width: none;
}

.page-home .home-backstory-strip .home-backstory-strip-card,
.page-home .home-backstory-strip .home-backstory-card {
  overflow: visible;
}

.page-home .home-backstory-strip .home-backstory-strip-card .thumb,
.page-home .home-backstory-strip .home-backstory-card .thumb {
  width: calc(100% + var(--home-body-right-trim, 4px));
  max-width: none;
}

.page-home .home-dogcare .home-dogcare-card {
  overflow: visible;
}

.page-home .home-dogcare .home-dogcare-card .thumb {
  width: calc(100% + var(--home-body-right-trim, 4px));
  max-width: none;
}

.page-home .home-picks .home-picks-card {
  overflow: visible;
}

.page-home .home-picks .home-picks-thumb {
  width: calc(100% + var(--home-body-right-trim, 4px));
  max-width: none;
}

@media (min-width: 769px) {
  .page-home .home-dogcare .home-dogcare-grid {
    width: calc(100% + var(--home-body-right-trim, 4px));
    max-width: none;
  }

  .page-home .home-go-forth .home-go-forth-carousel,
  .page-home .home-backstory-strip .home-backstory-strip-carousel,
  .page-home .home-backstory-strip .home-backstory-carousel {
    width: calc(100% + var(--home-body-right-trim, 4px));
    max-width: none;
  }
}

/* ===== Home: SP ≤768px — Category / Article strips / Recruit / Picks（§91 内） ===== */
/* ⚠ PROTECTED — §91 @media (max-width: 768px)（削除・統合・移動禁止）
   HERO/SP 上書きは RECRUIT ブロック直後（歴史的並び）。ルール順変更＝見た目変更。
   末尾付近の SP コンテナグループ（padding 20px）も同一 MQ 内で維持。 */
/* §91 ─────── @media (max-width: 768px)：本文・SP全般の調整（フッター SP → §45.3） ─────── */
@media (max-width: 768px) {
  /* HOME SP：編集コピー列トークン（ガター20px + inset18px ≈ 38px） */
  .page-home {
    --home-sp-gutter: 20px;
    --home-sp-editorial-inset: var(--home-editorial-subcopy-indent);
    --home-sp-editorial-x: calc(var(--home-sp-gutter) + var(--home-sp-editorial-inset));
  }

  /* §91 内訳：stories-archive → .home-card-grid → RECRUIT → PICKS → 記事帯 → カテゴリ */
  /* §50/§52 SP 旧 INTRO / 旧 REALITY 削除済み */


  .stories-archive .stories-list {
    flex-direction: column;
    align-items: center;
    gap: 36px;
  }

  .stories-archive .story-card,
  .story-card,
  .article-card {
    width: 100%;
    max-width: 440px;
  }

  .stories-archive .stories-list .thumb {
    height: auto;
    min-height: 220px;
    padding-bottom: 58%;
    aspect-ratio: auto;
  }

  /* §22 SP 旧 HERO（.hero-pc / .hero-sp / .hero-sp-image / .hero-sp-content 等）削除済み */

  /* --- §91：トップ .home-card-grid（GO FORTH / BACK STORY トラックは個別指定のため対象外） --- */

  /* ===== Home: SP ≤768px — Recruit（※直後に HERO ルールが続く：歴史的並び・見た目維持のため移動未実施） ===== */
  .home-recruit.home-band {
    padding-top: 0;
    padding-bottom: 0;
  }

  .page-home .home-recruit-inner {
    max-width: none;
    padding: 0;
  }

  /* ⚠ PROTECTED — §91 HERO/SP 上書き（削除・統合・移動禁止）
     ::before/::after・hero-inner padding・hero-text transform(0,0)・CTA margin 等。§90 と併用。 */
  /* --- §91：HERO（§90 ヘッダーと併用・本文は本ブロックが最終） --- */
  .page-home main section.hero.home-hero {
    /* SP：外周 630px（実機で確実に効く固定指定） */
    height: 630px;
    min-height: 630px;
  }

  .page-home main section.hero.home-hero::before {
    background:
      /* 上部のみごく弱い明光（ロゴ〜頭部付近）。中央以降は透過で現状トーン維持 */
      linear-gradient(
        to bottom,
        rgba(255, 252, 248, 0.28) 0%,
        rgba(252, 249, 245, 0.16) 12%,
        rgba(250, 246, 240, 0.07) 26%,
        rgba(248, 244, 238, 0.025) 38%,
        transparent 50%
      ),
      radial-gradient(
        130% 104% at -5% 34%,
        rgba(252, 249, 245, 0.54) 0%,
        rgba(250, 246, 240, 0.47) 17%,
        rgba(247, 242, 235, 0.31) 31%,
        rgba(245, 240, 230, 0.12) 45%,
        rgba(244, 239, 228, 0.028) 56%,
        transparent 70%
      ),
      linear-gradient(
        to right,
        rgba(250, 246, 240, 0.1) 0%,
        rgba(247, 242, 235, 0.05) 20%,
        rgba(244, 239, 228, 0.016) 34%,
        transparent 48%
      ),
      rgba(246, 241, 233, 0.065);
  }

  .page-home main section.hero.home-hero::after {
    /* SP：比率を保ったまま領域全体を覆う。はみ出した分だけトリミング */
    background-image: url("assets/img/home/hero-027.jpg");
    background-size: cover;
    background-position: center center;
  }

  .page-home .home-hero .hero-go-forth {
    right: 24px;
    bottom: 9px;
    font-size: 14px; /* SPのみ：さらに一段小さく（位置・書体・scaleYは維持） */
    color: rgba(255, 252, 248, 0.5);
    text-shadow: 0 1px 8px rgba(18, 14, 10, 0.32);
  }

  .page-home .home-hero .logo-img {
    height: clamp(54px, 5.4vw + 36px, 62px);
    opacity: 0.78;
  }

  .page-home .home-hero .logo {
    margin-left: calc(var(--home-sp-editorial-inset) - 10px);
  }

  .page-home .home-hero .header-actions {
    margin-right: 0;
  }

  .page-home .home-hero .hero-inner {
    max-width: 100%;
    height: auto;
    min-height: 0;
    justify-content: flex-start;
    align-items: flex-start;
    padding: clamp(170px, 32vw, 210px) 0 clamp(20px, 5vw, 32px);
  }

  .page-home .home-hero .hero-text {
    margin-right: 0;
    max-width: min(100%, 36rem);
    padding-left: var(--home-editorial-subcopy-indent);
    box-sizing: border-box;
    transform: translate(-12px, 0); /* SP：現在(-4)からさらに左へ8px（縦位置維持） */
    transform-origin: left top;
  }

  .page-home .home-hero .hero-eyebrow {
    margin-bottom: 18px;
    font-size: clamp(16px, 0.65vw + 13px, 18px);
  }

  .page-home .home-hero .hero-title,
  .page-home main section.hero.home-hero h1.hero-title {
    font-size: clamp(24px, 5.45vw + 8.5px, 37px);
    color: rgba(12, 10, 8, 0.86);
    text-shadow:
      0 0 3px rgba(255, 255, 255, 0.24),
      0 1px 2px rgba(255, 255, 255, 0.12);
  }

  .page-home .home-hero .hero-title span:first-child,
  .page-home .home-hero .hero-title span:last-child {
    color: rgba(12, 10, 8, 0.86);
  }

  .page-home .home-hero .hero-lead {
    color: rgba(12, 10, 8, 0.73);
    font-size: 11.5px;
    line-height: 2.08;
    margin-top: 16px;
    transform: translateY(-3px);
    text-shadow:
      0 0 7px rgba(255, 255, 255, 0.4),
      0 1px 4px rgba(255, 255, 255, 0.28);
  }

  .page-home .home-hero .hero-lead-break-pc {
    display: none;
  }

  .page-home .home-hero .hero-lead-break-sp {
    display: block;
  }

  .page-home .section-lead-br-sp {
    display: block;
  }

  .page-home .home-hero .hero-cta {
    margin-top: 12px;
    gap: 6px;
    padding: 7px 14px;
    color: #222;
    font-size: 9px;
    font-weight: 500;
    border-width: 1px;
    border-color: rgba(12, 10, 8, 0.18);
  }

  .page-home .home-recruit-layout {
    width: 100%;
    margin-left: 0;
    margin-right: 0;
    aspect-ratio: var(--home-recruit-visual-ratio-sp, 5 / 2);
    min-height: clamp(514px, calc(96vw + 100px), 676px);
    background-position: 58% 42%;
  }

  .page-home .home-recruit-layout::before {
    background: linear-gradient(
      90deg,
      rgba(16, 13, 14, 0.48) 0%,
      rgba(20, 16, 18, 0.3) 28%,
      rgba(22, 20, 24, 0.14) 46%,
      transparent 66%
    );
  }

  .page-home .home-recruit-text {
    max-width: min(22rem, 88%);
    margin-left: 0;
    padding: calc(var(--home-editorial-label-top-total) + 24px) 22px clamp(148px, calc(4vw + 128px), 156px) 20px;
  }

  /* HOME SP：RECRUIT 本文（サブコピー・CTA）も日本語タイトルと同じ本文基準
     （対称ガター20px + 左編集インセット）へ。カード／PICKS と同一トークンを参照。 */
  .page-home .home-recruit .home-recruit-lead.section-editorial-subcopy {
    margin-top: clamp(24px, calc(2.8vw + 12px), 28px);
    margin-left: var(--home-editorial-subcopy-indent);
    font-size: 12px;
    line-height: 1.75;
    margin-bottom: 20px;
    color: rgba(255, 248, 242, 0.92);
  }

  .page-home .home-recruit .home-recruit-cta {
    margin-left: var(--home-editorial-subcopy-indent);
    font-size: 10.125px;
    height: 36.22px;
    padding: 6.99px 15px;
    min-height: 34px;
    box-sizing: border-box;
    transform: translateY(12px);
  }

  .page-home .home-go-forth.home-band {
    margin-top: 20px;
    border-top: none;
  }

  .page-home .home-go-forth .home-go-forth-heading {
    padding-top: calc(clamp(26px, 7vw, 38px) + 15px);
    padding-bottom: clamp(14px, calc(5vw - 8px), 22px);
  }

  .page-home .home-backstory-strip .home-backstory-strip-heading,
  .page-home .home-dogcare .home-dogcare-heading {
    padding-top: calc(clamp(26px, 7vw, 38px) + 30px);
    padding-bottom: clamp(14px, calc(5vw - 8px), 22px);
  }

  /* HOME 見出し — 変更前基準：日本語見出し 上 +5px／下 +12px（GO FORTH〜PICKS） */
  .page-home .home-go-forth .section-editorial-copy,
  .page-home .home-dogcare .section-editorial-copy,
  .page-home .home-picks .section-editorial-copy {
    gap: clamp(11px, calc(0.55vw + 5px), 14px);
  }

  .page-home .home-backstory-strip .section-editorial-copy,
  .page-home .home-recruit .section-editorial-copy {
    gap: clamp(12px, calc(0.62vw + 5px), 15px);
  }

  .page-home .home-picks .home-picks-heading.section-head,
  .home-picks-heading {
    margin-bottom: clamp(2px, calc(2.9vw - 28px), 14px);
  }

  .page-home .home-go-forth .section-lead,
  .page-home .home-go-forth #home-go-forth-heading,
  .page-home .home-backstory-strip .section-lead,
  .page-home .home-backstory-strip #home-backstory-heading,
  .page-home .home-dogcare .section-lead,
  .page-home .home-dogcare #home-dogcare-heading,
  .page-home .home-recruit .section-lead,
  .home-recruit-text h2,
  #home-recruit-heading,
  .page-home .home-picks .section-lead,
  .home-picks-heading h2,
  #home-picks-heading {
    font-size: var(--home-editorial-title-size-sp, clamp(19px, calc(4.383vw + 6.85px), 24px));
  }

  .page-home .home-go-forth .home-go-forth-heading-row,
  .page-home .home-backstory-strip .home-backstory-strip-heading-row,
  .page-home .home-dogcare .home-dogcare-heading-row,
  .home-picks-heading-row {
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: flex-start;
  }

  /* HOME SP：英字カテゴリー＋縦棒線ユニット位置（日本語タイトル位置は維持） */
  .page-home .home-go-forth .home-go-forth-editorial-band.section-editorial-head,
  .page-home .home-backstory-strip .home-backstory-editorial-band.section-editorial-head,
  .page-home .home-dogcare .home-dogcare-editorial-band.section-editorial-head,
  .page-home .home-recruit .home-recruit-editorial-head.section-editorial-head,
  .page-home .home-picks .home-picks-editorial-head.section-editorial-head {
    margin-left: 20px;
  }

  /* HOME SP：日本語タイトル字頭を編集コピー列に維持（英字・縦線ユニット移動分を相殺） */
  .page-home .home-go-forth .home-go-forth-editorial-band .section-editorial-copy > .section-lead,
  .page-home .home-backstory-strip .home-backstory-editorial-band .section-editorial-copy > .section-lead,
  .page-home .home-dogcare .home-dogcare-editorial-band .section-editorial-copy > .section-lead,
  .page-home .home-recruit .home-recruit-editorial-head .section-editorial-copy > .section-lead,
  .page-home .home-picks .home-picks-editorial-head .section-editorial-copy > .section-lead {
    margin-left: -20px;
  }

  .page-home .home-go-forth .home-go-forth-editorial-band.section-editorial-head,
  .page-home .home-backstory-strip .home-backstory-editorial-band.section-editorial-head,
  .page-home .home-dogcare .home-dogcare-editorial-band.section-editorial-head {
    flex: 1 1 0;
    min-width: 0;
  }

  /* HOME SP：GO FORTH / BACK STORY / DOG CARE カード領域
     画面左右に約12px余白。
     ラベル・見出し・「すべてを見る」は .home-container 側のため対象外。
     ※戻す場合：margin-left / width を subcopy-indent 揃えに復元 */
  .page-home .home-go-forth .home-go-forth-carousel,
  .page-home .home-backstory-strip .home-backstory-strip-carousel,
  .page-home .home-backstory-strip .home-backstory-carousel,
  .page-home .home-dogcare .home-dogcare-grid {
    margin-left: calc(12px - var(--home-sp-gutter, 20px));
    width: calc(100% + (2 * var(--home-sp-gutter, 20px)) - 24px);
    max-width: none;
    box-sizing: border-box;
  }

  .page-home .home-go-forth .home-go-forth-heading-link,
  .page-home .home-backstory-strip .home-backstory-strip-heading-link,
  .page-home .home-dogcare .home-dogcare-heading-link,
  .home-picks-heading-link {
    flex: 0 0 auto;
    align-self: flex-start;
    margin: 0.2em 0 0 auto;
    width: auto;
    padding-left: clamp(7px, 0.65vw, 12px);
    font-size: clamp(10.5px, 0.3vw + 9px, 13px);
    font-weight: 500;
    line-height: 1.35;
    letter-spacing: 0.04em;
    text-decoration: none;
    white-space: nowrap;
  }

  /* HOME SP：GO FORTH / BACK STORY / DOG CARE / EDITOR'S PICKS — 上段ラベル+CTA／下段見出し全幅（左端ライン維持） */
  .page-home .home-go-forth .home-go-forth-heading-row,
  .page-home .home-backstory-strip .home-backstory-heading-row,
  .page-home .home-backstory-strip .home-backstory-strip-heading-row,
  .page-home .home-dogcare .home-dogcare-heading-row,
  .page-home .home-picks .home-picks-heading-row {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    grid-template-areas:
      "accent label link"
      ". title title";
    align-items: start;
    column-gap: var(--home-editorial-head-gap, clamp(13px, 1.15vw, 18px));
    row-gap: clamp(11px, calc(0.55vw + 5px), 14px);
    margin-left: 20px;
    box-sizing: border-box;
  }

  .page-home .home-go-forth .home-go-forth-editorial-band.section-editorial-head,
  .page-home .home-go-forth .home-go-forth-editorial-band .section-editorial-copy,
  .page-home .home-backstory-strip .home-backstory-editorial-band.section-editorial-head,
  .page-home .home-backstory-strip .home-backstory-editorial-band .section-editorial-copy,
  .page-home .home-dogcare .home-dogcare-editorial-band.section-editorial-head,
  .page-home .home-dogcare .home-dogcare-editorial-band .section-editorial-copy,
  .page-home .home-picks .home-picks-editorial-head.section-editorial-head,
  .page-home .home-picks .home-picks-editorial-head .section-editorial-copy {
    display: contents;
  }

  .page-home .home-go-forth .home-go-forth-editorial-band.section-editorial-head,
  .page-home .home-backstory-strip .home-backstory-editorial-band.section-editorial-head,
  .page-home .home-dogcare .home-dogcare-editorial-band.section-editorial-head,
  .page-home .home-picks .home-picks-editorial-head.section-editorial-head {
    margin-left: 0;
  }

  .page-home .home-go-forth .section-editorial-accent,
  .page-home .home-backstory-strip .section-editorial-accent,
  .page-home .home-dogcare .section-editorial-accent,
  .page-home .home-picks .section-editorial-accent {
    grid-area: accent;
  }

  .page-home .home-go-forth .section-editorial-label,
  .page-home .home-backstory-strip .section-editorial-label,
  .page-home .home-dogcare .section-editorial-label,
  .page-home .home-picks .section-editorial-label {
    grid-area: label;
    min-width: 0;
  }

  .page-home .home-go-forth .home-go-forth-heading-link,
  .page-home .home-backstory-strip .home-backstory-heading-link,
  .page-home .home-backstory-strip .home-backstory-strip-heading-link,
  .page-home .home-dogcare .home-dogcare-heading-link,
  .page-home .home-picks .home-picks-heading-link {
    grid-area: link;
    align-self: start;
    margin: 0.2em 0 0 0;
    justify-self: end;
  }

  .page-home .home-go-forth .home-go-forth-editorial-band .section-editorial-copy > .section-lead,
  .page-home .home-go-forth #home-go-forth-heading,
  .page-home .home-backstory-strip .home-backstory-editorial-band .section-editorial-copy > .section-lead,
  .page-home .home-backstory-strip #home-backstory-heading,
  .page-home .home-dogcare .home-dogcare-editorial-band .section-editorial-copy > .section-lead,
  .page-home .home-dogcare #home-dogcare-heading,
  .page-home .home-picks .home-picks-editorial-head .section-editorial-copy > .section-lead,
  .page-home .home-picks #home-picks-heading {
    grid-area: title;
    grid-column: 2 / -1;
    width: auto;
    max-width: 100%;
    box-sizing: border-box;
  }

  /* GO FORTH SP：BACK STORY 同 letter-spacing(0.042em) を維持し2行確保（見出し使用可能幅のみ拡張） */
  .page-home .home-go-forth .home-go-forth-editorial-band .section-editorial-copy > .section-lead,
  .page-home .home-go-forth #home-go-forth-heading {
    max-width: none;
    width: calc(100% + 24px);
  }

  .home-picks-heading-link span {
    margin-left: 0;
  }

  .page-home .home-go-forth .section-editorial-label,
  .page-home .home-backstory-strip .section-editorial-label,
  .page-home .home-dogcare .section-editorial-label,
  .page-home .home-recruit .section-editorial-label,
  .page-home .home-picks .section-editorial-label {
    font-size: calc(clamp(16.5px, 0.66vw + 12.5px, 21.5px) * 0.82 * 0.9);
    line-height: calc(clamp(16.5px, 0.66vw + 12.5px, 21.5px) * 1.15);
    letter-spacing: 0.42em;
    font-weight: 700;
  }

  .page-home .home-picks.home-band {
    padding-top: calc(var(--home-editorial-label-top-band, clamp(52px, 5.6vw, 68px)) + 12px);
  }

  .home-picks-heading {
    text-align: left;
  }

  .page-home .home-picks .home-picks-lead.section-editorial-subcopy {
    display: none;
  }

  /* HOME SP：PICKS グリッドも本文基準（対称ガター20px + 左編集インセット）へ。
     GO FORTH / BACK STORY / DOG CARE のカードと同一責任者トークンを参照。 */
  .page-home .home-picks .home-picks-grid {
    grid-template-columns: 1fr;
    gap: clamp(10px, 2.5vw, 14px);
    margin-left: var(--home-editorial-subcopy-indent);
    width: calc(100% - var(--home-editorial-subcopy-indent));
    box-sizing: border-box;
    margin-top: 27px;
  }

  .page-home .home-picks-thumb {
    aspect-ratio: 8 / 5;
  }

  /* HOME SP：右端白余白 bleed（§91 PICKS 定義の直後で上書き） */
  .page-home .home-picks .home-picks-card {
    overflow: visible;
  }

  .page-home .home-picks .home-picks-thumb {
    width: calc(100% + var(--home-body-right-trim, 4px));
    max-width: none;
  }

  .page-home .home-picks-shop {
    margin-bottom: calc(clamp(10px, 2.5vw, 14px) + 1.3em);
    font-size: clamp(15px, 3.8vw + 8px, 17px);
  }

  .page-home .home-picks-loc {
    margin-bottom: clamp(10px, 2.5vw, 14px);
  }

  /* ===== Home: SP ≤768px — GO FORTH（主役1枚 + 2カラム4枚） ===== */

  .page-home .home-go-forth .home-go-forth-carousel {
    padding-right: 0;
    overflow-x: visible;
  }

  .page-home .home-go-forth .home-go-forth-viewport {
    overflow: visible;
  }

  .page-home .home-go-forth .home-go-forth-track,
  .page-home .home-go-forth #home-go-forth-track {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
    flex-wrap: unset;
    align-items: stretch;
    transform: none !important;
    transition: none;
    will-change: auto;
  }

  .page-home .home-go-forth .home-go-forth-track > .home-go-forth-card,
  .page-home .home-go-forth .home-card-grid--4 > .home-go-forth-card {
    display: block;
    flex: unset;
    width: auto;
    min-width: 0;
    max-width: none;
    align-self: stretch;
    min-height: auto;
  }

  .page-home .home-go-forth .home-go-forth-card:first-child {
    grid-column: 1 / -1;
  }

  .page-home .home-go-forth .home-go-forth-card:nth-child(n + 6) {
    display: none;
  }

  .page-home .home-go-forth .home-go-forth-prev,
  .page-home .home-go-forth .home-go-forth-next,
  .page-home .home-go-forth .home-go-forth-prev.is-visible {
    display: none !important;
  }

  .page-home .home-go-forth .home-go-forth-card:first-child .thumb {
    position: relative;
    display: block;
    inset: auto;
    width: 100%;
    height: auto;
    margin: 0;
    padding-bottom: 0;
    aspect-ratio: 5 / 3;
  }

  .page-home .home-go-forth .home-go-forth-card:not(:first-child) .thumb {
    /* 実機Safariは、子が絶対配置のグリッド項目では aspect-ratio を高さにしない。
       幅に対する padding で 4/5 を作り、画像は枠内に cover で収める。 */
    position: relative;
    inset: auto;
    display: block;
    width: 100%;
    height: 0;
    padding-bottom: 125%;
    aspect-ratio: auto;
  }

  .page-home .home-go-forth .home-go-forth-card:not(:first-child) .thumb img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
  }

  /* HOME SP：右端白余白 bleed（§91 GO FORTH thumb 定義の直後で上書き） */
  .page-home .home-go-forth .home-go-forth-card,
  .page-home .home-go-forth .home-go-forth-card.story-card {
    overflow: visible;
  }

  .page-home .home-go-forth .home-go-forth-card:first-child .thumb,
  .page-home .home-go-forth .home-go-forth-card:not(:first-child) .thumb {
    width: calc(100% + var(--home-body-right-trim, 4px));
    max-width: none;
  }

  .page-home .home-go-forth .home-go-forth-card:not(:first-child) {
    aspect-ratio: auto;
    align-self: start;
    min-height: 0;
    --home-go-forth-title-top-sp-sub: calc(52% + clamp(12px, 1.1vw, 18px) + 10px);
    --home-go-forth-title-top-offset: clamp(8px, 2.2vw, 10px);
    --home-go-forth-title-top-safe-limit: calc(
      100% - var(--home-go-forth-foot-bottom) - var(--home-go-forth-foot-h) - 8px -
        (
          var(--home-go-forth-title-size-sub, clamp(15px, 0.48vw + 13px, 19px)) *
            var(--home-go-forth-title-line, 1.41) * 3 +
          clamp(22px, 5.6vw, 26px)
        )
    );
    --home-go-forth-title-top-safe: min(
      var(--home-go-forth-title-top-sp-sub),
      var(--home-go-forth-title-top-safe-limit)
    );
    --home-go-forth-title-top-headroom: max(
      0px,
      calc(var(--home-go-forth-title-top-safe-limit) - var(--home-go-forth-title-top-sp-sub))
    );
    --home-go-forth-title-top-nudge: min(
      clamp(2px, 0.6vw, 4px),
      max(
        0px,
        calc(
          var(--home-go-forth-title-top-headroom) - var(--home-go-forth-title-top-offset) - 1px
        )
      )
    );
    --home-go-forth-title-top: calc(
      var(--home-go-forth-title-top-safe) +
        var(--home-go-forth-title-top-offset) +
        var(--home-go-forth-title-top-nudge) +
        5px
    );
    --home-go-forth-text-pad-x: clamp(10px, 0.78vw, 12px);
    --home-go-forth-foot-bottom: clamp(10px, 0.78vw, 12px);
    --home-go-forth-foot-h: clamp(30px, 7vw, 36px);
    --home-go-forth-foot-rule-pad: 0.34em;
    --home-go-forth-title-foot-gap: max(
      0px,
      calc(
        8px - var(--home-go-forth-title-top-offset) - var(--home-go-forth-title-top-nudge)
      )
    );
  }

  .page-home .home-go-forth .home-go-forth-card:not(:first-child) .card-text-title {
    top: var(--home-go-forth-title-top);
    left: var(--home-go-forth-text-pad-x);
    right: auto;
    width: var(--home-go-forth-title-block-width, 68%);
    max-width: var(--home-go-forth-title-block-width, 68%);
    bottom: calc(
      var(--home-go-forth-foot-bottom) + var(--home-go-forth-foot-h) + var(--home-go-forth-title-foot-gap)
    );
  }

  .page-home .home-go-forth .home-go-forth-card:not(:first-child) .card-title,
  .page-home .home-go-forth .home-go-forth-card:not(:first-child) .story-card-text .story-title {
    font-size: var(--home-go-forth-title-size-sub, clamp(15px, 0.48vw + 13px, 19px));
    font-weight: var(--home-go-forth-title-weight-sub, 550);
    line-height: var(--home-go-forth-title-line, 1.41);
    -webkit-line-clamp: 3;
    line-clamp: 3;
  }

  .page-home .home-go-forth .home-go-forth-card .card-meta-role {
    font-size: clamp(9px, 0.28vw + 8px, 11px);
    font-weight: 500;
    line-height: 1.35;
  }

  .page-home .home-go-forth .home-go-forth-card .card-meta-date {
    font-size: clamp(10px, 0.32vw + 9px, 12px);
    font-weight: 400;
  }

  /* ===== Home: SP ≤768px — Back Story（1カラム4段） ===== */

  .page-home .home-backstory-strip .home-backstory-strip-carousel,
  .page-home .home-backstory-strip .home-backstory-carousel {
    padding-right: 0;
    overflow-x: visible;
    --home-backstory-sp-thumb-height-scale: 0.81;
  }

  .page-home .home-backstory-strip .home-backstory-strip-viewport,
  .page-home .home-backstory-strip .home-backstory-viewport {
    overflow: visible;
  }

  .page-home .home-backstory-strip .home-backstory-track,
  .page-home .home-backstory-strip #home-backstory-strip-track,
  .page-home .home-backstory-strip .home-card-grid--4.home-backstory-track {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 12px;
    flex-wrap: unset;
    align-items: stretch;
    transform: none !important;
    transition: none;
    will-change: auto;
  }

  .page-home .home-backstory-strip .home-backstory-track > .home-backstory-card,
  .page-home .home-backstory-strip .home-backstory-track > .home-backstory-strip-card,
  .page-home .home-backstory-strip .home-card-grid--4 > .home-backstory-card,
  .page-home .home-backstory-strip .home-card-grid--4 > .home-backstory-strip-card {
    display: block;
    flex: unset;
    width: auto;
    min-width: 0;
    max-width: none;
    align-self: stretch;
    min-height: auto;
  }

  .page-home .home-backstory-strip .home-backstory-card:nth-child(n + 5),
  .page-home .home-backstory-strip .home-backstory-strip-card:nth-child(n + 5) {
    display: none;
  }

  .page-home .home-backstory-strip .home-backstory-strip-prev,
  .page-home .home-backstory-strip .home-backstory-strip-next,
  .page-home .home-backstory-strip .home-backstory-prev,
  .page-home .home-backstory-strip .home-backstory-next,
  .page-home .home-backstory-strip .home-backstory-strip-prev.is-visible,
  .page-home .home-backstory-strip .home-backstory-prev.is-visible {
    display: none !important;
  }

  .page-home .home-backstory-strip .home-backstory-card .thumb,
  .page-home .home-backstory-strip .home-backstory-strip-card .thumb,
  .page-home .home-backstory-strip .home-backstory-card:not(:first-child) .thumb,
  .page-home .home-backstory-strip .home-backstory-strip-card:not(:first-child) .thumb {
    position: relative;
    display: block;
    inset: auto;
    width: 100%;
    height: auto;
    margin: 0;
    padding-bottom: 0;
    aspect-ratio: var(--home-go-forth-main-thumb-aspect-w, 1.75) /
      calc(var(--home-go-forth-main-thumb-aspect-h, 1.32) * var(--home-backstory-sp-thumb-height-scale, 0.81));
  }

  .page-home .home-backstory-strip .home-backstory-strip-card:first-child .thumb,
  .page-home .home-backstory-strip .home-backstory-card:first-child .thumb {
    aspect-ratio: var(--home-go-forth-main-thumb-aspect-w, 1.75) /
      calc(var(--home-go-forth-main-thumb-aspect-h, 1.32) * var(--home-backstory-sp-thumb-height-scale, 0.81));
  }

  /* HOME SP：右端白余白 bleed（§91 BACK STORY thumb 定義の直後で上書き） */
  .page-home .home-backstory-strip .home-backstory-card,
  .page-home .home-backstory-strip .home-backstory-strip-card {
    overflow: visible;
  }

  .page-home .home-backstory-strip .home-backstory-card .thumb,
  .page-home .home-backstory-strip .home-backstory-strip-card .thumb {
    width: calc(100% + var(--home-body-right-trim, 4px));
    max-width: none;
  }

  .page-home .home-backstory-strip .home-backstory-card,
  .page-home .home-backstory-strip .home-backstory-strip-card {
    aspect-ratio: auto;
    --home-go-forth-title-top: calc(52% + clamp(12px, 1.1vw, 18px) + 5px);
    --home-go-forth-text-pad-x: clamp(13px, 1vw, 17px);
  }

  .page-home .home-backstory-strip .home-backstory-card .card-text-title,
  .page-home .home-backstory-strip .home-backstory-strip-card .card-text-title {
    left: var(--home-go-forth-text-pad-x);
    right: auto;
    width: var(--home-go-forth-title-block-width, 68%);
    max-width: var(--home-go-forth-title-block-width, 68%);
    overflow: hidden;
  }

  .page-home .home-backstory-strip .home-backstory-strip-card.story-card:not(:first-child),
  .page-home .home-backstory-strip .home-backstory-card:not(:first-child) {
    --home-go-forth-title-top: calc(
      52% + clamp(12px, 1.1vw, 18px) + 10px -
        var(--home-go-forth-title-size-main, clamp(19px, 0.95vw + 13px, 26px)) *
        var(--home-go-forth-title-line, 1.41)
    );
  }

  .page-home .home-backstory-strip .home-backstory-strip-card:not(:first-child) .card-title,
  .page-home .home-backstory-strip .home-backstory-strip-card:not(:first-child) .story-card-text .story-title,
  .page-home .home-backstory-strip .home-backstory-card:not(:first-child) .card-title,
  .page-home .home-backstory-strip .home-backstory-card:not(:first-child) .story-card-text .story-title {
    font-size: var(--home-go-forth-title-size-main, clamp(19px, 0.95vw + 13px, 26px));
    font-weight: var(--home-go-forth-title-weight-sub, 550);
    line-height: var(--home-go-forth-title-line, 1.41);
    -webkit-line-clamp: 3;
    line-clamp: 3;
  }

  .page-home .home-backstory-strip .home-backstory-card .card-meta-role,
  .page-home .home-backstory-strip .home-backstory-strip-card .card-meta-role {
    font-size: clamp(9px, 0.28vw + 8px, 11px);
    font-weight: 500;
    line-height: 1.35;
  }

  .page-home .home-backstory-strip .home-backstory-card .card-meta-date,
  .page-home .home-backstory-strip .home-backstory-strip-card .card-meta-date {
    font-size: clamp(10px, 0.32vw + 9px, 12px);
    font-weight: 400;
  }

  .page-home .home-dogcare .home-dogcare-card .thumb {
    aspect-ratio: var(--home-editorial-card-ratio);
  }

  .home-backstory-strip-heading,
  .home-dogcare-heading {
    text-align: left;
  }

  /* ===== Home: SP ≤768px — 記事帯 MORE ボタン（GO FORTH / BACK STORY / DOG CARE） ===== */
  .page-home .home-section-sp-more-wrap {
    display: flex;
    justify-content: center;
    margin: 0;
    padding: clamp(22px, 5.5vw, 28px) 0 clamp(30px, 7.5vw, 40px);
  }

  .page-home .home-section-sp-more {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: clamp(49.3%, 51vw, 52.7%);
    max-width: 52.7%;
    min-height: 36px;
    height: clamp(36px, 9.63vw, 38.7px);
    padding: 0 1.25em;
    box-sizing: border-box;
    background: #ffffff;
    border: 1.5px solid rgba(12, 10, 8, 0.22);
    border-radius: clamp(14px, 3.6vw, 16px);
    font-family: var(--home-editorial-eyebrow-font);
    font-size: clamp(14px, 3.45vw + 2px, 16px);
    font-weight: 500;
    letter-spacing: 0.26em;
    color: rgba(12, 10, 8, 0.72);
    text-decoration: none;
    text-transform: uppercase;
    -webkit-font-smoothing: antialiased;
    transition: border-color 0.18s ease, color 0.18s ease;
  }

  .page-home .home-section-sp-more:hover {
    border-color: rgba(12, 10, 8, 0.34);
    color: rgba(12, 10, 8, 0.88);
    text-decoration: none;
  }

  .page-home .home-backstory-strip .home-backstory-strip-carousel {
    --home-go-forth-gap: clamp(10px, 2.4vw, 14px);
    --home-backstory-visible-ratio: 0.70;
    --home-go-forth-main-visible-ratio: 0.86;
  }

  .page-home .home-dogcare .home-dogcare-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
  }

  .page-home .home-dogcare .home-dogcare-card.story-card:nth-child(n + 7) {
    display: none;
  }

  /* HOME SP：右端白余白 bleed（§91 DOG CARE グリッド直後で上書き） */
  .page-home .home-dogcare .home-dogcare-card {
    overflow: visible;
  }

  .page-home .home-dogcare .home-dogcare-card .thumb {
    width: calc(100% + var(--home-body-right-trim, 4px));
    max-width: none;
  }

  .page-home .home-dogcare .home-dogcare-card .card-title,
  .page-home .home-dogcare .home-dogcare-card .story-card-text .story-title {
    font-size: clamp(13px, 0.45vw + 11px, 15px);
  }

  .page-home .home-dogcare .home-dogcare-card .card-text {
    font-size: calc(clamp(11px, 0.28vw + 9px, 12px) * 0.9);
    line-height: calc(clamp(11px, 0.28vw + 9px, 12px) * 1.55);
  }

  .home-backstory-strip.home-band {
    padding-top: calc(clamp(4px, 1.2vw, 8px) + 24px);
    padding-bottom: clamp(6px, 1.6vw, 10px);
  }

  .home-dogcare.home-band {
    padding-top: calc(clamp(4px, 1.2vw, 8px) + 24px);
  }

  .page-home .home-dogcare.home-band {
    padding-bottom: calc(clamp(20px, 2.2vw, 32px) + clamp(60px, 3.5vw, 80px));
  }

  /* ⚠ PROTECTED — §91 SP コンテナグループ（削除・統合・移動禁止）
     HOME SP ガター 20px の単一ソース。.page-home .home-container が基準（GO FORTH / BACK STORY / DOG CARE / PICKS / カテゴリバー）。
     hero-inner も同一ガターを継承。header-inner は padding 別管理（変更禁止）。 */
  .page-home .home-container,
  .page-home .home-hero .hero-inner {
    max-width: 100%;
    padding-left: 20px;
    padding-right: 20px;
  }

  .page-home .home-hero .header-inner {
    max-width: 100%;
    padding-left: 0;
    padding-right: 0;
  }

  /* HOME SP：header 左右ガター（コンテンツ20pxよりやや狭い） */
  .page-home .home-hero .header {
    padding-left: 15px;
    padding-right: 15px;
  }

  /* ── Home: Article strips SP ここまで ── */

  /* 旧 .home-emotion SP ルールは HTML 撤去に伴い削除（§41 コメントに削除候補一覧） */

  /* HOME SP：カードほぼフル幅化に合わせ、3セクション thumb の右 trim(+4px) を打ち消し
     ※戻す場合：本ブロック削除＋上記 carousel/grid の margin/width を subcopy 揃えへ */
  .page-home .home-go-forth .home-go-forth-card:first-child .thumb,
  .page-home .home-go-forth .home-go-forth-card:not(:first-child) .thumb,
  .page-home .home-backstory-strip .home-backstory-card .thumb,
  .page-home .home-backstory-strip .home-backstory-strip-card .thumb,
  .page-home .home-dogcare .home-dogcare-card .thumb {
    width: 100%;
  }

  /* ===== HOME SP：紙面左右統一（カード外周実測基準） ============================
     実測（375/390・v=1550）：GO FORTH / BACK STORY / DOG CARE カード外周 = 左右 12px。
     ※HERO背景（::after の position/size/transform）と3セクションカード領域の
       margin/width セレクタは未変更。戻す場合は本ブロックだけ削除。
     --home-sp-content-edge: カード／footer基準（12）
     --home-sp-inner-edge: カード・HERO背景・footer以外のコンテンツ基準（8＝12-4） */
  .page-home {
    --home-sp-content-edge: 12px;
    --home-sp-gutter: var(--home-sp-content-edge);
    --home-sp-inner-edge: 8px;
  }

  /* HEADER / HERO本文 / PICKS 等：inner-edge */
  .page-home .home-container,
  .page-home .home-hero .hero-inner {
    padding-left: var(--home-sp-inner-edge);
    padding-right: var(--home-sp-inner-edge);
  }

  .page-home .home-hero .header {
    padding-left: var(--home-sp-inner-edge);
    padding-right: var(--home-sp-inner-edge);
  }

  /* ヘッダーパッドを紙面基準に揃えたため、ロゴの追加アウトデントを解除 */
  .page-home .home-hero .logo {
    margin-left: 0;
  }

  /* RECRUIT：背景は据え置き、テキスト枠だけ inner-edge */
  .page-home .home-recruit-text {
    padding-left: var(--home-sp-inner-edge);
    padding-right: var(--home-sp-inner-edge);
  }

  /* GO FORTH / BACK STORY / DOG CARE：カード親は content-edge(12) を維持 */
  .page-home .home-go-forth > .home-container,
  .page-home .home-backstory-strip > .home-container,
  .page-home .home-dogcare > .home-container {
    padding-left: var(--home-sp-content-edge);
    padding-right: var(--home-sp-content-edge);
  }

  /* 上記3セクション：見出し行・MOREのみ inner-edge(8) へ左右各4px広げる */
  .page-home .home-go-forth .home-go-forth-heading,
  .page-home .home-backstory-strip .home-backstory-strip-heading,
  .page-home .home-dogcare .home-dogcare-heading,
  .page-home .home-go-forth .home-section-sp-more-wrap,
  .page-home .home-backstory-strip .home-section-sp-more-wrap,
  .page-home .home-dogcare .home-section-sp-more-wrap {
    margin-left: calc(var(--home-sp-inner-edge) - var(--home-sp-content-edge));
    margin-right: calc(var(--home-sp-inner-edge) - var(--home-sp-content-edge));
    width: calc(100% + 2 * (var(--home-sp-content-edge) - var(--home-sp-inner-edge)));
    max-width: none;
    box-sizing: border-box;
  }

  /* PICKS SP：画像群全体（.home-picks-grid）を開始前から左右 +16px 内側へ（前回+8 + 今回+8）。
     ※最終描画の支配は grid。カード個別 margin/padding・見出し・PC は未変更。 */
  .page-home .home-picks .home-picks-grid {
    margin-left: 16px;
    margin-right: 16px;
    width: calc(100% - 32px);
  }

  /* HOME SP：指定コピー群のみ現在位置から左へ 8px（サイズ・縦位置・カード／画像群は不変） */
  .page-home .home-go-forth .home-go-forth-heading-row,
  .page-home .home-backstory-strip .home-backstory-strip-heading-row,
  .page-home .home-dogcare .home-dogcare-heading-row,
  .page-home .home-picks .home-picks-heading-row {
    transform: translateX(-8px);
  }

  .page-home .home-recruit .home-recruit-text {
    transform: translateX(-8px);
  }

  /* PICKS：右 trim(+4px) も紙面に合わせ打ち消し（3セクション thumb と同趣旨） */
  .page-home .home-picks .home-picks-thumb {
    width: 100%;
  }

}

/* §57 ─────── チャンネル一覧 + 記事ページ（.page-go-forth / .page-backstory / .page-dogcare / .page-article） ───────
 *
 * §10 body:not(.page-home) … — 各 .page-* .header / .header-inner（0,3,1）で上書き。
 * §02 main section — 各 .page-* main section でリセットし .feature-main に紙面幅を一本化。
 * ※ §10 / §02 本体は変更しない。
 */
.page-go-forth {
  margin: 0;
  background: #f4f2ee;
  color: #1a1816;
  --feature-accent: #A64334;
  --feature-accent-bg: #A64334;
  --feature-accent-editorial: #88514A;
}

.page-backstory {
  margin: 0;
  background: #f4f2ee;
  color: #1a1816;
  --backstory-accent-editorial: #927554;
  --feature-accent: var(--backstory-accent-editorial);
  --feature-accent-bg: var(--home-backstory-label, #b89428);
}

/* BACK STORY 一覧：HERO表記・ページネーション丸は --home-backstory-label、編集系は --backstory-accent-editorial */

.page-backstory .feature-hero-eyebrow,
.page-backstory .feature-channel-hero .feature-hero-eyebrow {
  color: var(--home-backstory-label, #b89428);
}

.page-backstory .feature-pagination-link.is-current {
  background-color: var(--home-backstory-label);
}

.page-dogcare {
  margin: 0;
  background: #f4f2ee;
  color: #1a1816;
  --dogcare-accent-editorial: #597276;
  --feature-accent: var(--dogcare-accent-editorial);
  --feature-accent-bg: #4f7780;
}

/* DOG CARE 一覧：HERO表記は --home-dogcare-label、ページネーション丸は --feature-accent-bg、編集系は --dogcare-accent-editorial */

.page-dogcare .feature-hero-eyebrow,
.page-dogcare .feature-channel-hero .feature-hero-eyebrow {
  color: var(--home-dogcare-label, #5a8589);
}

.page-dogcare .feature-pagination-link.is-current {
  background-color: var(--feature-accent-bg, #4f7780);
}


.page-article {
  margin: 0;
}

.page-about,
.page-contact,
.page-privacy,
.page-recruit {
  margin: 0;
  background: #f4f2ee;
  color: #1a1816;
}

.page-editors-picks ,
.page-editors-picks-article {
  margin: 0;
  background: #faf8f5;
  color: #1a1816;
}

.page-article main section,
.page-about main section,
.page-contact main section,
.page-privacy main section,
.page-recruit main section,
.page-editors-picks main section ,
.page-editors-picks-article main section {
  max-width: none;
  margin: 0;
  padding: 0;
}

/* --- ヘッダー（§10 上書き・詳細度 0,3,1） --- */
.page-go-forth .header,
.page-backstory .header,
.page-dogcare .header,
.page-article .header,
.page-about .header,
.page-contact .header,
.page-privacy .header,
.page-recruit .header,
.page-editors-picks .header ,
.page-editors-picks-article .header {
  position: relative;
  width: 100%;
  padding: 25px 0 16px;
  min-height: 72px;
  box-sizing: border-box;
  z-index: 10;
  border-bottom: 1px solid rgba(12, 10, 8, 0.08);
  background: #fff;
}

.page-go-forth .header {
  background: #f5f3ef;
}

.page-go-forth .header .header-inner,
.page-backstory .header .header-inner,
.page-dogcare .header .header-inner,
.page-article .header .header-inner,
.page-about .header .header-inner,
.page-contact .header .header-inner,
.page-privacy .header .header-inner,
.page-recruit .header .header-inner,
.page-editors-picks .header .header-inner ,
.page-editors-picks-article .header .header-inner {
  width: 100%;
  max-width: var(--home-editorial-max);
  margin-left: auto;
  margin-right: auto;
  padding-top: 0;
  padding-bottom: 0;
  padding-left: var(--home-editorial-gutter);
  padding-right: calc(var(--home-editorial-gutter) + clamp(8px, 0.55vw, 14px));
  box-sizing: border-box;
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 22px;
}

.page-go-forth .logo,
.page-backstory .logo,
.page-dogcare .logo,
.page-article .logo,
.page-about .logo,
.page-contact .logo,
.page-privacy .logo,
.page-recruit .logo,
.page-editors-picks .logo ,
.page-editors-picks-article .logo {
  flex: 0 0 auto;
  margin-top: 0;
  line-height: 0;
  position: static;
  top: auto;
  transform: none;
}

.page-go-forth .logo-img,
.page-backstory .logo-img,
.page-dogcare .logo-img,
.page-article .logo-img,
.page-about .logo-img,
.page-contact .logo-img,
.page-privacy .logo-img,
.page-recruit .logo-img,
.page-editors-picks .logo-img ,
.page-editors-picks-article .logo-img {
  display: block;
  height: clamp(62px, 2.68vw + 48px, 69px);
  width: auto;
  aspect-ratio: 663 / 200;
  object-fit: contain;
  object-position: left center;
  transform: translateY(-1px);
  filter: drop-shadow(0 1px 8px rgba(0, 0, 0, 0.12));
  -webkit-user-drag: none;
  user-select: none;
}

.page-go-forth .nav,
.page-backstory .nav,
.page-dogcare .nav,
.page-article .nav,
.page-about .nav,
.page-contact .nav,
.page-privacy .nav,
.page-recruit .nav,
.page-editors-picks .nav ,
.page-editors-picks-article .nav {
  display: flex;
  align-items: center;
  gap: clamp(28px, 2.2vw, 40px);
  margin-top: 11px;
  position: static;
  top: auto;
  transform: none;
}

.page-go-forth .header-actions,
.page-backstory .header-actions,
.page-dogcare .header-actions,
.page-article .header-actions,
.page-about .header-actions,
.page-contact .header-actions,
.page-privacy .header-actions,
.page-recruit .header-actions,
.page-editors-picks .header-actions ,
.page-editors-picks-article .header-actions {
  display: none;
}

.page-go-forth .nav a,
.page-backstory .nav a,
.page-dogcare .nav a,
.page-article .nav a,
.page-about .nav a,
.page-contact .nav a,
.page-privacy .nav a,
.page-recruit .nav a,
.page-editors-picks .nav a ,
.page-editors-picks-article .nav a {
  color: rgba(12, 10, 8, 0.88);
  text-decoration: none;
  font-family: var(--font-story-meta, var(--font-page-serif));
  font-size: clamp(15px, 0.42vw + 13px, 16px);
  font-weight: 600;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  white-space: nowrap;
  transition: color 0.22s ease, opacity 0.22s ease;
}

.page-go-forth .nav a:hover,
.page-backstory .nav a:hover,
.page-dogcare .nav a:hover,
.page-article .nav a:hover,
.page-about .nav a:hover,
.page-contact .nav a:hover,
.page-privacy .nav a:hover,
.page-recruit .nav a:hover,
.page-editors-picks .nav a:hover ,
.page-editors-picks-article .nav a:hover {
  color: #0c0a08;
  opacity: 1;
}

.page-go-forth .feature-main,
.page-backstory .feature-main,
.page-dogcare .feature-main,
.page-about .feature-main,
.page-contact .feature-main,
.page-privacy .feature-main,
.page-recruit .feature-main {
  width: 100%;
  max-width: var(--home-editorial-max);
  margin-left: auto;
  margin-right: auto;
  padding: clamp(36px, 4vw, 52px) var(--home-editorial-gutter) clamp(40px, 4vw, 56px);
  box-sizing: border-box;
  background: transparent;
}

.page-go-forth main section,
.page-backstory main section,
.page-dogcare main section,
.page-about main section,
.page-contact main section,
.page-privacy main section,
.page-recruit main section {
  max-width: none;
  margin: 0;
  padding: 0;
}

.page-go-forth .feature-breadcrumb,
.page-backstory .feature-breadcrumb,
.page-dogcare .feature-breadcrumb,
.page-about .feature-breadcrumb,
.page-contact .feature-breadcrumb,
.page-privacy .feature-breadcrumb,
.page-recruit .feature-breadcrumb {
  margin: 0 0 clamp(28px, 3vw, 40px);
}

.page-go-forth .feature-breadcrumb-list,
.page-backstory .feature-breadcrumb-list,
.page-dogcare .feature-breadcrumb-list,
.page-about .feature-breadcrumb-list,
.page-contact .feature-breadcrumb-list,
.page-privacy .feature-breadcrumb-list,
.page-recruit .feature-breadcrumb-list {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.35em 0.5em;
  margin: 0;
  padding: 0;
  list-style: none;
  font-family: var(--font-story-meta, var(--font-page-serif));
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: rgba(12, 10, 8, 0.38);
}

.page-go-forth .feature-breadcrumb-list a,
.page-backstory .feature-breadcrumb-list a,
.page-dogcare .feature-breadcrumb-list a,
.page-about .feature-breadcrumb-list a,
.page-contact .feature-breadcrumb-list a,
.page-privacy .feature-breadcrumb-list a,
.page-recruit .feature-breadcrumb-list a {
  color: inherit;
  text-decoration: none;
  transition: color 0.18s ease;
}

.page-go-forth .feature-breadcrumb-list a:hover,
.page-backstory .feature-breadcrumb-list a:hover,
.page-dogcare .feature-breadcrumb-list a:hover,
.page-about .feature-breadcrumb-list a:hover,
.page-contact .feature-breadcrumb-list a:hover,
.page-privacy .feature-breadcrumb-list a:hover,
.page-recruit .feature-breadcrumb-list a:hover {
  color: rgba(12, 10, 8, 0.62);
}

.page-go-forth .feature-breadcrumb-list li + li::before,
.page-backstory .feature-breadcrumb-list li + li::before,
.page-dogcare .feature-breadcrumb-list li + li::before,
.page-about .feature-breadcrumb-list li + li::before,
.page-contact .feature-breadcrumb-list li + li::before,
.page-privacy .feature-breadcrumb-list li + li::before,
.page-recruit .feature-breadcrumb-list li + li::before {
  content: "/";
  margin-right: 0.55em;
  color: rgba(12, 10, 8, 0.22);
}

/* ── チャンネルヒーロー ── */
.page-go-forth .feature-channel-hero,
.page-backstory .feature-channel-hero,
.page-dogcare .feature-channel-hero {
  display: grid;
  grid-template-columns: minmax(0, 0.92fr) minmax(0, 1.08fr);
  gap: clamp(28px, 3.5vw, 52px);
  align-items: center;
  margin: 0 0 clamp(36px, 4vw, 52px);
  padding-bottom: clamp(32px, 3.5vw, 48px);
  border-bottom: 1px solid rgba(12, 10, 8, 0.08);
}

.page-go-forth .feature-hero-copy,
.page-backstory .feature-hero-copy,
.page-dogcare .feature-hero-copy {
  min-width: 0;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}

.page-go-forth .feature-hero-eyebrow,
.page-backstory .feature-hero-eyebrow,
.page-dogcare .feature-hero-eyebrow {
  margin: 0 0 clamp(14px, 1.4vw, 18px);
  font-family: var(--font-story-meta, var(--font-page-serif));
  font-size: clamp(11px, 0.28vw + 10px, 12px);
  font-weight: 600;
  letter-spacing: 0.28em;
  text-transform: uppercase;
  color: var(--feature-accent, #A64334);
}

.page-go-forth .feature-hero-headline,
.page-backstory .feature-hero-headline,
.page-dogcare .feature-hero-headline {
  margin: 0;
  font-family: var(--font-page-serif);
  font-size: clamp(28px, 2.2vw + 18px, 42px);
  font-weight: 700;
  line-height: 1.42;
  letter-spacing: 0.04em;
  color: #161412;
}

.page-go-forth .feature-hero-body,
.page-backstory .feature-hero-body,
.page-dogcare .feature-hero-body {
  margin-top: clamp(18px, 2vw, 28px);
}

.page-go-forth .feature-hero-body {
  min-height: clamp(92px, 7.8vw, 112px);
}

.page-go-forth .feature-hero-body {
  min-height: clamp(92px, 7.8vw, 112px);
}

.page-go-forth .feature-hero-body p,
.page-backstory .feature-hero-body p,
.page-dogcare .feature-hero-body p {
  margin: 0;
  font-family: var(--font-page-serif);
  font-size: clamp(15px, 0.35vw + 13px, 17px);
  font-weight: 500;
  line-height: 1.95;
  letter-spacing: 0.04em;
  color: rgba(12, 10, 8, 0.58);
}

.page-go-forth .feature-hero-body p {
  line-height: 1.68;
  letter-spacing: 0.05em;
}

.page-go-forth .feature-hero-body p {
  line-height: 1.68;
  letter-spacing: 0.05em;
}

.page-go-forth .feature-hero-body p + p,
.page-backstory .feature-hero-body p + p,
.page-dogcare .feature-hero-body p + p {
  margin-top: 0.65em;
}

.page-go-forth .feature-hero-body p + p {
  margin-top: clamp(2px, 0.25vw, 4px);
}

.page-go-forth .feature-hero-body p + p {
  margin-top: clamp(2px, 0.25vw, 4px);
}

.page-go-forth .feature-hero-about,
.page-backstory .feature-hero-about,
.page-dogcare .feature-hero-about {
  display: inline-flex;
  align-items: center;
  gap: clamp(14px, 1.6vw, 24px);
  margin-top: clamp(36px, 4vw, 56px);
  text-decoration: none;
  color: rgba(12, 10, 8, 0.46);
  transition: color 0.2s ease;
}

.page-go-forth .feature-hero-about:hover,
.page-backstory .feature-hero-about:hover,
.page-dogcare .feature-hero-about:hover {
  color: rgba(12, 10, 8, 0.58);
}

.page-go-forth .feature-hero-about-label,
.page-backstory .feature-hero-about-label,
.page-dogcare .feature-hero-about-label {
  font-family: var(--font-page-serif);
  font-size: clamp(13px, 0.28vw + 11px, 14px);
  font-weight: 500;
  letter-spacing: 0.06em;
  line-height: 1.4;
}

.page-go-forth .feature-hero-about-line,
.page-backstory .feature-hero-about-line,
.page-dogcare .feature-hero-about-line {
  display: block;
  width: clamp(40px, 4.5vw, 64px);
  height: 1px;
  background: currentColor;
  opacity: 0.32;
}

.page-go-forth .feature-hero-about-arrow,
.page-backstory .feature-hero-about-arrow,
.page-dogcare .feature-hero-about-arrow {
  font-family: var(--font-story-meta, var(--font-page-serif));
  font-size: 12px;
  font-weight: 400;
  letter-spacing: 0;
  line-height: 1;
  opacity: 0.5;
}

.page-go-forth .feature-hero-visual,
.page-backstory .feature-hero-visual,
.page-dogcare .feature-hero-visual {
  margin: 0;
  min-width: 0;
  aspect-ratio: 800 / 525;
  overflow: hidden;
}

.page-go-forth .feature-hero-visual img,
.page-backstory .feature-hero-visual img,
.page-dogcare .feature-hero-visual img {
  display: block;
  width: 100%;
  height: 100%;
  aspect-ratio: 800 / 525;
  object-fit: cover;
  object-position: center;
}

.page-go-forth .feature-channel-hero {
  align-items: stretch;
}

.page-go-forth .feature-channel-hero .feature-hero-copy {
  flex: 1 1 auto;
  align-self: stretch;
  width: 100%;
}

.page-go-forth .feature-channel-hero .feature-hero-eyebrow {
  font-size: clamp(24px, 2.2vw + 16px, 27px);
  letter-spacing: 0.22em;
  line-height: 1.1;
  margin-top: -7px;
  margin-bottom: clamp(29px, calc(1.4vw + 15px), 33px);
}

.page-go-forth .feature-channel-hero .feature-hero-link {
  display: flex;
  flex-direction: column;
  flex: 1 1 auto;
  align-self: stretch;
  width: 100%;
  min-height: 0;
}

.page-go-forth .feature-channel-hero .feature-hero-headline {
  margin-top: clamp(10px, 1.2vw, 15px);
}

@media (min-width: 981px) {
  .page-go-forth .feature-channel-hero {
    gap: clamp(48px, calc(3.5vw + 20px), 72px);
  }

  .page-go-forth .feature-channel-hero .feature-hero-headline {
    margin-top: clamp(14px, calc(1.2vw + 4px), 19px);
    margin-bottom: 10px;
  }
}

.page-go-forth .feature-channel-hero .feature-hero-body {
  min-height: 0;
  margin-top: clamp(14px, 1.6vw, 20px);
}

.page-go-forth .feature-channel-hero .feature-hero-body p {
  font-size: clamp(17px, 0.28vw + 15px, 18px);
}

.page-go-forth .feature-hero-link,
.page-go-forth .feature-hero-visual-link {
  display: block;
  min-width: 0;
  text-decoration: none;
  color: inherit;
}

.page-go-forth .feature-hero-meta {
  display: flex;
  align-items: baseline;
  flex-wrap: wrap;
  gap: 18px;
  margin: clamp(12px, 1.2vw, 16px) 0 0;
  font-family: var(--font-story-meta, var(--font-page-serif));
  font-weight: 500;
  letter-spacing: 0.06em;
  line-height: 1.4;
}

.page-go-forth .feature-hero-meta-category {
  color: var(--feature-accent-editorial, #8F514B);
  font-size: 12.5px;
  font-weight: 600;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

.page-go-forth .feature-hero-meta-sep {
  color: rgba(12, 10, 8, 0.22);
  font-size: 12.5px;
}

.page-go-forth .feature-hero-meta-date {
  color: rgba(12, 10, 8, 0.42);
  font-size: 13.75px;
  font-weight: 500;
}

.page-go-forth .feature-channel-hero .feature-hero-link .feature-card-more {
  display: inline-flex;
  align-items: center;
  align-self: flex-start;
  width: auto;
  margin-top: auto;
  padding-top: clamp(20px, 2.5vw, 30px);
  margin-bottom: 30px;
  font-size: 11.5px;
  gap: clamp(9px, 0.92vw, 14px);
}

.page-go-forth .feature-channel-hero .feature-hero-link .feature-card-more-line {
  display: inline-block;
  flex: none;
  width: clamp(32px, 3.2vw, 51px);
  min-width: 0;
}

.page-go-forth .feature-card[data-feature-lead="true"] {
  display: none;
}

.page-backstory .feature-channel-hero,
.page-dogcare .feature-channel-hero {
  align-items: stretch;
}

.page-backstory .feature-channel-hero .feature-hero-copy,
.page-dogcare .feature-channel-hero .feature-hero-copy {
  flex: 1 1 auto;
  align-self: stretch;
  width: 100%;
}

.page-backstory .feature-channel-hero .feature-hero-eyebrow,
.page-dogcare .feature-channel-hero .feature-hero-eyebrow {
  font-size: clamp(24px, 2.2vw + 16px, 27px);
  letter-spacing: 0.22em;
  line-height: 1.1;
  margin-top: -7px;
  margin-bottom: clamp(29px, calc(1.4vw + 15px), 33px);
}

.page-backstory .feature-channel-hero .feature-hero-link,
.page-dogcare .feature-channel-hero .feature-hero-link {
  display: flex;
  flex-direction: column;
  flex: 1 1 auto;
  align-self: stretch;
  width: 100%;
  min-height: 0;
}

.page-backstory .feature-channel-hero .feature-hero-headline,
.page-dogcare .feature-channel-hero .feature-hero-headline {
  margin-top: clamp(10px, 1.2vw, 15px);
}

@media (min-width: 981px) {
  .page-backstory .feature-channel-hero,
  .page-dogcare .feature-channel-hero {
    gap: clamp(48px, calc(3.5vw + 20px), 72px);
  }

  .page-backstory .feature-channel-hero .feature-hero-headline,
  .page-dogcare .feature-channel-hero .feature-hero-headline {
    margin-top: clamp(14px, calc(1.2vw + 4px), 19px);
    margin-bottom: 10px;
  }
}

.page-backstory .feature-channel-hero .feature-hero-body,
.page-dogcare .feature-channel-hero .feature-hero-body {
  min-height: 0;
  margin-top: clamp(14px, 1.6vw, 20px);
}

.page-backstory .feature-channel-hero .feature-hero-body p,
.page-dogcare .feature-channel-hero .feature-hero-body p {
  font-size: clamp(17px, 0.28vw + 15px, 18px);
}

.page-backstory .feature-hero-link,
.page-backstory .feature-hero-visual-link,
.page-dogcare .feature-hero-link,
.page-dogcare .feature-hero-visual-link {
  display: block;
  min-width: 0;
  text-decoration: none;
  color: inherit;
}

.page-backstory .feature-hero-meta,
.page-dogcare .feature-hero-meta {
  display: flex;
  align-items: baseline;
  flex-wrap: wrap;
  gap: 18px;
  margin: clamp(12px, 1.2vw, 16px) 0 0;
  font-family: var(--font-story-meta, var(--font-page-serif));
  font-weight: 500;
  letter-spacing: 0.06em;
  line-height: 1.4;
}

.page-backstory .feature-hero-meta-category {
  color: var(--backstory-accent-editorial, #927554);
  font-size: 12.5px;
  font-weight: 600;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

.page-dogcare .feature-hero-meta-category {
  color: var(--dogcare-accent-editorial, #597276);
  font-size: 12.5px;
  font-weight: 600;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

.page-backstory .feature-hero-meta-sep,
.page-dogcare .feature-hero-meta-sep {
  color: rgba(12, 10, 8, 0.22);
  font-size: 12.5px;
}

.page-backstory .feature-hero-meta-date,
.page-dogcare .feature-hero-meta-date {
  color: rgba(12, 10, 8, 0.42);
  font-size: 13.75px;
  font-weight: 500;
}

.page-backstory .feature-channel-hero .feature-hero-link .feature-card-more,
.page-dogcare .feature-channel-hero .feature-hero-link .feature-card-more {
  display: inline-flex;
  align-items: center;
  align-self: flex-start;
  width: auto;
  margin-top: auto;
  padding-top: clamp(20px, 2.5vw, 30px);
  margin-bottom: 30px;
  font-size: 11.5px;
  gap: clamp(9px, 0.92vw, 14px);
}

.page-backstory .feature-channel-hero .feature-hero-link .feature-card-more-line,
.page-dogcare .feature-channel-hero .feature-hero-link .feature-card-more-line {
  display: inline-block;
  flex: none;
  width: clamp(32px, 3.2vw, 51px);
  min-width: 0;
}

.page-backstory .feature-card[data-feature-lead="true"],
.page-dogcare .feature-card[data-feature-lead="true"] {
  display: none;
}

.page-backstory .feature-filter:focus,
.page-dogcare .feature-filter:focus {
  outline: none;
}

.page-backstory .feature-filter:focus-visible,
.page-dogcare .feature-filter:focus-visible {
  outline: 2px solid rgba(12, 10, 8, 0.45);
  outline-offset: 3px;
}

/* ── CATEGORY フィルタ ── */
.page-go-forth .feature-filters,
.page-backstory .feature-filters,
.page-dogcare .feature-filters {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: space-between;
  gap: clamp(16px, 2vw, 24px);
  margin: 0 0 clamp(32px, 3.5vw, 48px);
  padding-bottom: clamp(22px, 2.4vw, 30px);
  border-bottom: 1px solid rgba(12, 10, 8, 0.08);
}

.page-go-forth .feature-filters-start,
.page-backstory .feature-filters-start,
.page-dogcare .feature-filters-start {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: clamp(14px, 1.8vw, 24px) clamp(16px, 1.6vw, 24px);
  flex: 1 1 auto;
  min-width: 0;
}

.page-go-forth .feature-filters-end,
.page-backstory .feature-filters-end,
.page-dogcare .feature-filters-end {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: clamp(10px, 1.1vw, 16px);
  flex: 0 0 auto;
  margin-left: auto;
}

.page-go-forth .feature-filters-label,
.page-backstory .feature-filters-label,
.page-dogcare .feature-filters-label {
  flex: 0 0 auto;
  margin: 0;
  font-family: var(--font-story-meta, var(--font-page-serif));
  font-size: clamp(12px, 0.28vw + 11px, 13px);
  font-weight: 500;
  letter-spacing: 0.06em;
  line-height: 1.4;
  text-transform: uppercase;
  color: rgba(12, 10, 8, 0.42);
}

.page-go-forth .feature-filters-sort-label,
.page-backstory .feature-filters-sort-label,
.page-dogcare .feature-filters-sort-label {
  margin: 0;
  font-family: var(--font-story-meta, var(--font-page-serif));
  font-size: clamp(12px, 0.28vw + 11px, 13px);
  font-weight: 500;
  letter-spacing: 0.06em;
  line-height: 1.4;
  text-transform: uppercase;
  color: rgba(12, 10, 8, 0.42);
}

.page-go-forth .feature-filters-list,
.page-backstory .feature-filters-list,
.page-dogcare .feature-filters-list {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: clamp(10px, 1.1vw, 18px) clamp(16px, 1.6vw, 24px);
}

.page-go-forth .feature-filter,
.page-backstory .feature-filter,
.page-dogcare .feature-filter {
  flex: 0 0 auto;
  padding: 0;
  border: none;
  border-radius: 0;
  background: transparent;
  color: rgba(12, 10, 8, 0.45);
  font-family: var(--font-story-meta, var(--font-page-serif));
  font-size: clamp(12px, 0.28vw + 11px, 13px);
  font-weight: 500;
  letter-spacing: 0.06em;
  line-height: 1.4;
  cursor: pointer;
  white-space: nowrap;
  transition: color 0.2s ease;
}

.page-go-forth .feature-filter:hover:not(.is-active),
.page-backstory .feature-filter:hover:not(.is-active),
.page-dogcare .feature-filter:hover:not(.is-active) {
  color: rgba(12, 10, 8, 0.52);
}

.page-go-forth .feature-filter.is-active,
.page-backstory .feature-filter.is-active,
.page-dogcare .feature-filter.is-active {
  background: transparent;
  border: none;
  color: rgba(12, 10, 8, 0.62);
  font-weight: 500;
  text-decoration: underline;
  text-decoration-color: var(--feature-accent, #A64334);
  text-underline-offset: 0.35em;
  text-decoration-thickness: 1px;
}

.page-go-forth .feature-filter.is-active:hover,
.page-backstory .feature-filter.is-active:hover,
.page-dogcare .feature-filter.is-active:hover {
  color: rgba(12, 10, 8, 0.62);
}

.page-go-forth .feature-filter.is-active,
.page-go-forth .feature-filter.is-active:hover {
  text-decoration-color: var(--feature-accent-editorial, #88514A);
}

.page-backstory .feature-filter.is-active,
.page-backstory .feature-filter.is-active:hover {
  text-decoration-color: var(--backstory-accent-editorial, #927554);
}

.page-dogcare .feature-filter.is-active,
.page-dogcare .feature-filter.is-active:hover {
  text-decoration-color: var(--dogcare-accent-editorial, #597276);
}

.page-go-forth .feature-filter:focus {
  outline: none;
}

.page-go-forth .feature-filter:focus-visible {
  outline: 2px solid rgba(12, 10, 8, 0.45);
  outline-offset: 3px;
}

.page-go-forth .feature-filters-sort,
.page-backstory .feature-filters-sort,
.page-dogcare .feature-filters-sort {
  padding: 0;
  border: none;
  background: transparent;
  color: rgba(12, 10, 8, 0.58);
  font-family: var(--font-story-meta, var(--font-page-serif));
  font-size: clamp(12px, 0.28vw + 11px, 13px);
  font-weight: 500;
  letter-spacing: 0.06em;
  line-height: 1.4;
  cursor: pointer;
  white-space: nowrap;
  transition: color 0.18s ease;
}

.page-go-forth .feature-filters-sort:hover,
.page-backstory .feature-filters-sort:hover,
.page-dogcare .feature-filters-sort:hover {
  color: rgba(12, 10, 8, 0.68);
}

.page-go-forth .feature-filters-sort-chevron,
.page-backstory .feature-filters-sort-chevron,
.page-dogcare .feature-filters-sort-chevron {
  display: inline-block;
  margin-left: 0.15em;
  font-size: 0.72em;
  line-height: 1;
  vertical-align: baseline;
  opacity: 0.55;
}

.page-go-forth .feature-filters-sort-wrap,
.page-backstory .feature-filters-sort-wrap,
.page-dogcare .feature-filters-sort-wrap {
  position: relative;
}

.page-go-forth .feature-filters-sort-icon,
.page-backstory .feature-filters-sort-icon,
.page-dogcare .feature-filters-sort-icon {
  display: none;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 4px;
  width: 18px;
  height: 18px;
}

.page-go-forth .feature-filters-sort-icon span,
.page-backstory .feature-filters-sort-icon span,
.page-dogcare .feature-filters-sort-icon span {
  display: block;
  width: 16px;
  height: 1.5px;
  background: rgba(12, 10, 8, 0.68);
}

.page-go-forth .feature-filters-sort-menu,
.page-backstory .feature-filters-sort-menu,
.page-dogcare .feature-filters-sort-menu {
  position: absolute;
  top: calc(100% + 8px);
  right: 0;
  z-index: 20;
  min-width: 132px;
  margin: 0;
  padding: 6px 0;
  list-style: none;
  border: 1px solid rgba(12, 10, 8, 0.1);
  background: #faf9f7;
  box-shadow: 0 4px 16px rgba(12, 10, 8, 0.06);
}

.page-go-forth .feature-filters-sort-menu[hidden],
.page-backstory .feature-filters-sort-menu[hidden],
.page-dogcare .feature-filters-sort-menu[hidden] {
  display: none;
}

.page-go-forth .feature-filters-sort-option,
.page-backstory .feature-filters-sort-option,
.page-dogcare .feature-filters-sort-option {
  display: block;
  width: 100%;
  padding: 9px 16px;
  border: none;
  background: transparent;
  color: rgba(12, 10, 8, 0.58);
  font-family: var(--font-story-meta, var(--font-page-serif));
  font-size: clamp(12px, 0.28vw + 11px, 13px);
  font-weight: 500;
  letter-spacing: 0.06em;
  line-height: 1.4;
  text-align: left;
  cursor: pointer;
  white-space: nowrap;
  transition: color 0.18s ease, background 0.18s ease;
}

.page-go-forth .feature-filters-sort-option:hover,
.page-backstory .feature-filters-sort-option:hover,
.page-dogcare .feature-filters-sort-option:hover {
  color: rgba(12, 10, 8, 0.68);
  background: rgba(12, 10, 8, 0.04);
}

.page-go-forth .feature-filters-sort-option.is-active,
.page-backstory .feature-filters-sort-option.is-active,
.page-dogcare .feature-filters-sort-option.is-active {
  color: rgba(12, 10, 8, 0.62);
}

/* ── 記事一覧（3カラム均一・誌面型） ── */
.page-go-forth .feature-archive,
.page-backstory .feature-archive,
.page-dogcare .feature-archive {
  margin: 0;
}

.page-go-forth .feature-list,
.page-backstory .feature-list,
.page-dogcare .feature-list {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: clamp(36px, 3.2vw, 52px) clamp(22px, 2.2vw, 32px);
  align-items: stretch;
}

.page-go-forth .feature-card,
.page-backstory .feature-card,
.page-dogcare .feature-card {
  margin: 0;
  min-width: 0;
  display: flex;
  flex-direction: column;
  height: 100%;
}

.page-go-forth .feature-card-link,
.page-backstory .feature-card-link,
.page-dogcare .feature-card-link {
  display: flex;
  flex-direction: column;
  flex: 1 1 auto;
  min-height: 0;
  height: 100%;
  text-decoration: none;
  color: inherit;
  background: transparent;
  border-radius: 0;
  overflow: visible;
  box-shadow: none;
  transition: opacity 0.22s ease;
}

.page-go-forth .feature-card-link:hover,
.page-backstory .feature-card-link:hover,
.page-dogcare .feature-card-link:hover {
  opacity: 0.82;
}

.page-go-forth .feature-card-thumb,
.page-backstory .feature-card-thumb,
.page-dogcare .feature-card-thumb {
  position: relative;
  margin: 0;
  overflow: hidden;
  flex-shrink: 0;
  aspect-ratio: 4 / 3;
  background: #ebe8e1;
}

.page-go-forth .feature-card-thumb img,
.page-backstory .feature-card-thumb img,
.page-dogcare .feature-card-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  display: block;
  transition: transform 0.35s ease;
}

.page-go-forth .feature-card-link:hover .feature-card-thumb img,
.page-backstory .feature-card-link:hover .feature-card-thumb img,
.page-dogcare .feature-card-link:hover .feature-card-thumb img {
  transform: scale(1.02);
}

.page-go-forth .feature-card-body,
.page-backstory .feature-card-body,
.page-dogcare .feature-card-body {
  display: flex;
  flex-direction: column;
  flex: 1 1 auto;
  min-height: 0;
  padding: clamp(14px, 1.3vw, 18px) 0 0;
}

.page-go-forth .feature-card-meta,
.page-backstory .feature-card-meta,
.page-dogcare .feature-card-meta {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
}

.page-go-forth .feature-card-tag,
.page-backstory .feature-card-tag,
.page-dogcare .feature-card-tag {
  display: inline-block;
  padding: 0;
  border: none;
  border-radius: 0;
  background: transparent;
  color: var(--feature-accent, #A64334);
  font-family: var(--font-story-meta, var(--font-page-serif));
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 0.14em;
  line-height: 1.35;
  text-transform: uppercase;
}

.page-go-forth .feature-card-tag {
  color: var(--feature-accent-editorial, #88514A);
}

.page-backstory .feature-card-tag {
  color: var(--backstory-accent-editorial, #927554);
}

.page-dogcare .feature-card-tag {
  color: var(--dogcare-accent-editorial, #597276);
}

.page-go-forth .feature-card-title,
.page-backstory .feature-card-title,
.page-dogcare .feature-card-title {
  margin: clamp(10px, 1vw, 14px) 0 0;
  font-family: var(--font-page-serif);
  font-size: clamp(17px, 0.35vw + 14px, 20px);
  font-weight: 600;
  line-height: 1.55;
  letter-spacing: 0.02em;
  color: #1a1816;
}

.page-go-forth .feature-card-excerpt,
.page-backstory .feature-card-excerpt,
.page-dogcare .feature-card-excerpt {
  margin: clamp(8px, 0.8vw, 12px) 0 0;
  font-family: var(--font-page-serif);
  font-size: clamp(13px, 0.22vw + 12px, 14px);
  font-weight: 500;
  line-height: 1.78;
  letter-spacing: 0.02em;
  color: rgba(12, 10, 8, 0.52);
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  overflow: hidden;
}

.page-go-forth .feature-card-date,
.page-backstory .feature-card-date,
.page-dogcare .feature-card-date {
  flex-shrink: 0;
  margin: 0;
  padding: 0;
  font-family: var(--font-story-meta, var(--font-page-serif));
  font-size: 11px;
  line-height: 1.4;
  letter-spacing: 0.06em;
  color: rgba(12, 10, 8, 0.38);
}

.page-go-forth .feature-card-more,
.page-backstory .feature-card-more,
.page-dogcare .feature-card-more {
  display: inline-flex;
  align-items: center;
  gap: clamp(8px, 0.8vw, 12px);
  flex-shrink: 0;
  margin-top: auto;
  padding-top: clamp(14px, 1.4vw, 20px);
  font-family: var(--font-story-meta, var(--font-page-serif));
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 0.18em;
  line-height: 1.3;
  text-transform: uppercase;
  color: rgba(12, 10, 8, 0.48);
}

.page-go-forth .feature-card-more-line,
.page-backstory .feature-card-more-line,
.page-dogcare .feature-card-more-line {
  display: inline-block;
  width: clamp(28px, 2.8vw, 44px);
  height: 1px;
  background: currentColor;
  opacity: 0.72;
}

/* ── ページネーション ── */
.page-go-forth .feature-pagination,
.page-backstory .feature-pagination,
.page-dogcare .feature-pagination {
  margin-top: clamp(36px, 4vw, 52px);
  padding-top: clamp(28px, 3vw, 40px);
  border-top: 1px solid rgba(12, 10, 8, 0.08);
  text-align: center;
}

.page-go-forth .feature-pagination-list,
.page-backstory .feature-pagination-list,
.page-dogcare .feature-pagination-list {
  display: inline-flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: clamp(6px, 0.65vw, 10px);
  margin: 0;
  padding: 0;
  list-style: none;
}

.page-go-forth .feature-pagination-link,
.page-backstory .feature-pagination-link,
.page-dogcare .feature-pagination-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 36px;
  height: 36px;
  padding: 0 10px;
  border-radius: 50%;
  text-decoration: none;
  font-family: var(--font-story-meta, var(--font-page-serif));
  font-size: 13px;
  font-weight: 500;
  letter-spacing: 0.04em;
  color: rgba(12, 10, 8, 0.72);
  transition: background 0.18s ease, color 0.18s ease;
}

.page-go-forth .feature-pagination-link:hover:not(.is-current),
.page-backstory .feature-pagination-link:hover:not(.is-current),
.page-dogcare .feature-pagination-link:hover:not(.is-current) {
  background: rgba(12, 10, 8, 0.06);
  color: #1a1816;
}

.page-go-forth .feature-pagination-link.is-current,
.page-backstory .feature-pagination-link.is-current,
.page-dogcare .feature-pagination-link.is-current {
  width: 36px;
  min-width: 36px;
  height: 36px;
  padding: 0;
  box-sizing: border-box;
  border-radius: 50%;
  background: var(--feature-accent-bg, #A64334);
  color: #fff;
  font-weight: 600;
  pointer-events: none;
}

.page-go-forth .feature-pagination-ellipsis,
.page-backstory .feature-pagination-ellipsis,
.page-dogcare .feature-pagination-ellipsis {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 28px;
  height: 36px;
  font-family: var(--font-story-meta, var(--font-page-serif));
  font-size: 14px;
  color: rgba(12, 10, 8, 0.45);
}

.page-go-forth .feature-pagination-next,
.page-backstory .feature-pagination-next,
.page-dogcare .feature-pagination-next {
font-size: 16px;
  letter-spacing: 0;
}


/* go-forth.html：HOMEフッターと同系 */
.page-go-forth .site-footer.home-footer,
.page-backstory .site-footer.home-footer,
.page-dogcare .site-footer.home-footer,
.page-article .site-footer.home-footer,
.page-about .site-footer.home-footer,
.page-contact .site-footer.home-footer,
.page-privacy .site-footer.home-footer,
.page-recruit .site-footer.home-footer,
.page-editors-picks .site-footer.home-footer ,
.page-editors-picks-article .site-footer.home-footer {
  position: relative;
  overflow: hidden;
  /* 100vw + (50% - 50vw) はスクロールバー幅分はみ出すため、body直下の全幅は 100% で確保 */
  width: 100%;
  max-width: none;
  margin-left: 0;
  margin-right: 0;
  margin-top: clamp(48px, 5vw, 72px);
  padding: 0;
  border-top: none;
  background-color: #111111;
  color: rgba(243, 243, 243, 0.72);
  text-align: left;
  font-family: var(--font-page-serif);
  font-weight: 400;
  line-height: 1.85;
}

.page-go-forth .site-footer.home-footer::before,
.page-backstory .site-footer.home-footer::before,
.page-dogcare .site-footer.home-footer::before,
.page-article .site-footer.home-footer::before,
.page-about .site-footer.home-footer::before,
.page-contact .site-footer.home-footer::before,
.page-privacy .site-footer.home-footer::before,
.page-recruit .site-footer.home-footer::before,
.page-editors-picks .site-footer.home-footer::before ,
.page-editors-picks-article .site-footer.home-footer::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: 0;
  opacity: 0.045;
  mix-blend-mode: soft-light;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 256 256'%3E%3Cfilter id='a'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.8' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23a)'/%3E%3C/svg%3E");
  background-size: 180px 180px;
}

.page-go-forth .footer-home-inner,
.page-backstory .footer-home-inner,
.page-dogcare .footer-home-inner,
.page-article .footer-home-inner,
.page-about .footer-home-inner,
.page-contact .footer-home-inner,
.page-privacy .footer-home-inner,
.page-recruit .footer-home-inner,
.page-editors-picks .footer-home-inner ,
.page-editors-picks-article .footer-home-inner {
  position: relative;
  z-index: 1;
  max-width: var(--home-editorial-max);
  margin-left: auto;
  margin-right: auto;
  padding: clamp(56px, 6vw, 88px) var(--home-editorial-gutter) clamp(44px, 4.5vw, 68px);
  box-sizing: border-box;
}

.page-go-forth .footer-home-body-main,
.page-backstory .footer-home-body-main,
.page-dogcare .footer-home-body-main,
.page-article .footer-home-body-main,
.page-about .footer-home-body-main,
.page-contact .footer-home-body-main,
.page-privacy .footer-home-body-main,
.page-recruit .footer-home-body-main,
.page-editors-picks .footer-home-body-main ,
.page-editors-picks-article .footer-home-body-main {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: clamp(32px, 5vw, 72px);
  margin-bottom: clamp(44px, 5vw, 68px);
}

.page-go-forth .footer-home-brand-name,
.page-backstory .footer-home-brand-name,
.page-dogcare .footer-home-brand-name,
.page-article .footer-home-brand-name,
.page-about .footer-home-brand-name,
.page-contact .footer-home-brand-name,
.page-privacy .footer-home-brand-name,
.page-recruit .footer-home-brand-name,
.page-editors-picks .footer-home-brand-name ,
.page-editors-picks-article .footer-home-brand-name {
  margin: 0;
  font-family: "Work Sans", "IBM Plex Sans", "Helvetica Neue", sans-serif;
  font-size: clamp(22px, 1.45vw + 16px, 28px);
  font-weight: 700;
  letter-spacing: 0.08em;
  line-height: 1.32;
  text-transform: uppercase;
  color: #d8d8d8;
}

.page-go-forth .footer-home-brand-tag,
.page-backstory .footer-home-brand-tag,
.page-dogcare .footer-home-brand-tag,
.page-article .footer-home-brand-tag,
.page-about .footer-home-brand-tag,
.page-contact .footer-home-brand-tag,
.page-privacy .footer-home-brand-tag,
.page-recruit .footer-home-brand-tag,
.page-editors-picks .footer-home-brand-tag ,
.page-editors-picks-article .footer-home-brand-tag {
  margin: 0;
  font-family: "Work Sans", "IBM Plex Sans", "Helvetica Neue", sans-serif;
  font-size: clamp(10px, 0.2vw + 8px, 11px);
  font-weight: 500;
  letter-spacing: 0.24em;
  text-transform: uppercase;
  line-height: 1.6;
  color: rgba(243, 243, 243, 0.52);
}

.page-go-forth .footer-home-brand-copy,
.page-backstory .footer-home-brand-copy,
.page-dogcare .footer-home-brand-copy,
.page-article .footer-home-brand-copy,
.page-about .footer-home-brand-copy,
.page-contact .footer-home-brand-copy,
.page-privacy .footer-home-brand-copy,
.page-recruit .footer-home-brand-copy,
.page-editors-picks .footer-home-brand-copy ,
.page-editors-picks-article .footer-home-brand-copy {
  margin: 0;
  font-family: "Work Sans", "IBM Plex Sans", "Helvetica Neue", sans-serif;
  font-size: clamp(9px, 0.17vw + 7.5px, 10px);
  font-weight: 500;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  line-height: 1.6;
  color: rgba(243, 243, 243, 0.38);
}

.page-go-forth .footer-home-meta,
.page-backstory .footer-home-meta,
.page-dogcare .footer-home-meta,
.page-article .footer-home-meta,
.page-about .footer-home-meta,
.page-contact .footer-home-meta,
.page-privacy .footer-home-meta,
.page-recruit .footer-home-meta,
.page-editors-picks .footer-home-meta ,
.page-editors-picks-article .footer-home-meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-end;
  gap: clamp(20px, 2.8vw, 40px);
  flex: 1 1 auto;
  min-width: 0;
}

.page-go-forth .footer-home-nav,
.page-backstory .footer-home-nav,
.page-dogcare .footer-home-nav,
.page-article .footer-home-nav,
.page-about .footer-home-nav,
.page-contact .footer-home-nav,
.page-privacy .footer-home-nav,
.page-recruit .footer-home-nav,
.page-editors-picks .footer-home-nav ,
.page-editors-picks-article .footer-home-nav {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: clamp(14px, 1.6vw, 20px);
}

.page-go-forth .footer-home-nav a,
.page-backstory .footer-home-nav a,
.page-dogcare .footer-home-nav a,
.page-article .footer-home-nav a,
.page-about .footer-home-nav a,
.page-contact .footer-home-nav a,
.page-privacy .footer-home-nav a,
.page-recruit .footer-home-nav a,
.page-editors-picks-article .footer-home-nav a {
  font-family: "Work Sans", "IBM Plex Sans", "Helvetica Neue", sans-serif;
  font-size: clamp(11px, 0.38vw + 9px, 13px);
  font-weight: 500;
  letter-spacing: 0.26em;
  text-transform: uppercase;
  text-decoration: none;
  line-height: 1.65;
  color: rgba(243, 243, 243, 0.66);
  transition: color 0.25s ease;
}

.page-go-forth .footer-home-nav a:hover,
.page-backstory .footer-home-nav a:hover,
.page-dogcare .footer-home-nav a:hover,
.page-article .footer-home-nav a:hover,
.page-about .footer-home-nav a:hover,
.page-contact .footer-home-nav a:hover,
.page-privacy .footer-home-nav a:hover,
.page-recruit .footer-home-nav a:hover,
.page-editors-picks-article .footer-home-nav a:hover {
  color: rgba(243, 243, 243, 0.82);
}

.page-go-forth .footer-home-nav a:visited,
.page-backstory .footer-home-nav a:visited,
.page-dogcare .footer-home-nav a:visited,
.page-article .footer-home-nav a:visited,
.page-about .footer-home-nav a:visited,
.page-contact .footer-home-nav a:visited,
.page-privacy .footer-home-nav a:visited,
.page-recruit .footer-home-nav a:visited,
.page-editors-picks-article .footer-home-nav a:visited {
  color: rgba(243, 243, 243, 0.66);
}

.page-editors-picks-article .footer-home-nav a:focus-visible,
.page-editors-picks-article .footer-home-nav a:active {
  color: rgba(243, 243, 243, 0.82);
}

.page-go-forth .footer-home-nav-sep,
.page-backstory .footer-home-nav-sep,
.page-dogcare .footer-home-nav-sep,
.page-article .footer-home-nav-sep,
.page-about .footer-home-nav-sep,
.page-contact .footer-home-nav-sep,
.page-privacy .footer-home-nav-sep,
.page-recruit .footer-home-nav-sep,
.page-editors-picks .footer-home-nav-sep ,
.page-editors-picks-article .footer-home-nav-sep {
  font-family: "Work Sans", "IBM Plex Sans", sans-serif;
  font-size: clamp(11px, 0.38vw + 9px, 13px);
  font-weight: 400;
  letter-spacing: 0.08em;
  color: rgba(255, 255, 255, 0.26);
  user-select: none;
}

.page-go-forth .footer-home-follow,
.page-backstory .footer-home-follow,
.page-dogcare .footer-home-follow,
.page-article .footer-home-follow,
.page-about .footer-home-follow,
.page-contact .footer-home-follow,
.page-privacy .footer-home-follow,
.page-recruit .footer-home-follow,
.page-editors-picks .footer-home-follow ,
.page-editors-picks-article .footer-home-follow {
  --footer-home-follow-gap: clamp(16px, 1.8vw, 24px);
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--footer-home-follow-gap);
}

.page-go-forth .footer-home-follow-label,
.page-backstory .footer-home-follow-label,
.page-dogcare .footer-home-follow-label,
.page-article .footer-home-follow-label,
.page-about .footer-home-follow-label,
.page-contact .footer-home-follow-label,
.page-privacy .footer-home-follow-label,
.page-recruit .footer-home-follow-label,
.page-editors-picks .footer-home-follow-label ,
.page-editors-picks-article .footer-home-follow-label {
  font-family: "Work Sans", "IBM Plex Sans", "Helvetica Neue", sans-serif;
  font-size: clamp(11px, 0.38vw + 9px, 13px);
  font-weight: 500;
  letter-spacing: 0.26em;
  text-transform: uppercase;
  line-height: 1.65;
  color: rgba(243, 243, 243, 0.52);
}

.page-go-forth .footer-home-follow a,
.page-backstory .footer-home-follow a,
.page-dogcare .footer-home-follow a,
.page-article .footer-home-follow a,
.page-about .footer-home-follow a,
.page-contact .footer-home-follow a,
.page-privacy .footer-home-follow a,
.page-recruit .footer-home-follow a,
.page-editors-picks-article .footer-home-follow a {
  font-family: "Work Sans", "IBM Plex Sans", "Helvetica Neue", sans-serif;
  font-size: clamp(11px, 0.38vw + 9px, 13px);
  font-weight: 400;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  text-decoration: none;
  line-height: 1.65;
  color: rgba(243, 243, 243, 0.66);
  transition: color 0.25s ease;
}

.page-go-forth .footer-home-follow a:hover,
.page-backstory .footer-home-follow a:hover,
.page-dogcare .footer-home-follow a:hover,
.page-article .footer-home-follow a:hover,
.page-about .footer-home-follow a:hover,
.page-contact .footer-home-follow a:hover,
.page-privacy .footer-home-follow a:hover,
.page-recruit .footer-home-follow a:hover,
.page-editors-picks-article .footer-home-follow a:hover {
  color: rgba(243, 243, 243, 0.82);
}

.page-go-forth .footer-home-follow a:visited,
.page-backstory .footer-home-follow a:visited,
.page-dogcare .footer-home-follow a:visited,
.page-article .footer-home-follow a:visited,
.page-about .footer-home-follow a:visited,
.page-contact .footer-home-follow a:visited,
.page-privacy .footer-home-follow a:visited,
.page-recruit .footer-home-follow a:visited,
.page-editors-picks-article .footer-home-follow a:visited {
  color: rgba(243, 243, 243, 0.66);
}

.page-editors-picks-article .footer-home-follow a:focus-visible,
.page-editors-picks-article .footer-home-follow a:active {
  color: rgba(243, 243, 243, 0.82);
}

.page-go-forth .footer-home-bottom,
.page-backstory .footer-home-bottom,
.page-dogcare .footer-home-bottom,
.page-article .footer-home-bottom,
.page-about .footer-home-bottom,
.page-contact .footer-home-bottom,
.page-privacy .footer-home-bottom,
.page-recruit .footer-home-bottom,
.page-editors-picks .footer-home-bottom ,
.page-editors-picks-article .footer-home-bottom {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: clamp(24px, 3vw, 40px);
}

.page-go-forth .footer-home-pagetop,
.page-backstory .footer-home-pagetop,
.page-dogcare .footer-home-pagetop,
.page-article .footer-home-pagetop,
.page-about .footer-home-pagetop,
.page-contact .footer-home-pagetop,
.page-privacy .footer-home-pagetop,
.page-recruit .footer-home-pagetop,
.page-editors-picks .footer-home-pagetop ,
.page-editors-picks-article .footer-home-pagetop {
  display: inline-flex;
  flex-direction: column;
  align-items: flex-end;
  gap: clamp(14px, 1.4vw, 20px);
  text-decoration: none;
  color: rgba(243, 243, 243, 0.6);
  transition: color 0.25s ease;
  flex-shrink: 0;
}

.page-go-forth .footer-home-pagetop:hover,
.page-backstory .footer-home-pagetop:hover,
.page-dogcare .footer-home-pagetop:hover,
.page-article .footer-home-pagetop:hover,
.page-about .footer-home-pagetop:hover,
.page-contact .footer-home-pagetop:hover,
.page-privacy .footer-home-pagetop:hover,
.page-recruit .footer-home-pagetop:hover,
.page-editors-picks .footer-home-pagetop:hover ,
.page-editors-picks-article .footer-home-pagetop:hover {
  color: rgba(243, 243, 243, 0.78);
}

.page-go-forth .footer-home-pagetop-label,
.page-backstory .footer-home-pagetop-label,
.page-dogcare .footer-home-pagetop-label,
.page-article .footer-home-pagetop-label,
.page-about .footer-home-pagetop-label,
.page-contact .footer-home-pagetop-label,
.page-privacy .footer-home-pagetop-label,
.page-recruit .footer-home-pagetop-label,
.page-editors-picks .footer-home-pagetop-label ,
.page-editors-picks-article .footer-home-pagetop-label {
  font-family: "Work Sans", "IBM Plex Sans", "Helvetica Neue", sans-serif;
  font-size: clamp(11px, 0.38vw + 9px, 13px);
  font-weight: 500;
  letter-spacing: 0.26em;
  text-transform: uppercase;
  line-height: 1.65;
}

.page-go-forth .footer-home-pagetop-mark,
.page-backstory .footer-home-pagetop-mark,
.page-dogcare .footer-home-pagetop-mark,
.page-article .footer-home-pagetop-mark,
.page-about .footer-home-pagetop-mark,
.page-contact .footer-home-pagetop-mark,
.page-privacy .footer-home-pagetop-mark,
.page-recruit .footer-home-pagetop-mark,
.page-editors-picks .footer-home-pagetop-mark ,
.page-editors-picks-article .footer-home-pagetop-mark {
  display: inline-flex;
  align-items: center;
  gap: clamp(12px, 1.2vw, 18px);
}

.page-go-forth .footer-home-pagetop-line,
.page-backstory .footer-home-pagetop-line,
.page-dogcare .footer-home-pagetop-line,
.page-article .footer-home-pagetop-line,
.page-about .footer-home-pagetop-line,
.page-contact .footer-home-pagetop-line,
.page-privacy .footer-home-pagetop-line,
.page-recruit .footer-home-pagetop-line,
.page-editors-picks .footer-home-pagetop-line ,
.page-editors-picks-article .footer-home-pagetop-line {
  display: block;
  width: clamp(128px, 13vw, 196px);
  height: 1px;
  background: rgba(255, 255, 255, 0.32);
}



/* --- SP：下層ページ共通ヘッダー（HOME §90 準拠・ライト背景） --- */
@media (max-width: 980px) {
  .page-go-forth .header,
  .page-backstory .header,
  .page-dogcare .header,
  .page-article .header,
  .page-about .header,
  .page-contact .header,
  .page-privacy .header,
  .page-recruit .header,
  .page-editors-picks .header ,
.page-editors-picks-article .header {
    padding: 16px 18px 12px;
    min-height: 64px;
    border-bottom: 1px solid rgba(12, 10, 8, 0.08);
  }

  .page-go-forth .header .header-inner,
  .page-backstory .header .header-inner,
  .page-dogcare .header .header-inner,
  .page-article .header .header-inner,
  .page-about .header .header-inner,
  .page-contact .header .header-inner,
  .page-privacy .header .header-inner,
  .page-recruit .header .header-inner,
  .page-editors-picks .header .header-inner ,
.page-editors-picks-article .header .header-inner {
    flex-wrap: nowrap;
    row-gap: 0;
    padding-left: 0;
    padding-right: 0;
    align-items: center;
    gap: 14px;
  }

  .page-go-forth .logo,
  .page-backstory .logo,
  .page-dogcare .logo,
  .page-article .logo,
  .page-about .logo,
  .page-contact .logo,
  .page-privacy .logo,
  .page-recruit .logo,
  .page-editors-picks .logo ,
.page-editors-picks-article .logo {
    margin-top: 0;
  }

  .page-go-forth .logo-img,
  .page-backstory .logo-img,
  .page-dogcare .logo-img,
  .page-article .logo-img,
  .page-about .logo-img,
  .page-contact .logo-img,
  .page-privacy .logo-img,
  .page-recruit .logo-img,
  .page-editors-picks .logo-img ,
.page-editors-picks-article .logo-img {
    height: clamp(38px, 4.5vw + 28px, 45px);
    transform: translateY(2px);
    filter: drop-shadow(0 1px 6px rgba(0, 0, 0, 0.12));
  }

  .page-go-forth .nav,
  .page-backstory .nav,
  .page-dogcare .nav,
  .page-article .nav,
  .page-about .nav,
  .page-contact .nav,
  .page-privacy .nav,
  .page-recruit .nav,
  .page-editors-picks .nav ,
.page-editors-picks-article .nav {
    display: none;
  }

  .page-go-forth .header-actions,
  .page-backstory .header-actions,
  .page-dogcare .header-actions,
  .page-article .header-actions,
  .page-about .header-actions,
  .page-contact .header-actions,
  .page-privacy .header-actions,
  .page-recruit .header-actions,
  .page-editors-picks .header-actions ,
.page-editors-picks-article .header-actions {
    display: flex;
    margin-left: auto;
    align-items: center;
    gap: 10px;
  }

  .page-go-forth .header-icon,
  .page-backstory .header-icon,
  .page-dogcare .header-icon,
  .page-article .header-icon,
  .page-about .header-icon,
  .page-contact .header-icon,
  .page-privacy .header-icon,
  .page-recruit .header-icon,
  .page-editors-picks .header-icon ,
.page-editors-picks-article .header-icon {
    width: 38px;
    height: 38px;
    padding: 0;
    border: 1px solid rgba(12, 10, 8, 0.22);
    background: transparent;
    border-radius: 50%;
    color: #1a1816;
    cursor: pointer;
    position: relative;
  }

  .page-go-forth .header-icon--search span,
  .page-backstory .header-icon--search span,
  .page-dogcare .header-icon--search span,
  .page-article .header-icon--search span,
  .page-about .header-icon--search span,
  .page-contact .header-icon--search span,
  .page-privacy .header-icon--search span,
  .page-recruit .header-icon--search span,
  .page-editors-picks .header-icon--search span ,
.page-editors-picks-article .header-icon--search span {
    position: absolute;
    inset: 0;
    margin: auto;
    width: 12px;
    height: 12px;
    border: 1.5px solid rgba(12, 10, 8, 0.85);
    border-radius: 50%;
    transform: translate(-2px, -2px);
  }

  .page-go-forth .header-icon--search::after,
  .page-backstory .header-icon--search::after,
  .page-dogcare .header-icon--search::after,
  .page-article .header-icon--search::after,
  .page-about .header-icon--search::after,
  .page-contact .header-icon--search::after,
  .page-privacy .header-icon--search::after,
  .page-recruit .header-icon--search::after,
  .page-editors-picks .header-icon--search::after ,
.page-editors-picks-article .header-icon--search::after {
    content: "";
    position: absolute;
    right: 10px;
    bottom: 10px;
    width: 7px;
    height: 1.5px;
    background: rgba(12, 10, 8, 0.85);
    transform: rotate(45deg);
    transform-origin: left center;
  }

  .page-go-forth .header-icon--menu,
  .page-backstory .header-icon--menu,
  .page-dogcare .header-icon--menu,
  .page-article .header-icon--menu,
  .page-about .header-icon--menu,
  .page-contact .header-icon--menu,
  .page-privacy .header-icon--menu,
  .page-recruit .header-icon--menu,
  .page-editors-picks .header-icon--menu ,
.page-editors-picks-article .header-icon--menu {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 4px;
  }

  .page-go-forth .header-icon--menu span,
  .page-backstory .header-icon--menu span,
  .page-dogcare .header-icon--menu span,
  .page-article .header-icon--menu span,
  .page-about .header-icon--menu span,
  .page-contact .header-icon--menu span,
  .page-privacy .header-icon--menu span,
  .page-recruit .header-icon--menu span,
  .page-editors-picks .header-icon--menu span ,
.page-editors-picks-article .header-icon--menu span {
    display: block;
    width: 14px;
    height: 1.5px;
    background: rgba(12, 10, 8, 0.85);
  }
}

/* --- SP（値は整理のみ・デザイン調整は別タスク） --- */
@media (max-width: 980px) {
  .page-go-forth .feature-channel-hero,
  .page-backstory .feature-channel-hero,
  .page-dogcare .feature-channel-hero {
    grid-template-columns: 1fr;
    gap: clamp(24px, 4vw, 32px);
  }

  .page-go-forth .feature-hero-visual,
  .page-backstory .feature-hero-visual,
  .page-dogcare .feature-hero-visual {
    order: -1;
  }

  .page-go-forth .feature-hero-visual-link {
    order: -1;
  }

  .page-backstory .feature-hero-visual-link,
  .page-dogcare .feature-hero-visual-link {
    order: -1;
  }

  .page-go-forth .feature-channel-hero .feature-hero-headline {
    font-size: clamp(20px, 4.8vw + 6px, 26px);
    line-height: 1.35;
  }

  .page-backstory .feature-channel-hero .feature-hero-headline,
  .page-dogcare .feature-channel-hero .feature-hero-headline {
    font-family: var(--font-page-serif);
    font-size: clamp(20px, 4.8vw + 6px, 26px);
    font-weight: 700;
    line-height: 1.35;
    letter-spacing: 0.03em;
    color: #161412;
  }

  .page-backstory .feature-channel-hero .feature-hero-eyebrow,
  .page-dogcare .feature-channel-hero .feature-hero-eyebrow {
    margin-bottom: clamp(23px, calc(1.4vw + 9px), 27px);
  }

  .page-backstory .feature-channel-hero .feature-hero-body p,
  .page-dogcare .feature-channel-hero .feature-hero-body p {
    font-size: clamp(15px, 0.35vw + 13px, 17px);
    line-height: 1.68;
    letter-spacing: 0.05em;
    color: rgba(12, 10, 8, 0.58);
  }

  .page-backstory .feature-channel-hero .feature-hero-link .feature-card-more,
  .page-dogcare .feature-channel-hero .feature-hero-link .feature-card-more {
    padding-top: clamp(40px, calc(2.5vw + 20px), 50px);
    margin-bottom: 10px;
    font-size: 11.5px;
    gap: clamp(9px, 0.92vw, 14px);
  }

  .page-backstory .feature-channel-hero .feature-hero-link .feature-card-more-line,
  .page-dogcare .feature-channel-hero .feature-hero-link .feature-card-more-line {
    width: clamp(32px, 3.2vw, 51px);
  }

  .page-go-forth .feature-filters,
  .page-backstory .feature-filters,
  .page-dogcare .feature-filters {
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    gap: clamp(6px, 1.5vw, 8px);
  }

  .page-go-forth .feature-filters-start,
  .page-backstory .feature-filters-start,
  .page-dogcare .feature-filters-start {
    display: flex;
    flex: 1 1 auto;
    flex-wrap: nowrap;
    align-items: center;
    gap: clamp(6px, 1.5vw, 10px);
    min-width: 0;
  }

  .page-go-forth .feature-filters-label,
  .page-backstory .feature-filters-label,
  .page-dogcare .feature-filters-label {
    flex: 0 0 auto;
    margin: 0 11px 0 0;
    font-size: 12px;
  }

  .page-go-forth .feature-filters-list,
  .page-backstory .feature-filters-list,
  .page-dogcare .feature-filters-list {
    flex: 1 1 auto;
    flex-wrap: nowrap;
    gap: 8px 10px;
    min-width: 0;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    padding-bottom: 0;
  }

  .page-go-forth .feature-filters-list::-webkit-scrollbar,
  .page-backstory .feature-filters-list::-webkit-scrollbar,
  .page-dogcare .feature-filters-list::-webkit-scrollbar {
    display: none;
  }

  .page-go-forth .feature-filters-list .feature-filter,
  .page-backstory .feature-filters-list .feature-filter,
  .page-dogcare .feature-filters-list .feature-filter {
    flex-shrink: 0;
    font-size: 12px;
    letter-spacing: 0.04em;
  }

  .page-go-forth .feature-filters-end,
  .page-backstory .feature-filters-end,
  .page-dogcare .feature-filters-end {
    flex: 0 0 auto;
    align-self: center;
  }

  .page-go-forth .feature-filters-sort-label,
  .page-backstory .feature-filters-sort-label,
  .page-dogcare .feature-filters-sort-label,
  .page-go-forth .feature-filters-sort-text,
  .page-backstory .feature-filters-sort-text,
  .page-dogcare .feature-filters-sort-text {
    display: none;
  }

  .page-go-forth .feature-filters-sort,
  .page-backstory .feature-filters-sort,
  .page-dogcare .feature-filters-sort {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    padding: 0;
    transform: translateY(-5px);
  }

  .page-go-forth .feature-filters-sort-icon,
  .page-backstory .feature-filters-sort-icon,
  .page-dogcare .feature-filters-sort-icon {
    display: flex;
  }

  .page-go-forth .feature-filter,
  .page-backstory .feature-filter,
  .page-dogcare .feature-filter {
    color: rgba(12, 10, 8, 0.55);
  }

  .page-go-forth .feature-filter:hover:not(.is-active),
  .page-backstory .feature-filter:hover:not(.is-active),
  .page-dogcare .feature-filter:hover:not(.is-active) {
    color: rgba(12, 10, 8, 0.62);
  }

  .page-go-forth .feature-filters-sort-icon span,
  .page-backstory .feature-filters-sort-icon span,
  .page-dogcare .feature-filters-sort-icon span {
    background: rgba(12, 10, 8, 0.55);
  }

  .page-go-forth .feature-filters-label,
  .page-backstory .feature-filters-label,
  .page-dogcare .feature-filters-label,
  .page-go-forth .feature-filters-sort-label,
  .page-backstory .feature-filters-sort-label,
  .page-dogcare .feature-filters-sort-label,
  .page-go-forth .feature-filter,
  .page-backstory .feature-filter,
  .page-dogcare .feature-filter,
  .page-go-forth .feature-filters-sort,
  .page-backstory .feature-filters-sort,
  .page-dogcare .feature-filters-sort {
    font-size: 12px;
  }

  .page-go-forth .feature-filters-list .feature-filter.is-active,
  .page-go-forth .feature-filters-list .feature-filter.is-active:hover {
    color: rgba(12, 10, 8, 0.62);
    text-decoration: none;
    border-bottom: 1px solid var(--feature-accent-editorial, #88514A);
  }

  .page-backstory .feature-filters-list .feature-filter.is-active,
  .page-backstory .feature-filters-list .feature-filter.is-active:hover {
    color: rgba(12, 10, 8, 0.62);
    text-decoration: none;
    border-bottom: 1px solid var(--feature-accent, var(--home-backstory-label, #b89428));
  }

  .page-dogcare .feature-filters-list .feature-filter.is-active,
  .page-dogcare .feature-filters-list .feature-filter.is-active:hover {
    color: rgba(12, 10, 8, 0.62);
    text-decoration: none;
    border-bottom: 1px solid var(--feature-accent, #5a8589);
  }

  .page-go-forth .feature-list,
  .page-backstory .feature-list,
  .page-dogcare .feature-list {
    grid-template-columns: 1fr;
    gap: clamp(20px, 4.2vw, 28px);
    align-items: stretch;
  }

  .page-go-forth .feature-list .feature-card[data-feature-lead="true"],
  .page-backstory .feature-list .feature-card[data-feature-lead="true"],
  .page-dogcare .feature-list .feature-card[data-feature-lead="true"] {
    display: none;
  }

  .page-go-forth .feature-list .feature-card,
  .page-backstory .feature-list .feature-card,
  .page-dogcare .feature-list .feature-card {
    display: flex;
    flex-direction: column;
    height: auto;
    min-height: 0;
  }

  .page-go-forth .feature-list .feature-card-link,
  .page-backstory .feature-list .feature-card-link,
  .page-dogcare .feature-list .feature-card-link {
    flex-direction: row;
    align-items: stretch;
    gap: clamp(12px, 3.2vw, 16px);
    flex: 1 1 auto;
    height: auto;
    min-height: clamp(96px, 24vw, 118px);
  }

  .page-go-forth .feature-list .feature-card-thumb,
  .page-backstory .feature-list .feature-card-thumb,
  .page-dogcare .feature-list .feature-card-thumb {
    width: clamp(96px, 27vw, 118px);
    aspect-ratio: 1 / 1;
    flex-shrink: 0;
    align-self: stretch;
    height: auto;
  }

  .page-go-forth .feature-list .feature-card-body,
  .page-backstory .feature-list .feature-card-body,
  .page-dogcare .feature-list .feature-card-body {
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
    min-width: 0;
    min-height: 0;
    padding: 0;
  }

  .page-go-forth .feature-list .feature-card-title,
  .page-backstory .feature-list .feature-card-title,
  .page-dogcare .feature-list .feature-card-title {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
    margin-top: clamp(6px, 1.5vw, 8px);
    font-size: clamp(14px, 3.6vw, 16px);
    line-height: 1.48;
  }

  .page-go-forth .feature-card-excerpt,
  .page-backstory .feature-card-excerpt,
  .page-dogcare .feature-card-excerpt {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
    margin-top: clamp(4px, 1.2vw, 6px);
    font-size: clamp(12px, 3.1vw, 13px);
    line-height: 1.65;
  }

  .page-go-forth .feature-card-more,
  .page-backstory .feature-card-more,
  .page-dogcare .feature-card-more {
    display: flex;
    align-items: center;
    align-self: stretch;
    width: 100%;
    margin-top: auto;
    padding-top: clamp(8px, 2vw, 12px);
  }

  .page-go-forth .feature-list .feature-card-more,
  .page-backstory .feature-list .feature-card-more,
  .page-dogcare .feature-list .feature-card-more {
    flex-wrap: nowrap;
    white-space: nowrap;
  }

  .page-go-forth .feature-card-more-line,
  .page-backstory .feature-card-more-line,
  .page-dogcare .feature-card-more-line {
    flex: 1 1 auto;
    width: auto;
    min-width: 0;
  }

  .page-go-forth .feature-list .feature-card-more-line,
  .page-backstory .feature-list .feature-card-more-line,
  .page-dogcare .feature-list .feature-card-more-line {
    flex: 0 0 auto;
    width: clamp(90px, 24vw, 150px);
    min-width: 0;
  }
}

/* 記事一覧SP（GO FORTH / BACK STORY / DOG CARE）。個別記事・HOME・EDITOR'S PICKSは対象外 */
@media (max-width: 768px) {
  .page-go-forth:not(.page-article) .feature-main,
  .page-backstory:not(.page-article) .feature-main,
  .page-dogcare:not(.page-article) .feature-main {
    padding-top: calc(clamp(36px, 4vw, 52px) - 35px);
  }

  .page-go-forth:not(.page-article) .feature-breadcrumb,
  .page-backstory:not(.page-article) .feature-breadcrumb,
  .page-dogcare:not(.page-article) .feature-breadcrumb {
    margin-top: 26.796875px;
    margin-bottom: calc(clamp(28px, 3vw, 40px) - 25px + 2px);
  }

  .page-go-forth:not(.page-article) .feature-breadcrumb-list,
  .page-backstory:not(.page-article) .feature-breadcrumb-list,
  .page-dogcare:not(.page-article) .feature-breadcrumb-list {
    font-size: 10px;
  }

  .page-go-forth:not(.page-article) .feature-channel-hero,
  .page-backstory:not(.page-article) .feature-channel-hero,
  .page-dogcare:not(.page-article) .feature-channel-hero {
    row-gap: calc(clamp(24px, 4vw, 32px) + 6px);
    margin-bottom: calc(clamp(36px, 4vw, 52px) - 24px);
  }

  .page-go-forth:not(.page-article) .feature-channel-hero .feature-hero-link .feature-card-more,
  .page-backstory:not(.page-article) .feature-channel-hero .feature-hero-link .feature-card-more,
  .page-dogcare:not(.page-article) .feature-channel-hero .feature-hero-link .feature-card-more {
    padding-top: calc(clamp(20px, 2.5vw, 30px) + 20px);
    margin-bottom: calc(30px - 20px);
    font-size: 8.5px;
  }

  .page-go-forth:not(.page-article) .feature-channel-hero .feature-hero-eyebrow,
  .page-backstory:not(.page-article) .feature-channel-hero .feature-hero-eyebrow,
  .page-dogcare:not(.page-article) .feature-channel-hero .feature-hero-eyebrow {
    margin-top: calc(13px - 15px - 3px - 5px - 5px);
    margin-bottom: calc(29px - 6px);
    font-size: calc(clamp(24px, 2.2vw + 16px, 27px) + 1px);
  }

  .page-go-forth:not(.page-article) .feature-channel-hero .feature-hero-headline,
  .page-backstory:not(.page-article) .feature-channel-hero .feature-hero-headline,
  .page-dogcare:not(.page-article) .feature-channel-hero .feature-hero-headline {
    margin-top: calc(clamp(10px, 1.2vw, 15px) + 2px);
    letter-spacing: 0.04em;
  }

  .page-go-forth:not(.page-article) .feature-channel-hero .feature-hero-body,
  .page-backstory:not(.page-article) .feature-channel-hero .feature-hero-body,
  .page-dogcare:not(.page-article) .feature-channel-hero .feature-hero-body {
    margin-top: calc(clamp(14px, 1.6vw, 20px) + 10px);
  }

  .page-go-forth:not(.page-article) .feature-channel-hero .feature-hero-body p,
  .page-backstory:not(.page-article) .feature-channel-hero .feature-hero-body p,
  .page-dogcare:not(.page-article) .feature-channel-hero .feature-hero-body p {
    font-size: calc(clamp(17px, 0.28vw + 15px, 18px) * 0.8);
    line-height: 1.68;
    letter-spacing: 0.05em;
  }

  .page-go-forth:not(.page-article) .feature-channel-hero .feature-hero-meta-category,
  .page-backstory:not(.page-article) .feature-channel-hero .feature-hero-meta-category,
  .page-dogcare:not(.page-article) .feature-channel-hero .feature-hero-meta-category,
  .page-go-forth:not(.page-article) .feature-channel-hero .feature-hero-meta-sep,
  .page-backstory:not(.page-article) .feature-channel-hero .feature-hero-meta-sep,
  .page-dogcare:not(.page-article) .feature-channel-hero .feature-hero-meta-sep {
    font-size: calc(12.5px * 0.8);
  }

  .page-go-forth:not(.page-article) .feature-channel-hero .feature-hero-meta-date,
  .page-backstory:not(.page-article) .feature-channel-hero .feature-hero-meta-date,
  .page-dogcare:not(.page-article) .feature-channel-hero .feature-hero-meta-date {
    font-size: calc(13.75px * 0.8);
  }

  .page-go-forth:not(.page-article) .feature-filters,
  .page-backstory:not(.page-article) .feature-filters,
  .page-dogcare:not(.page-article) .feature-filters {
    padding-bottom: calc(clamp(22px, 2.4vw, 30px) - 10px);
  }

  .page-go-forth:not(.page-article) .feature-filters-list .feature-filter,
  .page-backstory:not(.page-article) .feature-filters-list .feature-filter,
  .page-dogcare:not(.page-article) .feature-filters-list .feature-filter {
    font-size: calc(12px * 0.81);
  }

  .page-go-forth:not(.page-article) .feature-list .feature-card-more,
  .page-backstory:not(.page-article) .feature-list .feature-card-more,
  .page-dogcare:not(.page-article) .feature-list .feature-card-more {
    font-size: 6.5px;
  }

  .page-go-forth:not(.page-article) .feature-list .feature-card-tag,
  .page-backstory:not(.page-article) .feature-list .feature-card-tag,
  .page-dogcare:not(.page-article) .feature-list .feature-card-tag,
  .page-go-forth:not(.page-article) .feature-list .feature-card-date,
  .page-backstory:not(.page-article) .feature-list .feature-card-date,
  .page-dogcare:not(.page-article) .feature-list .feature-card-date {
    font-size: calc(10px * 0.576 * 1.26);
  }

  .page-go-forth:not(.page-article) .feature-list .feature-card-title,
  .page-backstory:not(.page-article) .feature-list .feature-card-title,
  .page-dogcare:not(.page-article) .feature-list .feature-card-title {
    font-size: 14px;
  }

  .page-go-forth:not(.page-article) .feature-list .feature-card-excerpt,
  .page-backstory:not(.page-article) .feature-list .feature-card-excerpt,
  .page-dogcare:not(.page-article) .feature-list .feature-card-excerpt {
    font-size: calc(clamp(12px, 3.1vw, 13px) * 0.72);
  }
}

/* BACK STORY一覧SP完成版。
   並びはクラスで固定する。店舗名や人物名の文言には依存しない。
   見出し → 店舗・所属（.feature-hero-meta-place）と肩書き・人物名（.feature-hero-meta-person）→ 本文 → READ STORY。
   店舗と人物は .feature-hero-meta-date 内の同一行。上14px、下26px。
   GO FORTH・DOG CARE・PC・個別記事は対象外。 */
@media (max-width: 768px) {
  body.page-backstory:not(.page-article) .feature-channel-hero .feature-hero-meta {
    display: contents;
  }

  body.page-backstory:not(.page-article) .feature-channel-hero .feature-hero-meta-category {
    order: 1;
    margin-top: clamp(12px, 1.2vw, 16px);
  }

  body.page-backstory:not(.page-article) .feature-channel-hero .feature-hero-meta-sep {
    display: none;
  }

  body.page-backstory:not(.page-article) .feature-channel-hero .feature-hero-headline {
    order: 2;
  }

  body.page-backstory:not(.page-article) .feature-channel-hero .feature-hero-meta-date {
    order: 3;
    margin-top: 14px;
  }

  body.page-backstory:not(.page-article) .feature-channel-hero .feature-hero-body {
    order: 4;
    margin-top: 26px;
  }

  body.page-backstory:not(.page-article) .feature-channel-hero .feature-hero-link .feature-card-more {
    order: 5;
  }
}

@media (max-width: 768px) {
  .page-go-forth .header .header-inner,
  .page-backstory .header .header-inner,
  .page-dogcare .header .header-inner,
  .page-article .header .header-inner,
  .page-about .header .header-inner,
  .page-contact .header .header-inner,
  .page-privacy .header .header-inner,
  .page-recruit .header .header-inner,
  .page-editors-picks .header .header-inner ,
.page-editors-picks-article .header .header-inner {
    max-width: 100%;
    padding-left: 15px;
    padding-right: 15px;
  }

  .page-go-forth .header .header-inner,
  .page-backstory .header .header-inner,
  .page-dogcare .header .header-inner,
  .page-article .header .header-inner,
  .page-about .header .header-inner,
  .page-contact .header .header-inner,
  .page-privacy .header .header-inner,
  .page-recruit .header .header-inner,
  .page-editors-picks .header .header-inner ,
.page-editors-picks-article .header .header-inner {
    padding-left: 2px;
    padding-right: 0;
  }

  .page-go-forth .logo-img,
  .page-backstory .logo-img,
  .page-dogcare .logo-img,
  .page-article .logo-img,
  .page-about .logo-img,
  .page-contact .logo-img,
  .page-privacy .logo-img,
  .page-recruit .logo-img,
  .page-editors-picks .logo-img ,
.page-editors-picks-article .logo-img {
    height: clamp(38px, 4.5vw + 28px, 45px);
    transform: translateY(2px);
  }

  .page-go-forth .logo,
  .page-backstory .logo,
  .page-dogcare .logo,
  .page-article .logo,
  .page-about .logo,
  .page-contact .logo,
  .page-privacy .logo,
  .page-recruit .logo,
  .page-editors-picks .logo ,
.page-editors-picks-article .logo {
    flex: 1 1 auto;
    min-width: 0;
    margin-left: -10px;
  }

  .page-go-forth .header-actions,
  .page-backstory .header-actions,
  .page-dogcare .header-actions,
  .page-article .header-actions,
  .page-about .header-actions,
  .page-contact .header-actions,
  .page-privacy .header-actions,
  .page-recruit .header-actions,
  .page-editors-picks .header-actions ,
.page-editors-picks-article .header-actions {
    display: flex;
    margin-left: auto;
    margin-right: -6px;
    align-items: center;
    gap: 10px;
  }

  .page-go-forth .nav,
  .page-backstory .nav,
  .page-dogcare .nav,
  .page-article .nav,
  .page-about .nav,
  .page-contact .nav,
  .page-privacy .nav,
  .page-recruit .nav,
  .page-editors-picks .nav ,
.page-editors-picks-article .nav {
    display: none;
  }

  .page-go-forth .feature-main,
  .page-backstory .feature-main,
  .page-dogcare .feature-main,
  .page-about .feature-main,
  .page-contact .feature-main,
  .page-privacy .feature-main,
  .page-recruit .feature-main {
    max-width: 100%;
    padding-left: 20px;
    padding-right: 20px;
  }

  .page-go-forth .feature-list,
  .page-backstory .feature-list,
  .page-dogcare .feature-list {
    gap: clamp(18px, 4.8vw, 24px);
  }

  .page-go-forth .feature-list .feature-card-link,
  .page-backstory .feature-list .feature-card-link,
  .page-dogcare .feature-list .feature-card-link {
    gap: clamp(10px, 2.8vw, 14px);
    min-height: clamp(88px, 22vw, 108px);
  }

  .page-go-forth .feature-list .feature-card-thumb,
  .page-backstory .feature-list .feature-card-thumb,
  .page-dogcare .feature-list .feature-card-thumb {
    width: clamp(88px, 25vw, 108px);
  }

  .page-go-forth .feature-list .feature-card-date,
  .page-backstory .feature-list .feature-card-date,
  .page-dogcare .feature-list .feature-card-date {
    font-size: 10px;
  }

  .page-go-forth .footer-home-inner,
  .page-backstory .footer-home-inner,
  .page-dogcare .footer-home-inner,
  .page-article .footer-home-inner,
  .page-about .footer-home-inner,
  .page-contact .footer-home-inner,
  .page-privacy .footer-home-inner,
  .page-recruit .footer-home-inner,
  .page-editors-picks .footer-home-inner,
  .page-editors-picks-article .footer-home-inner {
    max-width: 100%;
    padding: clamp(72px, 10.5vw, 100px) 20px clamp(42px, 4.5vw, 60px);
  }

  /* GO FORTH記事（article-template.css）と同じ SP 左右ガターを EP 記事フッターへ適用 */
  .page-editors-picks-article .footer-home-inner {
    padding-left: 28px;
    padding-right: 28px;
    box-sizing: border-box;
  }

  .page-go-forth .footer-home-body-main,
  .page-backstory .footer-home-body-main,
  .page-dogcare .footer-home-body-main,
  .page-article .footer-home-body-main,
  .page-about .footer-home-body-main,
  .page-contact .footer-home-body-main,
  .page-privacy .footer-home-body-main,
  .page-recruit .footer-home-body-main,
  .page-editors-picks-article .footer-home-body-main {
    flex-direction: column;
    align-items: flex-start;
    gap: clamp(28px, 5.5vw, 38px);
    margin-bottom: clamp(36px, 5.8vw, 48px);
  }

  .page-go-forth .footer-home-meta,
  .page-backstory .footer-home-meta,
  .page-dogcare .footer-home-meta,
  .page-article .footer-home-meta,
  .page-about .footer-home-meta,
  .page-contact .footer-home-meta,
  .page-privacy .footer-home-meta,
  .page-recruit .footer-home-meta,
  .page-editors-picks-article .footer-home-meta {
    flex-direction: column;
    align-items: flex-start;
    justify-content: flex-start;
    gap: clamp(20px, 4vw, 28px);
  }

  .page-go-forth .footer-home-bottom,
  .page-backstory .footer-home-bottom,
  .page-dogcare .footer-home-bottom,
  .page-article .footer-home-bottom,
  .page-about .footer-home-bottom,
  .page-contact .footer-home-bottom,
  .page-privacy .footer-home-bottom,
  .page-recruit .footer-home-bottom,
  .page-editors-picks-article .footer-home-bottom {
    flex-direction: column;
    align-items: flex-start;
    gap: clamp(28px, 5.5vw, 38px);
  }

  .page-go-forth .footer-home-pagetop,
  .page-backstory .footer-home-pagetop,
  .page-dogcare .footer-home-pagetop,
  .page-article .footer-home-pagetop,
  .page-about .footer-home-pagetop,
  .page-contact .footer-home-pagetop,
  .page-privacy .footer-home-pagetop,
  .page-recruit .footer-home-pagetop,
  .page-editors-picks-article .footer-home-pagetop {
    align-self: flex-end;
  }

  .page-go-forth .footer-home-pagetop-line,
  .page-backstory .footer-home-pagetop-line,
  .page-dogcare .footer-home-pagetop-line,
  .page-article .footer-home-pagetop-line,
  .page-about .footer-home-pagetop-line,
  .page-contact .footer-home-pagetop-line,
  .page-privacy .footer-home-pagetop-line,
  .page-recruit .footer-home-pagetop-line,
  .page-editors-picks-article .footer-home-pagetop-line {
    width: clamp(100px, 28vw, 148px);
  }
}


/* §58 ─────── ABOUT（about.html）完成版・固定 ───────
   ⚠ PROTECTED — ABOUT専用。表示差分を伴う変更禁止。
   明示的な修正依頼がある場合のみ変更可。他ページ整理に伴う変更も禁止。
   完了記録: BACKSTORY_ABOUT_COMPLETE.md / BACKSTORY_OPERATION_RULES.md §23
   対象: about.html + 本§58のみ。HEADER/FOOTER共有セレクタは触らない。 */

.page-about {
  background: #ffffff;
  color: #1a1816;
  /* PC紙面レール: ヘッダー --home-editorial-gutter 基準 + 左右各20px */
  --about-rail-max: var(--home-editorial-max);
  --about-rail-gutter: calc(var(--home-editorial-gutter) + 20px);
  /* SP紙面レール: ヘッダーgutter − 18px（下限12px）≒31px */
  --about-sp-rail-gutter: max(12px, calc(var(--home-editorial-gutter) - 18px));
  /* HERO画像上部抽出色（ヘッダー／HERO境界を消す） */
  --about-hero-top-pc: #fefdfb; /* hero-about-pc-001.png */
  --about-hero-top-sp: #fefefd; /* hero-about-sp-001.png */
}

/* HEADER：共有セレクタは触らず、ABOUT専用で背景のみ上書き */
.page-about .header {
  background: var(--about-hero-top-pc);
  border-bottom-color: var(--about-hero-top-pc);
}

.page-about .feature-main.about-main {
  width: 100%;
  max-width: none;
  margin: 0;
  padding: 0;
  background: #ffffff;
  box-sizing: border-box;
}

/* HERO〜MEDIA OFFICE 共通コンテナ（背景はセクション全幅） */
.page-about .about-hero-frame,
.page-about .about-block-inner {
  width: 100%;
  max-width: var(--about-rail-max);
  margin-left: auto;
  margin-right: auto;
  padding-left: var(--about-rail-gutter);
  padding-right: var(--about-rail-gutter);
  box-sizing: border-box;
}

/* —— HERO —— */
.page-about .about-hero {
  position: relative;
  margin: 0;
  padding: 30px 0 60px;
  overflow: hidden;
  background: var(--about-hero-top-pc); /* 画像上部と同色（ヘッダーと一体） */
  border-bottom: 1px solid rgba(12, 10, 8, 0.06);
}

/* 全幅背景（PC / SP 切替）。旧右寄せイラストは重ねない */
.page-about .about-hero-bg {
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
}

.page-about .about-hero-bg picture,
.page-about .about-hero-bg img {
  display: block;
  width: 100%;
  height: 100%;
}

.page-about .about-hero-bg img {
  object-fit: cover;
  object-position: right center;
}

.page-about .about-hero-frame {
  position: relative;
  z-index: 1;
}

.page-about .about-hero-breadcrumb {
  margin: 0 0 60px;
}

.page-about .about-hero-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.95fr);
  gap: 12px 36px;
  align-items: stretch;
  min-height: 0;
}

.page-about .about-hero-copy {
  min-width: 0;
  align-self: start;
}

.page-about .about-hero-eyebrow {
  margin: 0 0 12px;
  font-family: var(--font-story-meta);
  font-size: clamp(11px, 0.2vw + 10px, 12px);
  font-weight: 600;
  letter-spacing: 0.28em;
  text-transform: uppercase;
  color: rgba(12, 10, 8, 0.42);
}

.page-about .about-hero-title {
  margin: 0 0 14px;
  font-family: var(--font-page-serif);
  font-size: clamp(30px, 2.8vw + 16px, 46px);
  font-weight: 500;
  line-height: 1.35;
  letter-spacing: 0.04em;
  color: #0c0a08;
}

.page-about .about-hero-lead {
  margin: 0 0 22px;
  max-width: 22em;
  font-family: var(--font-page-serif);
  font-size: clamp(15px, 0.35vw + 13px, 18px);
  font-weight: 400;
  line-height: 1.85;
  letter-spacing: 0.06em;
  color: rgba(12, 10, 8, 0.62);
}

.page-about .about-hero-tag {
  margin: 0;
  font-family: var(--font-story-meta);
  font-size: clamp(10px, 0.15vw + 9px, 11px);
  font-weight: 600;
  letter-spacing: 0.32em;
  text-transform: uppercase;
  color: rgba(12, 10, 8, 0.38);
}

/* 旧右イラスト相当の高さスペーサー（画像は表示しない） */
.page-about .about-hero-visual {
  display: flex;
  justify-content: flex-end;
  align-items: flex-end;
  align-self: stretch;
  min-width: 0;
  min-height: 100%;
}

.page-about .about-hero-visual::before {
  content: "";
  display: block;
  width: min(100%, 430px);
  aspect-ratio: 1467 / 1072;
  visibility: hidden;
}

/* —— セクション共通（2カラム） —— */
.page-about .about-block {
  margin: 0;
  padding: clamp(56px, 6.5vw, 88px) 0;
  background: #ffffff;
}

.page-about .about-block-inner {
  display: grid;
  grid-template-columns: minmax(140px, 200px) minmax(0, 1fr);
  gap: clamp(24px, 3.5vw, 48px);
  align-items: start;
}

.page-about .about-block-label {
  padding-top: 0.35em;
}

.page-about .about-block-label-text {
  margin: 0 0 0.85em;
  font-family: var(--font-story-meta);
  font-size: clamp(11px, 0.2vw + 10px, 12px);
  font-weight: 600;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  line-height: 1.3;
  color: #6d7f92;
}

.page-about .about-block-rule {
  display: block;
  width: 36px;
  height: 1px;
  background: rgba(109, 127, 146, 0.45);
}

.page-about .about-block-main {
  min-width: 0;
}

.page-about .about-block-title {
  margin: 0 0 clamp(22px, 2.4vw, 32px);
  font-family: var(--font-page-serif);
  font-size: clamp(22px, 1.4vw + 16px, 30px);
  font-weight: 500;
  line-height: 1.45;
  letter-spacing: 0.06em;
  color: #0c0a08;
}

.page-about .about-block-body {
  max-width: 40em;
}

.page-about .about-block-body p {
  margin: 0 0 1.35em;
  font-family: var(--font-page-serif);
  font-size: clamp(14px, 0.3vw + 13px, 16px);
  font-weight: 400;
  line-height: 2;
  letter-spacing: 0.05em;
  color: rgba(12, 10, 8, 0.72);
}

.page-about .about-block-body p:last-child {
  margin-bottom: 0;
}

.page-about .about-block--belief {
  background: #f2f5f8;
}

.page-about .about-block--editorial {
  background: #f7f6f4;
}

.page-about .about-editorial-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(160px, 280px);
  gap: clamp(20px, 3vw, 40px);
  align-items: end;
}

.page-about .about-editorial-visual {
  display: flex;
  justify-content: flex-end;
  align-items: flex-end;
}

.page-about .about-editorial-illust {
  display: block;
  width: min(100%, 240px);
  height: auto;
  object-fit: contain;
  background: transparent;
}

/* —— CONTENTS カード —— */
.page-about .about-cards {
  display: block;
  margin-top: calc(clamp(4px, 0.6vw, 8px) + 20px); /* 導入文〜カード */
}

.page-about .about-cards-list {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: clamp(12px, 1.4vw, 18px);
  margin: 0;
  padding: 0;
  list-style: none;
}

.page-about .about-card {
  --about-card-accent: #6d7f92;
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  box-sizing: border-box;
  min-height: 100%;
  padding: clamp(18px, 1.8vw, 24px) clamp(16px, 1.6vw, 22px) clamp(28px, 2.4vw, 36px);
  border: 1px solid rgba(12, 10, 8, 0.1);
  background: #ffffff;
  text-decoration: none;
  color: inherit;
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.page-about .about-card:hover {
  border-color: rgba(12, 10, 8, 0.2);
  box-shadow: 0 6px 18px rgba(12, 10, 8, 0.04);
}

.page-about .about-card:focus-visible {
  outline: 1px solid rgba(12, 10, 8, 0.35);
  outline-offset: 3px;
}

.page-about .about-card--backstory { --about-card-accent: #5f7fa0; }
.page-about .about-card--goforth { --about-card-accent: #6a8f6e; }
.page-about .about-card--dogcare { --about-card-accent: #c17f52; }
.page-about .about-card--picks { --about-card-accent: #c4848e; }

.page-about .about-card-label {
  margin: 0 0 0.9em;
  font-family: var(--font-story-meta);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--about-card-accent);
}

.page-about .about-card-title {
  margin: 0 0 auto;
  padding-bottom: 1.2em;
  font-family: var(--font-page-serif);
  font-size: clamp(13px, 0.3vw + 12px, 15px);
  font-weight: 500;
  line-height: 1.7;
  letter-spacing: 0.04em;
  color: #0c0a08;
}

.page-about .about-card-more {
  font-family: var(--font-story-meta);
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 0.12em;
  color: rgba(12, 10, 8, 0.48);
}

.page-about .about-card-accent {
  position: absolute;
  right: clamp(16px, 1.6vw, 22px);
  bottom: 14px;
  width: 28px;
  height: 3px;
  background: var(--about-card-accent);
}

/* —— MEDIA OFFICE —— */
.page-about .about-office-table {
  width: 100%;
  max-width: 680px;
  border-collapse: collapse;
  font-family: var(--font-page-serif);
  font-size: clamp(14px, 0.3vw + 13px, 16px);
  line-height: 1.7;
  letter-spacing: 0.04em;
}

.page-about .about-office-table th,
.page-about .about-office-table td {
  padding: 0.9em 0;
  border-bottom: 1px solid rgba(12, 10, 8, 0.08);
  vertical-align: top;
  text-align: left;
}

.page-about .about-office-table th {
  width: 7.5em;
  font-weight: 500;
  color: rgba(12, 10, 8, 0.48);
}

.page-about .about-office-table td {
  color: rgba(12, 10, 8, 0.78);
}

.page-about .about-block--office {
  padding-bottom: clamp(48px, 5vw, 72px);
}

/* —— ≤980px —— */
@media (max-width: 980px) {
  .page-about .about-cards-list {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .page-about .about-hero-layout {
    grid-template-columns: minmax(0, 1fr) minmax(0, 0.9fr);
    gap: 10px 24px;
  }

  .page-about .about-hero-visual::before {
    width: min(100%, 360px);
  }
}

/* —— SP ≤768px —— */
@media (max-width: 768px) {
  .page-about .header {
    background: var(--about-hero-top-sp);
    border-bottom-color: var(--about-hero-top-sp);
  }

  .page-about .about-hero {
    padding: 24px 0 40px;
    background: var(--about-hero-top-sp);
  }

  .page-about .about-hero-bg img {
    object-position: 78% center;
  }

  .page-about .about-hero-breadcrumb {
    margin-bottom: 32px;
  }

  .page-about .about-hero-layout {
    grid-template-columns: 1fr;
    gap: 24px;
    align-items: start;
    min-height: 0;
  }

  .page-about .about-hero-copy {
    order: 1;
  }

  .page-about .about-hero-visual {
    justify-content: flex-end;
    align-items: flex-end;
    align-self: auto;
    min-height: 0;
    order: 2;
  }

  .page-about .about-hero-visual::before {
    width: min(72%, 260px);
  }

  .page-about .about-hero-title {
    margin-bottom: 15px;
    /* 1行固定。算出式は完成表示を維持するため変更しない */
    font-size: calc((100vw - 88px) / 11.09375);
    line-height: 1.36;
    white-space: nowrap;
  }

  .page-about .about-hero-frame,
  .page-about .about-block-inner {
    padding-left: var(--about-sp-rail-gutter);
    padding-right: var(--about-sp-rail-gutter);
  }

  .page-about .about-block {
    padding: 48px 0;
  }

  .page-about .about-block-inner {
    grid-template-columns: 1fr;
    gap: 14px;
  }

  .page-about .about-block-label {
    padding-top: 0;
  }

  .page-about .about-block-title {
    margin-bottom: 20px;
  }

  .page-about .about-editorial-layout {
    grid-template-columns: 1fr;
    gap: 28px;
  }

  .page-about .about-editorial-illust {
    width: min(70%, 220px);
  }

  .page-about .about-cards-list {
    grid-template-columns: 1fr;
    gap: 12px;
  }

  .page-about .about-card {
    min-height: 0;
    padding: 18px 18px 30px;
  }

  .page-about .about-office-table th {
    width: 5.5em;
  }
}

/* SP CONTENTS: 中間幅は2カラム */
@media (min-width: 561px) and (max-width: 768px) {
  .page-about .about-cards-list {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

/* §60 ─────── CONTACT（about/contact.html）完成版・固定 ───────
   ⚠ PROTECTED — CONTACT専用。表示差分を伴う変更禁止。
   明示的な修正依頼がある場合のみ変更可。他ページ整理に伴う変更も禁止。
   完了記録: BACKSTORY_CONTACT_COMPLETE.md / BACKSTORY_OPERATION_RULES.md §25
   対象: about/contact.html + 本§60のみ。HEADER/FOOTER共有セレクタは触らない。
   フォーム構造・送信処理・バリデーション関連セレクタは削除・改名禁止。 */

.page-contact {
  --contact-rail-max: var(--home-editorial-max);
  --contact-rail-gutter: var(--home-editorial-gutter);
  /* HERO左右余白：ABOUT正本（--about-rail-gutter / --about-sp-rail-gutter）と同値 */
  --contact-hero-rail-gutter: calc(var(--home-editorial-gutter) + 20px);
  --contact-hero-sp-rail-gutter: max(12px, calc(var(--home-editorial-gutter) - 18px));
  --contact-ink: #0c0a08;
  --contact-muted: rgba(12, 10, 8, 0.62);
  --contact-line: rgba(12, 10, 8, 0.12);
  /* HERO画像上部抽出色（ヘッダー／HERO境界を消す） */
  --contact-hero-top-pc: #fefefe; /* hero-contact-pc-001.png */
  --contact-hero-top-sp: #fefefe; /* hero-contact-sp-001.png */
  --contact-hero-bg: var(--contact-hero-top-pc);
  --contact-note-bg: #eae6df;
  /* 下層共通の #f4f2ee を打ち消し（フッター上のベージュ帯防止） */
  background: #ffffff;
}

/* HEADER：共有セレクタは触らず、CONTACT専用で背景のみ上書き */
.page-contact .header {
  background: var(--contact-hero-top-pc);
  border-bottom-color: var(--contact-hero-top-pc);
}

.page-contact .feature-main.contact-main {
  width: 100%;
  max-width: none;
  margin: 0;
  padding: 0;
  background: #ffffff;
  box-sizing: border-box;
}

/* フッター上の余白帯を消す（フッター内部の高さ・paddingは共有指定のまま） */
.page-contact .site-footer.home-footer {
  margin-top: 0;
}

.page-contact .contact-hero-frame,
.page-contact .contact-body-frame {
  width: 100%;
  max-width: var(--contact-rail-max);
  margin-left: auto;
  margin-right: auto;
  box-sizing: border-box;
}

.page-contact .contact-hero-frame {
  padding-left: var(--contact-hero-rail-gutter);
  padding-right: var(--contact-hero-rail-gutter);
}

.page-contact .contact-body-frame {
  padding-left: var(--contact-rail-gutter);
  padding-right: var(--contact-rail-gutter);
}

/* —— HERO（全幅背景 PC/SP。旧右寄せイラストは重ねない） —— */
.page-contact .contact-hero {
  position: relative;
  margin: 0;
  padding: 30px 0 60px; /* ABOUT .about-hero と同値 */
  overflow: hidden;
  background: var(--contact-hero-bg);
  border-bottom: 1px solid rgba(12, 10, 8, 0.06);
}

.page-contact .contact-hero-bg {
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
}

.page-contact .contact-hero-bg picture,
.page-contact .contact-hero-bg img {
  display: block;
  width: 100%;
  height: 100%;
}

.page-contact .contact-hero-bg img {
  object-fit: cover;
  object-position: right center;
}

.page-contact .contact-hero-frame {
  position: relative;
  z-index: 1;
}

.page-contact .contact-hero-breadcrumb {
  margin: 0 0 60px; /* ABOUT .about-hero-breadcrumb と同値 */
}

.page-contact .contact-hero-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.95fr);
  gap: 12px 36px;
  align-items: stretch;
  min-height: 0;
}

.page-contact .contact-hero-copy {
  min-width: 0;
  align-self: start;
}

.page-contact .contact-hero-eyebrow {
  margin: 0 0 0.28em;
  font-family: var(--font-story-meta);
  font-size: clamp(30px, 3.4vw + 14px, 54px);
  font-weight: 600;
  letter-spacing: 0.24em;
  line-height: 1.1;
  text-transform: uppercase;
  color: var(--contact-ink);
}

.page-contact .contact-hero-title {
  margin: 0 0 1.35em;
  font-family: var(--font-page-serif);
  font-size: clamp(13px, 0.25vw + 12px, 15px);
  font-weight: 400;
  letter-spacing: 0.22em;
  line-height: 1.5;
  color: rgba(12, 10, 8, 0.38);
}

.page-contact .contact-hero-lead {
  margin: 0;
  max-width: 22em;
  font-family: var(--font-page-serif);
  font-size: clamp(16px, 0.45vw + 13px, 20px);
  font-weight: 400;
  letter-spacing: 0.06em;
  line-height: 1.85;
  color: var(--contact-muted);
}

/* 旧右イラスト相当の高さスペーサー（画像は表示しない） */
.page-contact .contact-hero-visual {
  display: flex;
  justify-content: flex-end;
  align-items: flex-end;
  align-self: stretch;
  min-width: 0;
  min-height: 100%;
}

.page-contact .contact-hero-visual::before {
  content: "";
  display: block;
  width: min(100%, 430px); /* 旧 about-009 表示幅 */
  aspect-ratio: 1440 / 1092;
  visibility: hidden;
}

/* —— 本文2カラム —— */
.page-contact .contact-body {
  margin: 0;
  /* フッター上余白は最終セクションの padding-bottom で確保（背景は白・ベージュ帯は復活させない） */
  padding: clamp(48px, 5.5vw, 80px) 0 100px;
  background: #ffffff;
}

.page-contact .contact-layout {
  display: grid;
  grid-template-columns: minmax(0, 0.92fr) minmax(0, 1.18fr);
  gap: clamp(40px, 5vw, 72px) clamp(36px, 4.5vw, 64px);
  align-items: start;
}

.page-contact .contact-intro,
.page-contact .contact-form-area {
  min-width: 0;
}

.page-contact .contact-form-area {
  padding-left: clamp(28px, 3vw, 48px);
  border-left: 1px solid rgba(12, 10, 8, 0.1);
}

.page-contact .contact-lead-text {
  margin: 0;
  font-family: var(--font-page-serif);
  font-size: clamp(14px, 0.25vw + 13px, 16px);
  font-weight: 400;
  letter-spacing: 0.045em;
  line-height: 2;
  color: var(--contact-muted);
}

.page-contact .contact-consult {
  margin-top: clamp(36px, 4vw, 48px);
  padding-top: clamp(26px, 3vw, 36px);
  border-top: 1px solid rgba(12, 10, 8, 0.1);
}

.page-contact .contact-section-heading {
  margin: 0 0 clamp(18px, 2vw, 26px);
  font-family: var(--font-page-serif);
  font-size: clamp(18px, 0.45vw + 14px, 22px);
  font-weight: 500;
  letter-spacing: 0.06em;
  line-height: 1.45;
  color: var(--contact-ink);
}

.page-contact .contact-form-heading {
  padding-bottom: 0.75em;
  border-bottom: 1px solid rgba(12, 10, 8, 0.28);
}

.page-contact .contact-consult-list {
  margin: 0;
  padding: 0;
  list-style: none;
}

.page-contact .contact-consult-item {
  margin: 0;
  padding: 1.15em 0 1.2em;
  border-top: 1px solid rgba(12, 10, 8, 0.1);
}

.page-contact .contact-consult-title {
  margin: 0 0 0.35em;
  font-family: var(--font-page-serif);
  font-size: clamp(15px, 0.2vw + 14px, 16px);
  font-weight: 500;
  letter-spacing: 0.06em;
  line-height: 1.45;
  color: var(--contact-ink);
}

.page-contact .contact-consult-text {
  margin: 0;
  font-family: var(--font-page-serif);
  font-size: 13px;
  font-weight: 400;
  letter-spacing: 0.035em;
  line-height: 1.7;
  color: rgba(12, 10, 8, 0.52);
}

.page-contact .contact-note {
  margin-top: clamp(28px, 3vw, 40px);
  padding: clamp(22px, 2.4vw, 28px) clamp(22px, 2.6vw, 30px);
  background: var(--contact-note-bg);
}

.page-contact .contact-note-title {
  margin: 0 0 0.55em;
  font-family: var(--font-page-serif);
  font-size: 15px;
  font-weight: 500;
  letter-spacing: 0.06em;
  color: var(--contact-ink);
}

.page-contact .contact-note-text {
  margin: 0;
  font-family: var(--font-page-serif);
  font-size: 13px;
  font-weight: 400;
  letter-spacing: 0.04em;
  line-height: 1.85;
  color: rgba(12, 10, 8, 0.62);
}

/* —— フォーム —— */
.page-contact .contact-form-group {
  margin-bottom: 1.25em;
}

.page-contact .contact-form-group label {
  display: block;
  margin-bottom: 0.45em;
  font-family: var(--font-page-serif);
  font-size: 14px;
  font-weight: 500;
  letter-spacing: 0.04em;
  color: rgba(12, 10, 8, 0.78);
}

.page-contact .contact-required {
  color: #8f3a32;
  font-size: 13px;
  font-weight: 500;
}

.page-contact .contact-form-group input,
.page-contact .contact-form-group select,
.page-contact .contact-form-group textarea {
  width: 100%;
  border: 1px solid rgba(12, 10, 8, 0.14);
  background: #ffffff;
  padding: 0.85em 1em;
  font-family: var(--font-page-serif);
  font-size: 14px;
  letter-spacing: 0.04em;
  color: #222;
  box-sizing: border-box;
  border-radius: 0;
}

.page-contact .contact-form-group textarea {
  min-height: 120px;
  resize: vertical;
}

.page-contact .contact-form-group input:focus,
.page-contact .contact-form-group select:focus,
.page-contact .contact-form-group textarea:focus {
  outline: 1px solid rgba(12, 10, 8, 0.28);
  outline-offset: 1px;
}

.page-contact .contact-submit {
  width: 100%;
  margin-top: 0.5em;
  padding: 1.05em 1.2em;
  border: none;
  background: #1d1b18;
  color: #fff;
  font-family: var(--font-story-meta);
  font-size: 15px;
  font-weight: 600;
  letter-spacing: 0.16em;
  cursor: pointer;
  transition: opacity 0.22s ease;
}

.page-contact .contact-submit:hover {
  opacity: 0.84;
}

.page-contact .contact-form-note {
  margin: 1em 0 0;
  font-family: var(--font-page-serif);
  font-size: 13px;
  letter-spacing: 0.03em;
  line-height: 1.6;
  color: rgba(12, 10, 8, 0.52);
  text-align: center;
}

.page-contact .contact-form-status {
  margin: 0 0 1.35em;
  padding: 0.95em 0;
  border-top: 1px solid rgba(12, 10, 8, 0.1);
  border-bottom: 1px solid rgba(12, 10, 8, 0.1);
  font-family: var(--font-page-serif);
  font-size: 14px;
  font-weight: 400;
  letter-spacing: 0.04em;
  line-height: 1.85;
  white-space: pre-line;
  color: rgba(12, 10, 8, 0.72);
}

.page-contact .contact-form-status[hidden] {
  display: none;
}

.page-contact .contact-form-status--success {
  color: rgba(12, 10, 8, 0.72);
}

.page-contact .contact-form-status--error {
  color: #8f3a32;
}

.page-contact .contact-hp {
  position: absolute;
  left: -10000px;
  top: auto;
  width: 1px;
  height: 1px;
  overflow: hidden;
}

.page-contact .contact-submit:disabled {
  opacity: 0.55;
  cursor: wait;
}

@media (max-width: 980px) {
  .page-contact .contact-hero-layout {
    grid-template-columns: minmax(0, 1fr) minmax(0, 0.9fr);
    gap: 10px 24px;
  }

  .page-contact .contact-hero-visual::before {
    width: min(100%, 360px);
  }
}

@media (max-width: 900px) {
  .page-contact .contact-layout {
    grid-template-columns: 1fr;
    gap: 40px;
  }

  .page-contact .contact-form-area {
    padding-left: 0;
    border-left: none;
    padding-top: 8px;
    border-top: 1px solid rgba(12, 10, 8, 0.1);
  }
}

@media (max-width: 768px) {
  .page-contact .header {
    background: var(--contact-hero-top-sp);
    border-bottom-color: var(--contact-hero-top-sp);
  }

  .page-contact .contact-hero {
    padding: 24px 0 40px; /* ABOUT SP と同値 */
    background: var(--contact-hero-top-sp);
  }

  .page-contact .contact-hero-bg img {
    object-position: 78% center;
  }

  .page-contact .contact-hero-frame {
    padding-left: var(--contact-hero-sp-rail-gutter);
    padding-right: var(--contact-hero-sp-rail-gutter);
  }

  .page-contact .contact-body-frame {
    padding-left: max(16px, calc(var(--home-editorial-gutter) - 20px));
    padding-right: max(16px, calc(var(--home-editorial-gutter) - 20px));
  }

  .page-contact .contact-hero-breadcrumb {
    margin-bottom: 32px; /* ABOUT SP と同値 */
  }

  .page-contact .contact-hero-layout {
    grid-template-columns: 1fr;
    gap: 24px;
    align-items: start;
    min-height: 0;
  }

  .page-contact .contact-hero-copy {
    order: 1;
  }

  .page-contact .contact-hero-visual {
    justify-content: flex-end;
    align-items: flex-end;
    align-self: auto;
    min-height: 0;
    order: 2;
  }

  .page-contact .contact-hero-visual::before {
    width: min(72%, 260px); /* 旧 about-009 SP 表示幅 */
  }

  .page-contact .contact-hero-eyebrow {
    font-size: clamp(28px, 8.8vw, 36px);
    letter-spacing: 0.2em;
  }

  .page-contact .contact-hero-title {
    margin-bottom: 1.25em;
    font-size: 13px;
    letter-spacing: 0.2em;
    color: rgba(12, 10, 8, 0.36);
  }

  .page-contact .contact-body {
    padding: 36px 0 70px; /* SP：フッター上 70px（白背景） */
  }

  .page-contact .contact-layout {
    gap: 32px;
  }

  .page-contact .contact-lead-text {
    line-height: 1.9;
  }

  .page-contact .contact-consult {
    margin-top: 26px;
    padding-top: 20px;
  }

  .page-contact .contact-section-heading {
    margin-bottom: 14px;
  }

  .page-contact .contact-consult-item {
    padding: 0.85em 0 0.9em;
  }

  .page-contact .contact-consult-title {
    margin-bottom: 0.25em;
    font-size: 15px;
  }

  .page-contact .contact-note {
    margin-top: 24px;
    padding: 20px 18px;
  }

  .page-contact .contact-form-area {
    padding-top: 4px;
  }

  .page-contact .contact-form-group {
    margin-bottom: 1.05em;
  }

  .page-contact .contact-form-group textarea {
    min-height: 110px;
  }
}


/* §60a ─────── PRIVACY（about/privacy-policy.html）完成版・固定 ───────
   ⚠ PROTECTED — PRIVACY専用。表示差分を伴う変更禁止。
   明示的な修正依頼がある場合のみ変更可。他ページ整理に伴う変更も禁止。
   完了記録: BACKSTORY_PRIVACY_COMPLETE.md / BACKSTORY_OPERATION_RULES.md §24
   対象: about/privacy-policy.html + 本§60aのみ。HEADER/FOOTER共有セレクタは触らない。 */

.page-privacy {
  --privacy-rail-max: var(--home-editorial-max);
  --privacy-rail-gutter: var(--home-editorial-gutter);
  --privacy-hero-rail-gutter: calc(var(--home-editorial-gutter) + 20px);
  --privacy-hero-sp-rail-gutter: max(12px, calc(var(--home-editorial-gutter) - 18px));
  --privacy-ink: #0c0a08;
  --privacy-muted: rgba(12, 10, 8, 0.62);
  --privacy-line: rgba(12, 10, 8, 0.12);
  /* HERO画像上部抽出色（ヘッダー／HERO境界を消す） */
  --privacy-hero-top-pc: #fefefe; /* hero-privacy-pc-001.png */
  --privacy-hero-top-sp: #fefefe; /* hero-privacy-sp-001.png */
  --privacy-hero-bg: var(--privacy-hero-top-pc);
  background: #ffffff;
}

/* HEADER：共有セレクタは触らず、PRIVACY専用で背景のみ上書き */
.page-privacy .header {
  background: var(--privacy-hero-top-pc);
  border-bottom-color: var(--privacy-hero-top-pc);
}

.page-privacy .feature-main.privacy-main {
  width: 100%;
  max-width: none;
  margin: 0;
  padding: 0;
  background: #ffffff;
  box-sizing: border-box;
}

.page-privacy .site-footer.home-footer {
  margin-top: 0;
}

.page-privacy .privacy-hero-frame,
.page-privacy .privacy-body-frame {
  width: 100%;
  max-width: var(--privacy-rail-max);
  margin-left: auto;
  margin-right: auto;
  box-sizing: border-box;
}

.page-privacy .privacy-hero-frame {
  padding-left: var(--privacy-hero-rail-gutter);
  padding-right: var(--privacy-hero-rail-gutter);
}

.page-privacy .privacy-body-frame {
  padding-left: var(--privacy-rail-gutter);
  padding-right: var(--privacy-rail-gutter);
}

.page-privacy .privacy-hero {
  position: relative;
  margin: 0;
  padding: 30px 0 60px;
  overflow: hidden;
  background: var(--privacy-hero-bg);
  border-bottom: 1px solid rgba(12, 10, 8, 0.06);
}

/* 全幅背景（PC / SP 切替）。旧右寄せイラストは重ねない */
.page-privacy .privacy-hero-bg {
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
}

.page-privacy .privacy-hero-bg picture,
.page-privacy .privacy-hero-bg img {
  display: block;
  width: 100%;
  height: 100%;
}

.page-privacy .privacy-hero-bg img {
  object-fit: cover;
  object-position: right center;
}

.page-privacy .privacy-hero-frame {
  position: relative;
  z-index: 1;
}

.page-privacy .privacy-hero-breadcrumb {
  margin: 0 0 60px;
}

.page-privacy .privacy-hero-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.95fr);
  gap: 12px 36px;
  align-items: stretch;
  min-height: 0;
}

.page-privacy .privacy-hero-copy {
  min-width: 0;
  align-self: start;
}

.page-privacy .privacy-hero-eyebrow {
  margin: 0 0 0.28em;
  font-family: var(--font-story-meta);
  font-size: clamp(30px, 3.4vw + 14px, 54px);
  font-weight: 600;
  letter-spacing: 0.24em;
  line-height: 1.1;
  text-transform: uppercase;
  color: var(--privacy-ink);
}

.page-privacy .privacy-hero-title {
  margin: 0 0 1.35em;
  font-family: var(--font-page-serif);
  font-size: clamp(13px, 0.25vw + 12px, 15px);
  font-weight: 400;
  letter-spacing: 0.22em;
  line-height: 1.5;
  color: rgba(12, 10, 8, 0.38);
}

.page-privacy .privacy-hero-lead {
  margin: 0;
  max-width: 28em;
  font-family: var(--font-page-serif);
  font-size: clamp(16px, 0.45vw + 13px, 20px);
  font-weight: 400;
  letter-spacing: 0.06em;
  line-height: 1.85;
  color: var(--privacy-muted);
}

/* 旧右イラスト相当の高さスペーサー（画像は表示しない） */
.page-privacy .privacy-hero-visual {
  display: flex;
  justify-content: flex-end;
  align-items: flex-end;
  align-self: stretch;
  min-width: 0;
  min-height: 100%;
}

.page-privacy .privacy-hero-visual::before {
  content: "";
  display: block;
  width: min(100%, 365.5px); /* 旧 about-006 表示幅（430px × 0.85） */
  aspect-ratio: 1230 / 1278;
  visibility: hidden;
}

.page-privacy .privacy-body {
  margin: 0;
  padding: clamp(48px, 5.5vw, 80px) 0 100px;
  background: #ffffff;
}

.page-privacy .privacy-intro {
  margin: 0 0 clamp(40px, 4.5vw, 56px);
  max-width: 780px;
  font-family: var(--font-page-serif);
  font-size: 14px;
  font-weight: 400;
  letter-spacing: 0.045em;
  line-height: 1.9;
  text-align: left;
  color: var(--privacy-muted);
}

.page-privacy .privacy-sections {
  max-width: 780px;
  text-align: left;
}

.page-privacy .privacy-section {
  margin: 0;
  padding: clamp(28px, 3vw, 36px) 0 0;
  border-top: 1px solid var(--privacy-line);
}

.page-privacy .privacy-section:first-child {
  padding-top: 0;
  border-top: none;
}

.page-privacy .privacy-section-heading {
  margin: 0 0 clamp(14px, 1.6vw, 20px);
  font-family: var(--font-page-serif);
  font-size: clamp(18.7px, 0.385vw + 15.4px, 22px); /* 旧17〜20pxの約110% */
  font-weight: 500;
  letter-spacing: 0.06em;
  line-height: 1.5;
  text-align: left;
  color: var(--privacy-ink);
}

.page-privacy .privacy-section-body p {
  margin: 0;
  font-family: var(--font-page-serif);
  font-size: 14px;
  font-weight: 400;
  letter-spacing: 0.04em;
  line-height: 1.9;
  text-align: left;
  color: var(--privacy-muted);
}

.page-privacy .privacy-section-body p + p {
  margin-top: 1em;
}

.page-privacy .privacy-list {
  margin: 1em 0;
  padding: 0 0 0 1.15em;
  list-style: disc;
}

.page-privacy .privacy-list li {
  margin: 0;
  padding: 0;
  font-family: var(--font-page-serif);
  font-size: 14px;
  font-weight: 400;
  letter-spacing: 0.04em;
  line-height: 1.9;
  text-align: left;
  color: var(--privacy-muted);
}

.page-privacy .privacy-list li + li {
  margin-top: 0.15em;
}

.page-privacy .privacy-contact-name {
  margin-top: 1.15em;
  color: rgba(12, 10, 8, 0.78);
}

.page-privacy .privacy-inline-link {
  color: rgba(12, 10, 8, 0.78);
  text-decoration: underline;
  text-decoration-color: rgba(12, 10, 8, 0.22);
  text-underline-offset: 0.2em;
  transition: color 0.18s ease, text-decoration-color 0.18s ease;
}

.page-privacy .privacy-inline-link:hover {
  color: #0c0a08;
  text-decoration-color: rgba(12, 10, 8, 0.42);
}

@media (max-width: 980px) {
  .page-privacy .privacy-hero-layout {
    grid-template-columns: minmax(0, 1fr) minmax(0, 0.9fr);
    gap: 10px 24px;
  }

  .page-privacy .privacy-hero-visual::before {
    width: min(100%, 306px); /* 旧 360px × 0.85 */
  }
}

@media (max-width: 768px) {
  .page-privacy .header {
    background: var(--privacy-hero-top-sp);
    border-bottom-color: var(--privacy-hero-top-sp);
  }

  .page-privacy .privacy-hero {
    padding: 24px 0 40px;
    background: var(--privacy-hero-top-sp);
  }

  .page-privacy .privacy-hero-bg img {
    object-position: 78% center;
  }

  .page-privacy .privacy-hero-frame {
    padding-left: var(--privacy-hero-sp-rail-gutter);
    padding-right: var(--privacy-hero-sp-rail-gutter);
  }

  .page-privacy .privacy-body-frame {
    padding-left: max(16px, calc(var(--home-editorial-gutter) - 20px));
    padding-right: max(16px, calc(var(--home-editorial-gutter) - 20px));
  }

  .page-privacy .privacy-hero-breadcrumb {
    margin-bottom: 32px;
  }

  .page-privacy .privacy-hero-layout {
    grid-template-columns: 1fr;
    gap: 24px;
    align-items: start;
    min-height: 0;
  }

  .page-privacy .privacy-hero-copy {
    order: 1;
  }

  .page-privacy .privacy-hero-visual {
    justify-content: flex-end;
    align-items: flex-end;
    align-self: auto;
    min-height: 0;
    order: 2;
  }

  .page-privacy .privacy-hero-visual::before {
    width: min(61.2%, 221px); /* 旧 72% / 260px × 0.85 */
  }

  .page-privacy .privacy-hero-eyebrow {
    font-size: clamp(28px, 8.8vw, 36px);
    letter-spacing: 0.2em;
  }

  .page-privacy .privacy-hero-title {
    margin-bottom: 1.25em;
    font-size: 13px;
    letter-spacing: 0.2em;
    color: rgba(12, 10, 8, 0.36);
  }

  .page-privacy .privacy-hero-lead {
    max-width: none;
    font-size: clamp(15px, 4.2vw, 17px);
    line-height: 1.8;
  }

  .page-privacy .privacy-body {
    padding: 36px 0 70px;
  }

  .page-privacy .privacy-intro {
    margin-bottom: 32px;
  }

  .page-privacy .privacy-section {
    padding-top: 24px;
  }

  .page-privacy .privacy-section-heading {
    margin-bottom: 12px;
    font-size: 17.6px; /* 旧SP 16pxの約110% */
  }
}

/* §59 ─────── RECRUIT（recruit.html）完成版・固定 ───────
   ⚠ PROTECTED — RECRUIT専用。表示差分を伴う変更禁止。
   正本: BACKSTORY_RECRUIT_COMPLETE.md / OPERATION_RULES §26
   対象: recruit.html + 本§59のみ。HEADER/FOOTER共有セレクタは触らない。
   ABOUT（§58）・CONTACT（§60）・PRIVACY（§60a）・HOME・他カテゴリは変更禁止。 */

.page-recruit {
  --recruit-rail-max: var(--home-editorial-max);
  /* HERO／本文共通ガター：ABOUT正本（--about-rail-gutter / --about-sp-rail-gutter）と同値 */
  --recruit-hero-rail-gutter: calc(var(--home-editorial-gutter) + 20px);
  --recruit-hero-sp-rail-gutter: max(12px, calc(var(--home-editorial-gutter) - 18px));
  /* HERO画像上部抽出色（ヘッダー／HERO境界を消す） */
  --recruit-hero-top-pc: #fefefe; /* hero-recruit-pc-001.png */
  --recruit-hero-top-sp: #fefefd; /* hero-recruit-sp-001.png */
  --recruit-hero-bg: var(--recruit-hero-top-pc);
}

/* HEADER：共有セレクタは触らず、RECRUIT専用で背景のみ上書き */
.page-recruit .header {
  background: var(--recruit-hero-top-pc);
  border-bottom-color: var(--recruit-hero-top-pc);
}

.page-recruit .feature-main.recruit-main {
  width: 100%;
  max-width: none;
  margin: 0;
  padding: 0;
  background: transparent;
  box-sizing: border-box;
}

/* —— 本文 —— */
.page-recruit .recruit-body {
  width: 100%;
  max-width: none;
  margin: 0;
  padding: 0;
  background: #ffffff;
  box-sizing: border-box;
}

.page-recruit .recruit-section {
  margin: 0;
  padding: 0;
}

.page-recruit .recruit-section-inner {
  width: 100%;
  max-width: var(--recruit-rail-max);
  margin: 0 auto;
  /* HEROと同値ガター（本文がHEROより外側へ広がらない） */
  padding-left: var(--recruit-hero-rail-gutter);
  padding-right: var(--recruit-hero-rail-gutter);
  box-sizing: border-box;
}

.page-recruit .recruit-section-label {
  margin: 0 0 1.1em;
  max-width: 760px;
  font-family: var(--font-story-meta);
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.32em;
  text-transform: uppercase;
  line-height: 1.3;
  color: rgba(12, 10, 8, 0.38);
}

.page-recruit .recruit-section-title {
  margin: 0 0 clamp(28px, 3vw, 40px);
  max-width: 760px;
  font-family: var(--font-page-serif);
  font-size: clamp(28px, 1.1vw + 24px, 36px); /* PC 約32〜36px */
  font-weight: 500;
  line-height: 1.5;
  letter-spacing: 0.04em;
  color: #0c0a08;
}

.page-recruit .recruit-section-body {
  margin: 0;
  max-width: 760px;
}

.page-recruit .recruit-section-body p {
  margin: 0 0 1.15em;
  font-family: var(--font-page-serif);
  font-size: 15px;
  font-weight: 400;
  line-height: 1.9;
  letter-spacing: 0.04em;
  color: rgba(12, 10, 8, 0.68);
}

.page-recruit .recruit-section-body p:last-child {
  margin-bottom: 0;
}

.page-recruit .recruit-inline-link {
  color: rgba(12, 10, 8, 0.78);
  text-decoration: underline;
  text-decoration-color: rgba(12, 10, 8, 0.22);
  text-underline-offset: 0.2em;
  transition: color 0.18s ease, text-decoration-color 0.18s ease;
}

.page-recruit .recruit-inline-link:hover {
  color: #0c0a08;
  text-decoration-color: rgba(12, 10, 8, 0.42);
}

/* RECRUIT本体（思想＋案内＋3カード） */
.page-recruit .recruit-overview {
  padding: clamp(46px, 5.44vw, 77px) 0 clamp(38px, 4.2vw, 58px);
}

/* 関連コンテンツ・カード（ABOUT CONTENTSカード仕様を§59へ再現／上辺フル幅色線は不採用） */
.page-recruit .recruit-content-cards {
  margin: clamp(24px, 2.7vw, 34px) 0 0;
  max-width: none;
}

.page-recruit .recruit-content-cards-list {
  --recruit-cards-gap: clamp(12px, 1.4vw, 18px);
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--recruit-cards-gap);
  align-items: stretch;
  /* PC：各カード幅＝コンテナ内旧幅の80%（まとまり幅 = 0.8×本文幅 + 0.4×gap） */
  width: calc(80% + 0.4 * var(--recruit-cards-gap));
  max-width: 100%;
  margin: 0;
  padding: 0;
  list-style: none;
  box-sizing: border-box;
}

.page-recruit .recruit-content-cards-item {
  display: flex;
  min-height: 0;
}

.page-recruit .recruit-content-card {
  --recruit-card-accent: #6d7f92;
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  width: 100%;
  min-height: 100%;
  height: 100%;
  box-sizing: border-box;
  padding: clamp(18px, 1.8vw, 24px) clamp(16px, 1.6vw, 22px) clamp(28px, 2.4vw, 36px);
  border: 1px solid rgba(12, 10, 8, 0.1);
  background: #ffffff;
  text-decoration: none;
  color: inherit;
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.page-recruit .recruit-content-card:hover {
  border-color: rgba(12, 10, 8, 0.2);
  box-shadow: 0 6px 18px rgba(12, 10, 8, 0.04);
}

.page-recruit .recruit-content-card:focus-visible {
  outline: 1px solid rgba(12, 10, 8, 0.35);
  outline-offset: 3px;
}

/* ABOUT .about-card--* と同値 */
.page-recruit .recruit-content-card--goforth { --recruit-card-accent: #6a8f6e; }
.page-recruit .recruit-content-card--backstory { --recruit-card-accent: #5f7fa0; }
.page-recruit .recruit-content-card--picks { --recruit-card-accent: #c4848e; }

.page-recruit .recruit-content-card-label {
  display: block;
  margin: 0 0 0.9em;
  font-family: var(--font-story-meta);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--recruit-card-accent);
}

.page-recruit .recruit-content-card-title {
  display: block;
  margin: 0;
  font-family: var(--font-page-serif);
  font-size: clamp(13px, 0.3vw + 12px, 15px);
  font-weight: 500;
  line-height: 1.7;
  letter-spacing: 0.04em;
  color: #0c0a08;
}

.page-recruit .recruit-content-card-text {
  display: block;
  flex: 1 1 auto;
  margin: 0.65em 0 0;
  padding-bottom: 1.2em;
  font-family: var(--font-page-serif);
  font-size: clamp(12px, 0.2vw + 11.5px, 13px);
  font-weight: 400;
  line-height: 1.75;
  letter-spacing: 0.03em;
  color: rgba(12, 10, 8, 0.58);
}

.page-recruit .recruit-content-card-cta {
  display: block;
  margin-top: auto;
  font-family: var(--font-story-meta);
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 0.12em;
  color: rgba(12, 10, 8, 0.48);
}

.page-recruit .recruit-content-card-accent {
  position: absolute;
  right: clamp(16px, 1.6vw, 22px);
  bottom: 14px;
  width: 28px;
  height: 3px;
  background: var(--recruit-card-accent);
}

/* FOR EMPLOYERS */
.page-recruit .recruit-employers {
  background: #faf8f5;
  padding: clamp(41px, 4.8vw, 68px) 0 clamp(43px, 5.12vw, 72px);
}

/* CONTACT — 下余白に旧footer margin-top相当を吸収（帯の解消） */
.page-recruit .recruit-contact {
  background: #eeeae4;
  padding: clamp(49px, 5.44vw, 77px) 0 calc(clamp(49px, 5.44vw, 77px) + clamp(48px, 5vw, 72px));
  text-align: center;
}

/* フッター上余白帯を消す（フッター内部は共有指定のまま） */
.page-recruit .site-footer.home-footer {
  margin-top: 0;
}

.page-recruit .recruit-contact .recruit-section-label,
.page-recruit .recruit-contact .recruit-section-title,
.page-recruit .recruit-contact .recruit-section-body {
  margin-left: auto;
  margin-right: auto;
  text-align: center;
}

.page-recruit .recruit-contact .recruit-section-title {
  margin-bottom: clamp(20px, 2.2vw, 28px);
}

.page-recruit .recruit-contact-actions {
  margin: clamp(28px, 3vw, 40px) 0 0;
  text-align: center;
}

.page-recruit .recruit-contact-cta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5em;
  min-width: 12.5em;
  padding: 1.05em 1.6em;
  border: none;
  background: #1d1b18;
  font-family: var(--font-story-meta);
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 0.16em;
  text-decoration: none;
  color: #ffffff;
  transition: opacity 0.22s ease;
}

.page-recruit .recruit-contact-cta:hover {
  opacity: 0.84;
  color: #ffffff;
}

.page-recruit .recruit-hero-frame {
  width: 100%;
  max-width: var(--recruit-rail-max);
  margin-left: auto;
  margin-right: auto;
  padding-left: var(--recruit-hero-rail-gutter);
  padding-right: var(--recruit-hero-rail-gutter);
  box-sizing: border-box;
  position: relative;
  z-index: 1;
}

/* —— HERO（全幅背景 PC/SP。旧右寄せイラストは重ねない） —— */
.page-recruit .recruit-hero {
  position: relative;
  margin: 0;
  padding: 30px 0 60px; /* ABOUT .about-hero と同値 */
  overflow: hidden;
  background: var(--recruit-hero-bg);
  border-bottom: 1px solid rgba(12, 10, 8, 0.06);
}

.page-recruit .recruit-hero-bg {
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
}

.page-recruit .recruit-hero-bg picture,
.page-recruit .recruit-hero-bg img {
  display: block;
  width: 100%;
  height: 100%;
}

.page-recruit .recruit-hero-bg img {
  object-fit: cover;
  object-position: right center;
}

.page-recruit .recruit-hero-breadcrumb {
  margin: 0 0 60px; /* ABOUT .about-hero-breadcrumb と同値 */
}

.page-recruit .recruit-hero-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.95fr);
  gap: 12px 36px;
  align-items: stretch;
  min-height: 0;
}

.page-recruit .recruit-hero-copy {
  min-width: 0;
  align-self: start;
}

.page-recruit .recruit-hero-eyebrow {
  margin: 0 0 12px;
  font-family: var(--font-story-meta);
  font-size: clamp(11px, 0.2vw + 10px, 12px);
  font-weight: 600;
  letter-spacing: 0.28em;
  text-transform: uppercase;
  color: rgba(12, 10, 8, 0.42);
}

.page-recruit .recruit-hero-title {
  margin: 0 0 14px;
  font-family: var(--font-page-serif);
  font-size: clamp(30px, 2.8vw + 16px, 46px); /* ABOUT .about-hero-title と同値 */
  font-weight: 500;
  line-height: 1.35;
  letter-spacing: 0.04em;
  color: #0c0a08;
}

/* PC／SP共通：指定2行（nowrapで意図しない途中改行を防止） */
.page-recruit .recruit-hero-title-line {
  display: block;
  white-space: nowrap;
}

.page-recruit .recruit-hero-lead {
  margin: 0;
  max-width: 28em;
  font-family: var(--font-page-serif);
  font-size: clamp(15px, 0.35vw + 13px, 18px); /* ABOUT .about-hero-lead と同値 */
  font-weight: 400;
  line-height: 1.85;
  letter-spacing: 0.06em;
  color: rgba(12, 10, 8, 0.62);
}

/* 旧右イラスト相当の高さスペーサー（画像は表示しない） */
.page-recruit .recruit-hero-visual {
  display: flex;
  justify-content: flex-end;
  align-items: flex-end;
  align-self: stretch;
  min-width: 0;
  min-height: 100%;
}

.page-recruit .recruit-hero-visual::before {
  content: "";
  display: block;
  /* 旧 about-004：max 430×314 内の正方形実表示 314×314 */
  width: min(100%, 314px);
  aspect-ratio: 1 / 1;
  visibility: hidden;
}

@media (max-width: 980px) {
  .page-recruit .recruit-hero-layout {
    grid-template-columns: minmax(0, 1fr) minmax(0, 0.9fr);
    gap: 10px 24px;
  }

  .page-recruit .recruit-hero-visual::before {
    width: min(100%, 263px); /* 旧 max-height 263 相当 */
  }

  .page-recruit .recruit-content-cards-list {
    grid-template-columns: 1fr;
    width: 100%; /* 1カラム時は縮小しない */
  }
}

@media (max-width: 768px) {
  .page-recruit .header {
    background: var(--recruit-hero-top-sp);
    border-bottom-color: var(--recruit-hero-top-sp);
  }

  .page-recruit .recruit-hero {
    padding: 24px 0 40px; /* ABOUT SP と同値 */
    background: var(--recruit-hero-top-sp);
  }

  .page-recruit .recruit-hero-bg img {
    object-position: 78% center;
  }

  .page-recruit .recruit-hero-frame {
    padding-left: var(--recruit-hero-sp-rail-gutter);
    padding-right: var(--recruit-hero-sp-rail-gutter);
  }

  .page-recruit .recruit-hero-breadcrumb {
    margin-bottom: 32px; /* ABOUT SP と同値 */
  }

  .page-recruit .recruit-hero-layout {
    grid-template-columns: 1fr;
    gap: 24px;
    align-items: start;
    min-height: 0;
  }

  .page-recruit .recruit-hero-copy {
    order: 1;
  }

  .page-recruit .recruit-hero-visual {
    justify-content: flex-end;
    align-items: flex-end;
    align-self: auto;
    min-height: 0;
    order: 2;
  }

  .page-recruit .recruit-hero-visual::before {
    width: min(72%, 190px); /* 旧 SP max-height 190 相当 */
  }

  /* SP HEROタイトル：2行固定は基底の .recruit-hero-title-line を継承。サイズ下限のみ320対応 */
  .page-recruit .recruit-hero-title {
    margin-bottom: 15px;
    font-size: clamp(20.5px, 6.2vw, 30px);
    line-height: 1.36;
  }

  .page-recruit .recruit-section-inner {
    padding-left: var(--recruit-hero-sp-rail-gutter);
    padding-right: var(--recruit-hero-sp-rail-gutter);
  }

  .page-recruit .recruit-overview {
    padding: 38px 0 34px;
  }

  .page-recruit .recruit-employers {
    padding: 36px 0 38px;
  }

  .page-recruit .recruit-contact {
    padding: 43px 0 calc(43px + 48px);
  }

  .page-recruit .recruit-section-title {
    font-size: clamp(24px, 6.4vw, 30px);
    margin-bottom: 24px;
  }

  .page-recruit .recruit-content-cards-list {
    grid-template-columns: 1fr;
    gap: 12px;
    width: 100%; /* SP：横幅縮小なし */
  }

  .page-recruit .recruit-content-card {
    min-height: 0;
    padding: 18px 18px 30px;
  }

  .page-recruit .recruit-contact-cta {
    width: 100%;
    max-width: 22em;
    box-sizing: border-box;
  }
}

/* §92 ─────── SPヘッダーメニュー（Phase 2・Tier-0標準下層） ─────── */
.header-sp-menu {
  display: none;
}

html.is-header-menu-open,
html.is-header-menu-open body {
  overflow: hidden;
}

@media (max-width: 980px) {
  .page-go-forth .header,
  .page-backstory .header,
  .page-dogcare .header,
  .page-about .header,
  .page-contact .header,
  .page-privacy .header,
  .page-recruit .header,
  .page-editors-picks .header,
.page-editors-picks-article .header,
  .page-article .header,
  .page-home .home-hero .header {
    z-index: 210;
  }

  .header-sp-menu {
    display: block;
    position: fixed;
    inset: 0;
    z-index: 200;
    pointer-events: none;
    visibility: hidden;
    opacity: 0;
    transition: opacity 0.22s ease, visibility 0.22s ease;
  }

  .header-sp-menu.is-open {
    pointer-events: auto;
    visibility: visible;
    opacity: 1;
  }

  .header-sp-menu__overlay {
    position: absolute;
    inset: 0;
    margin: 0;
    padding: 0;
    border: 0;
    background: rgba(250, 249, 244, 0.72);
    cursor: default;
  }

  .header-sp-menu__panel {
    position: absolute;
    top: 0;
    right: 0;
    width: min(300px, 88vw);
    height: 100%;
    margin: 0;
    box-sizing: border-box;
    background: #f5f3ef;
    border-left: 1px solid rgba(12, 10, 8, 0.08);
    padding: calc(72px + 24px) 28px 32px;
    transform: translateX(100%);
    transition: transform 0.24s ease;
  }

  .header-sp-menu.is-open .header-sp-menu__panel {
    transform: translateX(0);
  }

  .header-sp-menu__list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 28px;
  }

  .header-sp-menu__list a {
    color: rgba(12, 10, 8, 0.88);
    text-decoration: none;
    font-family: var(--font-story-meta, var(--font-page-serif));
    font-size: clamp(15px, 0.42vw + 13px, 16px);
    font-weight: 600;
    letter-spacing: 0.22em;
    text-transform: uppercase;
    white-space: nowrap;
    transition: color 0.22s ease, opacity 0.22s ease;
  }

  .header-sp-menu__list a:hover,
  .header-sp-menu__list a:focus-visible {
    color: #0c0a08;
    opacity: 1;
  }
}


/* =========================================================
   EDITOR'S PICKS — COMPLETE / PROTECTED
   §60 一覧（editors-picks.html）
   スコープは .page-editors-picks / .ep-* のみ。
   EDITOR'S PICKS一覧 SP 現行仕様を完成版として固定。
   SPの正本は下の @media (max-width: 768px)。明示指示がない限り変更しない。
   PC・他ページの調整ではこのブロックを変更しない。
   ========================================================= */
.page-editors-picks {
  /* PC HEROコピー左端（logo gutter + 中央寄りオフセット）に内容を揃える */
  --ep-paper: #faf8f5;
  --ep-ink: #1a1816;
  --ep-muted: rgba(26, 24, 22, 0.68);
  --ep-content-gutter: calc(var(--home-editorial-gutter) + clamp(20px, 1.8vw, 36px));
  --ep-content-max: var(--home-editorial-max);
  /* HERO画像上部抽出色（ヘッダー／HERO境界を消す）※資産は .jpg */
  --ep-hero-top-pc: #e9e3dd; /* hero-picks-pc-001.jpg */
  --ep-hero-top-sp: #e7e1d9; /* hero-picks-sp-001.jpg */
}

/* HEADER：共有セレクタは触らず、EP一覧専用で背景のみ上書き */
.page-editors-picks .header {
  background: var(--ep-hero-top-pc);
  border-bottom-color: var(--ep-hero-top-pc);
}

.page-editors-picks .ep-main {
  width: 100%;
  max-width: none;
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  background: var(--ep-paper);
  color: var(--ep-ink);
}

.page-editors-picks .ep-hero,
.page-editors-picks .ep-note,
.page-editors-picks .ep-featured,
.page-editors-picks .ep-list,
.page-editors-picks .ep-closing {
  width: 100%;
  max-width: none;
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

/* --- HERO（イラスト左余白＋右ビジュアル） --- */
.page-editors-picks .ep-hero {
  background: var(--ep-hero-top-pc);
}

.page-editors-picks .ep-hero-inner {
  display: block;
  position: relative;
  width: 100%;
  max-width: none;
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

.page-editors-picks .ep-hero-copy {
  display: none;
}

.page-editors-picks .ep-hero-eyebrow {
  display: inline-flex;
  align-items: center;
  margin: 0 0 clamp(14px, 1.35vw, 22px);
  font-family: var(--font-story-meta, "Noto Sans JP", sans-serif);
  font-size: clamp(15.84px, 0.504vw + 14.4px, 18.72px); /* ×1.2 */
  font-weight: 600;
  letter-spacing: 0.28em;
  color: var(--ep-ink);
  text-transform: uppercase;
}

.page-editors-picks .ep-hero-title {
  margin: 0;
  font-family: var(--font-page-serif, "Noto Serif JP", serif);
  font-size: clamp(37.44px, 2.664vw + 23.04px, 57.6px); /* ×1.2 */
  font-weight: 600;
  line-height: 1.52;
  letter-spacing: 0.06em;
  color: var(--ep-ink);
}

.page-editors-picks .ep-hero-lead {
  margin: clamp(16px, 1.55vw, 26px) 0 0;
  font-family: var(--font-page-serif, "Noto Serif JP", serif);
  font-size: clamp(18.72px, 0.504vw + 15.84px, 21.6px); /* ×1.2 */
  font-weight: 400;
  line-height: 2;
  letter-spacing: 0.04em;
  color: rgba(26, 24, 22, 0.72);
}

.page-editors-picks .ep-hero-en {
  margin: clamp(12px, 1.1vw, 18px) 0 0;
  font-family: "Cormorant Garamond", "Times New Roman", serif;
  font-size: clamp(18.72px, 0.504vw + 15.84px, 21.6px); /* ×1.2 */
  font-weight: 500;
  font-style: italic;
  letter-spacing: 0.04em;
  color: rgba(26, 24, 22, 0.55);
}

.page-editors-picks .ep-hero-visual {
  display: block;
  margin: 0;
  width: 100%;
  overflow: hidden;
  background: var(--ep-hero-top-pc);
}

.page-editors-picks .ep-hero-visual picture,
.page-editors-picks .ep-hero-visual img {
  display: block;
  width: 100%;
  height: auto;
}

.page-editors-picks .ep-hero-visual img {
  object-fit: cover;
  object-position: right center;
}

/* PC HERO：左コピー（イラスト左余白に合わせダーク文字・軽いグラデのみ） */
@media (min-width: 769px) {
  .page-editors-picks .ep-hero-visual {
    aspect-ratio: 1891 / 832;
  }

  .page-editors-picks .ep-hero-visual img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: right center;
  }

  .page-editors-picks .ep-hero-inner::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 1;
    pointer-events: none;
    background: linear-gradient(
      90deg,
      rgba(233, 227, 221, 0.92) 0%,
      rgba(233, 227, 221, 0.72) 18%,
      rgba(233, 227, 221, 0.28) 34%,
      transparent 48%
    );
  }

  .page-editors-picks .ep-hero-copy {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    z-index: 2;
    width: min(54%, 720px);
    max-width: 720px;
    padding: clamp(28px, 3.2vw, 48px) clamp(16px, 1.6vw, 24px) clamp(28px, 3.2vw, 48px) var(--ep-content-gutter);
    box-sizing: border-box;
    transform: translateY(-60px); /* テキストグループを上へ60px */
  }

  .page-editors-picks .ep-hero-title {
    font-size: clamp(40.32px, 2.3184vw + 23.04px, 56.16px); /* ×1.2 */
    line-height: 1.48;
    letter-spacing: 0.05em;
  }

  .page-editors-picks .ep-hero-title-l1 {
    white-space: nowrap;
  }

  .page-editors-picks .ep-hero-lead {
    display: block;
  }
}

/* --- Editor's Note --- */
.page-editors-picks .ep-note {
  position: relative;
  background: var(--ep-paper);
  border-top: 1px solid rgba(26, 24, 22, 0.08);
  overflow: hidden;
}

/* 全幅背景（PC/SP共通・旧右寄せイラストは重ねない） */
.page-editors-picks .ep-note-bg {
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
}

.page-editors-picks .ep-note-bg img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 58% center;
}

.page-editors-picks .ep-note-inner {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: minmax(0, 1.45fr) minmax(160px, 0.9fr);
  align-items: center;
  gap: clamp(28px, 4vw, 72px);
  max-width: var(--ep-content-max);
  margin: 0 auto;
  padding: clamp(52px, 5.5vw, 88px) var(--ep-content-gutter);
  box-sizing: border-box;
}

.page-editors-picks .ep-note-mark {
  position: relative;
  margin: 0;
  max-width: 300px;
  justify-self: center;
}

/* 旧 about-023 表示相当の高さスペーサー（画像は表示しない） */
.page-editors-picks .ep-note-mark::before {
  content: "";
  display: block;
  width: min(100%, 300px);
  aspect-ratio: 1272 / 1237;
  visibility: hidden;
}

.page-editors-picks .ep-note-body {
  min-width: 0;
}

.page-editors-picks .ep-note-script {
  margin: 0 0 calc(clamp(7px, 0.7vw, 11px) + 15px);
  font-family: "Cormorant Garamond", "Times New Roman", serif;
  font-size: clamp(15.6px, 0.84vw + 9.6px, 21.6px); /* ×1.2 */
  font-weight: 500;
  font-style: italic;
  line-height: 1.25;
  letter-spacing: 0.04em;
  color: #9a8a7c;
}

.page-editors-picks .ep-note-quote {
  margin: 0 0 clamp(14px, 1.3vw, 20px);
  font-family: var(--font-page-serif, "Noto Serif JP", serif);
  font-size: clamp(24px, 1.38vw + 15.6px, 31.2px); /* PC：現行 clamp ×1.20 */
  font-weight: 600;
  line-height: 1.65;
  letter-spacing: 0.04em;
  color: var(--ep-ink);
}

.page-editors-picks .ep-note-quote-dash {
  margin-right: 0.15em;
  font-weight: 500;
}

.page-editors-picks .ep-note-quote-br {
  display: none;
}

.page-editors-picks .ep-note-text {
  margin: 0;
  font-family: var(--font-page-serif, "Noto Serif JP", serif);
  font-size: clamp(13px, 0.32vw + 11px, 15px);
  font-weight: 400;
  line-height: 2.05;
  letter-spacing: 0.04em;
  color: rgba(26, 24, 22, 0.78);
}

.page-editors-picks .ep-note-link {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin-top: clamp(18px, 1.8vw, 26px);
  font-family: var(--font-story-meta, "Noto Sans JP", sans-serif);
  font-size: clamp(13px, 0.3vw + 11px, 14px);
  font-weight: 500;
  letter-spacing: 0.06em;
  color: var(--ep-ink);
  text-decoration: underline;
  text-underline-offset: 4px;
}

@media (min-width: 769px) {
  .page-editors-picks .ep-note-inner {
    /* 上 −10px / 下 +10px。合計は維持し、中身だけ上へ10px */
    padding-top: calc(clamp(52px, 5.5vw, 88px) + 40px);
    /* 下をさらに +40px。文字位置は上端基準のまま、背景の表示領域だけ下へ広げる */
    padding-bottom: calc(clamp(52px, 5.5vw, 88px) + 140px);
  }

  .page-editors-picks .ep-note-bg img {
    /* 幅基準の比率を維持。新しいセクション中央から20px上＝拡張前の見え方の上端 */
    position: absolute;
    left: 0;
    width: 100%;
    height: auto;
    min-height: calc(100% - 40px);
    object-fit: cover;
    object-position: 58% center;
    top: calc(50% - 20px);
    transform: translateY(-50%);
  }

  .page-editors-picks .ep-note-mark {
    transform: translateY(36px);
  }

  .page-editors-picks .ep-note-body {
    transform: translateY(-28px);
  }
}

/* --- FEATURED：左テキスト／右画像（画像は直前比+10%、右寄せ） --- */
.page-editors-picks .ep-shops-bg {
  background-color: #E7DBCE; /* beige-001.png 未読込時のフォールバック */
  background-image: url("assets/img/background/beige-001.png");
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
}

.page-editors-picks .ep-featured {
  position: relative;
  isolation: isolate;
  background-color: #E7DBCE;
  background-image: url("assets/img/background/beige-003.png");
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  /* 上は維持。下は写真下端までの余白を上（72px前後）に揃える */
  padding: clamp(48px, 5vw, 80px) 0;
}

.page-editors-picks .ep-featured-inner {
  display: grid;
  /* 画像列は旧 0.98/(1.29+0.98) の表示幅 ×1.25。gap縮小前の基準幅で算出 */
  --ep-featured-gap-base: clamp(28px, 3.5vw, 48px);
  grid-template-columns: minmax(0, 1fr) calc((100% - var(--ep-featured-gap-base)) * 0.431718 * 1.25);
  align-items: center;
  row-gap: var(--ep-featured-gap-base);
  column-gap: calc(var(--ep-featured-gap-base) * 0.8); /* 横間隔 −20% */
  max-width: var(--ep-content-max);
  margin: 0 auto;
  padding: 0 var(--ep-content-gutter);
  box-sizing: border-box;
}

.page-editors-picks .ep-featured-copy {
  min-width: 0;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}

.page-editors-picks .ep-featured-eyebrow,
.page-editors-picks .ep-list-eyebrow {
  display: inline-flex;
  align-items: center;
  margin: 0 0 clamp(12px, 1.2vw, 18px);
  font-family: var(--font-story-meta, "Noto Sans JP", sans-serif);
  font-size: clamp(11px, 0.3vw + 10px, 12px);
  font-weight: 700;
  letter-spacing: 0.22em;
  color: #6a5748;
  text-transform: uppercase;
}

.page-editors-picks .ep-featured-name {
  margin: 0;
  font-family: var(--font-page-serif, "Noto Serif JP", serif);
  font-size: clamp(31.2px, 1.95vw + 18.2px, 44.2px); /* ×1.3 */
  font-weight: 700;
  line-height: 1.35;
  letter-spacing: 0.04em;
  color: var(--ep-ink);
}

.page-editors-picks .ep-shop-meta {
  display: flex;
  align-items: baseline;
  flex-wrap: wrap;
  gap: 0.55em;
  margin: 10px 0 0;
  font-family: var(--font-story-meta, "Noto Sans JP", sans-serif);
  font-size: 11.9px; /* 14px ×0.85 */
  font-weight: 500;
  line-height: 1.5;
  color: #6a5748;
}

.page-editors-picks .ep-featured .ep-shop-meta {
  font-size: 11.9px; /* 14px ×0.85 */
}

.page-editors-picks .ep-shop-region {
  letter-spacing: 0.18em;
  text-transform: uppercase;
}

.page-editors-picks .ep-shop-cat {
  letter-spacing: 0.02em;
}

.page-editors-picks .ep-shop-sep {
  letter-spacing: 0;
  color: rgba(106, 87, 72, 0.4);
}

.page-editors-picks .ep-featured-text {
  margin: clamp(12px, 1.2vw, 16px) 0 0;
  font-family: var(--font-page-serif, "Noto Serif JP", serif);
  font-size: clamp(13.2px, 0.308vw + 11px, 15.4px); /* ×1.1 */
  font-weight: 400;
  line-height: 1.95;
  letter-spacing: 0.04em;
  color: rgba(26, 24, 22, 0.78);
}

.page-editors-picks .ep-featured-cta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  margin-top: clamp(20px, 2vw, 28px);
  padding: 11px 34px; /* 横幅 158px → 約182px（+15%） */
  border: 1px solid #514B45;
  border-radius: 999px;
  font-family: var(--font-story-meta, "Noto Sans JP", sans-serif);
  font-size: 12px;
  font-weight: 500;
  letter-spacing: 0.08em;
  color: #FFFFFF;
  text-decoration: none;
  background: #514B45;
}

.page-editors-picks .ep-featured-cta:hover,
.page-editors-picks .ep-featured-cta:focus-visible {
  background: #625C56;
  border-color: #625C56;
  color: #FFFFFF;
}

.page-editors-picks .ep-featured-visual {
  margin: 0;
  min-width: 0;
  width: 100%;
  overflow: hidden;
  background: #e8e2da;
  justify-self: end;
}

.page-editors-picks .ep-featured-visual img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 3 / 2;
  object-fit: cover;
  object-position: center 40%;
}

/* --- ALL SHOPS（PC 3カラム / SP 1カラム。地域ナビ削除） --- */
.page-editors-picks .ep-list {
  position: relative;
  isolation: isolate;
  background-color: transparent;
  background-image: none;
  padding-bottom: clamp(56px, 6vw, 96px);
}

/* ALL SHOPS は .ep-shops-bg の beige-001。FEATURED の疑似要素は SP だけ上の帯に使う */
.page-editors-picks .ep-featured::before,
.page-editors-picks .ep-list::before {
  content: none;
}

.page-editors-picks .ep-list-head {
  max-width: var(--ep-content-max);
  margin: 0 auto;
  padding: calc(clamp(48px, 5vw, 80px) * 0.528) var(--ep-content-gutter) 0;
  box-sizing: border-box;
  text-align: left;
  background: transparent;
  border-bottom: none; /* グローバル header 線を打ち消し */
}

.page-editors-picks .ep-list-title {
  margin: 0;
  font-family: var(--font-page-serif, "Noto Serif JP", serif);
  font-size: clamp(28.8px, 1.92vw + 16.8px, 40.8px); /* ×1.2 */
  font-weight: 600;
  letter-spacing: 0.06em;
  line-height: 1.45;
  color: var(--ep-ink);
  background: transparent;
}

.page-editors-picks .ep-list-lead {
  margin: clamp(6px, calc(1.2vw - 6px), 12px) 0 0; /* PC上余白：現行 clamp −6px */
  max-width: 22em;
  font-family: var(--font-page-serif, "Noto Serif JP", serif);
  font-size: clamp(13px, 0.3vw + 11px, 15px);
  font-weight: 400;
  line-height: 2;
  letter-spacing: 0.04em;
  color: var(--ep-muted);
  background: transparent;
}

@media (min-width: 769px) {
  .page-editors-picks .ep-list-lead {
    max-width: none;
    white-space: nowrap;
  }

  .page-editors-picks .ep-list-lead br {
    display: none;
  }
}

.page-editors-picks .ep-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: clamp(24px, 2.6vw, 36px) clamp(20px, 2.2vw, 32px);
  max-width: var(--ep-content-max);
  margin: clamp(11.6px, calc(2.4vw - 10px), 23.6px) auto 0; /* PC下余白：現行 clamp −10px */
  padding: 0 var(--ep-content-gutter);
  box-sizing: border-box;
}

.page-editors-picks .ep-card {
  display: flex;
  flex-direction: column;
  background: transparent;
  border-radius: 0;
  box-shadow: none;
  text-decoration: none;
  color: inherit;
  overflow: hidden;
  min-width: 0;
}

.page-editors-picks .ep-card-thumb {
  margin: 0;
  overflow: hidden;
  background: #e8e2da;
  aspect-ratio: 5 / 3; /* 横幅維持・高さ −10%（3/2 → 5/3） */
}

.page-editors-picks .ep-card-thumb img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

/* 看板・ロゴが切れにくい位置に調整 */
.page-editors-picks .ep-card--wankomania .ep-card-thumb img {
  object-position: center 35%;
}

.page-editors-picks .ep-card--onezugate .ep-card-thumb img {
  object-position: center 45%;
}

.page-editors-picks .ep-card--miyuu .ep-card-thumb img {
  object-position: 70% center;
}

.page-editors-picks .ep-card-body {
  position: relative;
  display: flex;
  flex-direction: column;
  flex: 1 1 auto;
  /* 画像との間隔（上）のみ −20%。左右・下は維持 */
  padding: calc(clamp(14px, 1.2vw, 18px) * 0.8) clamp(14px, 1.2vw, 18px) clamp(16px, 1.4vw, 22px);
  box-sizing: border-box;
  background: transparent;
}

.page-editors-picks .ep-card-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
}

.page-editors-picks .ep-card-name {
  margin: 0;
  font-family: var(--font-page-serif, "Noto Serif JP", serif);
  font-size: clamp(18px, 0.54vw + 14.4px, 21.6px); /* ×1.2 */
  font-weight: 700;
  line-height: 1.4;
  letter-spacing: 0.04em;
  color: var(--ep-ink);
}

.page-editors-picks .ep-card-text {
  margin: 10px 0 0;
  font-family: var(--font-page-serif, "Noto Serif JP", serif);
  font-size: clamp(13.2px, 0.308vw + 11px, 15.4px);
  font-weight: 400;
  line-height: 1.85;
  letter-spacing: 0.04em;
  color: rgba(26, 24, 22, 0.72);
}

.page-editors-picks .ep-card-arrow {
  position: static;
  flex: 0 0 auto;
  font-size: 14px;
  line-height: 1;
  color: rgba(26, 24, 22, 0.45);
}

/* --- Ending --- */
.page-editors-picks .ep-closing {
  background: #ebe6df;
}

.page-editors-picks .ep-closing-inner {
  position: relative;
  width: 100%;
  margin: 0;
  padding: 0;
}

.page-editors-picks .ep-closing-copy {
  display: none;
}

.page-editors-picks .ep-closing-title {
  margin: 0;
  font-family: var(--font-page-serif, "Noto Serif JP", serif);
  font-size: clamp(29.04px, 1.848vw + 15.84px, 42.24px); /* 現行 clamp ×1.1（PC） */
  font-weight: 600;
  line-height: 1.7;
  letter-spacing: 0.06em;
  white-space: nowrap;
  color: var(--ep-ink);
}

.page-editors-picks .ep-closing-en {
  width: max-content;
  max-width: none;
  margin: clamp(12px, 1.2vw, 18px) 0 0;
  font-family: "Cormorant Garamond", "Times New Roman", serif;
  font-size: clamp(13px, 0.35vw + 11px, 15px);
  font-weight: 500;
  font-style: italic;
  letter-spacing: 0.04em;
  white-space: nowrap;
  color: rgba(26, 24, 22, 0.55);
}

.page-editors-picks .ep-closing-visual {
  display: block;
  margin: 0;
  width: 100%;
  overflow: hidden;
  background: #ebe6df;
}

.page-editors-picks .ep-closing-visual picture,
.page-editors-picks .ep-closing-visual img {
  display: block;
  width: 100%;
  height: auto;
}

@media (min-width: 769px) {
  .page-editors-picks .ep-closing-visual {
    aspect-ratio: 1983 / 793;
  }

  .page-editors-picks .ep-closing-visual img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: right center;
  }

  .page-editors-picks .ep-closing-inner::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 1;
    pointer-events: none;
    background: linear-gradient(
      90deg,
      rgba(250, 248, 245, 0.88) 0%,
      rgba(250, 248, 245, 0.55) 22%,
      rgba(250, 248, 245, 0.15) 42%,
      transparent 58%
    );
  }

  .page-editors-picks .ep-closing-copy {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    z-index: 2;
    width: min(48%, 560px);
    padding: clamp(28px, 3vw, 48px) clamp(24px, 3vw, 48px) clamp(28px, 3vw, 48px) var(--ep-content-gutter);
    box-sizing: border-box;
    transform: translateY(-120px); /* 現行 −70px から上へ50px */
  }

  .page-editors-picks .ep-closing-title {
    width: max-content;
    max-width: none;
  }
}

/* --- Footer（一覧ページ正本に合わせて EP 一覧のみ補完。他ページセレクタは変更しない） --- */
/* 共有の margin-top（48〜72px）と、その隙間を塗っていた box-shadow を外す。Ending 直下に黒フッター */
.page-editors-picks .site-footer.home-footer {
  margin-top: 0;
  box-shadow: none;
}

.page-editors-picks .footer-home-nav a,
.page-editors-picks .footer-home-follow a {
  font-family: "Work Sans", "IBM Plex Sans", "Helvetica Neue", sans-serif;
  font-size: clamp(11px, 0.38vw + 9px, 13px);
  font-weight: 500;
  letter-spacing: 0.26em;
  text-transform: uppercase;
  text-decoration: none;
  line-height: 1.65;
  color: rgba(243, 243, 243, 0.66);
  transition: color 0.25s ease;
}

.page-editors-picks .footer-home-nav a:hover,
.page-editors-picks .footer-home-follow a:hover,
.page-editors-picks .footer-home-nav a:focus-visible,
.page-editors-picks .footer-home-follow a:focus-visible,
.page-editors-picks .footer-home-nav a:active,
.page-editors-picks .footer-home-follow a:active {
  color: rgba(243, 243, 243, 0.82);
}

.page-editors-picks .footer-home-nav a:visited,
.page-editors-picks .footer-home-follow a:visited {
  color: rgba(243, 243, 243, 0.66);
}

/* EDITOR'S PICKS一覧 SP 現行仕様を完成版として固定。
   HERO、Editor's Note、FEATURED、CTA、ALL SHOPS、締めコピー。
   基本レールは左右 20px。背景とフルブリードは画面幅。PC・他ページは対象外。 */
@media (max-width: 768px) {
  .page-editors-picks {
    --ep-content-gutter: 20px;
  }

  .page-editors-picks .ep-hero {
    background: var(--ep-hero-top-sp);
    overflow-x: clip;
  }

  .page-editors-picks .header {
    background: var(--ep-hero-top-sp);
    border-bottom-color: var(--ep-hero-top-sp);
  }

  .page-editors-picks .ep-hero-inner::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 1;
    pointer-events: none;
    /* 左余白の可読性。文字（z-index:2）より背面。右端は透明。 */
    background: linear-gradient(
      90deg,
      rgba(248, 246, 241, 0.72) 0%,
      rgba(248, 246, 241, 0.55) 35%,
      rgba(248, 246, 241, 0.22) 62%,
      rgba(248, 246, 241, 0) 82%
    );
  }

  .page-editors-picks .ep-hero-visual {
    width: 100%;
    aspect-ratio: 1 / 1;
    background: var(--ep-hero-top-sp);
  }

  .page-editors-picks .ep-hero-visual img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: right center;
  }

  /* 画像上オーバーレイ：左余白に文字（人物・犬と非重複） */
  .page-editors-picks .ep-hero-copy {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 100%;
    padding: 22px 20px 16px 20px;
    z-index: 2;
    box-sizing: border-box;
    transform: translateY(50px); /* SP：テキストグループを下へ50px */
    /* PC実測比（見出し基準）: eyebrow 13/39・lead/en 15/39 */
    --ep-hero-title-size: clamp(30.24px, 9.18vw, 36.72px); /* 現行 ×0.9。SP HEROの文字だけ */
  }

  .page-editors-picks .ep-hero-eyebrow {
    color: var(--ep-ink);
    margin: 0 0 12px;
    letter-spacing: 0.1em;
    font-size: calc(var(--ep-hero-title-size) * 13 / 39 * 0.9); /* −10% */
  }

  .page-editors-picks .ep-hero-title {
    color: var(--ep-ink);
    font-size: calc(var(--ep-hero-title-size) * 0.864); /* 現行比 +8% */
    line-height: 1.4;
    margin: 0;
    letter-spacing: 0.01em;
  }

  .page-editors-picks .ep-hero-title-l1 {
    white-space: nowrap;
  }

  .page-editors-picks .ep-hero-lead {
    display: block;
    margin-top: 12px;
    font-size: calc(var(--ep-hero-title-size) * 15 / 39);
    line-height: 1.6;
    letter-spacing: 0.02em;
    color: rgba(26, 24, 22, 0.72);
  }

  .page-editors-picks .ep-hero-en {
    display: block;
    margin-top: 10px;
    font-size: calc(var(--ep-hero-title-size) * 15 / 39);
    line-height: 1.35;
    letter-spacing: 0.02em;
    color: rgba(26, 24, 22, 0.55);
  }

  .page-editors-picks .ep-note {
    background-image: url("assets/img/illust/editorsnote-017.png");
    background-repeat: no-repeat;
    /* 下を120px伸ばしても画像は動かさない。bottom のままだと画像も下がり、足元が再び端で切れる */
    background-position: right bottom 120px;
    background-size: 126% auto; /* 140% auto ×0.9。位置は維持 */
    z-index: 0;
  }

  .page-editors-picks .ep-note-bg {
    display: none;
  }

  .page-editors-picks .ep-note-inner {
    grid-template-columns: 1fr;
    gap: 8px;
    /* 上 60→70（+10px）。下 134→124（−10px）。合計は維持し、中身だけ下へ10px */
    padding: 70px var(--ep-content-gutter) 124px;
    position: relative;
  }

  .page-editors-picks .ep-note-mark {
    order: 2;
    width: calc(100% + (var(--ep-content-gutter) * 2));
    max-width: none;
    justify-self: start;
    margin-top: 0;
    margin-left: calc(var(--ep-content-gutter) * -1);
    margin-right: calc(var(--ep-content-gutter) * -1);
    transform: none;
  }

  .page-editors-picks .ep-note-mark::before {
    width: 100%;
    aspect-ratio: 1844 / 853;
    /* SP本文の強制改行を1か所にした分（1行分）だけ、セクション高さを維持 */
    padding-bottom: 25.35px;
  }

  .page-editors-picks .ep-note-body {
    order: 1;
    transform: translateY(-2px); /* 現行 +10px から 12px上 */
  }

  .page-editors-picks .ep-note-script {
    font-size: 13.608px; /* 15.12px ×0.9 */
    margin-bottom: 21px; /* 6px + 15px */
  }

  .page-editors-picks .ep-note-quote {
    font-size: 19.82232px;
  }

  .page-editors-picks .ep-note-text {
    font-size: 10.53px; /* 11.7px ×0.9 */
    line-height: 1.95;
  }

  .page-editors-picks .ep-note-text-br {
    display: none;
  }

  .page-editors-picks .ep-note-link {
    margin-top: 16px;
    font-size: 10.53px; /* 11.7px ×0.9 */
    transform: translateY(14px); /* 文字全体を上げたあと、このリンクだけ14px下 */
  }

  .page-editors-picks .ep-shops-bg {
    position: relative;
    z-index: 1;
    background-position: left center;
    /* editorsnote-017.png は bottom 120px。その下の紙色（白帯）まで beige-003 を届かせる。中身は padding で戻す */
    margin-top: -120px;
    padding-top: 120px;
  }

  .page-editors-picks .ep-featured {
    /* 上余白 1.584px から 30px 減（padding は負にできないため margin）。下は 40px + 40px */
    margin-top: -30px;
    padding: calc(4.8px * 0.33) 0 80px;
    background-image: none;
  }

  .page-editors-picks .ep-featured::before {
    content: "";
    position: absolute;
    z-index: -1;
    left: 0;
    right: 0;
    top: -120px;
    bottom: 0;
    pointer-events: none;
    background-color: #E7DBCE;
    background-image: url("assets/img/background/beige-003.png");
    background-repeat: no-repeat;
    background-size: auto 100%;
    background-position: center center;
  }

  .page-editors-picks .ep-featured-inner {
    grid-template-columns: 1fr;
    gap: 18px;
    padding: 0 var(--ep-content-gutter);
  }

  .page-editors-picks .ep-featured-visual {
    width: 100%;
    max-width: 100%;
    min-width: 0;
    margin: 0;
    order: 1;
    justify-self: stretch;
  }

  .page-editors-picks .ep-featured-visual img {
    /* 元画像 1000×667。縦長の aspect-ratio を外し、幅100%・高さ自動で横長比率を維持 */
    aspect-ratio: auto;
    height: auto;
    object-fit: cover;
    object-position: 78% center; /* 看板 wankomania を左右とも残す */
  }

  .page-editors-picks .ep-featured-copy {
    order: 2;
    padding: 0;
  }

  .page-editors-picks .ep-featured .ep-shop-meta {
    margin-top: 8px;
    font-size: 11.05px; /* 13px ×0.85 */
  }

  .page-editors-picks .ep-featured-name {
    font-size: 33.8px; /* 26px ×1.3 */
  }

  .page-editors-picks .ep-featured-text {
    margin-top: 12px;
    font-size: 14.3px; /* 13px ×1.1 */
  }

  .page-editors-picks .ep-featured-cta {
    margin-top: 33px; /* 18px +15px */
    font-size: 9.6px; /* 12px ×0.8 */
    padding: 8.8px 27.2px; /* 11px 34px ×0.8。文字サイズは維持 */
    border-color: #78746f; /* #514B45 を白方向へ約22% */
  }

  .page-editors-picks .ep-list-head {
    padding: 26px var(--ep-content-gutter) 0; /* 上 40px → 26px（約−35%） */
    text-align: left;
  }

  .page-editors-picks .ep-list-eyebrow {
    font-size: clamp(9.68px, 0.264vw + 8.8px, 10.56px); /* 現行 clamp ×0.88 */
  }

  .page-editors-picks .ep-list-title {
    font-size: 25.344px; /* 28.8px ×0.88 */
    letter-spacing: 0.05em;
  }

  .page-editors-picks .ep-list-lead {
    /* 23字をコンテンツ幅に1行で収める。390pxでは13pxのまま、狭い幅だけ縮む */
    max-width: 100%;
    font-size: min(11.44px, calc((100vw - 68px) / 23.8 * 0.88)); /* 13px ×0.88 */
    margin-top: 9px; /* SP上余白：12px −3px */
    letter-spacing: 0.01em;
    white-space: nowrap;
  }

  .page-editors-picks .ep-list-lead br {
    display: none;
  }

  .page-editors-picks .ep-grid {
    grid-template-columns: 1fr;
    gap: 0;
    margin-top: 14.8px; /* SP下余白：16.8px −2px */
    padding: 0 var(--ep-content-gutter);
    border-top: none;
  }

  .page-editors-picks .ep-card {
    flex-direction: row;
    align-items: center;
    gap: 18px; /* 現行 12px +6px */
    padding: 14px 0;
    border-radius: 0;
    border-bottom: 1px solid rgba(26, 24, 22, 0.12);
    box-shadow: none;
    overflow: hidden;
  }

  .page-editors-picks .ep-card:last-child {
    border-bottom: none;
  }

  .page-editors-picks .ep-card-thumb {
    /* カード幅の 34% から gap 12px を引く。文字側がカード幅の 66% になる */
    flex: 0 0 calc(34% - 12px);
    width: calc(34% - 12px);
    aspect-ratio: 3 / 2.3; /* 現行 3/2 の高さ ×1.15。幅は維持、cover で切り抜く */
    align-self: center;
    border-radius: 0;
  }

  .page-editors-picks .ep-card-body {
    position: relative;
    flex: 1 1 auto;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: stretch;
    gap: 0;
    min-width: 0;
    min-height: 0;
    padding: 0;
  }

  /* PCと同じ並び：名前＋矢印 / 地域｜カテゴリ / 説明。文字サイズはSPのまま */
  .page-editors-picks .ep-card-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    width: 100%;
  }

  .page-editors-picks .ep-card-name {
    font-size: 18.31104px; /* 20.808px ×0.88 */
  }

  .page-editors-picks .ep-card .ep-shop-meta {
    margin-top: 7.75px; /* 現行 10px から約22.5%縮小 */
    font-size: 9.724px; /* 11.05px ×0.88 */
  }

  .page-editors-picks .ep-card-text {
    margin-top: 8px; /* 現行 10px から 20%縮小 */
    font-size: 9.8736px; /* 11.22px ×0.88 */
    line-height: 1.49; /* 現行 1.57 を少し狭く */
  }

  .page-editors-picks .ep-card-arrow {
    font-size: 12.32px; /* 14px ×0.88 */
  }

  /* SP エンディング：画像上にコピー（左余白／右の人物・犬と非重複） */
  .page-editors-picks .ep-closing {
    padding-top: 20px;
    padding-bottom: 20px;
    overflow: hidden;
  }

  .page-editors-picks .ep-closing-inner {
    display: block;
    position: relative;
  }

  .page-editors-picks .ep-closing-visual {
    display: block;
    width: 100%;
    /* 横長原寸だとSPで高さ不足 → オーバーレイ用に高さを確保 */
    aspect-ratio: 5 / 4;
    min-height: 300px;
    overflow: visible;
    background: #ebe6df;
  }

  .page-editors-picks .ep-closing-visual picture {
    display: block;
    width: 100%;
    height: 100%;
  }

  .page-editors-picks .ep-closing-visual img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: 70% 70%;
    transform: translateX(20px) scale(1.135); /* 縦横比を保ったまま上下の地色まで覆う。右20pxは維持 */
    transform-origin: center center;
  }

  .page-editors-picks .ep-closing-inner::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 1;
    pointer-events: none;
    background: linear-gradient(
      105deg,
      rgba(250, 248, 245, 0.82) 0%,
      rgba(250, 248, 245, 0.4) 38%,
      transparent 62%
    );
  }

  .page-editors-picks .ep-closing-copy {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
    position: absolute;
    left: 0;
    top: 0;
    width: min(calc(58% + 10px), 240px);
    max-width: 240px;
    padding: 62px 12px 0 var(--ep-content-gutter);
    z-index: 2;
    box-sizing: border-box;
  }

  .page-editors-picks .ep-closing-title {
    flex-shrink: 0;
    width: max-content;
    max-width: none;
    font-size: 20.54052px; /* 19.5624px ×1.05 */
    line-height: 1.65;
    color: var(--ep-ink);
  }

  .page-editors-picks .ep-closing-en {
    flex-shrink: 0;
    width: max-content;
    max-width: none;
    font-size: 10.4px; /* 13px ×0.8 */
    margin-top: 10px;
    line-height: 1.45;
    color: rgba(26, 24, 22, 0.55);
  }

}

/* SP 320付近：引用の不自然な1文字落ちを防ぐ */
@media (max-width: 330px) {
  .page-editors-picks .ep-note-quote-br {
    display: inline;
  }
}


/* §60b ─────── 5ページ共通コンテンツ幅（PCのみ） ───────
   対象: ABOUT / PRIVACY / CONTACT / RECRUIT / EDITOR'S PICKS一覧
   非対象: HOME / 記事詳細 / SP左右余白
   HERO背景・ヘッダー背景・フッター背景は全幅。内側コンテンツのみ 76% / max 1200px。
   ──────────────────────────────────────────────────────────────────────── */
@media (min-width: 769px) {
  /* ヘッダー内レール（背景は .header 全幅のまま／本文レールよりやや広い） */
  .page-about .header .header-inner,
  .page-privacy .header .header-inner,
  .page-contact .header .header-inner,
  .page-recruit .header .header-inner,
  .page-editors-picks .header .header-inner {
    width: 78%;
    max-width: 1240px;
    margin-left: auto;
    margin-right: auto;
    padding-left: 0;
    padding-right: 0;
    box-sizing: border-box;
  }

  /* HERO＋本文レール */
  .page-about .about-hero-frame,
  .page-about .about-block-inner,
  .page-privacy .privacy-hero-frame,
  .page-privacy .privacy-body-frame,
  .page-contact .contact-hero-frame,
  .page-contact .contact-body-frame,
  .page-recruit .recruit-hero-frame,
  .page-recruit .recruit-section-inner,
  .page-editors-picks .ep-note-inner,
  .page-editors-picks .ep-featured-inner,
  .page-editors-picks .ep-list-head,
  .page-editors-picks .ep-grid {
    width: 76%;
    max-width: 1200px;
    margin-left: auto;
    margin-right: auto;
    padding-left: 0;
    padding-right: 0;
    box-sizing: border-box;
  }

  /* EP HERO／CLOSING タイトルを本文レール左端に揃える */
  .page-editors-picks .ep-hero-copy,
  .page-editors-picks .ep-closing-copy {
    left: max(12%, calc((100% - 1200px) / 2));
    padding-left: 0;
  }

  /* フッター内レール（背景は .site-footer 全幅のまま） */
  .page-about .footer-home-inner,
  .page-privacy .footer-home-inner,
  .page-contact .footer-home-inner,
  .page-recruit .footer-home-inner,
  .page-editors-picks .footer-home-inner {
    width: 76%;
    max-width: 1200px;
    margin-left: auto;
    margin-right: auto;
    padding-left: 0;
    padding-right: 0;
    box-sizing: border-box;
  }
}


/* §61 ─────── EDITOR'S PICKS 個別記事・完成テンプレート ───────
   正本: article-template-editors-picks.html / .page-editors-picks-article
   HEROは EDITOR'S PICKS → ショップ名 → 記事タイトル → リード。
   文字ブロックは下端基準（PC/SPとも bottom: 100px）で、左端は本文列に合わせる。
   すべての記事スタイルは .page-editors-picks-article 配下に限定。
   一覧 .page-editors-picks / .ep-* は対象外。
   ──────────────────────────────────────────────────────────────────────── */

.page-editors-picks-article {
  --ep-article-max: 1080px;
  --ep-article-wide: 1240px;
  --ep-article-gutter: clamp(22px, 4vw, 48px);
  --ep-article-ink: #1a1816;
  --ep-article-muted: rgba(26, 24, 22, 0.62);
  --ep-article-line: rgba(26, 24, 22, 0.12);
  --ep-article-paper: #faf8f5;
  --ep-article-paper-deep: #f3efe9;
  overflow-x: hidden;
}


.page-editors-picks-article .ep-article {
  display: block;
  width: 100%;
  max-width: none;
  margin: 0;
  padding: 0;
  color: var(--ep-article-ink);
  background: var(--ep-article-paper);
}

.page-editors-picks-article .visually-hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

/* --- 共通メディア --- */
.page-editors-picks-article .ep-article-media {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center center;
}

.page-editors-picks-article .ep-article-media--pos-center {
  object-position: center center;
}

.page-editors-picks-article .ep-article-media--pos-top {
  object-position: center top;
}

.page-editors-picks-article .ep-article-media--pos-bottom {
  object-position: center bottom;
}

.page-editors-picks-article .ep-article-media--pos-left {
  object-position: left center;
}

.page-editors-picks-article .ep-article-media--pos-right {
  object-position: right center;
}

.page-editors-picks-article .ep-article-figure {
  margin: 0;
  width: 100%;
}

/* ========== HERO ========== */
.page-editors-picks-article .ep-article-hero {
  position: relative;
  width: 100%;
  max-width: none;
  margin: 0;
  padding: 0;
  background: #2a2623;
  color: #fff;
  overflow: hidden;
}

.page-editors-picks-article .ep-article-hero-media {
  position: relative;
  width: 100%;
  aspect-ratio: 21 / 9;
  min-height: 360px;
  max-height: min(72vh, 760px);
}

.page-editors-picks-article .ep-article-hero-media::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(
    90deg,
    rgba(20, 18, 16, 0.55) 0%,
    rgba(20, 18, 16, 0.28) 42%,
    rgba(20, 18, 16, 0.12) 100%
  );
  pointer-events: none;
}

/* onez gate個別記事のHEROのみ。左端から中央手前で透明になる追加フィルター */
.page-ep-onezgate .ep-article-hero::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  background: linear-gradient(
    to right,
    rgba(0, 0, 0, 0.25) 0%,
    rgba(0, 0, 0, 0.15) 30%,
    rgba(0, 0, 0, 0) 60%
  );
}

.page-editors-picks-article .ep-article-hero-media .ep-article-media {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}

.page-editors-picks-article .ep-article-hero-copy {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 1;
  box-sizing: border-box;
  max-width: var(--ep-article-max);
  margin: 0 auto;
  padding: clamp(28px, 4vw, 56px) var(--ep-article-gutter) clamp(32px, 4.5vw, 64px);
}

.page-editors-picks-article .ep-article-hero-category {
  margin: 0 0 12px;
  font-family: "Jost", "Work Sans", "IBM Plex Sans", sans-serif;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.28em;
  text-transform: uppercase;
}

.page-editors-picks-article .ep-article-hero-shop {
  margin: 0;
  font-family: var(--font-page-serif);
  font-size: clamp(28px, 3.2vw + 12px, 48px);
  font-weight: 500;
  line-height: 1.25;
  letter-spacing: 0.04em;
}

.page-editors-picks-article .ep-article-hero-en {
  display: none;
}

.page-editors-picks-article .ep-article-hero-title {
  margin: 0;
  font-family: var(--font-page-serif);
  font-weight: 500;
  letter-spacing: 0.04em;
}

.page-editors-picks-article .ep-article-hero-lead {
  margin: 18px 0 0;
  max-width: 34em;
  font-size: clamp(13px, 0.35vw + 12px, 15px);
  line-height: 1.9;
  letter-spacing: 0.04em;
  opacity: 0.92;
}

/* PC HERO：本文と同じ 1080px 列。テキスト塊は下端から 100px */
@media (min-width: 769px) {
  .page-editors-picks-article .ep-article-hero-copy {
    left: var(--ep-article-gutter);
    right: var(--ep-article-gutter);
    top: auto;
    bottom: 100px;
    transform: none;
    padding: 0;
  }

  .page-editors-picks-article .ep-article-hero-category {
    margin-bottom: 12px;
  }

  .page-editors-picks-article .ep-article-hero-shop {
    margin-bottom: 11px;
    font-size: 62.208px;
    line-height: 1.15;
  }

  .page-editors-picks-article .ep-article-hero-title {
    margin-bottom: 16.8px;
    font-size: 28.5px;
    line-height: 1.45;
  }

  .page-editors-picks-article .ep-article-hero-lead {
    margin-top: 0;
  }

  /* わんこまにあのみ。小文字化の視覚差を 12% で補正。他記事には当てない */
  /* COMPLETE / PROTECTED: わんこまにあ HEROショップ名の最終値 */
  .page-ep-wankomania .ep-article-hero-shop {
    font-size: 64.796px;
  }

  .page-ep-wankomania .ep-wankomania-sp-br {
    display: none;
  }
}

/* ========== INTRO ==========
   左寄せ＋右側余白の構成は維持。余白とタイポで「導入だけの紙面」をつくる。 */
.page-editors-picks-article .ep-article-intro {
  width: 100%;
  max-width: none;
  margin: 0;
  /* 下部を厚くし、余白で section-001 へつなぐ（罫線は使わない） */
  padding: clamp(52px, 6vw, 84px) var(--ep-article-gutter) clamp(80px, 9vw, 128px);
  background: var(--ep-article-paper);
  border-bottom: none;
}

.page-editors-picks-article .ep-article-intro-inner {
  /* section-001 と同じ紙面幅・左端に揃え、中央寄せの別幅をやめる */
  max-width: var(--ep-article-max);
  margin: 0 auto;
}

/* INTRO専用ラベル（章ラベル。存在感は控えめに一段上げる） */
.page-editors-picks-article .ep-article-intro-label {
  display: inline-block;
  margin: 0 0 42px;
  padding-bottom: 4px;
  border-bottom: 1px solid rgba(26, 24, 22, 0.55);
  font-family: "Jost", "Work Sans", "IBM Plex Sans", sans-serif;
  font-size: 13px;
  font-weight: 350;
  letter-spacing: 0.14em;
  line-height: 1.4;
  text-transform: none;
  color: var(--ep-article-ink);
}

.page-editors-picks-article .ep-article-intro-heading {
  /* ページ主役。3行を一行ずつ置く行間 */
  max-width: none;
  margin: 0 0 clamp(60px, 6.2vw, 84px);
  font-family: var(--font-page-serif);
  font-size: clamp(34px, 2.4vw + 16px, 44px);
  font-weight: 500;
  line-height: 1.78;
  letter-spacing: 0.04em;
}

.page-editors-picks-article .ep-article-intro-body {
  /* 親（intro-inner）の右端まで広げる */
  max-width: none;
  width: 100%;
  font-size: clamp(16px, 0.3vw + 15px, 18px);
  line-height: 2.2;
  letter-spacing: 0.03em;
  color: var(--ep-article-ink);
}

.page-editors-picks-article .ep-article-intro-body p {
  margin: 0;
}

.page-editors-picks-article .ep-article-intro-body p + p {
  margin-top: 1.75em;
}

/* ========== 通常セクション 001–003 ========== */
.page-editors-picks-article .ep-article-section {
  width: 100%;
  max-width: none;
  margin: 0;
  /* 左右ガターのみ（上下paddingなし） */
  padding: 0 var(--ep-article-gutter);
  background: var(--ep-article-paper);
}

/* 001–005：紙面深いベージュで統一（ベースの paper より詳細度を上げて上書き） */
.page-editors-picks-article .ep-article-section.ep-article-section-001,
.page-editors-picks-article .ep-article-section.ep-article-section-002,
.page-editors-picks-article .ep-article-section.ep-article-section-003,
.page-editors-picks-article .ep-article-section.ep-article-section-004,
.page-editors-picks-article .ep-article-section.ep-article-section-005 {
  background: var(--ep-article-paper-deep);
}

.page-editors-picks-article .ep-article-section.ep-article-section-003 {
  /* full-visual直前の余白を本sectionの下paddingへ移し、背景色を伸ばす */
  padding-bottom: clamp(68px, 7vw, 112px);
}

.page-editors-picks-article .ep-article-section-inner {
  display: grid;
  /* 左右ちょうど半々。中央線＝画像の内端（gapは文章側paddingで確保） */
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 0;
  align-items: start;
  max-width: var(--ep-article-max);
  margin: 0 auto;
}

.page-editors-picks-article .ep-article-section-body {
  min-width: 0;
}

/* 001 / 003 / 005：文章｜画像 → 文章の右に間隔（画像左端は中央線に密着） */
.page-editors-picks-article .ep-article-section-001 .ep-article-section-body,
.page-editors-picks-article .ep-article-section-003 .ep-article-section-body,
.page-editors-picks-article .ep-article-section-005 .ep-article-section-body {
  padding-right: clamp(28px, 4vw, 56px);
}

/* 002 / 004：画像｜文章 → 文章の左に間隔（画像右端は中央線に密着） */
.page-editors-picks-article .ep-article-section-002 .ep-article-section-body,
.page-editors-picks-article .ep-article-section-004 .ep-article-section-body {
  padding-left: clamp(28px, 4vw, 56px);
}

/* section-001〜003 見出し：INTRO見出しと同サイズ・同下余白で統一（基準＝section-001）
   ※INTRO側は変更しない。本文サイズは据え置き */
.page-editors-picks-article .ep-article-section-heading {
  margin-top: clamp(48px, 5.2vw, 80px);
  margin-bottom: clamp(28px, 3.2vw, 44px);
  margin-left: 0;
  margin-right: 0;
  font-family: var(--font-page-serif);
  font-size: clamp(18px, 1.25vw + 13px, 24px);
  font-weight: 500;
  line-height: 1.5;
  letter-spacing: 0.04em;
}

.page-editors-picks-article .ep-article-section-text {
  font-size: clamp(14px, 0.25vw + 13px, 15px);
  line-height: 2;
  letter-spacing: 0.03em;
}

.page-editors-picks-article .ep-article-section-text p {
  margin: 0;
}

.page-editors-picks-article .ep-article-section-text p + p {
  margin-top: 1.25em;
}

.page-editors-picks-article .ep-article-section-image {
  min-width: 0;
}

.page-editors-picks-article .ep-article-section-image .ep-article-figure {
  position: relative;
  width: 100%;
  /* 仮表示の統一枠。将来は比率クラスで縦長／正方形／横長へ */
  aspect-ratio: 4 / 5;
  overflow: hidden;
  background: #e8e2da;
}

/* section-002 / 004：縦長 3/4（001・003・005の4/5と差をつけてページにリズム） */
.page-editors-picks-article .ep-article-section-002 .ep-article-section-image .ep-article-figure,
.page-editors-picks-article .ep-article-section-004 .ep-article-section-image .ep-article-figure {
  width: 100%;
  aspect-ratio: 3 / 4;
}

/* 5セクションのときだけ、フルビジュアル直前の下余白を003から005へ移す。
   004・005を削除した3セクション記事では、003の下余白を維持する。 */
.page-editors-picks-article:has(.ep-article-section-005) .ep-article-section.ep-article-section-003 {
  padding-bottom: 0;
}

@media (min-width: 769px) {
  .page-editors-picks-article .ep-article-section.ep-article-section-005 {
    padding-bottom: clamp(68px, 7vw, 112px);
  }
}

.page-editors-picks-article .ep-article-section-image .ep-article-media {
  position: absolute;
  inset: 0;
}

/* ========== FULL VISUAL ========== */
.page-editors-picks-article .ep-article-full-visual {
  position: relative;
  width: 100%;
  max-width: none;
  margin: 0;
  padding: 0;
  overflow: hidden;
  background: #2a2623;
  color: #fff;
}

.page-editors-picks-article .ep-article-full-visual-media {
  position: relative;
  width: 100%;
  aspect-ratio: 21 / 9;
  min-height: 280px;
  max-height: min(68vh, 720px);
}

.page-editors-picks-article .ep-article-full-visual-media .ep-article-media {
  position: absolute;
  inset: 0;
}

.page-editors-picks-article .ep-article-full-visual-media::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(
    180deg,
    rgba(20, 18, 16, 0.08) 0%,
    rgba(20, 18, 16, 0.45) 100%
  );
  pointer-events: none;
}

.page-editors-picks-article .ep-article-full-visual-copy {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 1;
  box-sizing: border-box;
  max-width: var(--ep-article-wide);
  margin: 0 auto;
  padding: 24px var(--ep-article-gutter) 32px;
  text-align: right;
}

.page-editors-picks-article .ep-article-full-visual-copy[hidden],
.page-editors-picks-article .ep-article-full-visual-copy.is-empty {
  display: none;
}

.page-editors-picks-article .ep-article-full-visual-text {
  margin: 0;
  max-width: 18em;
  margin-left: auto;
  font-family: var(--font-page-serif);
  font-size: clamp(14px, 0.6vw + 12px, 18px);
  line-height: 1.7;
  letter-spacing: 0.06em;
}

/* ========== SHOP INFO（本文と同じ 1080px 枠。画像左／情報右） ========== */
.page-editors-picks-article .ep-article-shop-info {
  width: 100%;
  max-width: none;
  margin: 0;
  padding: clamp(40px, 5vw, 72px) var(--ep-article-gutter) calc(clamp(40px, 5vw, 72px) + 50px);
  background: var(--ep-article-paper);
  border-top: none;
}

.page-editors-picks-article .ep-article-shop-info-inner {
  display: grid;
  width: 100%;
  max-width: var(--ep-article-max);
  margin-left: auto;
  margin-right: auto;
  box-sizing: border-box;
  grid-template-columns: minmax(0, calc((min(100%, 1000px) - clamp(28px, 3.2vw, 40px)) * 1.222 / 2.222 * 0.8763)) minmax(0, 1fr);
  row-gap: clamp(28px, 3.2vw, 40px);
  column-gap: calc(clamp(28px, 3.2vw, 40px) * 0.525);
  align-items: start;
  /* 前セクションとの呼吸 */
  padding: clamp(36px, 4vw, 52px) 0 0;
  border: none;
  background: transparent;
  --ep-shop-ink: #3a2f26;
  --ep-shop-ink-soft: #5c4a3a;
}

.page-editors-picks-article .ep-article-shop-info-image {
  grid-column: 1;
  grid-row: 2 / span 2;
  max-width: 100%;
  min-width: 0;
  overflow: hidden;
}

.page-editors-picks-article .ep-article-shop-info-body,
.page-editors-picks-article .ep-article-shop-info-aside {
  grid-column: 2;
  min-width: 0;
  padding-left: calc(28px * 0.525);
}

.page-editors-picks-article .ep-article-shop-info-body {
  grid-row: 2;
}

.page-editors-picks-article .ep-article-shop-info-aside {
  grid-row: 3;
  display: flex;
  align-items: flex-end;
  justify-content: flex-end;
  align-self: stretch;
  margin-left: clamp(8px, 1.2vw, 16px);
  padding-bottom: 2px;
}

.page-editors-picks-article .ep-article-shop-info-image .ep-article-figure {
  position: relative;
  aspect-ratio: calc(0.95 * 320 / 207);
  width: 94.75%;
  height: auto;
  overflow: hidden;
  background: #e8e2da;
}

.page-editors-picks-article .ep-article-shop-info-image .ep-article-media {
  position: absolute;
  inset: 0;
}

.page-editors-picks-article .ep-article-shop-info-label {
  display: flex;
  align-items: center;
  column-gap: 28px;
  grid-column: 1 / -1;
  grid-row: 1;
  justify-self: start;
  width: max-content;
  max-width: 100%;
  margin: 0 0 calc(56px - clamp(28px, 3.2vw, 40px));
  font-family: "Jost", "Work Sans", "IBM Plex Sans", sans-serif;
  font-size: 17.595px;
  font-weight: 600;
  letter-spacing: 0.28em;
  line-height: 1.3;
  color: #2a2724;
}

.page-editors-picks-article .ep-article-shop-info-label::after {
  content: "";
  display: block;
  flex: 0 0 140px;
  width: 140px;
  height: 1px;
  background: #9a948c;
}

.page-editors-picks-article .ep-article-shop-name {
  margin: 0;
  font-family: var(--font-page-serif);
  font-size: clamp(22px, 1.4vw + 14px, 30px);
  font-weight: 500;
  letter-spacing: 0.04em;
  line-height: 1.4;
  color: var(--ep-shop-ink);
}

.page-editors-picks-article .ep-article-shop-en {
  margin: 8px 0 0;
  font-family: "Cormorant Garamond", "Times New Roman", serif;
  font-size: 16px;
  font-style: italic;
  letter-spacing: 0.06em;
  color: var(--ep-shop-ink-soft);
}

.page-editors-picks-article .ep-article-shop-facts {
  display: grid;
  /* 左列はラベル幅に合わせ、右列開始位置を全行で揃える */
  grid-template-columns: max-content minmax(0, 1fr);
  column-gap: 1.25rem;
  row-gap: 12px;
  margin: 22px 0 0;
  padding: 0;
  border-top: none;
}

.page-editors-picks-article .ep-article-shop-fact {
  display: contents;
}

.page-editors-picks-article .ep-article-shop-fact dt {
  margin: 0;
  padding-top: 0.25em;
  font-family: "Jost", "Work Sans", "IBM Plex Sans", sans-serif;
  font-size: 12px;
  font-weight: 500;
  letter-spacing: 0.16em;
  line-height: 1.5;
  color: #8a7a6c;
  text-transform: uppercase;
  white-space: nowrap;
}

/* 日本語項目名のみ、12pxと14pxの中間（Instagramは12pxのまま） */
.page-editors-picks-article .ep-article-shop-fact:nth-child(-n+3) dt {
  font-size: 13px;
}

.page-editors-picks-article .ep-article-shop-fact dd {
  margin: 0;
  min-width: 0;
  font-size: 14px;
  font-weight: 400;
  line-height: 1.7;
  color: var(--ep-shop-ink);
}

/* STAFF：右列内で常に縦4行（PC/SP共通） */
.page-editors-picks-article .ep-article-shop-staff {
  list-style: none;
  margin: 0;
  padding: 0;
}

.page-editors-picks-article .ep-article-shop-staff li {
  display: grid;
  grid-template-columns: max-content max-content;
  column-gap: 1.25em;
  justify-content: start;
  line-height: 1.55;
}

.page-editors-picks-article .ep-article-shop-staff li + li {
  margin-top: 2px;
}

.page-editors-picks-article .ep-article-shop-cta {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 10px 16px;
  border: 1px solid rgba(58, 47, 38, 0.35);
  background: transparent;
  color: var(--ep-shop-ink);
  text-decoration: none;
  font-family: "Jost", "Work Sans", "IBM Plex Sans", sans-serif;
  font-size: 12px;
  font-weight: 400;
  letter-spacing: 0.06em;
  line-height: 1.3;
  white-space: nowrap;
  transition: border-color 0.2s ease;
}

.page-editors-picks-article .ep-article-shop-cta:hover {
  border-color: rgba(58, 47, 38, 0.55);
}

.page-editors-picks-article .ep-article-shop-cta:focus-visible {
  outline: 2px solid rgba(58, 47, 38, 0.45);
  outline-offset: 3px;
}

/* Instagram：他事実行と同じ高さ・下線なし */
.page-editors-picks-article .ep-article-shop-info .ep-article-ext-link {
  display: inline;
  align-items: unset;
  gap: 0;
  min-height: 0;
  color: var(--ep-shop-ink);
  text-decoration: none;
  border-bottom: none;
  padding-bottom: 0;
  line-height: inherit;
  vertical-align: baseline;
}

.page-editors-picks-article .ep-article-shop-info .ep-article-ext-link:hover {
  border-bottom-color: transparent;
  opacity: 0.78;
}

.page-editors-picks-article .ep-article-shop-info .ep-article-ext-mark {
  margin-left: 0.3em;
  font-size: 12px;
  line-height: 1;
  opacity: 0.7;
  vertical-align: baseline;
}

/* ========== EDITOR'S NOTE ========== */
.page-editors-picks-article .ep-article-editors-note {
  position: relative;
  width: 100%;
  max-width: none;
  margin: 0;
  /* ベージュ帯としての上下余白（装飾画像が底部に収まる量） */
  padding: clamp(148px, 12.5vw, 168px) var(--ep-article-gutter) clamp(180px, calc(11.5vw + 40px), 198px);
  background-color: var(--ep-article-paper-deep);
  background-image: url("assets/img/background/editors-note-011.png");
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
  border-top: none;
  overflow: hidden;
}

.page-editors-picks-article .ep-article-editors-note-inner {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: minmax(8em, 12em) minmax(0, 1fr);
  /* ラベルと本文の間隔を抑え、Editor's Noteとしてのまとまりを出す */
  gap: clamp(8px, calc(3vw - 24px), 16px);
  align-items: start;
  max-width: var(--ep-article-max);
  margin: -16px auto 0;
}

.page-editors-picks-article .ep-article-editors-note-label {
  margin: 0;
  /* ラベル書体（Belleza） */
  font-family: Belleza, "Helvetica Neue", sans-serif;
  font-size: 15px;
  font-weight: 400;
  font-style: normal;
  letter-spacing: 0.13em;
  color: rgba(26, 24, 22, 0.68);
}

.page-editors-picks-article .ep-article-editors-note-body {
  max-width: 38rem;
  font-size: clamp(14px, 0.25vw + 13px, 15px);
  line-height: 2;
  letter-spacing: 0.03em;
}

.page-editors-picks-article .ep-article-editors-note-body p {
  margin: 0;
}

.page-editors-picks-article .ep-article-editors-note-body p + p {
  margin-top: 1.1em;
}

/* EDITOR'S NOTE 装飾：section-001〜003 と同一の紙面幅（--ep-article-max）右端基準 */
.page-editors-picks-article .ep-article-editors-note-deco {
  position: absolute;
  right: max(var(--ep-article-gutter), calc((100% - var(--ep-article-max)) / 2));
  bottom: clamp(24px, 3vw, 40px);
  width: clamp(154px, 14vw, 179px);
  height: auto;
  max-width: 26%;
  object-fit: contain;
  pointer-events: none;
  user-select: none;
  z-index: 0;
  opacity: 0.72;
}

/* ========== DISCOVER ========== */
.page-editors-picks-article .ep-article-discover {
  width: 100%;
  max-width: none;
  margin: 0;
  padding: clamp(48px, 6vw, 88px) var(--ep-article-gutter) clamp(64px, 8vw, 112px);
  background: var(--ep-article-paper);
  border-top: none;
}

.page-editors-picks-article .ep-article-discover-inner {
  display: flex;
  flex-direction: column;
  gap: 0;
  /* 導入見出しとのスケール差を抑えるため、紙面幅のみ約17%縮小（1080 → 900） */
  max-width: 900px;
  margin: 0 auto;
}

.page-editors-picks-article .ep-article-discover-head {
  /* 下層共通 body:not(.page-home) header の白帯・下線を打ち消す */
  text-align: center;
  margin: 0 0 clamp(16px, 2vw, 24px);
  padding: 0;
  border: none;
  border-bottom: none;
  background: transparent;
}

.page-editors-picks-article .ep-article-discover-eyebrow {
  margin: 0 0 8px;
  font-family: "Jost", "Work Sans", "IBM Plex Sans", sans-serif;
  font-size: 16px;
  font-weight: 450;
  letter-spacing: 0.24em;
  /* DISCOVER / DISCOVER MORE 共通アクセント */
  color: #89656a;
}

/* SECTION 英字ラベル。DISCOVER の eyebrow には当てない */
.page-editors-picks-article .ep-article-section-heading .ep-article-discover-eyebrow {
  display: block;
  font-size: 14.08px;
  margin: 0 0 15px;
}

.page-editors-picks-article .ep-article-discover-heading {
  margin: 0;
  font-family: var(--font-page-serif);
  font-size: clamp(23px, 1.05vw + 16px, 30px);
  font-weight: 500;
  letter-spacing: 0.06em;
  line-height: 1.4;
  color: var(--ep-article-ink);
}

.page-editors-picks-article .ep-article-discover-heading::after {
  content: "";
  display: block;
  width: 2.4em;
  height: 1px;
  margin: 24px auto 0;
  background: rgba(63, 36, 40, 0.5);
}

.page-editors-picks-article .ep-article-discover-card {
  display: grid;
  /* 画像列をやや抑え、文章との距離を詰める */
  grid-template-columns: minmax(0, 0.95fr) minmax(0, 1.2fr);
  gap: clamp(16px, 2.4vw, 32px);
  align-items: center;
  text-decoration: none;
  color: inherit;
  /* 上下は件間の呼吸のみ。左右paddingは紙面幅を変えないよう0 */
  padding: clamp(18px, 2vw, 26px) 0;
  border: none;
  border-bottom: 1px solid rgba(26, 24, 22, 0.08);
  background: transparent;
  transition: opacity 0.2s ease;
}

.page-editors-picks-article .ep-article-discover-card:last-child {
  border-bottom: none;
}

.page-editors-picks-article .ep-article-discover-card:hover {
  opacity: 0.88;
}

.page-editors-picks-article .ep-article-discover-card:focus-visible {
  outline: 2px solid rgba(26, 24, 22, 0.55);
  outline-offset: 3px;
}

.page-editors-picks-article .ep-article-discover-card-image {
  position: relative;
  aspect-ratio: 16 / 10;
  overflow: hidden;
  background: #e8e2da;
}

.page-editors-picks-article .ep-article-discover-card-image .ep-article-media {
  position: absolute;
  inset: 0;
}

.page-editors-picks-article .ep-article-discover-label {
  margin: 0 0 12px;
  font-family: "Jost", "Work Sans", "IBM Plex Sans", sans-serif;
  font-size: 10px;
  font-weight: 500;
  letter-spacing: 0.22em;
  /* 暖かみのあるチャコール（補助情報） */
  color: #524745;
}

.page-editors-picks-article .ep-article-discover-title {
  margin: 0;
  font-family: var(--font-page-serif);
  font-size: clamp(16px, 0.9vw + 11px, 20px);
  font-weight: 500;
  line-height: 1.5;
  letter-spacing: 0.04em;
}

.page-editors-picks-article .ep-article-discover-shop {
  margin: 6px 0 0;
  font-family: "Jost", "Work Sans", "IBM Plex Sans", sans-serif;
  font-size: 15px;
  font-weight: 400;
  letter-spacing: 0.06em;
  line-height: 1.4;
  color: var(--ep-article-muted);
}

.page-editors-picks-article .ep-article-discover-excerpt {
  margin: 12px 0 0;
  font-size: 14px;
  line-height: 1.85;
  color: var(--ep-article-muted);
}

.page-editors-picks-article .ep-article-discover-more {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-top: 20px;
  font-family: "Jost", "Work Sans", "IBM Plex Sans", sans-serif;
  font-size: 11px;
  font-weight: 500;
  letter-spacing: 0.14em;
  color: #89656a;
}

/* ========== SP ========== */
@media (max-width: 768px) {
  .page-editors-picks-article {
    --ep-article-gutter: 22px;
  }

  /* SP HERO：112%拡大後、テキスト塊は下端から 100px。左右は共通ガター */
  .page-editors-picks-article .ep-article-hero-media {
    aspect-ratio: 3 / 4;
    min-height: 0;
    max-height: none;
  }

  .page-editors-picks-article .ep-article-hero-media::after {
    background: linear-gradient(
      180deg,
      rgba(20, 18, 16, 0.18) 0%,
      rgba(20, 18, 16, 0.32) 50%,
      rgba(20, 18, 16, 0.6) 100%
    );
  }

  .page-editors-picks-article .ep-article-hero-copy {
    top: auto;
    bottom: 100px;
    transform: none;
    padding: 0 var(--ep-article-gutter);
  }

  .page-editors-picks-article .ep-article-hero-category {
    margin-bottom: 12.32px;
    font-size: 12.32px;
    letter-spacing: 0.24em;
  }

  .page-editors-picks-article .ep-article-hero-shop {
    margin-bottom: 9.6768px;
    font-size: 44.688px;
    line-height: 1.15;
  }

  /* COMPLETE / PROTECTED: わんこまにあ HEROショップ名の最終値 */
  .page-ep-wankomania .ep-article-hero-shop {
    font-size: 46.547px;
  }

  .page-editors-picks-article .ep-article-hero-title {
    margin-bottom: 18.816px;
    font-size: 21.28px;
    line-height: 1.45;
  }

  .page-editors-picks-article .ep-article-hero-lead {
    margin-top: 0;
    max-width: none;
    font-size: 13.44px;
    line-height: 1.85;
  }

  /* INTRO：SPでも左寄せ＋右余白。余白で次セクションへつなぐ */
  .page-editors-picks-article .ep-article-intro {
    padding: 36px var(--ep-article-gutter) 80px;
    border-bottom: none;
  }

  .page-editors-picks-article .ep-article-intro-inner {
    max-width: none;
  }

  .page-editors-picks-article .ep-article-intro-label {
    margin-bottom: 36px;
    padding-bottom: 3px;
    font-size: 12px;
    font-weight: 350;
    letter-spacing: 0.12em;
  }

  .page-editors-picks-article .ep-article-intro-heading {
    max-width: none;
    margin-bottom: 56px;
    font-size: 34px;
    line-height: 1.78;
  }

  .page-editors-picks-article .ep-article-intro-body {
    max-width: none;
    width: 100%;
    font-size: 17px;
    line-height: 2.2;
  }

  .page-editors-picks-article .ep-article-intro-body p + p {
    margin-top: 1.75em;
  }

  .page-editors-picks-article .ep-article-section {
    padding: 0 var(--ep-article-gutter);
  }

  /* section見出し：上余白を広げてセクション区切りを明確に（下余白＝本文との間隔は据え置き） */
  .page-editors-picks-article .ep-article-section-heading {
    margin-top: 52px;
    margin-bottom: 28px;
    font-size: 21px;
  }

  .page-editors-picks-article .ep-article-section-inner {
    display: flex;
    flex-direction: column;
    /* PCグリッドの align-items: start を打ち消す（start のままだと
       絶対配置画像のみの .ep-article-section-image が幅0に潰れる） */
    align-items: stretch;
    /* 画像・本文の間隔は見出し上余白（heading margin-top）で確保 */
    gap: 0;
    max-width: none;
  }

  /* SP: 全セクションで画像 → 文章（ラベル・見出し・本文は一塊で画像の下へ） */
  .page-editors-picks-article .ep-article-section-image {
    order: 1;
    width: 100%;
  }

  .page-editors-picks-article .ep-article-section-body {
    order: 2;
    padding-left: 0;
    padding-right: 0;
  }

  /* SP: intro + 001–003 文章ブロックの横位置のみ（上下余白は現行値を維持）。
     ・各ブロックの実測幅を維持（intro 346px / 001–003 本文列 318px）
     ・左右対称化でセクション内中央へ（text-align は左のまま）
     ・フォント・行間・見出し間隔は変更しない */
  .page-editors-picks-article .ep-article-intro-inner,
  .page-editors-picks-article .ep-article-section-001 .ep-article-section-body,
  .page-editors-picks-article .ep-article-section-002 .ep-article-section-body,
  .page-editors-picks-article .ep-article-section-003 .ep-article-section-body,
  .page-editors-picks-article .ep-article-section-004 .ep-article-section-body,
  .page-editors-picks-article .ep-article-section-005 .ep-article-section-body {
    margin-left: auto;
    margin-right: auto;
    box-sizing: border-box;
  }

  /* 001–005: PC非対称paddingを打ち消し、左右14pxで幅318pxを維持して中央配置。
     padding-bottom:64px は現行の下余白として維持。 */
  .page-editors-picks-article .ep-article-section-001 .ep-article-section-body,
  .page-editors-picks-article .ep-article-section-002 .ep-article-section-body,
  .page-editors-picks-article .ep-article-section-003 .ep-article-section-body,
  .page-editors-picks-article .ep-article-section-004 .ep-article-section-body,
  .page-editors-picks-article .ep-article-section-005 .ep-article-section-body {
    padding-left: 14px;
    padding-right: 14px;
    padding-bottom: 64px;
  }

  /* intro: 親gutter内いっぱい（346px）のまま中央。左右insetは付けない（幅維持） */
  .page-editors-picks-article .ep-article-intro-inner {
    width: 100%;
    max-width: none;
    padding-left: 0;
    padding-right: 0;
  }

  /* 現行の下余白一本化を維持（上下は今回変更しない） */
  .page-editors-picks-article .ep-article-section.ep-article-section-003 {
    padding-bottom: 0;
  }

  .page-editors-picks-article .ep-article-section-image .ep-article-figure {
    aspect-ratio: 4 / 5;
  }

  /* SPでも002 / 004の縦長比率（3/4）のみ維持 */
  .page-editors-picks-article .ep-article-section-002 .ep-article-section-image .ep-article-figure,
  .page-editors-picks-article .ep-article-section-004 .ep-article-section-image .ep-article-figure {
    width: 100%;
    aspect-ratio: 3 / 4;
  }

  .page-editors-picks-article .ep-article-full-visual-media {
    aspect-ratio: 4 / 3;
    min-height: 0;
    max-height: none;
  }

  .page-editors-picks-article .ep-article-full-visual-copy {
    padding: 18px var(--ep-article-gutter) 24px;
    text-align: left;
  }

  .page-editors-picks-article .ep-article-full-visual-text {
    margin-left: 0;
    max-width: none;
  }

  .page-editors-picks-article .ep-article-shop-info {
    padding: 32px var(--ep-article-gutter) 82px;
  }

  /* SP：画像＋文章を一体として約8%縮小し、同一幅・同一中心でまとめる */
  .page-editors-picks-article .ep-article-shop-info-inner {
    grid-template-columns: 1fr;
    gap: 22px;
    align-items: stretch;
    width: 92%;
    max-width: 100%;
    margin-inline: auto;
    padding: 28px 0 0;
  }

  .page-editors-picks-article .ep-article-shop-info-label,
  .page-editors-picks-article .ep-article-shop-info-image,
  .page-editors-picks-article .ep-article-shop-info-body,
  .page-editors-picks-article .ep-article-shop-info-aside {
    grid-column: 1 / -1;
    grid-row: auto;
    width: 100%;
    padding-left: 0;
    padding-right: 0;
    box-sizing: border-box;
  }

  .page-editors-picks-article .ep-article-shop-info-label {
    column-gap: 18px;
    justify-self: stretch;
    margin: 0 0 8px;
    font-size: 13.331px;
  }

  .page-editors-picks-article .ep-article-shop-info-label::after {
    flex: 0 1 64px;
    width: 64px;
    min-width: 0;
  }

  .page-editors-picks-article .ep-article-shop-info-image {
    margin-top: 5px;
  }

  .page-editors-picks-article .ep-article-shop-info-image .ep-article-figure {
    width: 100%;
    aspect-ratio: 320 / 207;
  }

  .page-editors-picks-article .ep-article-shop-info-aside {
    justify-content: flex-start;
    align-self: start;
    margin-left: 0;
    /* Instagram ↔ CTA：従来の約30px前後を維持 */
    margin-top: 8px;
  }

  /* SP：2カラム比率は維持しつつ、情報群（facts＋CTA）を約8%コンパクトに */
  .page-editors-picks-article .ep-article-shop-facts {
    grid-template-columns: minmax(0, 28%) minmax(0, 1fr);
    column-gap: 11px;
    row-gap: 13px;
    margin-top: 20px;
  }

  .page-editors-picks-article .ep-article-shop-fact dt {
    font-size: 11px;
    letter-spacing: 0.12em;
    white-space: nowrap;
  }

  .page-editors-picks-article .ep-article-shop-fact:nth-child(-n+3) dt {
    font-size: 12px;
  }

  .page-editors-picks-article .ep-article-shop-fact dd {
    font-size: 13px;
  }

  .page-editors-picks-article .ep-article-shop-staff li {
    column-gap: 1.15em;
    line-height: 1.55;
  }

  .page-editors-picks-article .ep-article-shop-cta {
    gap: 9px;
    padding: 9px 15px;
    font-size: 11px;
  }

  .page-editors-picks-article .ep-article-shop-info .ep-article-ext-mark {
    font-size: 11px;
  }

  /* SHOP INFO内Instagramは触領域拡大用min-heightを適用しない（項目高さを揃える） */
  .page-editors-picks-article .ep-article-shop-info .ep-article-ext-link {
    min-height: 0;
  }

  /* SP：上-20 / 下+50。ラベル〜本文 gap は +約20（装飾・本文タイポは据え置き） */
  .page-editors-picks-article .ep-article-editors-note {
    padding-top: 120px;
    padding-bottom: 190px;
    padding-left: var(--ep-article-gutter);
    padding-right: var(--ep-article-gutter);
    min-height: 0;
    box-sizing: border-box;
    background-image: url("assets/img/background/editors-note-012.png");
    background-position: calc(50% - 60px) 50%;
  }

  .page-editors-picks-article .ep-article-editors-note-inner {
    grid-template-columns: 1fr;
    gap: 34px;
    margin-top: 0;
  }

  /* 本文列は他セクションと同じ左右ガター。右だけ狭めない */
  .page-editors-picks-article .ep-article-editors-note-body {
    padding-right: 0;
    box-sizing: border-box;
  }

  .page-editors-picks-article .ep-article-editors-note-deco {
    right: 16px;
    bottom: 16px;
    width: clamp(96px, 28vw, 110px);
    max-width: 32%;
    opacity: 0.68;
  }

  .page-editors-picks-article .ep-article-discover {
    padding: 40px var(--ep-article-gutter) 72px;
  }

  .page-editors-picks-article .ep-article-discover-inner {
    gap: 0;
  }

  .page-editors-picks-article .ep-article-discover-card {
    grid-template-columns: 1fr;
    gap: 14px;
    padding: 16px 0;
    /* カード単位を中央配置（画像＋本文＋罫線を同一幅で同期） */
    width: 82%;
    margin-inline: auto;
  }

  .page-editors-picks-article .ep-article-discover-card-image {
    width: 100%;
    max-width: none;
  }

  .page-editors-picks-article .ep-article-discover-card-body {
    width: 100%;
    padding-left: 0;
    padding-right: 0;
    text-align: start;
  }

  /* SPのみ：説明文の強制改行を外し、幅に応じた折り返しにする */
  .page-editors-picks-article .ep-article-discover-excerpt br {
    display: none;
  }
}

/* HOME HERO 白系 完成固定（body.hero-white-exp）
   ------------------------------------------------------------------
   現行の HOME HERO（白文字・白ロゴ・オーバーレイ）は本ブロックが正。
   プロパティの削除・統合・数値変更はしない。
   ------------------------------------------------------------------ */

/* 白系ロゴ：hero-white-exp 時は logo-990 を表示 */
.page-home .home-hero .logo-img--white-exp {
  display: none;
}

.page-home.hero-white-exp .home-hero .logo-img--base {
  display: none;
}

.page-home.hero-white-exp .home-hero .logo-img--white-exp {
  display: block;
}

.page-home.hero-white-exp .home-hero .hero-eyebrow {
  color: rgba(255, 252, 248, 0.9);
}

.page-home.hero-white-exp .home-hero .hero-title,
.page-home.hero-white-exp main section.hero.home-hero h1.hero-title {
  color: rgba(255, 252, 248, 0.94);
  text-shadow: 0 1px 14px rgba(18, 14, 10, 0.28);
}

.page-home.hero-white-exp .home-hero .hero-title span:first-child,
.page-home.hero-white-exp .home-hero .hero-title span:last-child {
  color: rgba(255, 252, 248, 0.94);
}

.page-home.hero-white-exp .home-hero .hero-lead {
  color: rgba(255, 252, 248, 0.88);
  text-shadow: 0 1px 12px rgba(18, 14, 10, 0.22);
}

.page-home.hero-white-exp .home-hero .hero-cta {
  color: rgba(255, 252, 248, 0.92);
  border-color: rgba(255, 252, 248, 0.42);
}

.page-home.hero-white-exp .home-hero .hero-cta:hover {
  color: rgba(255, 255, 255, 0.96);
  border-color: rgba(255, 252, 248, 0.58);
}

.page-home.hero-white-exp .home-hero .hero-go-forth {
  color: rgba(255, 252, 248, 0.9);
  text-shadow: 0 1px 10px rgba(18, 14, 10, 0.3);
}

/* PCナビ：ABOUT / RECRUIT / PICKS のみ白系（検索・メニューは対象外） */
.page-home.hero-white-exp .home-hero .nav a {
  color: rgba(255, 252, 248, 0.9);
}

.page-home.hero-white-exp .home-hero .nav a:hover {
  color: rgba(255, 255, 255, 0.98);
  opacity: 1;
}

/* PC：白系オーバーレイ */
.page-home.hero-white-exp main section.hero.home-hero::after {
  filter: contrast(0.95) saturate(0.97) brightness(1.008);
}

.page-home.hero-white-exp main section.hero.home-hero::before {
  background-image:
    linear-gradient(
      to right,
      rgba(248, 244, 238, 0.119) 0%,
      rgba(248, 242, 234, 0.073) 19%,
      rgba(244, 238, 230, 0.035) 40%,
      rgba(243, 238, 230, 0.009) 58%,
      transparent 71%
    ),
    linear-gradient(
      to bottom,
      rgba(248, 244, 238, 0.067) 0%,
      rgba(248, 242, 235, 0.027) 28%,
      transparent 55%
    ),
    linear-gradient(
      to right,
      rgba(22, 16, 12, 0.256) 0%,
      rgba(22, 16, 12, 0.18) 12%,
      rgba(20, 15, 11, 0.095) 24%,
      rgba(18, 14, 10, 0.041) 39%,
      rgba(18, 14, 10, 0.011) 51%,
      transparent 60%
    ),
    linear-gradient(
      to top,
      rgba(18, 14, 10, 0.06) 0%,
      rgba(18, 14, 10, 0.021) 14%,
      transparent 34%
    );
  background-color: rgba(246, 240, 233, 0.065);
}

@media (max-width: 768px) {
  .page-home.hero-white-exp main section.hero.home-hero::after {
    filter: contrast(0.945) saturate(0.965) brightness(1.01);
  }

  .page-home.hero-white-exp main section.hero.home-hero::before {
    background-image:
      linear-gradient(
        to bottom,
        rgba(248, 244, 238, 0.075) 0%,
        rgba(248, 242, 235, 0.034) 21%,
        transparent 47%
      ),
      linear-gradient(
        to right,
        rgba(248, 244, 238, 0.104) 0%,
        rgba(248, 242, 234, 0.059) 25%,
        rgba(244, 238, 230, 0.024) 49%,
        transparent 70%
      ),
      linear-gradient(
        to bottom,
        rgba(248, 244, 238, 0.045) 0%,
        rgba(246, 241, 235, 0.021) 14%,
        transparent 36%
      ),
      linear-gradient(
        to right,
        rgba(22, 16, 12, 0.266) 0%,
        rgba(22, 16, 12, 0.166) 18%,
        rgba(20, 15, 11, 0.071) 34%,
        rgba(18, 14, 10, 0.024) 50%,
        transparent 64%
      ),
      linear-gradient(
        to top,
        rgba(18, 14, 10, 0.071) 0%,
        rgba(18, 14, 10, 0.024) 16%,
        transparent 36%
      );
    background-color: rgba(246, 240, 233, 0.063);
  }

  .page-home.hero-white-exp .home-hero .hero-title,
  .page-home.hero-white-exp main section.hero.home-hero h1.hero-title {
    color: rgba(255, 252, 248, 0.94);
    text-shadow: 0 1px 12px rgba(18, 14, 10, 0.32);
  }

  .page-home.hero-white-exp .home-hero .hero-title span:first-child,
  .page-home.hero-white-exp .home-hero .hero-title span:last-child {
    color: rgba(255, 252, 248, 0.94);
  }

  .page-home.hero-white-exp .home-hero .hero-lead {
    color: rgba(255, 252, 248, 0.88);
    text-shadow: 0 1px 10px rgba(18, 14, 10, 0.28);
  }

  .page-home.hero-white-exp .home-hero .hero-cta {
    color: rgba(255, 252, 248, 0.92);
    border-color: rgba(255, 252, 248, 0.4);
  }

  .page-home.hero-white-exp .home-hero .hero-go-forth {
    color: rgba(255, 252, 248, 0.88);
    text-shadow: 0 1px 8px rgba(18, 14, 10, 0.34);
  }
}

/* §62 ─────── DOG CARE 記事（.page-dogcare-article / .dc-article-*） ───────
   正本：DOG CARE 記事ページ（HERO／飼い主情報／001〜005／EDITOR'S NOTE／YOU MAY ALSO LIKE）
   EDITOR'S NOTE / YOU MAY ALSO LIKE は 2026-10-03 うめママ確定仕様
   ──────────────────────────────────────────────────────────────────────── */

.page-dogcare-article {
  --dc-article-max: 1080px;
  --dc-article-gutter: clamp(22px, 4vw, 48px);
  --dc-article-ink: #1a1816;
  --dc-article-line: rgba(26, 24, 22, 0.14);
  --dc-article-font-jp:
    "游ゴシック",
    "Yu Gothic",
    YuGothic,
    "Hiragino Kaku Gothic ProN",
    "Hiragino Kaku Gothic Pro",
    "メイリオ",
    Meiryo,
    "ＭＳ ゴシック",
    sans-serif;
  overflow-x: hidden;
}

.page-dogcare-article .dc-article {
  display: block;
  width: 100%;
  margin: 0;
  padding: 0;
  color: var(--dc-article-ink);
  background: #fff;
}

.page-dogcare-article .dc-article-media {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center center;
}

.page-dogcare-article .dc-article-figure {
  margin: 0;
  width: 100%;
}

/* ========== HERO ========== */
.page-dogcare-article .dc-article-hero {
  position: relative;
  width: 100%;
  margin: 0;
  padding: 0;
  background: #2a2623;
  color: #fff;
  overflow: hidden;
}

.page-dogcare-article .dc-article-hero-media {
  position: relative;
  width: 100%;
  aspect-ratio: 2000 / 870;
  min-height: 280px;
  max-height: min(72vh, 760px);
}

.page-dogcare-article .dc-article-hero-media::after {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.27);
  pointer-events: none;
}

.page-dogcare-article .dc-article-hero-media .dc-article-media {
  position: absolute;
  inset: 0;
}

.page-dogcare-article .dc-article-hero-copy {
  position: absolute;
  inset: 0;
  z-index: 1;
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  max-width: none;
  margin: 0;
  padding: 0 var(--dc-article-gutter);
  text-align: center;
}

.page-dogcare-article .dc-article-hero-title {
  margin: 0;
  max-width: var(--dc-article-max);
  font-family: var(--dc-article-font-jp);
  font-size: clamp(24px, 2.8vw + 10px, 42px);
  font-weight: 700;
  line-height: 1.45;
  letter-spacing: 0.04em;
}

.page-dogcare-article .dc-article-hero-lead {
  margin: clamp(8px, 0.9vw, 12px) auto 0;
  max-width: 34em;
  font-family: var(--dc-article-font-jp);
  font-size: clamp(17px, 0.7vw + 14px, 20px);
  font-weight: 400;
  line-height: 1.7;
  letter-spacing: 0.04em;
  opacity: 0.92;
}

/* ========== 飼い主・犬の情報 ========== */
.page-dogcare-article .dc-article-owner {
  width: 100%;
  margin: 0;
  padding: clamp(40px, 4.7vw, 63px) var(--dc-article-gutter) clamp(36px, 4.2vw, 56px);
  background: #fff;
}

.page-dogcare-article .dc-article-owner-inner {
  width: 85.5%;
  max-width: calc(var(--dc-article-max) * 0.855);
  margin: 0 auto;
  box-sizing: border-box;
  text-align: left;
  border: 1px solid rgba(26, 24, 22, 0.36);
  padding: clamp(22px, 2.4vw, 30px) clamp(22px, 3.2vw, 40px);
}

.page-dogcare-article .dc-article-owner-title {
  margin: 0;
  padding: 0 0 clamp(8px, 1vw, 11px);
  border-bottom: 1px solid rgba(26, 24, 22, 0.42);
  font-family: var(--dc-article-font-jp);
  font-size: clamp(19px, 1.23vw + 12px, 25px);
  font-weight: 700;
  line-height: 1.4;
  letter-spacing: 0.06em;
  color: var(--dc-article-ink);
}

.page-dogcare-article .dc-article-owner-meta {
  margin: 0;
  padding: clamp(8px, 1vw, 11px) 0;
  border-bottom: 1px solid rgba(26, 24, 22, 0.42);
  font-family: var(--dc-article-font-jp);
  font-size: clamp(11px, 0.22vw + 10px, 13px);
  font-weight: 400;
  line-height: 1.6;
  letter-spacing: 0.08em;
  color: #5a5652;
}

.page-dogcare-article .dc-article-owner-profile {
  max-width: none;
  width: 100%;
  margin: clamp(10px, 1.2vw, 14px) 0 0;
  font-family: var(--dc-article-font-jp);
  font-size: clamp(12px, 0.22vw + 11px, 14px);
  font-weight: 400;
  line-height: 2.1;
  letter-spacing: 0.03em;
  color: var(--dc-article-ink);
}

.page-dogcare-article .dc-article-owner-profile p {
  margin: 0;
}

/* ========== セクション001（入口） ========== */
.page-dogcare-article .dc-article-intro {
  width: 100%;
  margin: 0;
  padding: clamp(29px, 3.6vw, 50px) var(--dc-article-gutter) clamp(92px, 10vw, 132px);
  background: #fff;
}

.page-dogcare-article .dc-article-intro-inner {
  display: block;
  width: 85.5%;
  max-width: calc(var(--dc-article-max) * 0.855);
  margin: 0 auto;
}

.page-dogcare-article .dc-article-intro-label {
  display: inline-block;
  margin: 0 0 clamp(32px, 3.6vw, 44px);
  padding-bottom: 4px;
  border-bottom: 1px solid rgba(26, 24, 22, 0.55);
  font-family: "Jost", "Work Sans", "IBM Plex Sans", sans-serif;
  font-size: 13px;
  font-weight: 350;
  letter-spacing: 0.14em;
  line-height: 1.4;
  color: var(--dc-article-ink);
}

.page-dogcare-article .dc-article-intro-heading {
  margin: 0 0 clamp(50px, 5.6vw, 79px);
  max-width: none;
  font-family: var(--dc-article-font-jp);
  font-size: clamp(32px, 2.25vw + 15px, 45px);
  font-weight: 500;
  line-height: 1.78;
  letter-spacing: 0.04em;
}

/* DOG CARE 記事見出し：PC/SP 別改行（HERO .hero-lead-break-* と同趣旨） */
.page-dogcare-article .dc-article-br-pc {
  display: block;
}

.page-dogcare-article .dc-article-br-sp {
  display: none;
}

.page-dogcare-article .dc-article-intro-body {
  max-width: none;
  width: 100%;
  font-family: var(--dc-article-font-jp);
  font-size: clamp(14px, 0.25vw + 13px, 16px);
  line-height: 2.15;
  letter-spacing: 0.03em;
}

.page-dogcare-article .dc-article-intro-body p {
  margin: 0;
}

/* ========== セクション002〜005 ========== */
.page-dogcare-article .dc-article-section {
  width: 100%;
  margin: 0;
  padding: 0 var(--dc-article-gutter);
  background: #F4F5F1;
}

.page-dogcare-article .dc-article-section-005 {
  padding-bottom: 100px;
}

.page-dogcare-article .dc-article-section-inner {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 0;
  align-items: start;
  max-width: var(--dc-article-max);
  margin: 0 auto;
}

.page-dogcare-article .dc-article-section-002 .dc-article-section-body,
.page-dogcare-article .dc-article-section-004 .dc-article-section-body {
  padding-right: clamp(28px, 4vw, 56px);
}

.page-dogcare-article .dc-article-section-003 .dc-article-section-body,
.page-dogcare-article .dc-article-section-005 .dc-article-section-body {
  padding-left: clamp(28px, 4vw, 56px);
}

.page-dogcare-article .dc-article-section-heading {
  margin-top: clamp(48px, 5.2vw, 80px);
  margin-bottom: clamp(20px, 2.5vw, 28px);
  margin-left: 0;
  margin-right: 0;
  padding-bottom: clamp(16px, 2vw, 22px);
  border-bottom: 1px solid var(--dc-article-line);
  font-family: var(--dc-article-font-jp);
  font-size: clamp(17px, 1.1vw + 12px, 22px);
  font-weight: 700;
  line-height: 1.55;
  letter-spacing: 0.04em;
}

.page-dogcare-article .dc-article-section-text {
  font-family: var(--dc-article-font-jp);
  font-size: clamp(14px, 0.25vw + 13px, 15px);
  line-height: 2;
  letter-spacing: 0.03em;
}

.page-dogcare-article .dc-article-section-text p {
  margin: 0;
}

.page-dogcare-article .dc-article-section-image {
  min-width: 0;
}

.page-dogcare-article .dc-article-section-image .dc-article-figure {
  position: relative;
  width: 100%;
  aspect-ratio: 4 / 5;
  overflow: hidden;
  background: #e8e2da;
}

.page-dogcare-article .dc-article-figure--square {
  aspect-ratio: 1 / 1;
}

.page-dogcare-article .dc-article-figure--landscape {
  aspect-ratio: 4 / 3;
}

.page-dogcare-article .dc-article-section-image .dc-article-media {
  position: absolute;
  inset: 0;
}

/* article-template.css の img { height: auto } を打ち消し、本文画像をフレーム全面カバー */
body.page-dogcare-article.page-article .dc-article-section-image .dc-article-media {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center center;
}

.page-dogcare-article .dc-article-section-005 .dc-article-section-image .dc-article-figure--landscape {
  aspect-ratio: 3 / 4;
}

/* ========== EDITOR'S NOTE ========== */
.page-dogcare-article .dc-article-editors-note {
  position: relative;
  width: 100%;
  max-width: none;
  margin: 0;
  /* 下だけ +160px。高さ +80px につき background-position を -40px し、上端は動かさない */
  /* 画像の下に出る帯は白（YOU MAY ALSO LIKE と同じ）。ベージュは出さない */
  padding: clamp(148px, 12.5vw, 168px) var(--dc-article-gutter) calc(clamp(180px, calc(11.5vw + 40px), 198px) + 160px);
  background-color: #fff;
  background-image: url("assets/img/background/editors-note-011.png");
  background-repeat: no-repeat;
  background-position: center calc(50% - 80px);
  background-size: cover;
  border-top: none;
  overflow: hidden;
}

.page-dogcare-article .dc-article-editors-note-inner {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: minmax(8em, 12em) minmax(0, 1fr);
  gap: clamp(8px, calc(3vw - 24px), 16px);
  align-items: start;
  max-width: var(--dc-article-max);
  margin: -16px auto 0;
}

.page-dogcare-article .dc-article-editors-note-label {
  margin: 0;
  font-family: Belleza, "Helvetica Neue", sans-serif;
  font-size: 15px;
  font-weight: 400;
  font-style: normal;
  letter-spacing: 0.13em;
  color: rgba(26, 24, 22, 0.68);
}

.page-dogcare-article .dc-article-editors-note-body {
  max-width: 38rem;
  font-family: var(--font-page-serif);
  font-weight: 300;
  font-size: clamp(14px, 0.25vw + 13px, 15px);
  line-height: 2;
  letter-spacing: 0.03em;
  color: #1a1816;
}

.page-dogcare-article .dc-article-editors-note-body p {
  margin: 0;
}

.page-dogcare-article .dc-article-editors-note-body p + p {
  margin-top: 1.1em;
}

body.page-dogcare-article.page-article .dc-article-editors-note-deco {
  display: none;
}

.page-dogcare-article .dc-article-editors-note-deco {
  position: absolute;
  right: max(var(--dc-article-gutter), calc((100% - var(--dc-article-max)) / 2));
  bottom: clamp(48px, 4.6vw, 66px);
  width: clamp(226px, 20.5vw, 263px);
  height: auto;
  max-width: 37%;
  object-fit: contain;
  pointer-events: none;
  user-select: none;
  z-index: 0;
  opacity: 0.72;
}

/* ========== YOU MAY ALSO LIKE ========== */
.page-dogcare-article .dc-also-like {
  width: 100%;
  margin: 0;
  padding: clamp(72px, 7.5vw, 112px) var(--dc-article-gutter) clamp(180px, calc(8vw + 100px), 220px);
  background: #fff;
  color: var(--dc-article-ink);
}

.page-dogcare-article .dc-also-like-inner {
  width: 100%;
  max-width: var(--dc-article-max);
  margin: 0 auto;
}

.page-dogcare-article .dc-also-like-heading {
  margin: 0 0 clamp(36px, 3.8vw, 52px);
  padding: 0;
  font-family: var(--font-story-meta, var(--font-page-serif));
  font-size: clamp(19px, 0.65vw + 15px, 24px);
  font-weight: 500;
  line-height: 1.25;
  letter-spacing: 0.14em;
  text-align: center;
  text-transform: uppercase;
  color: var(--dc-article-ink);
}

.page-dogcare-article .dc-also-like-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: clamp(16px, 1.4vw, 22px);
  align-items: start;
  margin: 0;
  padding: 0;
  list-style: none;
}

.page-dogcare-article .dc-also-like-item {
  margin: 0;
  padding: 0;
  background: transparent;
  border: none;
  border-radius: 0;
  box-shadow: none;
}

.page-dogcare-article .dc-also-like-link {
  display: block;
  text-decoration: none;
  color: inherit;
  transition: opacity 0.3s ease;
}

.page-dogcare-article .dc-also-like-link:hover {
  opacity: 0.82;
}

.page-dogcare-article .dc-also-like-media {
  position: relative;
  width: 100%;
  margin: 0;
  aspect-ratio: 3 / 2;
  overflow: hidden;
  background: #e4e6e1;
  border: none;
  border-radius: 0;
  box-shadow: none;
}

/* article-template.css の img { height: auto } を打ち消し、3:2枠いっぱいに cover。枠サイズは変えない */
body.page-dogcare-article.page-article .dc-also-like-media img {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center center;
}

.page-dogcare-article .dc-also-like-meta {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 0.55em;
  margin: 14px 0 0;
  padding: 0;
  font-family: var(--font-story-meta, var(--font-page-serif));
  line-height: 1.4;
}

.page-dogcare-article .dc-also-like-category {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--dc-article-ink);
}

.page-dogcare-article .dc-also-like-date {
  font-size: 11px;
  font-weight: 400;
  letter-spacing: 0.06em;
  color: rgba(26, 24, 22, 0.58);
}

.page-dogcare-article .dc-also-like-title {
  margin: 10px 0 0;
  padding: 0;
  font-family: var(--dc-article-font-jp);
  font-size: clamp(14px, 0.3vw + 13px, 16px);
  font-weight: 500;
  line-height: 1.7;
  letter-spacing: 0.03em;
  color: var(--dc-article-ink);
}

/* .page-article footer の margin-top を打ち消し（ベージュ帯防止） */
.page-dogcare-article .site-footer.home-footer {
  margin-top: 0;
}

/* ========== SP（≤768px） ========== */
@media (max-width: 768px) {
  .page-dogcare-article .dc-article-hero {
    aspect-ratio: 4 / 5;
    max-height: none;
    background: transparent;
  }

  .page-dogcare-article .dc-article-hero-media {
    position: absolute;
    inset: 0;
    aspect-ratio: auto;
    min-height: 0;
    max-height: none;
  }

  /* article-template.css の img { height: auto } を打ち消し、HEROを全面カバー */
  body.page-dogcare-article.page-article .dc-article-hero-media .dc-article-media {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center 32%;
  }

  .page-dogcare-article .dc-article-hero-copy {
    justify-content: center;
    padding: 0 var(--dc-article-gutter);
  }

  .page-dogcare-article .dc-article-hero-title {
    font-size: clamp(16px, 4.5vw, 22px);
  }

  .page-dogcare-article .dc-article-hero-lead {
    margin-top: 8px;
    font-size: clamp(10.5px, 2.8vw, 12px);
    line-height: 1.65;
  }

  .page-dogcare-article .dc-article-owner {
    padding-top: 40px;
    padding-bottom: 40px;
  }

  /* 飼主情報・section-001 を section-002 と同じコンテンツ幅に揃える */
  .page-dogcare-article .dc-article-owner-inner,
  .page-dogcare-article .dc-article-intro-inner {
    width: 100%;
    max-width: var(--dc-article-max);
  }

  .page-dogcare-article .dc-article-owner-inner {
    padding: 22px 20px 24px;
  }

  .page-dogcare-article .dc-article-owner-title {
    padding-bottom: 8px;
    font-size: 19px;
    letter-spacing: 0.05em;
  }

  .page-dogcare-article .dc-article-owner-meta {
    padding-top: 8px;
    padding-bottom: 8px;
    font-size: 11px;
    letter-spacing: 0.06em;
  }

  .page-dogcare-article .dc-article-owner-profile {
    margin-top: 10px;
    font-size: 13px;
    line-height: 2.05;
  }

  .page-dogcare-article .dc-article-intro {
    padding-top: 23px;
    padding-bottom: 64px;
  }

  /* flex + stretch によりラベル下線がコンテンツ全幅になる（現行SP見た目を維持） */
  .page-dogcare-article .dc-article-intro-inner {
    display: flex;
    flex-direction: column;
  }

  .page-dogcare-article .dc-article-intro-label {
    margin-bottom: clamp(40px, 10vw, 52px);
    padding-bottom: 3px;
    font-size: 12px;
    letter-spacing: 0.12em;
  }

  .page-dogcare-article .dc-article-intro-heading {
    max-width: none;
    margin-bottom: clamp(44px, 11vw, 60px);
    font-size: clamp(23px, 5.9vw, 29px);
  }

  .page-dogcare-article .dc-article-br-pc {
    display: none;
  }

  .page-dogcare-article .dc-article-br-sp {
    display: block;
  }

  .page-dogcare-article .dc-article-section-inner {
    grid-template-columns: 1fr;
    gap: 0;
  }

  .page-dogcare-article .dc-article-section-image {
    order: 1;
  }

  .page-dogcare-article .dc-article-section-body {
    order: 2;
    padding-left: 0 !important;
    padding-right: 0 !important;
  }

  .page-dogcare-article .dc-article-section-heading {
    margin-top: 52px;
    font-size: 18px;
    margin-bottom: 18px;
    padding-bottom: 16px;
  }

  .page-dogcare-article .dc-article-section-002 .dc-article-section-body,
  .page-dogcare-article .dc-article-section-003 .dc-article-section-body,
  .page-dogcare-article .dc-article-section-004 .dc-article-section-body {
    padding-bottom: 64px;
  }

  .page-dogcare-article .dc-article-section-005 {
    padding-bottom: 80px;
  }

  .page-dogcare-article .dc-article-section-005 .dc-article-section-image .dc-article-figure--landscape {
    aspect-ratio: 4 / 5;
  }

  .page-dogcare-article .dc-article-editors-note {
    padding-top: 120px;
    padding-bottom: 190px;
    padding-left: 22px;
    padding-right: 22px;
    min-height: 0;
    box-sizing: border-box;
    background-image: url("assets/img/background/editors-note-014.png");
    background-repeat: no-repeat;
    background-position: center bottom;
    background-size: cover;
    background-origin: border-box;
    background-clip: border-box;
    /* 正方形画像の下端までセクションを伸ばす。幅より高いときは中身の高さに従う */
    container-type: inline-size;
    display: grid;
  }

  .page-dogcare-article .dc-article-editors-note::before {
    content: "";
    grid-area: 1 / 1;
    width: 100%;
    /* border-box を幅と同じにする。padding 120+190 と左右 22+22 の差 */
    height: calc(100cqw - 266px);
    min-height: 0;
    pointer-events: none;
  }

  .page-dogcare-article .dc-article-editors-note-inner {
    grid-area: 1 / 1;
    align-self: start;
    grid-template-columns: 1fr;
    gap: 34px;
    margin-top: 0;
    transform: translateY(-12px);
  }

  .page-dogcare-article .dc-article-editors-note-body {
    padding-right: 0;
    box-sizing: border-box;
  }

  .page-dogcare-article .dc-article-editors-note-deco {
    right: var(--dc-article-gutter);
    bottom: 40px;
    width: clamp(154px, 45vw, 177px);
    max-width: 52%;
    opacity: 0.68;
  }

  .page-dogcare-article .dc-also-like-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 28px 14px;
  }

  .page-dogcare-article .dc-also-like-meta {
    margin-top: 10px;
    gap: 0.4em;
  }

  .page-dogcare-article .dc-also-like-category,
  .page-dogcare-article .dc-also-like-date {
    font-size: 10px;
  }

  .page-dogcare-article .dc-also-like-title {
    margin-top: 8px;
    font-size: 13px;
    line-height: 1.55;
  }
}

/* /HOME HERO 白系 完成固定 */

/* サイト内検索（.site-search のみ。既存ページのセレクタは変更しない） */
.site-search[hidden] {
  display: none;
}

.site-search:not([hidden]) {
  position: fixed;
  inset: 0;
  z-index: 400;
  display: flex;
  justify-content: center;
  box-sizing: border-box;
  padding: 28px 32px 48px;
  overflow: auto;
  background: #f7f4ee;
  color: #1c1814;
  font-family: var(--font-page-serif);
  -webkit-overflow-scrolling: touch;
}

.site-search__panel {
  width: min(860px, 100%);
  margin: 0 auto;
  box-sizing: border-box;
}

.site-search__head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 24px;
  padding-bottom: 22px;
  border-bottom: 1px solid rgba(150, 132, 110, 0.36);
}

.site-search__eyebrow {
  margin: 0;
  font-family: var(--font-logo-eyebrow);
  font-size: 12px;
  font-weight: 400;
  letter-spacing: 0.28em;
  color: rgba(74, 64, 52, 0.72);
}

.site-search__lead {
  margin: 10px 0 0;
  font-size: 22px;
  font-weight: 500;
  line-height: 1.5;
  letter-spacing: 0.04em;
}

.site-search__close {
  flex: 0 0 auto;
  margin: 0;
  padding: 8px 14px;
  border: 1px solid rgba(150, 132, 110, 0.45);
  background: transparent;
  color: #1c1814;
  font-family: inherit;
  font-size: 13px;
  letter-spacing: 0.08em;
  line-height: 1;
  cursor: pointer;
}

.site-search__close:hover,
.site-search__close:focus-visible {
  background: rgba(255, 252, 247, 0.72);
}

.site-search__form {
  margin-top: 28px;
}

.site-search__label {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.site-search__input {
  display: block;
  width: 100%;
  box-sizing: border-box;
  margin: 0;
  padding: 14px 2px 12px;
  border: 0;
  border-bottom: 1px solid rgba(150, 132, 110, 0.55);
  border-radius: 0;
  background: transparent;
  color: #1c1814;
  font-family: inherit;
  font-size: 18px;
  line-height: 1.6;
  letter-spacing: 0.04em;
  outline: none;
}

.site-search__input::placeholder {
  color: rgba(74, 64, 52, 0.45);
}

.site-search__input:focus {
  border-bottom-color: #1c1814;
}

.site-search__status {
  margin: 22px 0 0;
  font-size: 14px;
  line-height: 1.7;
  letter-spacing: 0.04em;
  color: rgba(44, 38, 30, 0.72);
}

.site-search__results {
  margin: 8px 0 0;
  padding: 0;
}

.site-search__card {
  display: grid;
  grid-template-columns: 148px minmax(0, 1fr);
  gap: 20px;
  align-items: center;
  padding: 18px 0;
  border-bottom: 1px solid rgba(150, 132, 110, 0.28);
  color: inherit;
  text-decoration: none;
}

.site-search__card:hover .site-search__title,
.site-search__card:focus-visible .site-search__title {
  text-decoration: underline;
  text-underline-offset: 0.18em;
}

.site-search__thumb {
  display: block;
  aspect-ratio: 3 / 2;
  overflow: hidden;
  background: #ebe6dc;
}

.site-search__thumb img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.site-search__category {
  display: block;
  font-family: var(--font-logo-eyebrow);
  font-size: 11px;
  letter-spacing: 0.16em;
  color: rgba(74, 64, 52, 0.72);
}

.site-search__title {
  display: block;
  margin-top: 8px;
  font-size: 18px;
  font-weight: 500;
  line-height: 1.55;
  letter-spacing: 0.03em;
}

.site-search__shop {
  display: block;
  margin-top: 8px;
  font-size: 13px;
  line-height: 1.6;
  letter-spacing: 0.04em;
  color: rgba(44, 38, 30, 0.72);
}

@media (max-width: 768px) {
  .site-search:not([hidden]) {
    padding: 18px 16px 32px;
  }

  .site-search__head {
    gap: 12px;
    padding-bottom: 16px;
  }

  .site-search__lead {
    font-size: 18px;
  }

  .site-search__close {
    padding: 8px 10px;
    font-size: 12px;
  }

  .site-search__form {
    margin-top: 20px;
  }

  .site-search__input {
    font-size: 16px;
    padding-top: 12px;
  }

  .site-search__status {
    margin-top: 16px;
    font-size: 13px;
  }

  .site-search__card {
    grid-template-columns: 96px minmax(0, 1fr);
    gap: 12px;
    padding: 14px 0;
  }

  .site-search__title {
    margin-top: 6px;
    font-size: 15px;
  }

  .site-search__shop {
    margin-top: 6px;
    font-size: 12px;
  }
}