:root {
  --bg: #fbfaf7;
  --surface: #ffffff;
  --text: #24211e;
  --muted: #777069;
  --line: #e5e0da;
  --accent: #75594d;
  --accent-soft: #eee7e1;
  --reading: 720px;
  --wide: 1120px;
  --site: 1180px;
  --header-h: 64px;
  --font-fa: "Vazirmatn", "Vazir", Tahoma, Arial, sans-serif;
}

*,:before,:after { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  direction: rtl;
  background: var(--bg);
  color: var(--text);
  font-family: var(--font-fa);
  font-size: 16px;
  line-height: 2;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
img { max-width: 100%; height: auto; display: block; }
a { color: inherit; text-underline-offset: .22em; }
button,input,textarea,select { font: inherit; }
:focus-visible { outline: 2px solid var(--accent); outline-offset: 4px; }

.site-shell { width: min(calc(100% - 32px), var(--site)); margin-inline: auto; }
.container { width: min(calc(100% - 32px), var(--site)); margin-inline: auto; }
.content-width { width: min(calc(100% - 40px), var(--reading)); margin-inline: auto; }
.section { padding: 64px 0 88px; }
.reading-shell { width: min(calc(100% - 40px), var(--reading)); margin-inline: auto; }
.wide-shell { width: min(calc(100% - 40px), var(--wide)); margin-inline: auto; }
.muted { color: var(--muted); }

.skip-link { position:absolute; top:-100px; inset-inline-start:16px; background:#111; color:#fff; padding:8px 12px; z-index:1000; }
.skip-link:focus { top:16px; }

.site-header {
  position: sticky;
  top: 0;
  z-index: 50;
  background: color-mix(in srgb, var(--bg) 94%, transparent);
  border-bottom: 1px solid var(--line);
  backdrop-filter: blur(12px);
}
.site-header__inner { min-height: var(--header-h); display:flex; align-items:center; justify-content:space-between; gap:24px; }
.site-brand { display:inline-flex; align-items:center; gap:10px; font-weight:600; text-decoration:none; font-size:.95rem; }
.site-brand__mark { width:30px; height:30px; border:1px solid var(--text); display:grid; place-items:center; border-radius:50%; font-size:.62rem; letter-spacing:.03em; font-family:Arial,sans-serif; }
.custom-logo { max-height:34px; width:auto; }
.primary-nav ul { margin:0; padding:0; list-style:none; display:flex; gap:22px; align-items:center; }
.primary-nav a { text-decoration:none; font-size:.9rem; color:#504b46; }
.primary-nav a:hover { color:var(--text); }
.menu-toggle { display:none; width:42px; height:42px; border:0; background:transparent; cursor:pointer; font-size:1.2rem; }

.home-intro { padding: clamp(72px, 11vw, 128px) 0 clamp(64px, 9vw, 104px); }
.eyebrow { margin:0 0 14px; color:var(--accent); font-size:.82rem; font-weight:600; text-decoration:none; }
.home-intro h1 { margin:0; font-size:clamp(2.3rem, 7vw, 4.7rem); line-height:1.14; letter-spacing:-.035em; }
.home-intro__lead { margin:22px 0 0; max-width:38rem; color:#5d5752; font-size:clamp(1.03rem, 2vw, 1.18rem); line-height:2; }
.home-intro__links { margin-top:24px; display:flex; gap:10px; color:var(--muted); font-size:.92rem; }
.home-intro__links a { color:var(--text); }

.home-writing { padding-bottom:80px; }
.section-title-row { display:flex; align-items:baseline; justify-content:space-between; gap:16px; border-bottom:1px solid var(--line); padding-bottom:14px; }
.section-title-row h2 { margin:0; font-size:1.2rem; line-height:1.5; }
.section-title-row a { color:var(--muted); font-size:.88rem; }

.post-stream { border-bottom:1px solid var(--line); }
.post-row { display:flex; gap:22px; align-items:center; padding:24px 0; border-bottom:1px solid var(--line); }
.post-stream .post-row:last-child { border-bottom:0; }
.post-row__content { min-width:0; flex:1; }
.post-row__meta { display:flex; flex-wrap:wrap; gap:6px; align-items:center; color:var(--muted); font-size:.78rem; margin-bottom:7px; }
.post-row__meta a { color:var(--accent); text-decoration:none; }
.post-row__title { margin:0; font-size:clamp(1.02rem, 2.2vw, 1.28rem); line-height:1.65; font-weight:650; }
.post-row__title a { text-decoration:none; }
.post-row__title a:hover { text-decoration:underline; }
.post-row__excerpt { margin:7px 0 0; color:#6a645e; font-size:.9rem; line-height:1.85; max-width:48rem; }
.post-row__media { flex:0 0 128px; width:128px; height:92px; border-radius:8px; overflow:hidden; background:var(--accent-soft); }
.post-row__media img { width:100%; height:100%; object-fit:cover; }

.home-about { padding:0 0 96px; }
.home-about .reading-shell { border-top:1px solid var(--line); padding-top:28px; }
.home-about p { color:var(--muted); margin:0 0 10px; }
.quiet-link { font-weight:600; text-decoration:none; }

.archive-main { padding:72px 0 96px; }
.compact-header { margin-bottom:38px; }
.compact-header h1 { margin:0 0 12px; font-size:clamp(2rem,5vw,3.3rem); line-height:1.2; }
.compact-header p,.archive-description { color:var(--muted); max-width:44rem; }

.breadcrumbs { display:flex; flex-wrap:wrap; gap:6px; color:#928a83; font-size:.76rem; margin-bottom:30px; }
.breadcrumbs a { color:inherit; text-decoration:none; }

.article-header { padding:70px 0 42px; }
.article-header h1 { margin:10px 0 18px; max-width:15ch; font-size:clamp(2.15rem,6.2vw,4.2rem); line-height:1.25; letter-spacing:-.03em; }
.article-lead { margin:0 0 18px; color:#5e5852; font-size:clamp(1.02rem,2vw,1.18rem); line-height:2; max-width:42rem; }
.entry-meta { display:flex; flex-wrap:wrap; gap:8px; color:var(--muted); font-size:.82rem; }
.article-featured { margin-top:0; margin-bottom:54px; }
.article-featured img { width:100%; height:auto; max-height:760px; object-fit:contain; background:#f1ede8; border-radius:10px; }
.article-featured figcaption { margin-top:8px; color:var(--muted); font-size:.78rem; text-align:center; }

.article-body { padding-bottom:58px; }
.prose { font-size:1.04rem; line-height:2.05; }
.prose > * { max-width:100%; }
.prose > * + * { margin-top:1.35em; }
.prose p { margin-bottom:0; }
.prose h2 { margin-top:2.5em; margin-bottom:.6em; font-size:1.55rem; line-height:1.55; letter-spacing:-.01em; }
.prose h3 { margin-top:2.1em; margin-bottom:.55em; font-size:1.25rem; line-height:1.65; }
.prose ul,.prose ol { padding-inline-start:1.35rem; }
.prose li + li { margin-top:.3em; }
.prose blockquote { margin:2em 0; padding:4px 20px 4px 0; border-right:3px solid var(--accent); color:#625c56; font-size:1.04em; }
.prose hr { border:0; border-top:1px solid var(--line); margin:3rem 0; }
.prose table { width:100%; border-collapse:collapse; display:block; overflow-x:auto; font-size:.92rem; }
.prose th,.prose td { border-bottom:1px solid var(--line); padding:10px 12px; text-align:right; }
.prose figure { margin:2.2rem 0; }
.prose figcaption { color:var(--muted); font-size:.8rem; margin-top:.55rem; }
.prose img { border-radius:8px; }
.prose pre { direction:ltr; text-align:left; overflow:auto; padding:16px; border-radius:8px; background:#1f1f1f; color:#f7f7f7; font-size:.9rem; line-height:1.7; }

.article-footer { padding-bottom:90px; }
.share-row { border-top:1px solid var(--line); border-bottom:1px solid var(--line); padding:14px 0; display:flex; flex-wrap:wrap; gap:14px; align-items:center; color:var(--muted); font-size:.82rem; }
.share-row__label { color:var(--text); font-weight:600; }
.share-row button,.share-row a { border:0; background:none; color:inherit; padding:0; cursor:pointer; text-decoration:none; }
.post-nav { margin-top:34px; display:grid; grid-template-columns:1fr 1fr; gap:24px; font-size:.9rem; }
.post-nav a { text-decoration:none; }
.post-nav div:last-child { text-align:left; }

.site-footer { border-top:1px solid var(--line); padding:30px 0; color:var(--muted); font-size:.8rem; }
.site-footer__inner { display:flex; gap:20px; justify-content:space-between; align-items:center; flex-wrap:wrap; }
.site-footer ul { margin:0; padding:0; list-style:none; display:flex; gap:16px; flex-wrap:wrap; }
.site-footer a { color:inherit; text-decoration:none; }

.nav-links { display:flex; justify-content:center; gap:8px; margin-top:34px; }
.page-numbers { min-width:36px; height:36px; display:grid; place-items:center; border-radius:50%; text-decoration:none; }
.page-numbers.current { background:var(--text); color:#fff; }

.screen-reader-text { position:absolute!important; width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0; }

@media (max-width: 767px) {
  :root { --header-h: 58px; }
  body { font-size:16px; line-height:2.05; }
  .site-shell { width:min(calc(100% - 28px), var(--site)); }
  .reading-shell { width:min(calc(100% - 32px), var(--reading)); }
  .wide-shell { width:min(calc(100% - 32px), var(--wide)); }

  .site-brand { font-size:.9rem; }
  .site-brand__mark { width:28px; height:28px; }
  .menu-toggle { display:grid; place-items:center; }
  .primary-nav { display:none; position:absolute; top:calc(var(--header-h) - 1px); inset-inline:14px; background:var(--surface); border:1px solid var(--line); border-radius:10px; padding:8px; box-shadow:0 12px 32px rgba(40,35,30,.08); }
  .primary-nav.is-open { display:block; }
  .primary-nav ul { display:grid; gap:0; }
  .primary-nav a { display:block; padding:10px 12px; min-height:44px; }

  .home-intro { padding:64px 0 58px; }
  .home-intro h1 { font-size:2.55rem; }
  .home-intro__lead { font-size:1rem; line-height:2.05; margin-top:18px; }
  .home-writing { padding-bottom:64px; }
  .post-row { gap:14px; padding:20px 0; align-items:flex-start; }
  .post-row__media { flex-basis:92px; width:92px; height:72px; border-radius:7px; }
  .post-row__title { font-size:1rem; line-height:1.7; }
  .post-row__excerpt { display:none; }
  .post-row__meta { font-size:.73rem; margin-bottom:5px; }
  .home-about { padding-bottom:72px; }

  .archive-main { padding:50px 0 72px; }
  .compact-header { margin-bottom:28px; }
  .compact-header h1 { font-size:2.15rem; }

  .article-header { padding:46px 0 30px; }
  .article-header h1 { max-width:none; font-size:2.05rem; line-height:1.42; margin:8px 0 14px; }
  .article-lead { font-size:1rem; line-height:2; }
  .article-featured { width:100%; margin-bottom:36px; }
  .article-featured img { width:100%; max-height:none; border-radius:0; object-fit:contain; background:#f1ede8; }
  .article-featured figcaption { padding-inline:16px; }
  .prose { font-size:1rem; line-height:2.05; }
  .prose h2 { font-size:1.35rem; line-height:1.65; margin-top:2.25em; }
  .prose h3 { font-size:1.16rem; }
  .prose blockquote { padding-right:16px; }
  .article-body { padding-bottom:44px; }
  .article-footer { padding-bottom:72px; }
  .post-nav { grid-template-columns:1fr; gap:18px; }
  .post-nav div:last-child { text-align:right; }
  .share-row { gap:12px; }

  .site-footer__inner { align-items:flex-start; flex-direction:column; gap:12px; }
}

@media (min-width: 768px) {
  .post-row__media { transition:transform .18s ease; }
  .post-row:hover .post-row__media { transform:translateY(-2px); }
}

@media (prefers-reduced-motion: reduce) {
  *,*:before,*:after { scroll-behavior:auto!important; transition:none!important; animation:none!important; }
}

.search-form { display:flex; gap:8px; margin-top:22px; }
.search-field { flex:1; min-width:0; min-height:44px; border:1px solid var(--line); background:var(--surface); border-radius:8px; padding:8px 12px; color:var(--text); }
.search-form button { min-height:44px; border:1px solid var(--text); background:var(--text); color:#fff; border-radius:8px; padding:8px 16px; cursor:pointer; }
@media (max-width:767px){ .search-form { flex-direction:column; } }

/* v0.7 — featured-image editorial stream */
.post-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 190px;
  gap: 28px;
  align-items: center;
  padding: 30px 0;
}
.post-row:not(.has-thumbnail) { grid-template-columns: 1fr; }
.post-row__media {
  grid-column: 2;
  grid-row: 1;
  width: 190px;
  aspect-ratio: 3 / 2;
  height: auto;
  border-radius: 10px;
  overflow: hidden;
  background: var(--accent-soft);
  text-decoration: none;
}
.post-row__media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.post-row__content { grid-column: 1; grid-row: 1; }
.page-featured { margin: 26px 0 36px; }
.page-featured img { width:100%; height:auto; max-height:680px; object-fit:contain; border-radius:10px; background:#f1ede8; }
.page-featured figcaption { margin-top:8px; color:var(--muted); font-size:.78rem; text-align:center; }

@media (max-width: 767px) {
  .post-row,
  .post-row.has-thumbnail {
    display: flex;
    flex-direction: column;
    gap: 13px;
    align-items: stretch;
    padding: 24px 0;
  }
  .post-row__media {
    order: 0;
    width: 100%;
    height: auto;
    aspect-ratio: 16 / 10;
    border-radius: 9px;
  }
  .post-row__content { order: 1; width: 100%; }
  .post-row__title { font-size: 1.08rem; line-height: 1.7; }
  .post-row__excerpt { display: block; margin-top: 6px; font-size: .88rem; line-height: 1.85; }
  .page-featured { margin: 20px -16px 30px; }
  .page-featured img { border-radius: 0; max-height:none; }
  .page-featured figcaption { padding-inline:16px; }
}
