/* قرچک دات کام — صفحه اصلی: ریسپانسیو + ظاهر حرفه‌ای. بعد از home.css و shell.css لود شود. */
.container.home{width:100%;max-width:1280px;margin-inline:auto;padding-inline:var(--px);--px:clamp(12px,3.5vw,24px);--r:20px;padding-top:20px}
.home,.home *{box-sizing:border-box}
.home img{max-width:100%}
.home a{text-decoration:none;color:inherit}
.home section{margin-inline:0}
/* اسلایدر + بنرهای کناری */
.home .top-grid{display:grid;grid-template-columns:minmax(0,2.5fr) minmax(0,1fr);grid-template-rows:repeat(2,minmax(0,1fr));gap:14px}
.home .slider{position:relative;grid-row:1/3;min-width:0;overflow:hidden;border-radius:var(--r);box-shadow:0 14px 34px rgba(20,30,40,.14)}
.home .slides{display:flex;height:100%;overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x mandatory;scrollbar-width:none}
.home .slides::-webkit-scrollbar{display:none}
.home .slide{position:relative;flex:0 0 100%;min-width:0;min-height:310px;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:clamp(18px,4vw,44px) clamp(18px,4vw,44px) 48px;color:#fff;overflow:hidden;isolation:isolate;scroll-snap-align:start;scroll-snap-stop:always}
.home .slide::before,.home .slide::after{content:"";position:absolute;border-radius:50%;z-index:-1;background:rgba(255,255,255,.09)}
.home .slide::before{width:380px;height:380px;inset-inline-end:-90px;top:-150px}
.home .slide::after{width:240px;height:240px;inset-inline-end:26%;bottom:-130px}
.home .slide h1,.home .slide h2{margin:0 0 8px;font-size:clamp(1.15rem,3.4vw,2rem);font-weight:900;line-height:1.5;text-shadow:0 2px 12px rgba(0,0,0,.18)}
.home .slide p{margin:0;font-size:clamp(.82rem,2.2vw,1rem);line-height:1.9;opacity:.94;max-width:44ch}
.home .slide>div::after{content:"مشاهده بیشتر ‹";display:inline-flex;margin-top:16px;background:#fff;color:var(--brand,#D6342E);padding:8px 20px;border-radius:999px;font-weight:800;font-size:.88rem;box-shadow:0 8px 18px rgba(0,0,0,.18);transition:transform .2s}
.home .slide .art{flex:none;font-size:clamp(3.6rem,12vw,8rem);line-height:1;filter:drop-shadow(0 10px 18px rgba(0,0,0,.22));transition:transform .5s cubic-bezier(.22,.8,.3,1)}
.home .dots{position:absolute;inset-inline:0;bottom:14px;display:flex;justify-content:center;gap:6px;z-index:2}
.home .dots button{width:8px;height:8px;padding:0;border:0;border-radius:99px;background:rgba(255,255,255,.55);cursor:pointer;transition:width .3s,background .3s}
.home .dots button.on{width:24px;background:#fff}
.home .side-banner{position:relative;display:flex;flex-direction:column;justify-content:center;gap:2px;min-width:0;padding:18px 20px;padding-inline-end:84px;overflow:hidden;color:#fff;border-radius:var(--r);box-shadow:0 8px 22px rgba(20,30,40,.12);transition:transform .25s,box-shadow .25s}
.home .side-banner strong{font-size:1.05rem;font-weight:900}
.home .side-banner span{font-size:.85rem;opacity:.92}
.home .side-banner i{position:absolute;inset-inline-end:14px;bottom:6px;font-style:normal;font-size:3.4rem;line-height:1;transition:transform .35s}
/* دکمه‌های اسلایدر و ریل (دسکتاپ) */
.sl-nav,.rail-nav{position:absolute;top:50%;z-index:3;width:42px;height:42px;margin-top:-21px;display:none;place-items:center;border:0;border-radius:50%;background:#fff;color:var(--ink,#1E2A32);box-shadow:0 6px 18px rgba(20,30,40,.25);cursor:pointer;transition:transform .2s,background .2s,color .2s}
.sl-nav[hidden],.rail-nav[hidden]{display:none!important}
.sl-nav.next,.rail-nav.next{inset-inline-end:10px}.sl-nav.prev,.rail-nav.prev{inset-inline-start:10px}
.sl-nav.next .ico,.rail-nav.next .ico{transform:rotate(90deg)}.sl-nav.prev .ico,.rail-nav.prev .ico{transform:rotate(-90deg)}
.rail-wrap{position:relative}
@media (hover:hover) and (min-width:901px){.sl-nav,.rail-nav{display:grid}.slider:not(:hover) .sl-nav{opacity:0}.sl-nav{transition:opacity .2s}}
/* دسته‌های گرد */
.home .circles{display:flex;gap:18px;overflow-x:auto;padding:30px 6px 12px;scrollbar-width:none;overscroll-behavior-x:contain}
.home .circles::-webkit-scrollbar{display:none}
.home .circle{flex:none;width:88px;display:flex;flex-direction:column;align-items:center;gap:8px;text-align:center}
.home .circle .ic{width:76px;height:76px;display:grid;place-items:center;overflow:hidden;border-radius:50%;background:#fff;border:2px solid var(--brand-soft,#FDECEB);box-shadow:0 6px 16px rgba(20,30,40,.07);font-size:1.8rem;font-weight:800;color:var(--brand,#D6342E);transition:transform .25s,box-shadow .25s,border-color .25s}
.home .circle .ic img{width:100%;height:100%;object-fit:cover}
.home .circle .nm{font-weight:600;font-size:.82rem;line-height:1.6;color:var(--ink,#1E2A32)}
/* پیشنهاد ویژه */
.home .featured.amazing{margin-top:30px;padding:20px;border-radius:var(--r);color:#fff;background:radial-gradient(circle at 12% 0,#F05A4F 0,transparent 42%),linear-gradient(120deg,#D6342E,#A8231F);box-shadow:0 16px 34px rgba(214,52,46,.28)}
.home .featured-head{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:14px}
.home .featured-head h2{margin:0;font-size:1.3rem;font-weight:900;color:#fff}
.home .timer{display:flex;align-items:center;gap:4px;font-weight:800}
.home .timer b{display:inline-grid;place-items:center;min-width:32px;height:32px;padding-inline:4px;border-radius:8px;background:#fff;color:var(--brand,#D6342E);font-variant-numeric:tabular-nums;box-shadow:0 3px 8px rgba(0,0,0,.18)}
.home .featured .more{margin-inline-start:auto;padding:6px 16px;border-radius:999px;background:rgba(255,255,255,.18);color:#fff;font-weight:700;font-size:.88rem;transition:background .2s}
/* سرفصل بخش‌ها */
.home .block{margin-top:38px}
.home .block-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:12px}
.home .block-head h2,.home .block>h2{position:relative;margin:0;padding-inline-start:14px;font-size:1.25rem;font-weight:900;color:var(--ink,#1E2A32)}
.home .block>h2{margin-bottom:14px}
.home .block-head h2::before,.home .block>h2::before{content:"";position:absolute;inset-inline-start:0;top:12%;bottom:12%;width:4px;border-radius:4px;background:var(--brand,#D6342E)}
.home .more.dark{display:inline-flex;align-items:center;padding:6px 14px;border-radius:999px;font-weight:700;font-size:.88rem;color:var(--brand,#D6342E);transition:background .2s}
/* ریل‌ها */
.home .rail{display:flex;gap:12px;overflow-x:auto;padding:6px 4px 16px;scrollbar-width:none;-webkit-overflow-scrolling:touch;overscroll-behavior-x:contain}
.home .rail::-webkit-scrollbar{display:none}
.home .pcard{flex:0 0 clamp(150px,42vw,205px);display:flex;flex-direction:column;gap:8px;padding:12px;border-radius:16px;background:#fff;border:1px solid var(--line,#E4E8EB);transition:transform .25s,box-shadow .25s,border-color .25s}
.home .pimg{position:relative;display:grid;place-items:center;height:158px;border-radius:12px;font-size:3.6rem;overflow:hidden;background:radial-gradient(circle at 50% 30%,#fff,#F3F5F6 70%)}
.home .pimg .demo{position:absolute;top:8px;inset-inline-start:8px;font-style:normal;font-size:.65rem;font-weight:700;color:#fff;background:rgba(30,42,50,.6);padding:2px 8px;border-radius:99px}
.home .pname{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:3.4em;font-size:.86rem;font-weight:700;line-height:1.7;color:var(--ink,#1E2A32)}
.home .pprice{display:flex;flex-wrap:wrap;align-items:center;gap:2px 8px;margin-top:auto}
.home .pprice s{font-size:.78rem;color:var(--muted,#6B7780)}
.home .pprice .off{padding:1px 8px;border-radius:99px;background:var(--brand,#D6342E);color:#fff;font-size:.76rem;font-weight:800}
.home .pprice strong{flex-basis:100%;font-size:1.02rem;font-weight:900;color:var(--ink,#1E2A32)}
.home .pprice small{font-size:.7rem;font-weight:600;color:var(--muted,#6B7780)}
.home .shop-tile.light{flex:0 0 clamp(140px,40vw,180px);display:flex;flex-direction:column;align-items:center;gap:6px;padding:20px 12px;text-align:center;border-radius:16px;background:#fff;border:1px solid var(--line,#E4E8EB);transition:transform .25s,box-shadow .25s}
.home .shop-tile img{width:84px;height:84px;object-fit:cover;border-radius:50%;background:var(--brand-soft,#FDECEB)}
.home .shop-tile strong{font-size:.92rem;font-weight:800;color:var(--ink,#1E2A32)}
.home .shop-tile span:not(.shop-emo){font-size:.78rem;color:var(--muted,#6B7780)}
.home .shop-emo{width:84px;height:84px;display:grid;place-items:center;border-radius:50%;background:var(--brand-soft,#FDECEB);font-size:2.6rem}
/* بنرها و چیپ‌ها */
.home .promos{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-top:30px}
.home .promos.four{grid-template-columns:repeat(4,minmax(0,1fr))}
.home .promo{position:relative;display:flex;flex-direction:column;justify-content:center;gap:4px;min-width:0;min-height:120px;padding:22px 20px;padding-inline-end:90px;overflow:hidden;color:#fff;border-radius:var(--r);box-shadow:0 10px 24px rgba(20,30,40,.14);transition:transform .25s,box-shadow .25s}
.home .promo strong{font-size:1.05rem;font-weight:900;line-height:1.6}
.home .promo span{font-size:.85rem;opacity:.92}
.home .promo i{position:absolute;inset-inline-end:14px;bottom:6px;font-style:normal;font-size:3.4rem;line-height:1;transition:transform .4s}
.home .chips{display:flex;flex-wrap:wrap;gap:10px}
.home .chip{display:inline-flex;align-items:center;padding:9px 20px;border-radius:999px;background:#fff;border:1px solid var(--line,#E4E8EB);font-size:.88rem;font-weight:600;box-shadow:0 2px 6px rgba(20,30,40,.04);transition:background .2s,transform .2s,color .2s}
/* هاور فقط برای ماوس (روی لمسی «گیر» نمی‌کند) */
@media (hover:hover){
  .home .slide:hover>div::after{transform:translateX(-4px)}.home .slide:hover .art{transform:scale(1.06) rotate(-4deg)}
  .home .side-banner:hover,.home .promo:hover{transform:translateY(-3px);box-shadow:0 16px 30px rgba(20,30,40,.2)}
  .home .side-banner:hover i,.home .promo:hover i{transform:scale(1.12) rotate(-6deg)}
  .home .circle:hover .ic{transform:translateY(-4px);border-color:var(--brand,#D6342E);box-shadow:0 12px 22px rgba(214,52,46,.2)}
  .home .featured .more:hover{background:rgba(255,255,255,.3)}.home .more.dark:hover{background:var(--brand-soft,#FDECEB)}
  .home .pcard:hover,.home .shop-tile.light:hover{transform:translateY(-5px);box-shadow:0 16px 30px rgba(20,30,40,.14);border-color:transparent}
  .home .chip:hover{background:var(--brand-soft,#FDECEB);color:var(--brand,#D6342E);transform:translateY(-2px)}
  .rail-nav:hover,.sl-nav:hover{background:var(--brand,#D6342E);color:#fff}
}
@media (hover:none){.home .pcard,.home .promo,.home .side-banner,.home .shop-tile,.home .chip,.home .circle .ic,.home .slide .art{transition:none}.home a:active{opacity:.85}}
/* ---------- موبایل و تبلت ---------- */
@media (max-width:900px){
  .container.home{padding-top:10px;--r:16px}
  .home .top-grid{grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:auto;gap:10px}
  .home .slider{grid-column:1/-1;grid-row:auto}
  .home .slide{min-height:200px;padding:18px 18px 40px}
  .home .slide .art{font-size:4.2rem}
  .home .slide::before{width:240px;height:240px}
  .home .side-banner{min-height:88px;padding:14px;padding-inline-end:56px}
  .home .side-banner i{font-size:2.4rem;inset-inline-end:10px}
  .home .side-banner strong{font-size:.92rem}.home .side-banner span{font-size:.76rem}
  .home .circles,.home .rail{margin-inline:calc(-1 * var(--px));padding-inline:var(--px);scroll-padding-inline:var(--px)}
  .home .circles{gap:12px;padding-top:20px}
  .home .circle{width:74px}.home .circle .ic{width:64px;height:64px;font-size:1.5rem}.home .circle .nm{font-size:.74rem}
  .home .featured.amazing{margin-top:22px;padding:14px 0 6px;border-radius:var(--r)}
  .home .featured-head{padding-inline:14px}.home .featured-head h2{font-size:1.1rem}
  .home .timer b{min-width:28px;height:28px;font-size:.85rem}
  .home .block{margin-top:26px}.home .block-head h2,.home .block>h2{font-size:1.08rem}
  .home .pimg{height:128px;font-size:3.1rem}
  .home .promos{margin-top:22px;gap:10px}
  .home .promos.four{grid-template-columns:repeat(2,minmax(0,1fr))}
  .home .promo{min-height:96px;padding:16px;padding-inline-end:64px}.home .promo strong{font-size:.92rem}.home .promo span{font-size:.76rem}
  .home .promo i{font-size:2.6rem;inset-inline-end:10px}
  .home .promo.wide{min-height:104px}
  .home .promos:not(.four){grid-template-columns:minmax(0,1fr)}
  .home .chip{padding:8px 16px;font-size:.84rem}
}
@media (max-width:380px){.home .promos.four .promo{padding-inline-end:48px}.home .pcard{flex-basis:148px}}
@media (prefers-reduced-motion:reduce){.home *{transition:none!important;scroll-behavior:auto}}

/* اسلایدر تصویری (عکس‌های ۲۸۸۰×۶۰۰ با متن و دکمه‌ی داخل خود تصویر) */
.home .top-grid{grid-template-columns:minmax(0,1fr);grid-template-rows:auto}
.home .img-slider{grid-row:auto;background:#eee}
.home .slide.img{display:block;min-height:0;padding:0;aspect-ratio:2880/600;color:inherit}
.home .slide.img::before,.home .slide.img::after{display:none}
.home .slide.img img{display:block;width:100%;height:100%;object-fit:cover}
.home .img-slider .dots button{box-shadow:0 1px 4px rgba(0,0,0,.35)}
@media (max-width:700px){.home .slide.img{aspect-ratio:2.6/1}.home .slide.img img{object-position:80% center}}
/* دایره‌های دسته‌بندی با عکس واقعی (عکس‌ها خودشان دایره‌ی طوسی دارند) */
.home .circle .ic.has-img{width:96px;height:96px;border:0;border-radius:0;background:none;box-shadow:none;overflow:visible}
.home .circle .ic.has-img img{object-fit:contain}
.home .circle:has(.has-img){width:100px}
@media (max-width:900px){.home .circle .ic.has-img{width:74px;height:74px}.home .circle:has(.has-img){width:80px}}
@media (hover:hover) and (min-width:901px){.home .circle:hover .ic.has-img{border:0;box-shadow:none;filter:drop-shadow(0 10px 12px rgba(20,30,40,.22))}}

/* ====== نسخه ۳: عکس دسته‌ها به‌صورت دایره‌ی تمیز (عکس‌های ۶۰۰×۶۰۰ دایره‌ی خاکستری در مرکز دارند) ====== */
.home .circle .ic.has-img{border-radius:50%;overflow:hidden;background:#e9edf0;box-shadow:0 3px 10px rgba(20,30,40,.10);transition:transform .25s,box-shadow .25s}
.home .circle .ic.has-img img{display:block;width:100%;height:100%;object-fit:cover;transform:scale(1.07)}
@media (hover:hover) and (min-width:901px){.home .circle:hover .ic.has-img{border:0;filter:none;transform:translateY(-4px);box-shadow:0 12px 22px rgba(20,30,40,.18)}}

/* ====== نسخه ۴: اسلایدر بلندتر، فاصله‌ی دایره‌ها، پیشنهاد ویژه مطابق نمونه + ساعت ورق‌خور ====== */
.home .slide.img{aspect-ratio:3.6/1}
@media (max-width:700px){.home .slide.img{aspect-ratio:2.25/1}}
.home .circles{padding-bottom:2px}
.home .featured.amazing{--aw:114px;--ai:90px;margin-top:8px;margin-inline:calc(-1 * var(--px));padding:0;border-radius:0;box-shadow:none;overflow:hidden;background:linear-gradient(90deg,#ee384e 0%,#e1304e 55%,#d02b50 100%)}
.home .amazing .featured-head{height:49px;margin:0;padding:0 16px;gap:8px;flex-wrap:nowrap;align-items:center}
.home .amazing .featured-head h2{display:flex;align-items:center;gap:6px;margin:0;font-size:1.08rem;font-weight:900;white-space:nowrap;color:#fff}
.home .amazing .pct{flex:none}
.home .amazing .timer{margin-left:auto;margin-right:0;direction:ltr;display:flex;align-items:center;gap:3px;font-weight:900}
.home .timer .fg{display:flex;gap:2px}
.home .timer .sep{color:#fff;font-weight:900;font-size:1rem;line-height:1;padding-bottom:2px}
.home .fd{--w:20px;--h:28px;position:relative;display:block;width:var(--w);height:var(--h);border-radius:6px;font-size:17px;background:linear-gradient(#fff,#eef0f3);box-shadow:0 2px 6px rgba(0,0,0,.22);overflow:hidden;contain:paint}
.home .fd i{position:absolute;left:0;right:0;top:0;height:var(--h);line-height:var(--h);text-align:center;font-style:normal;font-weight:900;color:#d9304c;font-variant-numeric:tabular-nums}
.home .fd .n{opacity:0}
.home .fd.go .a{animation:fdout .38s ease-in-out both}
.home .fd.go .n{animation:fdin .38s ease-in-out both}
@keyframes fdout{from{opacity:1}to{opacity:0}}
@keyframes fdin{from{opacity:0}to{opacity:1}}
@media (prefers-reduced-motion:reduce){.home .fd.go .a,.home .fd.go .n{animation:none}.home .fd.go .a{opacity:0}.home .fd.go .n{opacity:1}}
.home .amazing .rail{gap:1.5px;margin:0;padding:0 14px 14px;scroll-padding-inline:14px}
.home .amazing .pcard{flex:0 0 var(--aw);gap:4px;padding:8px;min-height:187px;border:0;border-radius:0;background:#fff;box-shadow:none;transform:none}
.home .amazing .pcard:first-child{border-start-start-radius:12px;border-end-start-radius:12px}
.home .amazing .pcard:last-child{border-start-end-radius:12px;border-end-end-radius:12px}
.home .amazing .pcard:hover{transform:none;box-shadow:none;border-color:transparent}
.home .amazing .pimg{height:var(--ai);font-size:2.9rem;border-radius:0;background:none}
.home .amazing .pimg .demo{top:0;font-size:.55rem;padding:1px 6px}
.home .amazing .pname{min-height:32px;font-size:11.5px;line-height:16px;font-weight:700;color:#23254e}
.home .amazing .pprice{gap:4px 6px;margin-top:auto}
.home .amazing .pprice s{order:1;font-size:11px;color:#a1a3a8}
.home .amazing .pprice .off{order:2;display:inline-flex;align-items:center;height:19px;padding:0 6px;border-radius:10px;font-size:12px;font-weight:800;background:#ee384e}
.home .amazing .pprice strong{order:3;display:flex;justify-content:flex-end;align-items:baseline;gap:3px;font-size:14px;font-weight:800;color:#23254e}
.home .amazing .pprice small{font-size:9px;font-weight:500;color:#23254e}
.home .amazing .see-all{align-items:center;justify-content:center;gap:10px;color:#ee384e}
.home .amazing .see-all .ring{display:grid;place-items:center;width:44px;height:44px;border-radius:50%;border:2px solid #ee384e}
.home .amazing .see-all b{font-size:11.5px;font-weight:700;color:#23254e}
@media (min-width:901px){
  .home .featured.amazing{--aw:176px;--ai:126px;margin-top:18px;margin-inline:0;border-radius:var(--r)}
  .home .amazing .featured-head{height:64px;padding:0 24px}
  .home .amazing .featured-head h2{font-size:1.35rem}
  .home .fd{--w:26px;--h:36px;font-size:22px}
  .home .amazing .rail{padding:0 20px 20px;scroll-padding-inline:20px}
  .home .amazing .pcard{min-height:268px;padding:10px;gap:6px}
  .home .amazing .pimg{font-size:3.6rem}
  .home .amazing .pname{min-height:40px;font-size:13px;line-height:20px}
  .home .amazing .pprice s{font-size:12.5px}
  .home .amazing .pprice .off{height:22px;font-size:13px;border-radius:11px}
  .home .amazing .pprice strong{font-size:17px}
  .home .amazing .pprice small{font-size:10.5px}
  .home .amazing .see-all .ring{width:52px;height:52px}
  .home .amazing .see-all b{font-size:13px}
}
@media (max-width:360px){.home .fd{--w:18px;--h:26px;font-size:15px}.home .amazing .featured-head{padding:0 12px}.home .amazing .featured-head h2{font-size:1rem}}
@media (max-width:420px){.home .amazing .featured-head{gap:6px}.home .amazing .featured-head h2{font-size:.98rem;gap:4px}.home .amazing .pct{width:20px;height:20px}.home .fd{--w:18px;--h:26px;font-size:15px}.home .timer .fg{gap:1.5px}}

/* دایره‌های دسته روی لپ‌تاپ: نوار اسکرول نازک + دکمه‌های قبلی/بعدی (بقیه‌ی استایل از .rail-wrap/.rail-nav) */
@media (hover:hover) and (min-width:901px){
  .home .circles{scrollbar-width:thin;scrollbar-color:#cfd5da transparent;padding-bottom:12px;cursor:grab}
  .home .circles::-webkit-scrollbar{display:block;height:6px}
  .home .circles::-webkit-scrollbar-thumb{background:#cfd5da;border-radius:6px}
  .home .circles::-webkit-scrollbar-thumb:hover{background:#aeb6bc}
  .home .circles::-webkit-scrollbar-track{background:transparent}
  .rail-wrap:has(>.circles) .rail-nav{top:calc(30px + 48px);margin-top:-21px}
}

/* تایمر: عنوان سمت راست، تایمر سمت چپ کادر */
.home .amazing .featured-head{justify-content:space-between}
.home .amazing .featured-head .timer{margin:0}