/* ============================================================
   Excellia テーマ：WordPress で表示するページ（記事・固定ページ・一覧）
   色・フォント・共通部品は /styles.css の変数とクラスを使う
   ============================================================ */

/* ---- 記事の見出しエリア ---- */
.art-hero { padding:170px 0 64px; }
.art-hero h1 { font-size:clamp(24px,3.6vw,38px); line-height:1.7; letter-spacing:.06em; max-width:880px; }
.art-meta { margin-top:22px; display:flex; flex-wrap:wrap; gap:18px; align-items:baseline;
  font-family:var(--en); font-size:15px; letter-spacing:.08em; color:var(--gold-deep); }
@media (max-width:760px){
  .art-hero { padding:120px 0 44px; }
  .art-hero .crumb { margin-bottom:22px; }
}

/* ---- 本文の枠 ---- */
.article { background:var(--bg); padding:72px 0 96px; }
.art-wrap { max-width:840px; }
.art-thumb { margin:0 0 56px; border-radius:4px; overflow:hidden; border:1px solid var(--hairline); background:var(--card); }
.art-thumb img { width:100%; height:auto; }
@media (max-width:760px){
  .article { padding:40px 0 72px; }
  .art-wrap { padding:0 20px; }
  .art-thumb { margin-bottom:36px; }
}

/* ---- 本文（クラシックエディタのHTML） ---- */
.entry { position:relative; font-size:16px; line-height:2.1; letter-spacing:.04em; color:var(--ink); overflow-wrap:anywhere; }
.entry > *:first-child { margin-top:0; }
.entry p { margin:0 0 1.1em; }
.entry p:empty { display:none; }
.entry strong, .entry b { font-weight:700; }
.entry em { font-style:normal; background:linear-gradient(transparent 62%, rgba(201,169,97,.32) 62%); }
.entry a { color:var(--gold-deep); border-bottom:1px solid var(--line); transition:color .3s, border-color .3s; }
.entry a:hover { color:var(--gold); border-bottom-color:var(--gold); }
.entry a:has(img) { border-bottom:none; }

/* 見出し：h1（本文中に書かれたもの）・h2 は章、h3 は節、h4・h5 は小見出し */
.entry h1, .entry h2 { font-family:var(--serif); font-weight:600; font-size:clamp(21px,2.6vw,27px);
  line-height:1.7; letter-spacing:.06em; margin:2.6em 0 1.1em; padding-top:26px; position:relative; }
.entry h1::before, .entry h2::before { content:''; position:absolute; top:0; left:0; width:48px; height:1px; background:var(--grad-gold); }
.entry h3 { font-family:var(--serif); font-weight:600; font-size:clamp(18px,2.1vw,21px);
  line-height:1.75; letter-spacing:.05em; margin:2.2em 0 .9em; padding-bottom:12px; border-bottom:1px solid var(--hairline); }
.entry h4, .entry h5 { font-family:var(--sans); font-weight:700; font-size:16px; letter-spacing:.08em;
  color:var(--gold-deep); margin:1.9em 0 .7em; }
.entry h2 a, .entry h3 a, .entry h4 a { color:inherit; border-bottom:none; }

/* 目次：「#link00」などページ内リンクの並び */
.entry p > a[href^="#"] { border-bottom:none; }
.entry p > a[href^="#"]:hover { border-bottom:1px solid var(--line); }

/* 余白用の空 div（高さ指定つき）をそろえる */
.entry div[style*="height"]:empty { height:14px !important; }

/* 字下げ（段落の左余白）はスマホで小さく */
@media (max-width:760px){
  .entry [style*="padding-left"] { padding-left:1em !important; }
}

/* 文字色の直接指定：アイボリーの背景で読める色に置き換える */
.entry [style*="#00ffff"], .entry [style*="#00FFFF"], .entry [style*="#ffffff"], .entry [style*="#FFFFFF"], .entry [style*="#fff;"] { color:var(--gold-deep) !important; }
.entry [style*="arial black"] { font-family:inherit !important; }

/* リスト */
.entry ul, .entry ol { margin:0 0 1.6em; padding-left:1.6em; }
.entry ul { list-style:disc; }
.entry ol { list-style:decimal; }
.entry ul[style*="list-style-type"] , .entry ol[style*="list-style-type"] { list-style:revert; }
.entry li { margin:.3em 0; padding-left:.2em; }
.entry li::marker { color:var(--gold); }
.entry li > ul, .entry li > ol { margin:.4em 0 .4em; }

