/* =========================================================
   Editorial Touch — v1.4 採用デザイン（2026-08-31 本人選定: パターン C）
   style.css の後に読み込む上書き。色は現行の赤黒グレーを維持
   ========================================================= */
:root {
  --font-serif-jp: "Zen Old Mincho", "Hiragino Mincho ProN", "Yu Mincho", serif;
  --font-serif-en: "Cormorant Garamond", Georgia, serif;
  --radius: 0;
}

/* 角丸・影を排してフラットに */
.card, .contact-item, .contact-form, .contact-done, .modal-inner, .yt-list a, .about-photo img, .about-photo-btn img { border-radius: 0 !important; }
.card:hover, .card:focus-visible { box-shadow: none; transform: translateY(-2px); }

/* 見出し・名前をセリフに */
.hero-name.name-switch, .hero-name-jp { font-family: var(--font-serif-jp); font-weight: 500; letter-spacing: -.03em; }
.hero-name .name-face::after { width: .14em; height: .14em; vertical-align: .6em; }
.section-en { font-family: var(--font-serif-en); font-style: italic; font-weight: 400; letter-spacing: -.02em; font-size: clamp(2rem, 4.4vw, 3.2rem); }
.section-en::before { display: none; }
.section-title { border-left: 2px solid var(--red); padding-left: 18px; }
.section-jp { letter-spacing: .3em; text-transform: uppercase; font-size: .68rem; }
.modal-title, .about-name, .contact-done-title, .card-title { font-family: var(--font-serif-jp); font-weight: 500; }
.about-alias, .timeline time, .hero-kicker, .alias-en { font-family: var(--font-serif-en); font-style: italic; font-weight: 400; }
.hero-kicker { font-size: .95rem; letter-spacing: .18em; text-transform: none; }
.loader-name { font-family: var(--font-serif-jp); }

/* グリッドをギャラリー的に（ハアラインの格子） */
.grid { gap: 2px; background: var(--line); border: 1px solid var(--line); }
.grid > li { background: var(--bg); }
.card { border: 0; background: var(--bg); }
.card-media img { filter: grayscale(.3) brightness(.92); }
.card:hover .card-media img { filter: none; }
.yt-list { gap: 2px; background: var(--line); border: 1px solid var(--line); }
.yt-list a { border: 0; }

/* ボタン・タブをピルに */
.btn { border-radius: 9999px; letter-spacing: .14em; font-size: .8rem; text-transform: uppercase; }
.btn-primary { background: #fff; color: #000; }
.btn-primary:hover { background: var(--red); color: #fff; }
.tab[aria-selected="true"] { background: #fff; border-color: #fff; color: #000; }

/* 余白を広く・本文を少し小さく端正に */
.section { padding: 110px var(--gutter); }
body { font-size: 14px; letter-spacing: -.01em; }
.about-photo img { filter: grayscale(1) contrast(1.05); }
.about-photo-btn:hover img { filter: grayscale(.2); }

/* ヒーローの帯・スクロールインジケータを控えめに */
.hero-shade::after { width: 1px; }
.hero-now { border-radius: 0; }

/* ---------- タグフィルタ: 非該当カードのグレーアウト（クリックは可能） ---------- */
.grid > li.is-dim .card { opacity: .32; }
.grid > li.is-dim .card-media img { filter: grayscale(1) brightness(.55); }
.grid > li.is-dim .card .chip { opacity: .5; }
.grid > li.is-dim .card:hover, .grid > li.is-dim .card:focus-visible { opacity: .85; transform: translateY(-2px); }
.grid > li.is-dim .card:hover .card-media img { filter: grayscale(.4) brightness(.85); }
.grid > li .card, .grid > li .card-media img { transition: opacity .45s cubic-bezier(.2,.7,.2,1), filter .45s cubic-bezier(.2,.7,.2,1), transform .35s cubic-bezier(.2,.7,.2,1); }

/* モーダル内テキストリンク */
.modal-detail a { color: var(--red-2); border-bottom: 1px solid var(--red); }
.modal-detail a:hover { color: #fff; text-decoration: none; }
