/* -----------------------------------------------------------
  Travelnews Archive
----------------------------------------------------------- */

    .bx-shd{ box-shadow: var(--cm-box-shadow); background: #fff; }

    /* ===== Masthead ===== */
    .np-masthead{
      background: var(--color-bg);
      border-bottom:1px solid var(--color-divider);
      position:sticky; top:0; z-index:50;
      padding-top:max(0px,env(safe-area-inset-top));
      backdrop-filter: blur(6px);
    }
    .np-masthead .inner{ display:flex; align-items:center; justify-content:space-between; gap:1rem; padding-bottom:.5rem; }
    .np-logo{ font-weight:800; font-size: var(--fs-h2); letter-spacing:.5px; color: var(--color-text-strong); }
    .np-kicker{ color: var(--color-primary); font-weight:800; }
    .np-dateline{ color: var(--color-text-muted); font-size: var(--fs-small); }
    .np-chip{ display:inline-flex; align-items:center; gap:.5rem; padding:.4rem .7rem; border-radius:10px; border:1px solid var(--color-border); background:var(--color-bg); }

    /* ===== Breaking Bar / Ticker ===== */
    .np-bar{
      background: var(--color-bg-sec);
      border-bottom: 1px solid var(--color-border);
      overflow: hidden;
    }
    .np-bar .inner{
      /* Mobile: grid makes better wrapping than flex */
      display: grid;
      grid-template-columns: auto 1fr;
      align-items: center;
      gap: .5rem;
      padding-block: .5rem;
      overflow: hidden;
      max-width:1250px;
    }

    .np-bar .badge{
      display: inline-flex; align-items: center; gap: .4rem;
      padding: .2rem .6rem; border-radius: .5rem;
      background: var(--color-primary); color: #fff; font-weight: 700; font-size: var(--fs-caption);
      flex: 0 0 auto; white-space: nowrap;
    }

    .np-ticker{
      flex: 1 1 auto;
      min-width: 0; 
      overflow: hidden;
      block-size: 40px;
      border-radius: .5rem;
      align-content: center;
    }

    .np-track{
      display: inline-flex;
      align-items: center;
      gap: 1.25rem;
      white-space: nowrap;
      will-change: transform;
      animation: npTicker 35s linear infinite;
    }
    @keyframes npTicker{
      0%{ transform: translate3d(0,0,0); }
      100%{ transform: translate3d(-50%,0,0); }
    }

    .np-tick{
      display: inline-flex; align-items: center; gap: .6rem;
      color: var(--color-text); text-decoration: none;
      min-width: 0; max-width: 100%; font-size: var(--fs-small);
    }
    .np-tick:hover{ color: var(--color-primary); }
    .np-dot{
      inline-size: .45rem; block-size: .45rem; border-radius: 999px;
      background: var(--color-primary); display: inline-block; flex: none;
    }
    .np-tick .fw-semibold{
      display: inline-block;
      max-width: 70vw; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
    }

    /* ===== Lead ===== */
    .np-lead{
      position:relative; overflow:hidden; border-radius: var(--card-radius);
      min-block-size: clamp(360px, 60svh, 680px);
      background:#000; isolation:isolate;
    }
    .np-media img{ position:absolute; inset:0; inline-size:100%; block-size:100%; object-fit:cover; }
    .np-shade{ position:absolute; inset:0; background: linear-gradient(180deg, rgba(0,0,0,.15) 0%, rgba(0,0,0,.55) 55%, rgba(0,0,0,.88) 100%); z-index:1; }
    .np-body{ position:relative; z-index:2; min-block-size:inherit; display:flex; flex-direction:column; justify-content:flex-end; padding: 1rem; gap:.5rem; }
    .np-title a{ color:#fff; text-decoration:none; text-shadow: var(--cm-text-shadow, 0 2px 12px rgba(0,0,0,.8)); }
    .np-excerpt, .np-meta{ color:#E5E7EB; }
    .np-share a{ display:inline-flex; align-items:center; gap:.4rem; }

    /* Buttons */
    .btn{
      display:inline-flex; align-items:center; justify-content:center; gap:.4rem;
      padding:.55rem .9rem; border-radius:.7rem; border:1px solid var(--color-border);
      background: var(--color-bg); color: var(--color-text); text-decoration:none;
      transition: transform var(--transition), background var(--transition), color var(--transition), border-color var(--transition);
    }
    .btn:hover{ transform: translateY(-1px); }
    .btn:active{ transform: translateY(0); }
    .btn-outline{ background:transparent; color: var(--color-primary); border-color: var(--color-primary); }
    .btn-primary{ background:var(--color-primary); color:#fff; border-color: transparent; }
    .btn-link{ color: var(--color-primary); background: transparent; border-color: transparent; padding-inline:0; }
    .btn-sm{ padding:.4rem .6rem; font-size: var(--fs-small); }
    .btn-lg{ padding:.7rem 1.05rem; font-size: calc(var(--font-size-base) * 1.05); }


    .page-numbers { display: inline-flex; gap: 1rem; }
    .page-numbers li span, .page-numbers li a { border-radius: 6px; border: solid 1px var(--blue-500); cursor: pointer; transition: .3s; align-items: center; justify-content: center; }
    .page-numbers li:hover .page-numbers { background: var(--blue-500); color: #fff; border-radius: 6px; transition: .3s; }
    .next.page-numbers { padding-inline: 10px; }

    /* Secondary cards */
    .np-sec{
      display:grid; grid-template-columns: 120px 1fr; gap:.8rem; align-items:center;
      border:1px solid var(--color-border); border-radius: var(--card-radius);
      background:var(--color-bg); padding:.75rem; box-shadow: var(--cm-box-shadow);
    }
    .np-thumb{ inline-size:120px; block-size:90px; border-radius:.75rem; background:#eee center/cover no-repeat; border:1px solid var(--color-border); aspect-ratio: 4/3; }

    /* Cards */
    .card{ border-radius: var(--card-radius); background: var(--color-bg); box-shadow: var(--cm-box-shadow); border:1px solid var(--color-border); }
    .card__link{ display:block; color:inherit; text-decoration:none; }

    /* Feature */
    .np-feature{ position:relative; border-radius: var(--card-radius); overflow:hidden; }
    .np-feature__media{ block-size:280px; background:#000 center/cover no-repeat; }

    /* Sidebar */
    .mini-thumb{ inline-size:96px; block-size:72px; border-radius:.75rem; background:#eee center/cover no-repeat; border:1px solid var(--color-border); aspect-ratio: 4/3; flex: none; }
    .np-classified{ border:2px dashed var(--color-border); border-radius: var(--card-radius); padding:1rem; background:var(--color-bg); }

    /* Markets */
    .np-markets table{ inline-size:100%; border-collapse: collapse; }
    .np-markets th, .np-markets td{ border:1px solid var(--color-border); padding:.6rem .6rem; text-align:center; white-space:nowrap; }
    .np-markets thead th{ background: var(--color-text-strong); color:#fff; font-weight:700; position:sticky; top:0; }

    /* Footer */
    .np-footer{ border-top:1px solid var(--color-divider); background:var(--color-bg); }

    /* Utils */
    .visually-hidden{ position:absolute !important; inline-size:1px; block-size:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
    .grid-auto{ display:grid; grid-template-columns: repeat(auto-fill, minmax(var(--min, 260px), 1fr)); gap: var(--grid-gap, 1rem); }

    /* =========================================================
       Responsive (Mobile-first)
       ========================================================= */
    @media (max-width: 575.98px){
      .np-masthead .inner{ gap:.5rem; }
      .np-logo{ font-size: calc(var(--font-size-base) * 1.6); }

      .np-ticker{ block-size: 34px; }
      .np-track{ gap: .75rem; }

      .np-body{ padding: .85rem; }
      .np-excerpt{ display:none; }
      .np-meta{ font-size: var(--fs-caption); opacity:.95; }

      .btn-lg{ inline-size:100%; }

      .np-sec{ grid-template-columns: 96px 1fr; gap:.65rem; }
      .np-thumb{ inline-size:96px; block-size:72px; }

      .np-feature__media{ block-size: 200px; }

      .grid-auto{ --min: 220px; }
      .row[style*="--gutter"]{ --gutter:.75rem !important; }

      .np-side{ order: 2; }
    }
    @media (min-width: 576px) and (max-width: 767.98px){
      .np-body{ padding: 1rem; }
      .btn-lg{ inline-size:100%; }
      .np-sec{ grid-template-columns: 120px 1fr; }
      .grid-auto{ --min: 240px; }
    }
    @media (min-width: 768px) and (max-width: 991.98px){
      .np-logo{ font-size: calc(var(--font-size-base) * 2); }
      .np-excerpt{ display:block; }
      .grid-auto{ --min: 260px; }
      .np-feature__media{ block-size: 240px; }
    }
    @media (min-width: 992px) and (max-width: 1199.98px){
      .np-feature__media{ block-size: 260px; }
    }
    @media (min-width: 1200px){
      .np-feature__media{ block-size: 280px; }
      .grid-auto{ --min: 280px; }
    }

    /* دسکتاپ همون انیمیشن CSS قبلی بمونه */
    @media (max-width: 767.98px){
      .np-ticker{
        overflow: hidden;            /* نه scrollLeft، نه اسکرول‌بار */
        block-size: 34px;
      }
      .np-track{
        animation: none !important;  /* CSS marquee خاموش؛ JS کنترل می‌کند */
        will-change: transform;
        gap: .75rem;
      }
      .np-bar .inner{ gap: .5rem; }
    }