/* 引用 */
.entry blockquote { margin:0 0 1.8em; padding:24px 28px; background:var(--bg-2); border-radius:4px;
  color:#4a4337; font-size:15px; }
.entry blockquote p:last-child { margin-bottom:0; }

/* 区切り線 */
.entry hr { border:none; height:1px; background:var(--hairline); margin:3em 0; }

/* 画像・キャプション */
.entry img { max-width:100%; height:auto; border-radius:3px; }
.entry .aligncenter, .entry img.aligncenter { display:block; margin:2em auto; }
.entry .alignleft { float:left; margin:.4em 1.6em 1em 0; }
.entry .alignright { float:right; margin:.4em 0 1em 1.6em; }
.entry .wp-caption { max-width:100% !important; margin:2em auto; }
.entry .wp-caption-text, .entry figcaption { margin-top:10px; font-size:13px; color:var(--ink-sub); text-align:center; letter-spacing:.06em; }
@media (max-width:760px){
  .entry .alignleft, .entry .alignright { float:none; margin:1.6em auto; display:block; }
}

/* 表：スマホでは横にスクロール */
.entry table { width:100%; border-collapse:collapse; margin:0 0 2em; font-size:14.5px; line-height:1.8;
  background:var(--card); border:1px solid var(--hairline); }
.entry th, .entry td { padding:12px 14px; border:1px solid var(--hairline); vertical-align:top; text-align:left; min-width:5.5em; }
.entry thead th, .entry thead td, .entry th { background:var(--bg-2); font-weight:700; }
.entry table[style*="height"], .entry td[style*="height"], .entry tr[style*="height"] { height:auto !important; }
@media (max-width:760px){
  .entry table { display:block; overflow-x:auto; -webkit-overflow-scrolling:touch; white-space:normal; }
  .entry th, .entry td { min-width:7em; }
}

/* 埋め込み（YouTube・Xなど） */
.entry iframe { max-width:100%; display:block; margin:2em auto; border:0; }
.entry iframe[src*="youtube"], .entry iframe[src*="youtu.be"], .entry iframe[src*="vimeo"] { width:100%; height:auto; aspect-ratio:16/9; }
.entry .wp-embedded-content { width:100% !important; }
.entry .twitter-tweet { margin:2em auto !important; }

/* ---- 前後の記事・一覧へ戻る ---- */
.art-nav { margin-top:72px; display:grid; grid-template-columns:1fr 1fr; gap:18px; border-top:1px solid var(--line); padding-top:36px; }
.art-nav a { display:flex; flex-direction:column; gap:8px; padding:22px 24px; background:var(--card);
  border:1px solid var(--hairline); border-radius:4px; transition:border-color .3s, transform .3s; }
.art-nav a:hover { border-color:var(--line); transform:translateY(-2px); }
.art-nav .next { text-align:right; }
.art-nav .dir { font-family:var(--en); font-style:italic; font-size:13px; letter-spacing:.18em; color:var(--gold); }
.art-nav .t { font-size:14.5px; line-height:1.8; letter-spacing:.03em; }
.art-back { margin-top:44px; text-align:center; }
@media (max-width:760px){
  .art-nav { grid-template-columns:minmax(0,1fr); margin-top:56px; }
  .art-nav .next { text-align:left; }
}


/* ---- 404 ---- */
.art-404 { display:flex; gap:18px; justify-content:center; flex-wrap:wrap; }

/* ---- ログイン中の管理バーとヘッダーが重ならないように ---- */
.admin-bar .header { top:32px; }
@media (max-width:782px){ .admin-bar .header { top:46px; } }

/* ---- 目次（functions.php で「目次」の見出し以降を .entry-toc で囲んでいる） ---- */
.entry .entry-toc { margin:0 0 2.6em; padding:28px 32px 24px; background:var(--card); border:1px solid var(--hairline); border-radius:4px; }
.entry .entry-toc-title { font-family:var(--serif); font-weight:600; font-size:15px; letter-spacing:.2em; color:var(--gold); margin:0 0 14px; }
.entry .entry-toc p { margin:0; font-size:15px; line-height:1.9; }
.entry .entry-toc p + p { margin-top:8px; }
.entry .entry-toc a { color:var(--ink); border-bottom:none; }
.entry .entry-toc a:hover { color:var(--gold-deep); }
.entry .entry-toc [style*="padding-left"] { padding-left:1.2em !important; font-size:14px; color:var(--ink-sub); }
@media (max-width:760px){ .entry .entry-toc { padding:22px 20px 18px; } }

/* 「&nbsp;」だけの段落（functions.php で .entry-gap に置き換え） */
.entry .entry-gap { height:6px; }
.entry .entry-gap + .entry-gap, .entry div[style*="height"]:empty + .entry-gap, .entry .entry-gap + div[style*="height"]:empty { display:none; }

/* ---- 「ページ上部へ戻る」ボタン（VK All in One Expansion Unit）は使わない ---- */
#page_top { display:none !important; }
