/* ============ Blog: shared ============ */
.blog-hero{ max-width:900px; margin:0 auto; padding:64px 24px 20px; text-align:center; }
.blog-hero h1{ font-family:'Fraunces',serif; font-size:clamp(30px,4vw,44px); color:var(--ink); margin:10px 0; }
.blog-hero p{ color:var(--slate); font-size:15.5px; max-width:560px; margin:0 auto; }

.cat-filters{ display:flex; gap:10px; flex-wrap:wrap; justify-content:center; max-width:1100px; margin:22px auto 10px; padding:0 24px; }
.cat-filters a{ font-size:13px; font-weight:600; padding:7px 15px; border-radius:20px; background:var(--paper-2); color:var(--slate); text-decoration:none; border:1px solid transparent; }
.cat-filters a.active, .cat-filters a:hover{ background:var(--stamp-tint); color:var(--stamp); }

.blog-grid{ max-width:1180px; margin:36px auto; padding:0 24px; display:grid; grid-template-columns:repeat(3,1fr); gap:26px; }
@media(max-width:900px){ .blog-grid{grid-template-columns:1fr;} }
.blog-card{ background:var(--paper-2); border-radius:var(--radius,14px); overflow:hidden; display:flex; flex-direction:column; text-decoration:none; color:inherit; transition:transform .15s ease; }
.blog-card:hover{ transform:translateY(-3px); }
.blog-card .thumb{ width:100%; aspect-ratio:16/10; background:var(--ink) center/cover no-repeat; display:flex; align-items:center; justify-content:center; color:#fff; font-family:'Fraunces',serif; font-size:15px; }
.blog-card .body{ padding:20px 22px 24px; display:flex; flex-direction:column; gap:8px; flex:1; }
.blog-card .cat{ font-size:11px; font-weight:700; letter-spacing:.04em; text-transform:uppercase; color:var(--stamp); }
.blog-card h3{ font-family:'Fraunces',serif; font-size:19px; color:var(--ink); margin:0; line-height:1.3; }
.blog-card p{ font-size:13.5px; color:var(--slate); margin:0; line-height:1.55; }
.blog-card .meta{ margin-top:auto; padding-top:10px; font-size:12px; color:var(--slate); display:flex; gap:10px; }
.empty-state{ text-align:center; padding:60px 24px; color:var(--slate); }

/* ============ Single post ============ */
.post-wrap{ max-width:760px; margin:0 auto; padding:50px 24px 10px; }
.post-cat{ color:var(--stamp); font-weight:700; font-size:12.5px; text-transform:uppercase; letter-spacing:.04em; }
.post-title{ font-family:'Fraunces',serif; font-size:clamp(28px,4vw,42px); color:var(--ink); margin:12px 0 16px; line-height:1.2; }
.post-meta{ display:flex; gap:16px; flex-wrap:wrap; color:var(--slate); font-size:13.5px; margin-bottom:26px; }
.post-hero-img{ width:100%; border-radius:var(--radius,14px); margin-bottom:34px; display:block; }
.post-content{ font-size:16.5px; line-height:1.8; color:var(--ink-soft); }
.post-content h2{ font-family:'Fraunces',serif; color:var(--ink); font-size:26px; margin:36px 0 14px; }
.post-content h3{ font-family:'Fraunces',serif; color:var(--ink); font-size:21px; margin:28px 0 12px; }
.post-content p{ margin:0 0 18px; }
.post-content img{ max-width:100%; border-radius:10px; }
.post-content ul, .post-content ol{ margin:0 0 18px; padding-left:22px; }
.post-tags{ display:flex; gap:8px; flex-wrap:wrap; margin:30px 0; }
.post-tags a{ font-size:12px; background:var(--paper-2); color:var(--slate); padding:5px 12px; border-radius:16px; text-decoration:none; }

.share-row{ display:flex; align-items:center; gap:12px; margin:34px 0; padding:20px 0; border-top:1px solid var(--paper-2); border-bottom:1px solid var(--paper-2); }
.share-row span{ font-size:13px; font-weight:700; color:var(--slate); }
.share-btn{ width:36px; height:36px; border-radius:50%; display:flex; align-items:center; justify-content:center; background:var(--paper-2); color:var(--ink); text-decoration:none; font-size:15px; }
.share-btn:hover{ background:var(--stamp); color:#fff; }

.related-wrap{ max-width:1180px; margin:50px auto; padding:0 24px; }
.related-wrap h3{ font-family:'Fraunces',serif; font-size:22px; color:var(--ink); margin-bottom:20px; text-align:center; }

/* ============ Comments ============ */
.comments-wrap{ max-width:760px; margin:20px auto 70px; padding:0 24px; }
.comments-wrap h3{ font-family:'Fraunces',serif; font-size:22px; color:var(--ink); margin-bottom:24px; }
.comment-list{ display:flex; flex-direction:column; gap:18px; margin-bottom:36px; }
.comment-item{ display:flex; gap:14px; background:var(--paper-2); border-radius:12px; padding:18px 20px; }
.comment-num{ flex-shrink:0; width:30px; height:30px; border-radius:50%; background:var(--ink); color:#fff; font-size:12px; font-weight:700; display:flex; align-items:center; justify-content:center; font-family:'IBM Plex Mono',monospace; }
.comment-avatar{ flex-shrink:0; width:38px; height:38px; border-radius:50%; background:var(--stamp); color:#fff; display:flex; align-items:center; justify-content:center; font-weight:700; font-family:'Fraunces',serif; }
.comment-body{ flex:1; }
.comment-head{ display:flex; align-items:baseline; gap:10px; margin-bottom:4px; }
.comment-head .name{ font-weight:700; color:var(--ink); font-size:14.5px; }
.comment-head .time{ font-size:12px; color:var(--slate); }
.comment-body p{ margin:0; font-size:14.5px; color:var(--ink-soft); line-height:1.6; white-space:pre-wrap; }
.no-comments{ color:var(--slate); font-size:14px; padding:14px 0 30px; }

.comment-form{ background:var(--paper-2); border-radius:14px; padding:26px; }
.comment-form label{ display:block; font-size:12.5px; font-weight:700; color:var(--slate); text-transform:uppercase; letter-spacing:.03em; margin:14px 0 6px; }
.comment-form label:first-child{ margin-top:0; }
.comment-form input, .comment-form textarea{ width:100%; box-sizing:border-box; padding:11px 13px; border:1.5px solid #E3DCC8; border-radius:9px; font-family:inherit; font-size:14.5px; background:#fff; }
.comment-form textarea{ resize:vertical; min-height:100px; }
.comment-form button{ margin-top:16px; }
.hp-field{ position:absolute; left:-9999px; }
.form-note{ font-size:12.5px; color:var(--slate); margin-top:10px; }
.flash-ok{ background:var(--success-tint); color:var(--success); border-radius:10px; padding:12px 16px; font-size:13.5px; margin-bottom:18px; }
.flash-err{ background:var(--stamp-tint); color:var(--stamp); border-radius:10px; padding:12px 16px; font-size:13.5px; margin-bottom:18px; }

/* ============ Admin ============ */
.admin-wrap{ max-width:960px; margin:0 auto; padding:50px 24px 90px; }
.admin-bar{ display:flex; align-items:center; justify-content:space-between; margin-bottom:30px; flex-wrap:wrap; gap:12px; }
.admin-bar h1{ font-family:'Fraunces',serif; font-size:26px; color:var(--ink); margin:0; }
.admin-login{ max-width:380px; margin:80px auto; padding:36px; background:var(--paper-2); border-radius:16px; }
.admin-login h2{ font-family:'Fraunces',serif; margin-top:0; }
.admin-table{ width:100%; border-collapse:collapse; background:#fff; border-radius:12px; overflow:hidden; }
.admin-table th, .admin-table td{ text-align:left; padding:13px 16px; font-size:13.5px; border-bottom:1px solid var(--paper-2); }
.admin-table th{ background:var(--paper-2); font-size:11.5px; text-transform:uppercase; letter-spacing:.03em; color:var(--slate); }
.status-pill{ font-size:11px; font-weight:700; padding:3px 10px; border-radius:12px; text-transform:uppercase; }
.status-published{ background:var(--success-tint); color:var(--success); }
.status-draft{ background:var(--paper-2); color:var(--slate); }
.admin-actions a{ font-size:12.5px; font-weight:600; margin-right:12px; color:var(--stamp); text-decoration:none; }
.admin-form{ background:#fff; border-radius:14px; padding:30px; margin-top:10px; }
.admin-form .grid2{ display:grid; grid-template-columns:1fr 1fr; gap:18px; }
@media(max-width:640px){ .admin-form .grid2{grid-template-columns:1fr;} }
.admin-form label{ display:block; font-size:12.5px; font-weight:700; color:var(--slate); text-transform:uppercase; letter-spacing:.03em; margin:16px 0 6px; }
.admin-form label:first-child{ margin-top:0; }
.admin-form input[type=text], .admin-form input[type=email], .admin-form input[type=url], .admin-form textarea, .admin-form select{
  width:100%; box-sizing:border-box; padding:11px 13px; border:1.5px solid #E3DCC8; border-radius:9px; font-family:inherit; font-size:14.5px; background:#fff;
}
.admin-form textarea{ resize:vertical; }
.admin-form .hint{ font-size:12px; color:var(--slate); margin-top:5px; }
.admin-form .btn-row{ margin-top:26px; display:flex; gap:12px; }
.current-thumb{ max-width:220px; border-radius:10px; margin-top:10px; display:block; }
