/* ===== روناس | صفحهٔ مقاله (/blog/{slug}) =====
   تکمیل‌کنندهٔ ronas.css و ronas-pages.css؛ تایپوگرافی متنی که در پنل با ویرایشگر نوشته می‌شود. */

/* ---------- سربرگ ---------- */
.rn-article-head h1{font-size:clamp(22px,3.2vw,34px);line-height:1.75}
.rn-article-head .rn-ph-kicker{color:var(--c,var(--rn-primary))}
.rn-article-meta{display:flex;flex-wrap:wrap;gap:8px 18px;margin-top:18px;position:relative;z-index:1;
  font-size:13px;color:var(--rn-grey);font-weight:700}
.rn-article-meta i{color:var(--rn-primary);margin-inline-end:4px}

/* ---------- بدنهٔ مقاله ---------- */
.rn-article{background:#fff;border-radius:28px;box-shadow:0 10px 30px -18px rgba(15,61,62,.25);
  padding:clamp(18px,3.4vw,40px)}
.rn-article-cover{margin:0 0 26px;border-radius:20px;overflow:hidden;aspect-ratio:16/9;background:var(--rn-primary-soft)}
.rn-article-cover img{width:100%;height:100%;object-fit:cover;display:block}

.rn-article-body{font-size:16px;line-height:2.25;color:var(--rn-ink);overflow-wrap:anywhere}
.rn-article-body > :first-child{margin-top:0}
.rn-article-body p{margin:0 0 1.15em}
.rn-article-body h2{font-size:clamp(19px,2.3vw,23px);font-weight:900;color:var(--rn-festival);
  margin:1.9em 0 .7em;display:flex;align-items:center;gap:10px;line-height:1.7}
.rn-article-body h2::before{content:"";width:4px;height:26px;border-radius:3px;background:var(--rn-primary-strong);flex:none}
.rn-article-body h3{font-size:18px;font-weight:800;color:var(--rn-festival);margin:1.6em 0 .6em}
.rn-article-body h4{font-size:16px;font-weight:800;margin:1.4em 0 .5em}
.rn-article-body a{color:var(--rn-primary);font-weight:700;text-decoration:underline;text-underline-offset:4px}
.rn-article-body a:hover{color:var(--rn-pink)}
.rn-article-body ul,.rn-article-body ol{padding-inline-start:1.4em;margin:0 0 1.2em}
.rn-article-body li{margin-bottom:.45em}
.rn-article-body li::marker{color:var(--rn-primary);font-weight:800}
.rn-article-body strong,.rn-article-body b{color:var(--rn-festival);font-weight:800}
.rn-article-body blockquote{margin:1.6em 0;padding:16px 22px;border-inline-start:4px solid var(--rn-pink);
  background:var(--rn-pink-soft);border-radius:14px;color:var(--rn-ink)}
.rn-article-body blockquote p:last-child{margin-bottom:0}
.rn-article-body img{max-width:100%;height:auto;border-radius:16px}
.rn-article-body figure{margin:1.6em 0;text-align:center}
.rn-article-body figcaption{font-size:13px;color:var(--rn-grey);margin-top:8px}
.rn-article-body table{width:100%;border-collapse:separate;border-spacing:0;margin:1.4em 0;font-size:14px;
  border:1px solid var(--rn-primary-border);border-radius:14px;overflow:hidden;display:block;overflow-x:auto}
.rn-article-body th{background:var(--rn-primary-soft);color:var(--rn-festival);font-weight:800}
.rn-article-body th,.rn-article-body td{padding:10px 14px;border-bottom:1px solid var(--rn-primary-border);text-align:start}
.rn-article-body tr:last-child td{border-bottom:none}
.rn-article-body hr{border:0;border-top:1px dashed var(--rn-primary-border);margin:2em 0;opacity:1}

.rn-article-note{display:flex;gap:10px;align-items:flex-start;margin-top:28px;padding:14px 16px;border-radius:14px;
  background:var(--rn-primary-soft);color:var(--rn-ink);font-size:13px;line-height:2}
.rn-article-note i{color:var(--rn-primary);font-size:17px;line-height:1.6}

/* ---------- ستون کناری ---------- */
.rn-article-aside{position:sticky;top:96px;display:grid;gap:16px}
.rn-article-cta{border-radius:24px;padding:24px;color:#fff;
  background:radial-gradient(320px 220px at 85% 0%,rgba(255,0,102,.28),transparent 60%),linear-gradient(160deg,#1f908c,#0f3d3e)}
.rn-article-cta b{display:block;font-size:17px;font-weight:900;margin:6px 0 8px}
.rn-article-cta p{font-size:13px;line-height:2;opacity:.85;margin-bottom:16px}
.rn-article-cta .spark{color:#ffd0e2}
.rn-article-related-mini{background:#fff;border-radius:24px;padding:20px;box-shadow:0 10px 30px -18px rgba(15,61,62,.25)}
.rn-article-related-mini a{display:flex;gap:10px;align-items:flex-start;padding:10px 0;text-decoration:none;
  color:var(--rn-ink);font-weight:700;font-size:13.5px;line-height:1.9;border-top:1px dashed var(--rn-line)}
.rn-article-related-mini a:first-of-type{border-top:none}
.rn-article-related-mini a:hover{color:var(--rn-primary)}
.rn-article-related-mini .dot{width:9px;height:9px;border-radius:50%;flex:none;margin-top:9px}
.rn-article-related-mini small{display:block;color:var(--rn-grey);font-weight:500;font-size:11.5px}

@media (max-width:991.98px){
  .rn-article-aside{position:static}
}