/* Google Fonts */
@import url('https://fonts.googleapis.com/css2?family=Bodoni+Moda:ital,opsz,wght@0,6..96,400..900;1,6..96,400..900&family=Noto+Sans+JP:wght@100;400;700&family=Noto+Serif+JP:wght@400;700&display=swap');

/* ===== 1. 全体レイアウト ===== */
main, header, header > div, footer, 
article, .nested-links, .site-header-inner,
section.w-100, .relative.w-100,
[class*="ph"], [class*="pa"] {
  max-width: 520px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  width: 100% !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  display: block !important;
}

body {
  background-color: #93a4ae !important;
  color: #000000 !important;
  font-family: "Noto Serif JP", serif;
  font-size: 20px;
  line-height: 1.9;
  margin: 0;
}

/* ===== 2. ヘッダー & 3. ナビゲーション ===== */
header { padding: 40px 0 20px 0 !important; }
.site-title {
  font-family: "Bodoni Moda", serif !important;
  font-style: italic !important;
  font-weight: 400 !important;
  font-size: 42px !important;
  color: #c1d4cc !important;
  text-decoration: none !important;
  display: inline-block !important;
  margin-left: -45px !important; 
  padding-left: 0 !important;
}
.top-nav-grid {
  display: flex !important;
  justify-content: flex-end !important;
  gap: 3rem !important;
  padding-right: 0.2rem !important;
  margin-top: 5px !important;
}
.nav-link {
  font-family: "Noto Serif JP", serif !important;
  font-size: 18px !important;
  color: rgba(0, 0, 0, 0.8) !important;
  text-decoration: none !important;
}

/* ===== 4. 記事見出し（日付とタイトルの個別指定） ===== */
h1, h2, h3, .post-title {
  margin: 0 !important;
  padding: 0 !important;
  display: flex !important;        /* 横並びにする */
  flex-direction:column !important;
  align-items: baseline !important; /* 下端を揃える */
  flex-wrap: wrap !important;      /* スマホで溢れないように */
}

/* タイトル部分 */
.post-title a, body.single h1.post-title {
  font-family: "Noto Serif JP", serif !important;
  font-style: normal !important;
  font-size: 21px !important;
  font-weight: 400 !important;
  color: #000000 !important;
  text-decoration: none !important;
  line-height: 1.1 !important;
}

/* 日付部分（span要素への別指定） */
.post-title span.mr3 {
  font-family: Georgia, serif !important; 
  font-weight: 400 !important;
  font-size: 25px !important;
  font-style: italic !important;   
  color: #000000 !important;        
  margin-right: 1rem !important;
  flex-shrink: 0 !important;
}

body:not(.single) .post-title {
  font-size: 27px !important;
  margin-bottom: 1.5rem !important; /* 被らないように適切な余白を */
}

body.single h1.post-title {
  font-size: 97px !important;
  word-break: break-all;
}

/* ===== 5. 本文・コンテンツ ===== */
.post-content p, article p, .nested-copy-line-height p {
  font-family: "Noto Serif JP", serif !important; /* Zineなら明朝体でしょ！ */
  font-size: 20px !important;
  text-align: left !important;
  margin: 1rem 0 5.8rem 0 !important;
  padding: 0 !important;
}

/* ===== 6. アーカイブ & プロフィール共通 ===== */
.archive-header, .profile-header {
  text-align: right !important;
  margin-top: -2.3rem !important; 
  margin-bottom: 0 !important;
  padding-right: 1.5rem !important;
}

.archive-title-small, .profile-title-small {
  font-family: "Noto Serif JP", serif !important;
  font-style: normal !important;
  font-size: 17px !important; 
  color: #000000 !important;
  letter-spacing: 0.1em !important;
  margin-bottom: 1.5rem !important;
  display: inline-block !important;
}

.month-label {
  font-family: Georgia, serif !important;
  font-style: italic;
  font-size: 1.5rem;
  color: #c1d4cc !important;
  border-left: 2px solid #c1d4cc;
  padding-left: 20px !important;
  margin: 1.5rem 0 1rem !important; 
  display: block !important;
}

.archive-list ul, .archive-list li {
  list-style: none !important;
  padding: 0 !important;
  margin: 0 !important;
}

.archive-list a {
  font-family: "Noto Serif JP", serif !important;
  font-style: normal !important;
  color: #000000 !important;
  text-decoration: none !important;
  font-weight: 400 !important;
  font-size: 20px !important; 
  padding-left: 19px !important;
  display: inline-block;
  transition: color 0.3s;
}
.archive-list a:hover { color: #c1d4cc !important; }

/* ===== 7. レスポンシブ調整 ===== */
@media (max-width: 920px) {
  main, header, footer, .top-nav-grid { 
    padding-left: 0px !important; 
    padding-right: 0px !important; 
    box-sizing: border-box !important;
  }
  article, .post-title, p, .site-title {
    padding-left: 0 !important;
    margin-left: 0 !important;
  }
}

/* ===== 9. 画像のレスポンシブ設定 (追記) ===== */
img {
  max-width: 100% !important;
  height: auto !important;
  display: block !important;
  margin: 2rem auto !important; /* 記事の幅に合わせ、上下に余白をプラス */
}

/* ===== 8. 不要要素の抹殺 & フッター ===== */
/* .post-date と .silver は消さないようにリストから抜いておいた */
.meta, .f6, .ananke-socials, aside, .more-link, header div.bg-black, .bg-black-60, .black-70 { display: none !important; }
footer { padding: 10rem 0 2rem 0 !important; }
footer p { text-align: right !important; color: #c1d4cc !important; font-size: 14px !important; font-family: "Bodoni Moda", serif; }