/* ============================================================
   سیر تا پیاز | magazine homepage — newtheme/home.css
   رنگ اصلی: #8F35BB (بنفش) + پالت هماهنگ
   تمام استایل ها اختصاصی و بدون CDN / پلاگین آنلاین
   ============================================================ */

:root{
    --stp-P: #8F35BB;
    --stp-P2: #a04bc9;
    --stp-P3: #6d2492;
    --stp-Pdg: #f4e9fb;   /* بنفش خیلی روشن (بک گراندها) */
    --stp-Pdg2:#e9d6f7;
    --stp-ink:#1f2030;    /* تیره */
    --stp-gray:#667085;
    --stp-line:#e9e6f2;
    --stp-soft:#f7f5fb;
    --stp-gold:#f0b400;
    --stp-acc:#ff5e7a;    /* قرمز - اخبار فوری */
    --stp-green:#12b76a;
    --radius:14px;
    --shadow-sm:0 6px 18px rgba(143,53,187,.08);
    --shadow-md:0 14px 40px rgba(32,14,50,.12);
}

/* ---------- تیکر حرفه ای «آخرین اخبار ویژه» (ارتفاع ~64px) ---------- */
.stp-newsfeed{display:flex;align-items:center;gap:14px;background:#fff;border:2px solid var(--stp-Pdg2);border-right:6px solid var(--stp-P);
    border-radius:var(--radius);padding:0 16px;margin:22px 0 0;box-shadow:var(--shadow-sm);height:64px;min-height:64px;overflow:hidden}
.stp-newsfeed .nf-t{flex:none;display:flex;align-items:center;gap:8px;font-size:13px;font-weight:800;color:#fff;background:var(--stp-P);
    padding:6px 14px;border-radius:9px;white-space:nowrap}
