/*
Theme Name: SHINDOU PRESS
Theme URI: https://shindou.press
Description: Newspaper-style cinematic blog theme. Site title & tagline are customizable. Left header edition text is customizable via Customizer. Mobile menu is hamburger-style.
Version: 1.4
Author: Okamoto
*/

body { background:#f5f5f5; color:#111; font-family: "Noto Serif JP", "Hiragino Mincho ProN", "Yu Mincho", serif; line-height:1.7; }
a { color:inherit; text-decoration:none; }
img { max-width:100%; height:auto; display:block; }

.page-wrap{ max-width:1120px; margin:0 auto; padding:16px; }

/* header */
.header{ border:2px solid #000; padding:12px 16px; background:#fff;
  display:grid; grid-template-columns:1.5fr 1fr 1.5fr; gap:8px; align-items:center; }
.header-left{ font-family:sans-serif; font-size:11px; letter-spacing:0.15em; }
.header-center{ text-align:center; }
.site-title{ font-family:sans-serif; font-weight:800; letter-spacing:0.18em; font-size:18px; text-transform:uppercase; }
.site-title a{ text-decoration:none; }
.site-sub{ font-size:10px; letter-spacing:0.24em; margin-top:2px; }
.header-right{ text-align:right; display:flex; flex-direction:column; align-items:flex-end; gap:4px; }
.menu-toggle{ display:none; font-family:sans-serif; font-size:11px; letter-spacing:0.16em; text-transform:uppercase; padding:4px 8px; border:1px solid #000; background:#fff; cursor:pointer; }
.header-nav{ display:flex; gap:12px; justify-content:flex-end; font-family:sans-serif; font-size:11px; letter-spacing:0.16em; text-transform:uppercase; }
.header-nav li{ list-style:none; }
.header-nav a{ border-bottom:1px solid transparent; padding-bottom:2px; }
.header-nav a:hover{ border-color:#000; }
.divider{ border-top:1px solid #000; margin:8px 0 16px; }

@media (max-width:900px){
  .header{ grid-template-columns:1fr; text-align:center; }
  .header-left{ order:2; text-align:center; }
  .header-center{ order:1; }
  .header-right{ order:3; align-items:center; }
  .menu-toggle{ display:inline-block; }
  .header-nav{ display:none; flex-direction:column; gap:6px; align-items:center; margin-top:4px; }
  .header-nav.is-open{ display:flex; }
}

/* index layout */
.main-grid{ display:grid; grid-template-columns:2.2fr 1.3fr; gap:20px; margin-bottom:32px; }
@media (max-width:900px){ .main-grid{ grid-template-columns:1fr; } }

.lead-article{ background:#fff; border:1px solid #ccc; padding:16px; display:flex; flex-direction:column; gap:12px; }
.label-section{ font-family:sans-serif; font-size:11px; letter-spacing:0.18em; color:#666; text-transform:uppercase; }
.lead-headline{ font-size:24px; font-weight:700; letter-spacing:0.08em; border-bottom:1px solid #ddd; padding-bottom:8px; margin-bottom:4px; }
.lead-meta{ font-family:sans-serif; font-size:11px; color:#666; display:flex; flex-wrap:wrap; gap:12px; }
.lead-thumbnail{ margin-top:8px; border:1px solid #ddd; background:#000; overflow:hidden; }
.lead-excerpt{ font-size:14px; color:#222; margin-top:8px; }
.lead-footer{ margin-top:auto; display:flex; justify-content:space-between; align-items:center; font-family:sans-serif; font-size:11px; color:#666; border-top:1px dotted #ccc; padding-top:8px; }
.read-more-link{ font-size:11px; letter-spacing:0.18em; text-transform:uppercase; border-bottom:1px solid #000; padding-bottom:2px; }

/* side */
.side-list{ display:flex; flex-direction:column; gap:12px; }
.side-article{ background:#fff; border:1px solid #ccc; padding:12px; display:grid; grid-template-columns:1.1fr 1.4fr; gap:8px; }
.side-thumb{ border:1px solid #ddd; background:#000; overflow:hidden; }
.side-content{ display:flex; flex-direction:column; gap:4px; }
.side-meta{ font-family:sans-serif; font-size:10px; color:#666; }
.side-title{ font-size:13px; font-weight:600; }
.side-excerpt{ font-size:11px; color:#222; }

@media(max-width:640px){
  .side-article{ grid-template-columns:1fr; }
}

/* more stories */
.more-section-title{ font-family:sans-serif; font-size:11px; letter-spacing:0.2em; text-transform:uppercase; border-top:2px solid #000; border-bottom:1px solid #000; padding:6px 2px; margin-bottom:12px; }
.more-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:14px; }
@media(max-width:900px){ .more-grid{ grid-template-columns:repeat(2,1fr); } }
@media(max-width:640px){ .more-grid{ grid-template-columns:1fr; } }
.post-card{ background:#fff; border:1px solid #ccc; padding:10px; display:flex; flex-direction:column; gap:6px; }
.post-thumb{ border:1px solid #ddd; background:#000; margin-bottom:4px; overflow:hidden; }
.post-meta{ font-family:sans-serif; font-size:10px; color:#666; }
.post-title{ font-size:13px; font-weight:600; }
.post-excerpt{ font-size:11px; color:#222; }

/* footer */
.footer{ margin-top:32px; border-top:2px solid #000; padding-top:12px; font-family:sans-serif; font-size:10px; color:#666; display:flex; justify-content:space-between; gap:8px; flex-wrap:wrap; }
.footer-links{ display:flex; gap:12px; flex-wrap:wrap; }
.footer-links a{ border-bottom:1px solid transparent; }
.footer-links a:hover{ border-color:#000; }

/* single */
.single-article{ background:#fff; border:1px solid #ccc; padding:24px 20px 32px; max-width:760px; margin:0 auto 40px; }
.article-meta{ font-family:sans-serif; font-size:11px; color:#666; display:flex; flex-wrap:wrap; gap:12px; margin-bottom:8px; }
.article-title{ font-size:24px; line-height:1.5; font-weight:700; letter-spacing:0.08em; border-bottom:1px solid #ddd; padding-bottom:8px; margin-bottom:12px; }
.hero-media{ margin:16px 0 8px; border:1px solid #ddd; background:#000; overflow:hidden; }
.article-body{ margin-top:16px; font-size:14px; color:#222; }
.article-body p{ margin-bottom:14px; }
.article-body h2{ font-size:18px; margin:20px 0 8px; padding-top:4px; border-top:1px solid #ddd; }
.article-body h3{ font-size:15px; margin:16px 0 6px; }
.article-footer{ border-top:1px dotted #ccc; margin-top:24px; padding-top:10px; font-family:sans-serif; font-size:11px; color:#666; display:flex; justify-content:space-between; gap:8px; flex-wrap:wrap; }
.tag-list{ display:flex; flex-wrap:wrap; gap:6px; }
.tag{ border:1px solid #ccc; padding:2px 6px; font-size:10px; }
.back-link{ margin-top:16px; font-family:sans-serif; font-size:11px; letter-spacing:0.14em; text-transform:uppercase; border-bottom:1px solid #000; display:inline-block; padding-bottom:2px; }

/* archive */
.archive-wrap{ background:#fff; border:1px solid #ccc; padding:20px; }
.archive-header{ border-bottom:1px solid #ddd; margin-bottom:14px; padding-bottom:6px; }
.archive-title{ font-size:18px; letter-spacing:0.08em; }
.archive-desc{ font-size:12px; color:#666; margin-top:4px; }
.archive-list{ display:flex; flex-direction:column; gap:14px; margin-top:12px; }
.archive-item{ display:grid; grid-template-columns:1.1fr 2fr; gap:10px; border-bottom:1px dotted #ddd; padding-bottom:10px; }
.archive-thumb{ border:1px solid #ddd; background:#000; overflow:hidden; }
.archive-content{ display:flex; flex-direction:column; gap:4px; }
.archive-meta{ font-family:sans-serif; font-size:11px; color:#666; display:flex; flex-wrap:wrap; gap:8px; }
.archive-item-title{ font-size:15px; font-weight:600; }
.archive-excerpt{ font-size:12px; color:#222; }
.archive-pager{ margin-top:16px; font-family:sans-serif; font-size:12px; }
@media(max-width:640px){
  .archive-item{ grid-template-columns:1fr; }
}

/* page */
.page-plain{ background:#fff; border:1px solid #ccc; padding:24px 20px 32px; max-width:760px; margin:0 auto 40px; }
.page-title{ font-size:22px; border-bottom:1px solid #ddd; padding-bottom:8px; margin-bottom:12px; }
.page-body{ font-size:14px; color:#222; }