/*
Theme Name: Dental Media
Theme URI: https://example.com/dental-media
Description: 歯科情報メディア（村井亮介 院長監修）のブロックテーマ。CPT column を /symptom/ /treatment/ /cost/ /about/ で表示し、情報ポータルのトップ・監修者ボックス・パンくずを備える。CTA・予約・医院情報は含まない（開業時に追加）。
Author: Dental Media
Version: 0.1.0
Requires at least: 6.4
Tested up to: 6.5
Requires PHP: 7.4
License: GPL-2.0-or-later
Text Domain: dental-media
*/

/* 可視パンくず・戻りリンク（mu-plugin が出力するHTMLに対応） */
.dmc-breadcrumb { font-size: .82rem; color: #5b6b7b; margin: 0 0 1.2rem; }
.dmc-breadcrumb a { color: #1c6ea4; text-decoration: none; }
.dmc-breadcrumb a:hover { text-decoration: underline; }
.dmc-breadcrumb .sep { color: #aab4be; margin: 0 .15rem; }
.dmc-back { margin-top: 2.4rem; padding-top: 1rem; border-top: 1px solid #e6ebf0; font-size: .95rem; }

/* トップの症状/治療カード（wp:buttons をカード風に） */
.dmc-cards .wp-block-button__link {
  background: #ffffff; color: #14384f; border: 1px solid #d7e0e8; border-radius: 12px;
  font-weight: 600; padding: .9rem 1.2rem; box-shadow: 0 1px 2px rgba(20,56,79,.04);
}
.dmc-cards .wp-block-button__link:hover { border-color: #1c6ea4; color: #1c6ea4; }

/* 監修者ボックス */
.dmc-reviewer { background: #f3f8fb; border: 1px solid #d7e6f0; border-radius: 12px; padding: 1.4rem 1.6rem; }
.dmc-reviewer strong { color: #14384f; }

/* 記事内画像（全体図・段落イラスト）の表示サイズ制御：大きすぎ防止・中央寄せ */
.entry-content .wp-block-image, .wp-block-image { margin: 1.8rem auto; text-align: center; }
.wp-block-image img { max-width: min(100%, 640px); height: auto; border-radius: 12px; }
.wp-block-image figcaption { font-size: .85rem; color: #5b6b7b; margin-top: .4rem; }
/* アイキャッチ：解説図など全体を見せたいので contain で表示（切れない） */
.wp-block-post-featured-image img, .wp-post-image { width: 100%; max-width: 720px; height: auto; max-height: none; border-radius: 14px; display: block; margin: 0 auto; }

/* よくある質問：Q/A カード */
.dm-faq { display: grid; gap: 14px; margin: 1.4rem 0 2rem; }
.dm-faq-item { background: #f3f8fb; border: 1px solid #e2edf2; border-radius: 14px; padding: 1.1rem 1.3rem; }
.dm-faq-q, .dm-faq-a { display: flex; gap: 12px; align-items: flex-start; }
.dm-faq-a { margin-top: .7rem; padding-top: .7rem; border-top: 1px dashed #d7e6ec; }
.dm-faq-q span, .dm-faq-a span { flex: 0 0 26px; width: 26px; height: 26px; border-radius: 50%; display: grid; place-items: center;
  font-size: .8rem; font-weight: 700; color: #fff; margin-top: .15rem; }
.dm-faq-q span { background: #4FB0C6; }
.dm-faq-a span { background: #9fbfc9; }
.dm-faq-q p { margin: 0; font-weight: 700; color: #14384f; line-height: 1.75; }
.dm-faq-a p { margin: 0; color: #3a5a66; line-height: 1.85; }

/* ===== 記事の読みやすさ（見出し・段落・リスト・余白） ===== */
.dmc-h2 { font-size: 1.45rem; font-weight: 700; color: #14384f; line-height: 1.5;
  margin: 2.8rem 0 .9rem; padding: .15rem 0 .15rem .7rem; border-left: 5px solid #4FB0C6; }
.dmc-h3 { font-size: 1.12rem; font-weight: 700; color: #1c6ea4; line-height: 1.55; margin: 2rem 0 .5rem; }
.wp-block-post-content p, .entry-content p { line-height: 1.95; margin: 0 0 1.15rem; }
.wp-block-post-content ul.wp-block-list, .entry-content ul.wp-block-list {
  background: #f3f8fb; border: 1px solid #e2edf2; border-radius: 10px;
  padding: .9rem 1.1rem .9rem 2.2rem; margin: 1.3rem 0; list-style: disc; }
.wp-block-post-content ul.wp-block-list li, .entry-content ul.wp-block-list li { margin: .4rem 0; line-height: 1.75; }
.wp-block-post-content ol.wp-block-list { padding-left: 2.2rem; margin: 1.3rem 0; }
/* 冒頭の更新日／監修の小メタ行を控えめに（最初の2段落） */
.wp-block-post-content > p:first-of-type { color: #5b6b7b; font-size: .9rem; margin-bottom: .3rem; }

/* 比較表（タイプ別早見表など） */
.wp-block-table.dm-types { margin: 1.6rem 0 2rem; }
.wp-block-table.dm-types table { width: 100%; border-collapse: separate; border-spacing: 0; background: #fff; border: 1px solid #d7e6ec; border-radius: 12px; overflow: hidden; font-size: .92rem; }
.wp-block-table.dm-types th { background: #2c8392; color: #fff; padding: .8rem .7rem; text-align: left; font-weight: 700; font-size: .85rem; letter-spacing: .03em; }
.wp-block-table.dm-types td { padding: .7rem; border-top: 1px solid #e2edf2; color: #3a5a66; line-height: 1.6; vertical-align: top; }
.wp-block-table.dm-types td:first-child { background: #f3f8fb; font-weight: 700; color: #14384f; text-align: center; width: 56px; }
.wp-block-table.dm-types tr:hover td { background: #f7fbfc; }
.wp-block-table.dm-types td:first-child:hover { background: #e8f1f4; }
@media (max-width: 720px) {
  .wp-block-table.dm-types table { font-size: .82rem; }
  .wp-block-table.dm-types th, .wp-block-table.dm-types td { padding: .55rem .45rem; }
}

/* 記事ページ等のヘッダー（フロントページ以外）：ロゴ＋ナビ */
.dm-site-header { background: #ffffff; border-bottom: 1px solid #e6ebf0; }
.dm-site-header-inner { max-width: 1200px; margin: 0 auto; padding: 14px clamp(16px, 4vw, 32px); display: flex; align-items: center; justify-content: space-between; gap: 20px; flex-wrap: wrap; }
.dm-site-logo { display: inline-flex; align-items: center; line-height: 0; }
.dm-site-logo img { height: 38px; width: auto; display: block; }
.dm-site-nav { display: flex; gap: 22px; font-size: .86rem; color: #3a5a66; align-items: center; }
.dm-site-nav a { color: #3a5a66; text-decoration: none; position: relative; padding: 4px 0; }
.dm-site-nav a::after { content: ""; position: absolute; left: 0; bottom: -2px; width: 0; height: 1.5px; background: #2c8392; transition: width .3s ease; }
.dm-site-nav a:hover { color: #134b56; }
.dm-site-nav a:hover::after { width: 100%; }
@media (max-width: 720px) {
  .dm-site-header-inner { padding: 10px 16px; gap: 10px; }
  .dm-site-logo img { height: 30px; }
  .dm-site-nav { width: 100%; gap: 14px; font-size: .78rem; justify-content: space-between; }
}

/* カテゴリ／タクソノミー アーカイブ：カード型 */
.dm-axis-archive { max-width: 1200px; margin: 0 auto; padding-left: clamp(16px, 4vw, 32px); padding-right: clamp(16px, 4vw, 32px); }
.dm-archive-head { margin-bottom: 1.8rem; padding-bottom: 1.2rem; border-bottom: 1px solid #e6ebf0; }
.dm-archive-title { font-size: clamp(1.5rem, 3vw, 2.2rem); font-weight: 700; color: #14384f; margin: .2rem 0 .5rem; line-height: 1.3; }
.dm-archive-desc { color: #5b6b7b; font-size: .95rem; margin: 0; line-height: 1.8; }
.dm-archive-list .wp-block-query > .wp-block-post-template { display: grid; grid-template-columns: repeat(3, 1fr); gap: clamp(16px, 2vw, 24px); padding: 0; margin: 0; list-style: none; }
.dm-archive-list .wp-block-query > .wp-block-post-template > li { list-style: none; margin: 0; padding: 0; }
.dm-archive-card { background: #ffffff; border: 1px solid #e6ebf0; border-radius: 14px; padding: clamp(18px, 1.8vw, 24px); display: flex; flex-direction: column; gap: .55rem; height: 100%; position: relative; overflow: hidden; transition: transform .3s ease, box-shadow .3s ease, border-color .3s ease; }
.dm-archive-card::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 3px; background: #2c8392; transform: scaleY(0); transform-origin: top; transition: transform .4s ease; }
.dm-archive-card:hover { transform: translateY(-3px); border-color: #2c8392; box-shadow: 0 18px 40px -22px rgba(15, 40, 48, .35); }
.dm-archive-card:hover::before { transform: scaleY(1); }
.dm-archive-meta { display: flex !important; align-items: center; gap: .55rem; margin: 0; }
.dm-archive-axis, .dm-archive-axis a { font-family: "Fraunces", Georgia, serif; font-size: .7rem; letter-spacing: .15em; text-transform: uppercase; color: #9c7c41; font-style: italic; text-decoration: none; }
.dm-archive-title-link { margin: 0 !important; font-size: clamp(1rem, 1.4vw, 1.14rem) !important; font-weight: 700 !important; line-height: 1.55 !important; }
.dm-archive-title-link a { color: #14384f; text-decoration: none; background-image: linear-gradient(#2c8392, #2c8392); background-position: 0 100%; background-repeat: no-repeat; background-size: 0 1px; transition: background-size .4s ease; }
.dm-archive-card:hover .dm-archive-title-link a { background-size: 100% 1px; }
.dm-archive-excerpt { margin: 0 !important; font-size: .9rem; line-height: 1.75; color: #3a5a66; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.dm-archive-excerpt p { margin: 0; }
.dm-archive-more { margin: auto 0 0 !important; font-size: .85rem; color: #1d6573; font-weight: 600; display: flex; align-items: center; gap: 6px; padding-top: .3rem; }
.dm-archive-more span { transition: transform .3s ease; }
.dm-archive-card:hover .dm-archive-more span { transform: translateX(4px); }
@media (max-width: 960px) { .dm-archive-list .wp-block-query > .wp-block-post-template { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 600px) { .dm-archive-list .wp-block-query > .wp-block-post-template { grid-template-columns: 1fr; } }

/* 対象エリア・バッジ（記事冒頭・控えめに） */
.dmc-area-badge { display: inline-block; font-size: .82rem; line-height: 1.7; color: #1c6ea4; background: #f3f8fb; border: 1px solid #d7e6f0; border-radius: 999px; padding: .35rem .95rem; margin: 0 0 1.4rem; }
.dmc-area-badge strong { color: #14384f; font-weight: 700; }

/* メタヘッダ（更新日・監修を本文から切り離す） */
.dmc-meta-head { display: flex; flex-wrap: wrap; align-items: center; gap: .55rem 1.4rem; padding: .8rem 1.1rem; margin: 0 0 1.8rem; background: #fbfcfd; border-left: 3px solid #4FB0C6; border-radius: 0 8px 8px 0; }
.dmc-meta-head .dmc-meta-date,
.dmc-meta-head .dmc-meta-sup { font-size: .82rem; color: #5b6b7b; line-height: 1.6; }
.dmc-meta-head .dmc-meta-date::before { content: "🕐 "; opacity: .55; }
.dmc-meta-head .dmc-meta-sup { font-weight: 500; color: #1c6ea4; }
.dmc-meta-head .dmc-meta-sup::before { content: "✓ "; opacity: .8; color: #2c8392; }
@media (max-width: 720px) { .dmc-meta-head { padding: .7rem .85rem; gap: .35rem; flex-direction: column; align-items: flex-start; } .dmc-meta-head .dmc-meta-date, .dmc-meta-head .dmc-meta-sup { font-size: .78rem; } }

/* TL;DR：この記事でわかること */
.dmc-tldr { background: linear-gradient(180deg, #f3f8fb 0%, #fbfcfd 100%); border: 1px solid #d7e6ec; border-radius: 14px; padding: 1.2rem 1.4rem 1.1rem; margin: 0 0 2.2rem; box-shadow: 0 1px 3px rgba(15,40,48,.04); }
.dmc-tldr-label { display: inline-block; font-family: "Fraunces", Georgia, serif; font-size: .72rem; letter-spacing: .15em; text-transform: uppercase; color: #2c8392; background: #fff; border: 1px solid #d7e6ec; border-radius: 999px; padding: .25rem .8rem; margin-bottom: .8rem; font-style: italic; }
.dmc-tldr ul { list-style: none; padding: 0; margin: 0; display: grid; gap: .55rem; }
.dmc-tldr li { position: relative; padding-left: 1.6rem; color: #14384f; font-size: .95rem; line-height: 1.7; font-weight: 500; }
.dmc-tldr li::before { content: ""; position: absolute; left: 0; top: .55em; width: 8px; height: 8px; border-radius: 50%; background: #4FB0C6; box-shadow: 0 0 0 3px rgba(79,176,198,.18); }
@media (max-width: 720px) { .dmc-tldr { padding: 1rem 1.1rem .95rem; border-radius: 12px; } .dmc-tldr li { font-size: .9rem; padding-left: 1.4rem; } }

/* リード段落（記事冒頭フック） */
.dmc-lead { font-size: 1.06rem !important; line-height: 1.95 !important; color: #1c3a4a !important; font-weight: 500 !important; margin: 0 0 1.6rem !important; padding: 0; letter-spacing: .01em; }
.dmc-lead::first-letter { font-size: 1.35em; font-weight: 700; color: #2c8392; padding-right: .04em; }
@media (max-width: 720px) { .dmc-lead { font-size: 1rem !important; line-height: 1.9 !important; } }

/* 記事本文の余白・密度を緩める */
.wp-block-post-content p, .entry-content p { line-height: 2.0; margin: 0 0 1.3rem; color: #1c3a4a; }
.wp-block-post-content .wp-block-image, .entry-content .wp-block-image { margin: 2.2rem auto; }

/* 記事ページの左右余白（モバイルで読みやすく） */
main.wp-block-group { padding-left: clamp(16px, 4vw, 32px); padding-right: clamp(16px, 4vw, 32px); }
@media (max-width: 720px) {
  main.wp-block-group { padding-left: 20px !important; padding-right: 20px !important; }
}