.stp-newsfeed .nf-t i{font-size:11px;animation:stp-blink 1.1s infinite}
@keyframes stp-blink{0%,100%{opacity:1}50%{opacity:.35}}
.stp-newsfeed .nf-track{position:relative;flex:1;min-width:0;height:100%;overflow:hidden;display:flex;align-items:center}
.stp-newsfeed .nf-track ul{list-style:none;margin:0;padding:0;height:100%;width:100%;position:relative}
.stp-newsfeed .nf-track li{position:absolute;inset:0;display:flex;align-items:center;gap:10px;padding:0 4px;opacity:0;transform:translateY(12px);transition:opacity .4s,transform .4s;white-space:nowrap;overflow:hidden}
.stp-newsfeed .nf-track li.on{opacity:1;transform:translateY(0)}
.stp-newsfeed .nf-track li .nf-cat{flex:none;font-size:10px;font-weight:700;color:var(--stp-P);background:var(--stp-Pdg);padding:2px 9px;border-radius:12px}
.stp-newsfeed .nf-track li a{color:var(--stp-ink);font-size:13.5px;font-weight:600;line-height:1.4;text-decoration:none;overflow:hidden;text-overflow:ellipsis;max-width:100%}
.stp-newsfeed .nf-track li a:hover{color:var(--stp-P)}
.stp-newsfeed .nf-track li .dot{flex:none;width:7px;height:7px;border-radius:50%;background:var(--stp-P2)}
.stp-newsfeed .nf-all{flex:none;padding:6px 12px;font-size:12px;font-weight:700;color:var(--stp-P);background:var(--stp-soft);border-radius:8px;text-decoration:none;white-space:nowrap}
.stp-newsfeed .nf-all:hover{background:var(--stp-P);color:#fff}

/* ---------- بخش بالای صفحه (اسلایدر اصلی + کارت های کناری) ---------- */
.stp-feature{display:grid;grid-template-columns:1.55fr 1fr;gap:22px;margin-top:22px;font-family:IRANSans,vazir,Tahoma,sans-serif}

/* ===== اسلایدر اصلی ===== */
.stp-hero{position:relative;border-radius:18px;overflow:hidden;min-height:470px;box-shadow:var(--shadow-md);background:#14101f}
.stp-slides{position:relative;height:100%;min-height:470px}
.stp-slide{position:absolute;inset:0;height:100%;width:100%;opacity:0;visibility:hidden;transition:opacity .7s ease;display:flex;align-items:flex-end}
.stp-slide.active{opacity:1;visibility:visible;position:relative}
.stp-slide .slide-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;transform:scale(1.06);transition:transform 6s ease}
.stp-slide.active .slide-img{transform:scale(1)}
.stp-slide .veil{position:absolute;inset:0;background:linear-gradient(180deg,rgba(8,4,14,0) 0%,rgba(8,4,14,.55) 40%,rgba(8,4,14,.94) 100%)}
.stp-slide .hero-content{position:relative;z-index:2;padding:34px 30px;color:#fff;max-width:620px}
.stp-slide .hero-cat{display:inline-block;background:var(--stp-P);color:#fff;font-size:11.5px;font-weight:700;padding:5px 12px;border-radius:20px;margin-bottom:14px}
.stp-slide .hero-cat.gold{background:var(--stp-gold);color:#3a2c00}
.stp-hero h2{font-size:clamp(22px,2.6vw,34px);line-height:1.55;font-weight:800;margin:0 0 12px;color:#fff}
.stp-hero h2 a{color:#fff;text-decoration:none}
.stp-hero h2 a:hover{color:#ffe3ff}
.stp-hero .hero-meta{display:flex;align-items:center;gap:16px;font-size:13px;color:#d9c8f0}
.stp-hero .hero-cta{display:inline-flex;align-items:center;gap:8px;margin-top:18px;background:#fff;color:var(--stp-P);font-weight:800;font-size:13.5px;padding:10px 22px;border-radius:30px;text-decoration:none;box-shadow:0 6px 20px rgba(0,0,0,.25);transition:.25s}
.stp-hero .hero-cta:hover{background:var(--stp-P);color:#fff;transform:translateY(-2px)}
.stp-hero .hero-nav{position:absolute;bottom:55px;left:28px;z-index:3;display:flex;gap:8px}
.stp-hero .hero-arrow{width:40px;height:40px;border-radius:50%;border:1.5px solid rgba(255,255,255,.4);background:rgba(255,255,255,.05);color:#fff;cursor:pointer;font-size:16px;display:flex;align-items:center;justify-content:center;transition:.25s}
.stp-hero .hero-arrow:hover{background:#fff;color:var(--stp-P);border-color:#fff}
.stp-hero .hero-dots{position:absolute;bottom:32px;left:30px;z-index:3;display:flex;gap:7px}
.stp-hero .hero-dots span{width:9px;height:9px;border-radius:9px;background:rgba(255,255,255,.45);cursor:pointer;transition:.3s}
.stp-hero .hero-dots span.on{width:26px;background:var(--stp-P2)}

/* ===== کارت های کناری ===== */
.stp-side{display:flex;flex-direction:column;gap:18px}
.stp-side-card{position:relative;flex:1;border-radius:16px;overflow:hidden;min-height:0;display:block;text-decoration:none;box-shadow:var(--shadow-sm)}
.stp-side-card .bg{position:absolute;inset:0;background-size:cover;background-position:center;transition:transform .5s ease}
.stp-side-card:hover .bg{transform:scale(1.07)}
.stp-side-card .veil{position:absolute;inset:0;background:linear-gradient(180deg,rgba(10,5,18,0) 30%,rgba(10,5,18,.88) 100%)}
.stp-side-card .cap{position:relative;z-index:2;padding:20px 18px;color:#fff;margin-top:auto}
.stp-side-card .cap .bus{font-size:11px;font-weight:700;color:#ffd9e0}
.stp-side-card .cap h4{font-size:15.5px;line-height:1.6;font-weight:700;margin:7px 0 0;color:#fff;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.stp-side-card .cap h4:hover{color:#ffd9fb}

/* ---------- تیتر سکشن ---------- */
.stp-sec{display:flex;align-items:center;justify-content:space-between;gap:14px;margin:26px 0 18px;position:relative}
.stp-sec .h{display:flex;align-items:center;gap:12px}
.stp-sec .h .ic{width:34px;height:34px;border-radius:10px;background:var(--stp-P);color:#fff;display:flex;align-items:center;justify-content:center;font-size:15px;flex:none}
.stp-sec h3{font-size:18.5px;font-weight:800;color:var(--stp-ink);margin:0}
.stp-sec .sub{display:block;font-size:11.5px;color:var(--stp-gray);font-weight:500}
.stp-sec a.more{font-size:12.5px;font-weight:700;color:var(--stp-P);text-decoration:none;display:inline-flex;align-items:center;gap:6px;padding:7px 14px;border:1.5px solid var(--stp-Pdg2);border-radius:20px;transition:.25s;white-space:nowrap}
.stp-sec a.more:hover{background:var(--stp-P);color:#fff;border-color:var(--stp-P)}

/* ---------- کارت مقاله ---------- */
.stp-article{background:#fff;border-radius:var(--radius);overflow:hidden;border:1px solid var(--stp-line);box-shadow:var(--shadow-sm);display:flex;flex-direction:column;height:100%;transition:.3s;text-decoration:none;color:inherit}
.stp-article:hover{transform:translateY(-5px);box-shadow:var(--shadow-md);border-color:var(--stp-P2)}
.stp-article .thumb{position:relative;aspect-ratio:16/10;overflow:hidden}
.stp-article .thumb img{width:100%;height:100%;object-fit:cover;transition:transform .5s}
.stp-article:hover .thumb img{transform:scale(1.08)}
.stp-article .thumb .lbl{position:absolute;top:10px;right:10px;z-index:2;background:#fff;color:var(--stp-P);font-size:10.5px;font-weight:700;padding:4px 10px;border-radius:6px;box-shadow:0 2px 8px rgba(0,0,0,.15)}
.stp-article .thumb .rank{position:absolute;bottom:10px;left:10px;z-index:2;width:30px;height:30px;border-radius:8px;background:var(--stp-P);color:#fff;font-weight:800;font-size:14px;display:flex;align-items:center;justify-content:center;border:2px solid #fff}
.stp-article .body{padding:15px 16px 17px;display:flex;flex-direction:column;flex:1}
.stp-article .cat{font-size:11px;font-weight:700;color:var(--stp-P);margin-bottom:8px;display:flex;align-items:center;gap:6px}
.stp-article .cat i{width:6px;height:6px;border-radius:50%;background:var(--stp-P)}
.stp-article h3{font-size:15.5px;line-height:1.7;font-weight:700;color:var(--stp-ink);margin:0 0 10px;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;min-height:0}
.stp-article:hover h3{color:var(--stp-P)}
.stp-article .meta{margin-top:auto;display:flex;align-items:center;gap:12px;font-size:11.5px;color:var(--stp-gray)}
.stp-article .meta span{display:inline-flex;align-items:center;gap:5px}

/* کارت بزرگ (feature اول سکشن) */
.stp-article.large h3{font-size:19px;-webkit-line-clamp:3}
.stp-article.large .thumb{aspect-ratio:16/9}

/* ---------- لیست عدددار کناری ---------- */
.stp-ranked{background:#fff;border:1px solid var(--stp-line);border-radius:var(--radius);box-shadow:var(--shadow-sm);padding:14px;height:100%}
.stp-ranked .r-row{display:flex;align-items:center;gap:14px;padding:11px 4px;border-bottom:1px dashed var(--stp-line);text-decoration:none;color:inherit}
.stp-ranked .r-row:last-child{border-bottom:none}
.stp-ranked .r-row:hover .r-t{color:var(--stp-P)}
.stp-ranked .num{flex:none;width:38px;height:38px;border-radius:10px;background:var(--stp-soft);color:var(--stp-P);font-weight:800;font-size:16px;display:flex;align-items:center;justify-content:center}
.stp-ranked .r-row h4{font-size:13.5px;line-height:1.65;font-weight:700;margin:0;color:var(--stp-ink);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}

/* ---------- چهره‌ها (تصویر محور) ---------- */
.stp-face-sec{background:linear-gradient(135deg,#2a1035,#4a1c66 55%,#7a2ca0);border-radius:20px;padding:26px 22px;color:#fff;margin-top:10px;position:relative;overflow:hidden}
.stp-face-sec::before{content:"";position:absolute;inset:0;background:radial-gradient(600px 260px at 85% 0%,rgba(255,255,255,.14),transparent 60%)}
.stp-face-sec .stp-sec h3{color:#fff}
.stp-face-sec .stp-sec .ic{background:#fff;color:var(--stp-P)}
.stp-face-sec .stp-sec a.more{color:#fff;border-color:rgba(255,255,255,.35)}
.stp-face-sec .stp-sec a.more:hover{background:#fff;color:var(--stp-P)}
.stp-faces{display:grid;grid-template-columns:repeat(4,1fr);grid-auto-flow:row;gap:16px}
.stp-face{position:relative;border-radius:16px;overflow:hidden;aspect-ratio:3/4;width:100%;display:block;text-decoration:none;box-shadow:0 10px 30px rgba(0,0,0,.25)}
.stp-face img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .5s}
.stp-face:hover img{transform:scale(1.08)}
.stp-face .veil{position:absolute;inset:0;background:linear-gradient(180deg,rgba(20,8,32,0) 45%,rgba(20,8,32,.92) 100%)}
.stp-face .info{position:absolute;bottom:-5px;left:0;right:0;padding:16px 15px 15px;z-index:2}
.stp-face .info .cat{font-size:10.5px;font-weight:700;background:rgba(255,255,255,.2);border:1px solid rgba(255,255,255,.3);backdrop-filter:blur(4px);padding:3px 10px;border-radius:14px;display:inline-block;margin-bottom:8px;color:#ffe9ff}
.stp-face .info h4{font-size:14.5px;font-weight:700;color:#fff;margin:0;line-height:1.5}
.stp-face .info h4 small{display:block;font-size:10.5px;font-weight:500;color:#d9b8f0;margin-top:3px}

/* ---------- کارت متن محور (چهره، مسیر دیگر) ---------- */
.stp-face-text{display:flex;gap:16px;background:#fff;border:1px solid var(--stp-line);border-radius:var(--radius);box-shadow:var(--shadow-sm);padding:14px;text-decoration:none;color:inherit;transition:.3s;height:100%}
.stp-face-text:hover{transform:translateY(-4px);box-shadow:var(--shadow-md);border-color:var(--stp-P2)}
.stp-face-text .av{flex:none;width:86px;height:112px;border-radius:12px;object-fit:cover}
.stp-face-text .t{display:flex;flex-direction:column;justify-content:center}
.stp-face-text .t .cat{font-size:10.5px;font-weight:700;color:var(--stp-P);margin-bottom:6px}
.stp-face-text .t h4{font-size:14.5px;line-height:1.6;font-weight:700;margin:0 0 8px;color:var(--stp-ink);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.stp-face-text:hover .t h4{color:var(--stp-P)}
.stp-face-text .t .bio{font-size:12px;color:var(--stp-gray);line-height:1.7;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}

/* ---------- ویدئو ---------- */
.stp-video-sec{background:#131023;border-radius:18px;padding:26px 22px;color:#fff;margin-top:8px}
.stp-video-sec .stp-sec h3{color:#fff}
.stp-video-sec .stp-sec .ic{background:var(--stp-acc)}
.stp-video-sec .stp-sec .sub{color:#a89bc8}
.stp-video-sec .stp-sec a.more{color:#fff;border-color:rgba(255,255,255,.3)}
.stp-video-sec .stp-sec a.more:hover{background:var(--stp-acc);border-color:var(--stp-acc)}
.stp-videos{display:grid;grid-template-columns:1.1fr 1.9fr;gap:18px}
.stp-vid{position:relative;border-radius:14px;overflow:hidden;display:block;text-decoration:none;min-height:180px;box-shadow:0 10px 26px rgba(0,0,0,.3)}
.stp-vid img{width:100%;height:100%;object-fit:cover;position:absolute;inset:0;transition:.4s}
.stp-vid:hover img{transform:scale(1.06)}
.stp-vid .veil{position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,0) 40%,rgba(0,0,0,.85) 100%)}
.stp-vid .play{position:absolute;left:50%;top:45%;transform:translate(-50%,-50%);width:54px;height:54px;border-radius:50%;background:rgba(255,94,122,.9);display:flex;align-items:center;justify-content:center;border:3px solid #fff;z-index:2}
.stp-vid .play:before{content:"";border-left:16px solid #fff;border-top:10px solid transparent;border-bottom:10px solid transparent;margin-left:4px}
.stp-vid .cap{position:absolute;bottom:0;left:0;right:0;padding:15px;z-index:2}
.stp-vid .cap h4{font-size:14.5px;font-weight:700;color:#fff;line-height:1.6;margin:0;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.stp-vid.main .cap h4{font-size:18px}
.stp-vids-sm{display:grid;grid-template-columns:repeat(2,1fr);gap:18px;align-items:stretch}
.stp-vids-sm .stp-vid{min-height:150px}

/* ---------- گردشگری (جایگزین ویدئو) ---------- */
.stp-travel-sec{background:linear-gradient(120deg,#0d3b34,#116e5f 45%,#0fa18c);border-radius:18px;padding:26px 22px;color:#fff;margin-top:8px;position:relative;overflow:hidden}
.stp-travel-sec::before{content:"";position:absolute;inset:0;background:radial-gradient(520px 240px at 12% 0%,rgba(255,255,255,.16),transparent 60%)}
.stp-travel-sec .stp-sec h3{color:#fff}
.stp-travel-sec .stp-sec .ic{background:#fff;color:#0fa18c}
.stp-travel-sec .stp-sec .sub{color:#c4e8e0}
.stp-travel-sec .stp-sec a.more{color:#fff;border-color:rgba(255,255,255,.35)}
.stp-travel-sec .stp-sec a.more:hover{background:#fff;color:#0fa18c;border-color:#fff}
.stp-travels{display:grid;grid-template-columns:1.1fr 1.9fr;gap:18px;position:relative;z-index:2}
.stp-trav{position:relative;border-radius:14px;overflow:hidden;display:block;text-decoration:none;min-height:180px;box-shadow:0 10px 26px rgba(0,0,0,.3)}
.stp-trav img{width:100%;height:100%;object-fit:cover;position:absolute;inset:0;transition:.4s}
.stp-trav:hover img{transform:scale(1.06)}
.stp-trav .veil{position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,0) 40%,rgba(0,0,0,.85) 100%)}
.stp-trav .emj{position:absolute;left:12px;top:12px;width:40px;height:40px;border-radius:12px;background:rgba(255,255,255,.18);border:1px solid rgba(255,255,255,.35);backdrop-filter:blur(4px);display:flex;align-items:center;justify-content:center;font-size:18px;z-index:2}
.stp-trav .cap{position:absolute;bottom:0;left:0;right:0;padding:15px;z-index:2}
.stp-trav .cap h4{font-size:14.5px;font-weight:700;color:#fff;line-height:1.6;margin:0;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.stp-trav.main .cap h4{font-size:18px}
.stp-travs-sm{display:grid;grid-template-columns:repeat(2,1fr);gap:18px;align-items:stretch}
.stp-travs-sm .stp-trav{min-height:150px}

/* ---------- شبکه دسته‌ها ---------- */
.stp-tag-cloud{display:flex;flex-wrap:wrap;gap:12px}
.stp-tag{flex:1;min-width:130px;display:flex;align-items:center;gap:12px;background:#fff;border:1px solid var(--stp-line);border-radius:14px;padding:13px 15px;text-decoration:none;color:inherit;transition:.25s;box-shadow:var(--shadow-sm)}
.stp-tag:hover{border-color:var(--stp-P);transform:translateY(-3px);box-shadow:var(--shadow-md)}
.stp-tag .em{width:44px;height:44px;border-radius:12px;background:var(--stp-Pdg);color:var(--stp-P);display:flex;align-items:center;justify-content:center;font-size:20px;flex:none}
.stp-tag:hover .em{background:var(--stp-P);color:#fff}
.stp-tag .tt{font-size:13.5px;font-weight:700;color:var(--stp-ink);line-height:1.4}
.stp-tag .tt small{display:block;font-size:10.5px;color:var(--stp-gray);font-weight:500}

/* ---------- شبکه ترکیبی (بزرگ + کوچک) ---------- */
.stp-mix-1{display:grid;grid-template-columns:1.2fr 1fr;gap:18px}
.stp-col{display:flex;flex-direction:column;gap:16px}

/* ---------- سکشن یکدست (ستون اصلی + سایدبار) ---------- */
.stp-mix-2{display:block;width:100%}
.stp-main-feed{display:grid;grid-template-columns:1fr 360px;gap:26px}
.stp-feed{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:22px;align-items:stretch;align-content:start}
.stp-sidecols{display:flex;flex-direction:column;gap:18px;align-items:stretch}
.stp-sidecols > *{width:100%;min-width:0}
.stp-minilist{display:flex;flex-direction:column}
.stp-minilist a{display:flex;gap:10px;align-items:flex-start;padding:8px 2px;border-bottom:1px dashed var(--stp-line);text-decoration:none;color:inherit}
.stp-minilist a:last-child{border-bottom:none}
.stp-minilist a:hover h4{color:var(--stp-P)}
.stp-minilist .mi{flex:none;width:44px;height:44px;border-radius:9px;object-fit:cover;background:var(--stp-Pdg);border:1px solid var(--stp-line)}
.stp-minilist .mt .mcat{font-size:10px;font-weight:700;color:var(--stp-P)}
.stp-minilist .mt h4{font-size:12.5px;line-height:1.55;font-weight:600;color:var(--stp-ink);margin:2px 0 0;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
/* placeholder بدون داده — بلاک خالی را اشغال می‌کند */
.stp-minilist .ph a{opacity:.45}
.stp-minilist .ph a h4{color:var(--stp-gray)}

/* ============================================================
   RESPONSIVE
   ============================================================ */
@media (max-width:1024px){
    .stp-feature{grid-template-columns:1.3fr 1fr}
    .stp-faces{grid-template-columns:repeat(3,1fr)}
    .stp-main-feed{grid-template-columns:1fr}
    .stp-videos{grid-template-columns:1fr}
    .stp-vids-sm{grid-template-columns:repeat(2,1fr)}
    .stp-travels{grid-template-columns:1fr}
    .stp-travs-sm{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:900px){
    .stp-main-feed{grid-template-columns:1fr}
    .stp-sidecols{flex-direction:column;align-items:stretch}
}
@media (max-width:768px){
    .stp-feature{grid-template-columns:1fr}
    .stp-hero{min-height:380px}
    .stp-side{flex-direction:row}
    .stp-side-card{min-height:190px}
    .stp-faces{grid-template-columns:repeat(3,1fr);gap:12px}
    .stp-face:nth-child(n+7){display:none}
    .stp-mix-1{grid-template-columns:1fr}
    .stp-vids-sm{grid-template-columns:1fr 1fr}
    .stp-travs-sm{grid-template-columns:1fr 1fr}
    .stp-main-feed{gap:18px}
    .stp-editgrid{grid-template-columns:1fr}
    .stp-editmain{min-height:230px}
    .stp-popframes{grid-template-columns:repeat(auto-fill,minmax(200px,1fr))}
    .stp-weekgrid{grid-template-columns:1fr}
}
@media (max-width:540px){
    .stp-hero{min-height:330px;border-radius:14px}
    .stp-slide .hero-content{padding:22px 18px}
    .stp-hero .hero-nav{bottom:18px;right:18px}
    .stp-hero .hero-dots{bottom:24px;left:18px}
    .stp-side{flex-direction:column;gap:12px}
    .stp-side-card{min-height:150px}
    .stp-face-sec{padding:20px 14px}
    .stp-faces{grid-template-columns:repeat(2,1fr);gap:12px}
    .stp-face:nth-child(n+5){display:none}
    .stp-vids-sm{grid-template-columns:1fr}
    .stp-travs-sm{grid-template-columns:1fr}
    .stp-tag{min-width:100%}
    .stp-travel-sec{padding:20px 14px}
    .stp-sec h3{font-size:16px}
    .stp-face-text{flex-direction:row}
    .stp-face-text .av{width:70px;height:92px}
    .stp-article.large h3{font-size:16px}
    .stp-newsfeed{height:auto;min-height:56px;padding:8px 12px;gap:10px}
    .stp-newsfeed .nf-t{font-size:12px;padding:6px 10px}
    .stp-newsfeed .nf-track{height:40px}
    .stp-newsfeed .nf-track li a{font-size:12.5px}
    .stp-newsfeed .nf-all{display:none}
    .stp-popframes{grid-template-columns:1fr}
    .stp-editgrid{grid-template-columns:1fr}
    .stp-editsec,.stp-topsec,.stp-weeksec,.stp-moreread{padding:18px 14px}
    .stp-editmain{min-height:200px}
    .stp-topicwrap{grid-template-columns:1fr}
    .stp-morrr{grid-template-columns:1fr}
    .stp-morrr .mr img{width:96px;height:80px}
    .stp-week-lead .wday{width:44px}
}

/* ---------- JS toolbar ---------- */
.stp-hero .hero-tools{position:absolute;bottom:26px;left:50%;transform:translateX(-50%);z-index:3;display:flex;gap:8px}

/* ---------- v2 اسلایدر تب دسته (ساده، بدون وابستگی) ---------- */
.stp-catnav{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:18px}
.stp-catnav button{border:1.5px solid var(--stp-line);background:#fff;color:var(--stp-gray);font-weight:700;font-size:13px;padding:8px 16px;border-radius:22px;cursor:pointer;transition:.25s}
.stp-catnav button.on{background:var(--stp-P);border-color:var(--stp-P);color:#fff}
.stp-catnav button:hover{color:var(--stp-P);border-color:var(--stp-P)}
/* دکمه «همه» — کنار عنوان، عرض ثابت 70px، hover متن بنفش نمی‌شود */
.stp-sec .allbtn{width:70px;flex:none;padding:7px 0;font-size:12.5px;font-weight:700;color:#fff;background:var(--stp-P);
    border:1.5px solid var(--stp-P);border-radius:20px;cursor:pointer;text-align:center;transition:.2s;line-height:1.6}
.stp-sec .allbtn:hover{background:var(--stp-P3);color:#fff;border-color:var(--stp-P3)}
.stp-sec .allbtn.on{box-shadow:0 4px 14px rgba(143,53,187,.35)}
.stp-cat-panel{display:none}
.stp-cat-panel.on{display:block;width:100%}
.stp-cat-panel.on .stp-hscroll{width:100%}

/* ---------- رول نوار (پیمایش افقی) ---------- */
.stp-hscroll{display:grid;grid-auto-flow:column;grid-auto-columns:270px;gap:16px;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:8px}
.stp-hscroll-full{width:100%;display:grid;grid-auto-columns:260px;margin-top:6px}
.stp-hscroll-full .stp-face-wide{min-height:190px}
.stp-hscroll::-webkit-scrollbar{height:8px}
.stp-hscroll::-webkit-scrollbar-thumb{background:var(--stp-Pdg2);border-radius:8px}
.stp-hscroll .stp-article{scroll-snap-align:start}

/* ---------- فیلد چهره: کارت عریض ---------- */
.stp-face-wide{display:flex;gap:18px;align-items:stretch;background:#fff;border:1px solid var(--stp-line);border-radius:var(--radius);box-shadow:var(--shadow-sm);overflow:hidden;text-decoration:none;color:inherit}
.stp-face-wide .fg{position:relative;width:100%;min-height:190px;overflow:hidden}
.stp-face-wide .fg img{width:100%;height:100%;object-fit:cover;position:absolute;inset:0;transition:.4s}
.stp-face-wide:hover .fg img{transform:scale(1.05)}
.stp-face-wide .fc{padding:18px 6px 18px 18px;display:flex;flex-direction:column;justify-content:center;flex:1}
.stp-face-wide .fc .cat{font-size:11px;color:var(--stp-P);font-weight:700;margin-bottom:6px}
.stp-face-wide .fc h4{font-size:17px;font-weight:800;margin:0 0 8px;color:var(--stp-ink);line-height:1.6}
.stp-face-wide .fc h4 a{color:inherit;text-decoration:none}
.stp-face-wide:hover .fc h4 a{color:var(--stp-P)}

/* ============================================================
   5 سکشن جدید پایانی (استاتیک — آماده Binding توسط کاربر)
   کلاس های اختصاصی برای جلوگیری از تداخل CSS
   ============================================================ */

/* ---------- 1) چهره های محبوب (کارت افقی avatar) ---------- */
.stp-popsec{background:#fff;border-top:3px solid var(--stp-P);border-radius:var(--radius);
    padding:20px 16px 24px;box-shadow:var(--shadow-sm);margin-top:8px}
.stp-popsec .stp-sec .ic{background:#1d7a5f}
.stp-popframes{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:16px}
.stp-popframes .pf{display:flex;gap:12px;align-items:center;background:var(--stp-soft);border:1px solid var(--stp-line);
    border-radius:12px;padding:10px;transition:.25s}
.stp-popframes .pf:hover{transform:translateY(-3px);box-shadow:var(--shadow-sm);border-color:var(--stp-P2)}
.stp-popframes .pf .pfa{flex:none;width:58px;height:58px;border-radius:50%;object-fit:cover;border:2px solid #fff;box-shadow:0 2px 8px rgba(0,0,0,.15);background:var(--stp-Pdg)}
.stp-popframes .pf .pfc{min-width:0}
.stp-popframes .pf .pfc .pcat{font-size:10px;font-weight:700;color:var(--stp-P);display:flex;align-items:center;gap:5px}
.stp-popframes .pf .pfc .pcat::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--stp-P2)}
.stp-popframes .pf .pfc h4{font-size:13.5px;font-weight:700;color:var(--stp-ink);margin:3px 0 0;line-height:1.5;
    display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden}
.stp-popframes .pf .pfc .pbio{font-size:11px;color:var(--stp-gray);margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

/* ---------- 2) پیشنهاد سردبیر (editorial: بزرگ + چند کوچک) ---------- */
.stp-editsec{background:linear-gradient(160deg,#2b1035,#4d1c68 60%,#7a2ca0);border-radius:20px;color:#fff;
    padding:26px 22px;margin-top:8px;overflow:hidden;position:relative}
.stp-editsec::before{content:"";position:absolute;inset:0;background:radial-gradient(520px 240px at 88% 0%,rgba(255,255,255,.16),transparent 60%)}
.stp-editsec .stp-sec h3{color:#fff}
.stp-editsec .stp-sec .ic{background:#fff;color:var(--stp-P)}
.stp-editsec .stp-sec .sub{color:#d7c0ee}
.stp-editgrid{display:grid;grid-template-columns:1.6fr 1fr;gap:18px;position:relative;z-index:2}
.stp-editmain{position:relative;border-radius:16px;overflow:hidden;min-height:260px;display:block;text-decoration:none;box-shadow:0 14px 40px rgba(0,0,0,.3)}
.stp-editmain img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:.4s;background:#3a2950}
.stp-editmain:hover img{transform:scale(1.05)}
.stp-editmain .veil{position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,0) 30%,rgba(0,0,0,.9) 100%)}
.stp-editmain .ec{position:absolute;bottom:0;left:0;right:0;padding:18px;z-index:2}
.stp-editmain .ec .e-tag{font-size:10px;font-weight:800;background:var(--stp-gold);color:#3a2c00;padding:3px 10px;border-radius:12px}
.stp-editmain .ec h3{font-size:19px;font-weight:800;color:#fff;margin:10px 0 0;line-height:1.6}
.stp-editside{display:flex;flex-direction:column;gap:12px}
.stp-editsmall{display:flex;gap:12px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.15);border-radius:12px;padding:10px;text-decoration:none;transition:.25s}
.stp-editsmall:hover{background:rgba(255,255,255,.16);transform:translateY(-2px)}
.stp-editsmall .es-no{flex:none;width:34px;height:34px;border-radius:9px;background:rgba(255,255,255,.18);color:#ffe9ff;font-weight:800;font-size:14px;display:flex;align-items:center;justify-content:center}
.stp-editsmall .es-t{min-width:0}
.stp-editsmall .es-t b{display:block;font-size:10.5px;color:#d7b8f0;font-weight:600}
.stp-editsmall .es-t h4{font-size:13.5px;font-weight:700;color:#fff;margin:2px 0 0;line-height:1.5;
    display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}

/* ---------- 3) موضوعات داغ (tag/topic عدددار) ---------- */
.stp-topsec{background:var(--stp-soft);border-radius:20px;padding:24px 20px;margin-top:8px;border:1px solid var(--stp-line)}
.stp-topsec .stp-sec .ic{background:var(--stp-acc)}
.stp-topicwrap{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:14px}
.stp-topic{display:flex;align-items:center;gap:12px;background:#fff;border:1px solid var(--stp-line);border-radius:14px;
    padding:13px 15px;text-decoration:none;transition:.25s;box-shadow:var(--shadow-sm)}
.stp-topic:hover{transform:translateY(-3px);box-shadow:var(--shadow-md);border-color:var(--stp-acc)}
.stp-topic .tk{flex:none;width:40px;height:40px;border-radius:11px;background:var(--stp-Pdg);color:var(--stp-P);font-weight:800;font-size:16px;display:flex;align-items:center;justify-content:center}
.stp-topic:hover .tk{background:var(--stp-acc);color:#fff}
.stp-topic .tt{min-width:0}
.stp-topic .tt b{display:block;font-size:13.5px;font-weight:700;color:var(--stp-ink)}
.stp-topic .tt small{display:block;font-size:11px;color:var(--stp-gray);margin-top:1px}

/* ---------- 4) این هفته در سیر تا پیاز (timeline) ---------- */
.stp-weeksec{background:#fff;border:1px solid var(--stp-line);border-radius:20px;padding:24px 20px;margin-top:8px;box-shadow:var(--shadow-sm)}
.stp-weeksec .stp-sec .ic{background:#0b7a4b}
.stp-weekgrid{display:grid;grid-template-columns:1fr 1fr;gap:14px 26px}
.stp-week{position:relative;padding-right:22px;display:flex;flex-direction:column;gap:0}
.stp-week::before{content:"";position:absolute;right:7px;top:6px;bottom:6px;width:2px;background:var(--stp-line)}
.stp-week-lead{position:relative;display:flex;cursor:pointer;text-decoration:none;color:inherit;gap:14px;padding:12px 6px 12px 6px;border:1px solid transparent;border-radius:12px;transition:.2s}
.stp-week-lead:hover{background:var(--stp-soft);border-color:var(--stp-line)}
.stp-week-lead .wd{flex:none;width:30px;height:30px;border-radius:50%;background:#fff;border:2px solid var(--stp-P);z-index:1;align-items:center}
.stp-week-lead .wday{flex:none;text-align:center}
.stp-week-lead .wday b{display:block;font-size:15px;font-weight:800;color:var(--stp-P)}
.stp-week-lead .wday small{font-size:10.5px;color:var(--stp-gray)}
.stp-week-lead .wt{min-width:0}
.stp-week-lead .wt h4{font-size:14px;font-weight:700;color:var(--stp-ink);margin:0 0 3px;line-height:1.55;
    display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.stp-week-lead:hover .wt h4{color:var(--stp-P)}
.stp-week-lead .wt p{font-size:12px;color:var(--stp-gray);margin:0;line-height:1.6}
.stp-week-lead .cm-stars{display:inline-flex;gap:2px;margin-bottom:3px}
.stp-week-lead .cm-stars i{color:#d9d9d9;font-size:11px}
.stp-week-lead .cm-stars i.on{color:var(--stp-gold)}

/* ---------- 5) بیشتر بخوانید (grid کارت افقی) ---------- */
.stp-moreread{background:linear-gradient(120deg,#f4e9fb,#fbf6ff);border-radius:20px;padding:24px 20px;margin-top:8px;border:1px solid var(--stp-Pdg2)}
.stp-moreread .stp-sec .ic{background:var(--stp-P3)}
.stp-morrr{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:16px}
.stp-morrr .mr{display:flex;gap:14px;background:#fff;border:1px solid var(--stp-line);border-radius:14px;overflow:hidden;text-decoration:none;transition:.25s;box-shadow:var(--shadow-sm)}
.stp-morrr .mr:hover{transform:translateY(-4px);box-shadow:var(--shadow-md);border-color:var(--stp-P2)}
.stp-morrr .mr img{flex:none;width:110px;height:88px;object-fit:cover;background:var(--stp-Pdg)}
.stp-morrr .mr .mri{flex:none;width:110px;height:88px;display:flex;align-items:center;justify-content:center;background:var(--stp-Pdg);color:var(--stp-P);font-size:30px}
.stp-morrr .mr .mc{padding:10px 8px 10px 12px;display:flex;flex-direction:column;justify-content:center;min-width:0}
.stp-morrr .mr .mc .mcat{font-size:10px;font-weight:700;color:var(--stp-P)}
.stp-morrr .mr .mc h4{font-size:13.5px;font-weight:700;color:var(--stp-ink);margin:4px 0 0;line-height:1.6;
    display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.stp-morrr .mr:hover .mc h4{color:var(--stp-P)}
