/* GhelGheli · news hub — بازطراحی ۲۰۲۶ (لید + شبکه + ستون کنار) */
.nhead{position:relative;padding-block:clamp(22px,3.4vw,44px) clamp(10px,1.6vw,18px);border-bottom:1px solid var(--line)}
.nhead__in{display:flex;align-items:flex-end;gap:clamp(14px,3vw,40px);flex-wrap:wrap}
.nhead h1{font-size:clamp(27px,4vw,48px)}
.nhead p{color:var(--muted);font-size:13.6px;margin-top:10px;max-width:62ch;line-height:2}
.nhead .eyebrow{display:inline-flex;align-items:center;gap:7px}
.nhead .dot{width:6px;height:6px;border-radius:50%;background:var(--lime);box-shadow:0 0 0 3px rgba(184,241,74,.15);animation:blip 2s infinite}
.nsearch{display:flex;align-items:center;gap:8px;margin-inline-start:auto;padding:9px 14px;border-radius:var(--r-pill);
  border:1px solid var(--line);background:rgba(255,255,255,.03);color:var(--muted-2);min-width:min(260px,100%)}
.nsearch:focus-within{border-color:rgba(184,241,74,.45);background:rgba(184,241,74,.05);color:var(--lime)}
.nsearch input{flex:1;min-width:0;border:0;background:none;color:var(--txt);font:inherit;font-size:12.6px;outline:none}
.nsearch input::placeholder{color:var(--muted-2)}
.nchips{display:flex;gap:7px;flex-wrap:wrap;margin-top:16px}
.nchip{font-size:11.6px;padding:6px 13px;border-radius:var(--r-pill);border:1px solid var(--line);color:#C7D8C4;transition:.25s var(--ease)}
.nchip:hover{border-color:rgba(184,241,74,.45);color:#fff;background:rgba(184,241,74,.07)}
.nchip[aria-current]{background:var(--lime);color:#081004;border-color:var(--lime);font-variation-settings:"wght" 750}
.nq{margin-top:12px;font-size:12.6px;color:var(--muted)}
.nq b{color:var(--lime)}

/* ── خبر شاخص ── */
.nlead{display:grid;grid-template-columns:1.15fr 1fr;gap:clamp(14px,2.4vw,28px);margin-block:clamp(18px,2.6vw,30px) 6px;
  padding:clamp(10px,1.4vw,14px);border-radius:var(--r-3);border:1px solid var(--line);
  background:linear-gradient(140deg,rgba(184,241,74,.07),rgba(255,255,255,.015) 45%,rgba(255,255,255,.01));
  transition:transform .5s var(--ease),border-color .35s,box-shadow .5s}
.nlead:hover{transform:translateY(-3px);border-color:rgba(184,241,74,.35);box-shadow:0 36px 80px -50px #000}
.nlead__pic{position:relative;display:block;aspect-ratio:16/10;border-radius:calc(var(--r-3) - 10px);overflow:hidden;background:#0B140E}
.nlead__pic img{width:100%;height:100%;object-fit:cover;transition:transform .8s var(--ease)}
.nlead:hover .nlead__pic img{transform:scale(1.04)}
.nlead__badge{position:absolute;top:12px;inset-inline-start:12px;font-size:10.4px;padding:4px 11px;border-radius:var(--r-pill);
  background:var(--lime);color:#081004;font-variation-settings:"wght" 750;box-shadow:0 8px 22px -10px rgba(184,241,74,.9)}
.nlead__body{display:flex;flex-direction:column;justify-content:center;gap:10px;padding:clamp(4px,1vw,14px) clamp(6px,1.4vw,18px) clamp(6px,1.6vw,20px)}
.nlead__cat{font-size:11px;color:var(--lime);font-variation-settings:"wght" 700;letter-spacing:.02em}
.nlead__ttl{font-size:clamp(19px,2.3vw,29px);line-height:1.42;font-variation-settings:"wght" 830;letter-spacing:-.02em;text-wrap:balance}
.nlead__exc{font-size:13.4px;color:var(--muted);line-height:2;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}

/* ── بدنه: شبکه + ستون ── */
.nbody{display:grid;grid-template-columns:minmax(0,1fr) 306px;gap:clamp(16px,2.4vw,30px);padding-block:clamp(18px,2.6vw,30px) 46px}
.ngrid{display:grid;grid-template-columns:repeat(2,1fr);gap:clamp(12px,1.8vw,20px)}
@media (max-width:1080px){.nbody{grid-template-columns:1fr}.nrail{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:14px}}
@media (max-width:980px){.nlead{grid-template-columns:1fr}.ngrid{grid-template-columns:1fr 1fr}}
@media (max-width:640px){.ngrid{grid-template-columns:1fr}.nhead__in{flex-direction:column;align-items:stretch}.nsearch{margin:0}}

/* ── کارت ── */
.ncard{display:grid;grid-template-rows:auto 1fr;overflow:hidden;border-radius:var(--r-2);border:1px solid var(--line);
  background:linear-gradient(180deg,rgba(255,255,255,.035),rgba(255,255,255,.012));
  transition:transform .45s var(--ease),border-color .35s,box-shadow .45s}
.ncard:hover{transform:translateY(-4px);border-color:rgba(184,241,74,.35);box-shadow:0 26px 60px -44px #000}
.ncard__pic{position:relative;display:block;aspect-ratio:16/10;overflow:hidden;background:linear-gradient(110deg,#0B140E,#101B14,#0B140E)}
.ncard__pic img{width:100%;height:100%;object-fit:cover;transition:transform .7s var(--ease)}
.ncard:hover .ncard__pic img{transform:scale(1.055)}
.ncard__cat{position:absolute;top:10px;inset-inline-start:10px;font-size:10.4px;padding:3px 10px;border-radius:var(--r-pill);
  background:rgba(6,11,8,.78);border:1px solid rgba(184,241,74,.35);color:var(--lime);backdrop-filter:blur(6px)}
.ncard__view{position:absolute;inset-inline-end:10px;bottom:10px;display:inline-flex;align-items:center;gap:5px;
  font-size:10.4px;padding:4px 10px;border-radius:var(--r-pill);background:rgba(184,241,74,.92);color:#081004;
  font-variation-settings:"wght" 720;opacity:0;transform:translateY(6px);transition:.35s var(--ease)}
.ncard:hover .ncard__view{opacity:1;transform:none}
.ncard__body{display:grid;align-content:start;gap:7px;padding:14px 15px 16px}
.ncard__body h2{font-size:15.4px;line-height:1.6;font-variation-settings:"wght" 780;text-wrap:pretty}
.ncard__body p{font-size:12.4px;color:var(--muted);line-height:1.95;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.nmeta{display:flex;align-items:center;gap:8px;font-size:10.6px;color:var(--muted-2);margin-top:2px}
.nmeta b{color:#CBDCC8;font-variation-settings:"wght" 650}
.nmeta i{width:3px;height:3px;border-radius:50%;background:var(--muted-2);display:inline-block}
.ntags{display:flex;gap:5px;flex-wrap:wrap;margin-top:3px}
.ntag{font-size:10.2px;color:var(--lime);background:rgba(184,241,74,.09);border:1px solid rgba(184,241,74,.22);
  padding:2px 8px;border-radius:var(--r-pill);transition:.25s}
.ntag:hover{background:rgba(184,241,74,.18);border-color:rgba(184,241,74,.45)}

/* ── ستون کنار ── */
.nrail{display:grid;gap:14px;align-content:start}
.nrail__box{border:1px solid var(--line);border-radius:var(--r-2);padding:15px 15px 13px;
  background:linear-gradient(180deg,rgba(255,255,255,.03),rgba(255,255,255,.008))}
.nrail__box h2{font-size:13px;font-variation-settings:"wght" 780;margin-bottom:11px;display:flex;align-items:center;gap:7px}
.nrail__box h2::before{content:"";width:3px;height:13px;border-radius:2px;background:var(--lime)}
.ntrend{list-style:none;margin:0;padding:0;display:grid;gap:2px;counter-reset:t}
.ntrend li{counter-increment:t}
.ntrend a{display:flex;gap:10px;align-items:flex-start;padding:8px 0;border-top:1px solid var(--line);transition:.25s}
.ntrend li:first-child a{border-top:0}
.ntrend a::before{content:counter(t);font-size:11px;color:var(--lime);font-variation-settings:"wght" 750;
  min-width:15px;line-height:1.7}
.ntrend a:hover span{color:var(--lime)}
.ntrend span{font-size:12.4px;line-height:1.75;color:#D7E4D3;transition:color .25s}
.ntrend small{display:block;font-size:10px;color:var(--muted-2);margin-top:2px;font-weight:400}
.nminilist{display:grid;gap:9px}
.nmini{display:flex;gap:9px;align-items:center;transition:.25s}
.nmini:hover .nmini__body b{color:var(--lime)}
.nmini__pic{width:64px;aspect-ratio:16/11;flex:none;border-radius:9px;overflow:hidden;background:#0B140E}
.nmini__pic img{width:100%;height:100%;object-fit:cover}
.nmini__body{display:grid;gap:3px;min-width:0}
.nmini__body b{font-size:11.8px;line-height:1.6;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;transition:color .25s}
.nmini__body i{font-size:10px;color:var(--muted-2);font-style:normal}
.nrail__cta p{font-size:11.8px;color:var(--muted);line-height:1.9;margin-bottom:11px}

.pager{display:flex;align-items:center;justify-content:center;gap:8px;padding-block:22px 6px}
.pager a,.pager span{font-size:12px;padding:7px 13px;border-radius:10px;border:1px solid var(--line);color:#CADCC6;transition:.25s}
.pager a:hover{border-color:rgba(184,241,74,.45);color:#fff}
.pager span[aria-current]{background:var(--lime);color:#081004;border-color:var(--lime)}
.empty{text-align:center;padding:56px 16px;color:var(--muted);font-size:13.6px}

/* ── مقاله ── */
.article{max-width:820px;margin-inline:auto;padding-block:clamp(20px,3vw,40px)}
.article__top{display:flex;align-items:center;gap:8px;flex-wrap:wrap;font-size:11px;color:var(--muted-2);margin-bottom:12px}
.article h1{font-size:clamp(24px,3.6vw,40px);line-height:1.32;text-wrap:balance}
.article__lead{font-size:clamp(13.6px,1.5vw,16px);color:#CBDCC8;line-height:2.05;margin-top:14px}
.article__hero{margin-top:20px;border-radius:var(--r-2);overflow:hidden;border:1px solid var(--line);aspect-ratio:16/10;background:#0B140E}
.article__hero img{width:100%;height:100%;object-fit:cover}
.article__body{margin-top:22px;font-size:14.4px;line-height:2.15;color:#DDEBD9}
.article__body h2{font-size:clamp(18px,2.2vw,24px);margin:28px 0 10px;color:#fff}
.article__body h3{font-size:17px;margin:22px 0 8px}
.article__body p{margin:0 0 14px}
.article__body a{color:var(--lime);text-decoration:underline;text-underline-offset:3px}
.article__body ul,.article__body ol{padding-inline-start:22px;margin:0 0 14px}
.article__body li{margin-bottom:7px}
.article__body blockquote{margin:18px 0;padding:12px 16px;border-inline-start:2px solid var(--lime);
  background:rgba(184,241,74,.06);border-radius:0 12px 12px 0;color:#EAF3E4}
.article__body img{max-width:100%;border-radius:14px;margin:10px 0}
.article__tags{display:flex;gap:6px;flex-wrap:wrap;margin-top:24px;padding-top:18px;border-top:1px solid var(--line)}
.related{margin-top:34px}
.lite .ncard__view{display:none}
@media (prefers-reduced-motion:reduce){.ncard,.nlead,.ncard__pic img,.nlead__pic img{transition:none}}

/* ── تیزر اخبار در خانه ── */
.nteaser{display:grid;grid-template-columns:1.22fr 1fr;gap:clamp(12px,1.8vw,20px);margin-top:clamp(14px,2.2vw,22px)}
.nteaser__side{display:grid;grid-template-rows:1fr 1fr;gap:clamp(12px,1.8vw,20px)}
.ncard--wide{grid-template-rows:auto auto}
.ncard--wide .ncard__body h2{font-size:18px}
.ncard--wide .ncard__body p{-webkit-line-clamp:2}
@media (max-width:860px){.nteaser{grid-template-columns:1fr}.nteaser__side{grid-template-rows:none;grid-template-columns:1fr 1fr}}
@media (max-width:560px){.nteaser__side{grid-template-columns:1fr}}
.eyebrow .dot{width:6px;height:6px;border-radius:50%;background:var(--lime);box-shadow:0 0 0 3px rgba(184,241,74,.15);display:inline-block;animation:blip 2s infinite}


/* ═══════════════════════════════════════════════════════════════════════════
   توضیحِ صفحهٔ برچسب (tagintro)
   ───────────────────────────────────────────────────────────────────────────
   چرا: صفحهٔ برچسب بدونِ متن فقط چند لینک است و گوگل آن را «نازک» می‌بیند.
   این بلوک چند جملهٔ واقعی می‌دهد تا صفحه هم برای بازدیدکننده معنا پیدا کند و
   هم برای موتورِ جست‌وجو. سبکِ بصری از خودِ nrail__box گرفته شده تا از بقیهٔ
   صفحه جدا نیفتد. عمداً بدونِ انیمیشن است: بالای صفحه است و هر حرکتِ اضافه
   فقط CLS می‌سازد.
   ═══════════════════════════════════════════════════════════════════════════ */
.tagintro{
  margin-top:clamp(16px,2.4vw,26px);
  padding:clamp(16px,2.4vw,22px) clamp(16px,2.6vw,24px);
  border:1px solid var(--line); border-radius:var(--r-2);
  background:linear-gradient(180deg,rgba(184,241,74,.035),rgba(184,241,74,0));
  max-width:82ch;
}
.tagintro h2{
  font-size:13px; font-variation-settings:"wght" 780;
  margin-bottom:11px; display:flex; align-items:center; gap:7px;
}
.tagintro h2::before{
  content:""; width:3px; height:13px; border-radius:2px; background:var(--lime);
}
.tagintro__lead{
  color:var(--muted); font-size:13.4px; line-height:2.05; margin:0;
}
.tagintro__pts{
  list-style:none; margin:14px 0 0; padding:0;
  display:grid; gap:8px;
}
.tagintro__pts li{
  position:relative; padding-inline-start:18px;
  font-size:12.6px; line-height:1.95; color:#C7D8C4;
}
.tagintro__pts li::before{
  content:""; position:absolute; inset-inline-start:0; inset-block-start:8px;
  width:5px; height:5px; border-radius:50%;
  background:var(--lime); opacity:.75;
}

/* در صفحهٔ باریک، فاصله‌ها کمی جمع می‌شوند تا بلوک صفحه را قبضه نکند. */
@media (max-width:640px){
  .tagintro{padding:14px 15px}
  .tagintro__lead{font-size:13px}
  .tagintro__pts li{font-size:12.2px}
}
