/* ==========================================================================
   Arcopet v2 · صفحه‌ی اصلی فروشگاه
   ظاهر همان صفحه‌ی قبلی (css/index-redesign.css و استایل‌های داخل js/main.js چایلد)، بدون Swiper:
   ردیف‌ها با اسکرول بومی (scroll-snap)، اسلایدر و چرخ‌فلک بنرها با v2-home.js.
   ساختار: templates/front-page.php و parts/home/*. فقط var(--v2-*).
   ========================================================================== */

.v2-home{ background:var(--v2-home-bg); padding-bottom:0; }

/* ---------- اسلایدر بالا ---------- */
.v2-home-hero{ position:relative; overflow:hidden; background:var(--v2-surface-hover); }
.v2-home-hero-track{
  display:flex; overflow-x:auto; scroll-snap-type:x mandatory; overscroll-behavior-x:contain; scrollbar-width:none;
}
.v2-home-hero-track::-webkit-scrollbar{ display:none; }
.v2-home-hero-slide{ flex:0 0 100%; scroll-snap-align:center; scroll-snap-stop:always; display:block; }
.v2-home-hero-slide picture, .v2-home-hero-slide img{ display:block; width:100%; }
.v2-home-hero-slide img{ height:auto; max-height:350px; object-fit:cover; }
.v2-home-hero-dots{ position:absolute; inset-inline:0; bottom:10px; display:flex; justify-content:center; gap:6px; pointer-events:none; }
.v2-home-hero-dot{
  pointer-events:auto; width:8px; height:8px; padding:0; border-radius:999px; border:0;
  background:var(--v2-white); opacity:.6; box-shadow:0 0 0 1px rgba(0,0,0,.08); transition:width .2s, opacity .2s, background-color .2s;
}
.v2-home-hero-dot.is-active{ width:20px; opacity:1; background:var(--v2-home-title); }
/* لمس‌پذیری نقطه‌ها: ناحیه‌ی کلیک بزرگ‌تر از خود نقطه */
.v2-home-hero-dot{ position:relative; }
.v2-home-hero-dot::after{ content:""; position:absolute; inset:-10px -4px; }
@media (max-width:768px){
  .v2-home-hero{ margin:11px; border-radius:10px; }
  .v2-home-hero-slide img{ max-height:260px; }
}

/* ---------- بخش‌ها (ردیف محصولات) ---------- */
.v2-home-section{
  max-width:var(--v2-container); margin:0 auto; padding:22px 24px 28px;
  border-bottom:10px solid var(--v2-surface);
}
.v2-home-section[hidden]{ display:none; }
.v2-home-head{ display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:10px; padding-inline:4px; }
.v2-home-head > div{ min-width:0; }
.v2-home-title{ margin:0; font-size:15px; font-weight:700; line-height:1.8; color:var(--v2-home-title); }
.v2-home-title::before{ content:"⁘ "; }
.v2-home-subtitle{ margin:2px 0 0; font-size:12px; line-height:1.8; color:var(--v2-text-muted); }
.v2-home-subtitle[hidden]{ display:none; }
.v2-home-all{ flex:none; font-size:13px; font-weight:700; color:var(--v2-home-title); white-space:nowrap; transition:color .2s; }
.v2-home-all:hover{ color:var(--v2-home-title-hover); }

/* پت پارتی و پک بصرفه: پس‌زمینه‌ی رنگی و عنوان سفید */
.v2-home-section.is-party{ background-image:var(--v2-home-party); }
.v2-home-section.is-pack{ background-image:var(--v2-home-pack); }
.v2-home-section:is(.is-party, .is-pack) .v2-home-title,
.v2-home-section:is(.is-party, .is-pack) .v2-home-all{ color:var(--v2-white); }
.v2-home-section:is(.is-party, .is-pack) .v2-home-all:hover{ opacity:.8; }

/* بخش‌های شخصی */
.v2-home-client.is-recent{ background:var(--v2-surface); }
.v2-home-client.is-personalized{ background:var(--v2-home-personal); border-radius:24px; }
.v2-home-client.is-complementary{ background:var(--v2-home-complement); border-radius:24px; }
.v2-home-clear{
  flex:none; padding:5px 12px; border-radius:999px; border:1px solid rgba(233,30,99,.25); background:rgba(233,30,99,.06);
  color:var(--v2-home-title); font:inherit; font-size:12px; font-weight:700; line-height:1.7; cursor:pointer; transition:background-color .2s, border-color .2s;
}
.v2-home-clear:hover{ background:rgba(233,30,99,.12); border-color:rgba(233,30,99,.45); }

@media (max-width:768px){
  .v2-home-section{ padding:12px 0 12px 0; padding-inline-start:10px; }
  .v2-home-head{ padding-inline-end:12px; }
  /* موبایل: «مشاهده همه» دکمه‌ی گرد صورتی (همان قبلی) */
  .v2-home-all, .v2-home-section:is(.is-party, .is-pack) .v2-home-all{
    display:inline-flex; align-items:center; min-height:24px; padding:0 10px; border-radius:20px;
    background:var(--v2-home-pill); color:var(--v2-white); font-size:12px; line-height:22px;
  }
  .v2-home-client.is-personalized, .v2-home-client.is-complementary{ border-radius:16px; }
}

/* ---------- ردیف افقی ---------- */
.v2-home-rail{ position:relative; }
.v2-home-track{
  display:grid; grid-auto-flow:column; grid-auto-columns:calc((100% - 5 * 15px) / 6); gap:15px;
  margin:0; padding:4px 0 6px; list-style:none;
  overflow-x:auto; overscroll-behavior-x:contain; scroll-snap-type:x mandatory; scrollbar-width:none;
}
.v2-home-track::-webkit-scrollbar{ display:none; }
.v2-home-track > li{ scroll-snap-align:start; min-width:0; }
@media (max-width:1199px){ .v2-home-track{ grid-auto-columns:calc((100% - 4 * 15px) / 5); } }
@media (max-width:1023px){ .v2-home-track{ grid-auto-columns:calc((100% - 3 * 15px) / 4); } }
@media (max-width:767px){ .v2-home-track{ grid-auto-columns:calc((100% - 2 * 15px) / 3); } }
@media (max-width:639px){
  .v2-home-track{ grid-auto-columns:163px; gap:0; padding-inline-end:10px; }
  /* دو طبقه در موبایل: پت پارتی و پک بصرفه */
  .v2-home-track.is-2row{ grid-template-rows:auto auto; grid-auto-columns:calc((100% - 10px) / 2.3); }
}

/* دکمه‌های قبلی/بعدی: فقط دسکتاپ و فقط وقتی موس روی بخش است (همان رفتار قبلی) */
.v2-home-arrow{
  position:absolute; top:calc(50% - 30px); z-index:3; display:none; place-items:center; width:50px; height:50px; padding:0;
  border:0; border-radius:50%; background:var(--v2-surface); color:var(--v2-home-pill); box-shadow:0 0 5px rgba(0,0,0,.15);
  opacity:0; transition:opacity .2s; cursor:pointer;
}
.v2-home-arrow .v2-icon{ width:26px; height:26px; }
.v2-home-arrow.is-prev{ inset-inline-start:-14px; }
.v2-home-arrow.is-next{ inset-inline-end:-14px; }
.v2-home-arrow.is-prev .v2-icon{ transform:scaleX(-1); }
.v2-home-arrow[disabled]{ visibility:hidden; }
@media (hover:hover) and (min-width:768px){
  .v2-home-arrow{ display:grid; }
  .v2-home-rail:hover .v2-home-arrow, .v2-home-arrow:focus-visible{ opacity:1; }
}

/* ---------- کارت محصول (ظاهر کارت قبلی صفحه‌ی اصلی) ---------- */
.v2-hcard{ position:relative; padding:6px; border-radius:12px; transition:transform .3s; }
@media (hover:hover){ .v2-hcard:hover{ transform:translateY(-5px); } }
.v2-hcard-link{ display:block; color:inherit; }
.v2-hcard-media{
  position:relative; display:block; aspect-ratio:1 / 1; border-radius:15px; overflow:hidden;
  background:var(--v2-white); border:1px solid rgba(238,238,238,.38);
}
.v2-hcard-media img{ display:block; width:100%; height:100%; object-fit:cover; opacity:0; transition:opacity .25s; }
.v2-hcard-media img.is-loaded{ opacity:1; }
.v2-hcard-media:not(:has(img.is-loaded)){ background:linear-gradient(90deg, var(--v2-skel-base) 0%, var(--v2-skel-shine) 50%, var(--v2-skel-base) 100%) 0 0 / 200% 100%; animation:v2-home-shine 1.2s linear infinite; }
@keyframes v2-home-shine{ to{ background-position:-200% 0; } }
.v2-hcard:not(.is-skeleton) .v2-hcard-media:empty{ animation:none; background:var(--v2-surface-subtle); }
.v2-hcard-off{
  position:absolute; top:11px; left:12px; z-index:2; padding:0 6px; border-radius:12px 4px 4px 4px;
  border:1px solid rgba(226,0,116,.28); background:rgba(255,222,238,.47); color:var(--v2-brand);
  font-size:14px; line-height:1.3;
}
.v2-hcard-off.is-solid{ background:var(--v2-brand); border-color:var(--v2-brand); color:var(--v2-white); }
.v2-hcard-title{
  display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2; overflow:hidden;
  margin:10px 5px 8px; font-size:13.5px; line-height:1.7; color:var(--v2-text); font-weight:400;
}
.v2-hcard-price{ display:flex; flex-direction:column; align-items:flex-start; margin:0 5px; line-height:1.6; }
.v2-hcard-now{ font-size:16px; font-weight:700; color:var(--v2-text); }
.v2-hcard-was{ font-size:13px; color:var(--v2-text-subtle); }
/* دکمه‌ی + روی تصویر (همان جای قبلی).
   !important فقط برای غلبه بر CSS عمومی پلاگین سبد سریع روی .flowrand-fc-button (مثل cards.css). */
.v2-hcard .v2-hcard-add{
  position:absolute; top:33%; right:9%; z-index:3;
  display:grid !important; place-items:center; width:30px !important; height:30px !important; min-height:0 !important;
  margin:0 !important; padding:0 !important; border-radius:30% !important; border:0 !important;
  background:var(--v2-white) !important; color:var(--v2-heading) !important; box-shadow:0 2px 6px rgba(0,0,0,.17) !important;
  text-decoration:none !important; transform:none !important;
}
.v2-hcard .v2-hcard-add:hover{ color:var(--v2-brand) !important; }
.v2-hcard .v2-hcard-add .flowrand-fc-button__text{
  display:block !important; margin:-2px 0 0 !important; color:inherit !important;
  font-family:inherit !important; font-size:25px !important; font-weight:700 !important; line-height:1 !important;
}
.v2-hcard .v2-hcard-add.is-loading .flowrand-fc-button__text{ visibility:hidden; }
.v2-hcard .v2-hcard-add .flowrand-fc-button__spinner{ border-color:var(--v2-border); border-top-color:var(--v2-brand); }
/* ناحیه‌ی لمس بزرگ‌تر از خود دکمه */
.v2-hcard .v2-hcard-add::after{ content:""; position:absolute; inset:-7px; }
@media (max-width:639px){
  .v2-hcard-title{ -webkit-line-clamp:1; margin:6px 1px 2px; font-size:11px; }
  .v2-hcard-price{ margin:0 1px; }
  .v2-hcard-now{ font-size:13.5px; }
  .v2-hcard-was{ font-size:12px; }
  .v2-hcard-off{ top:10px; left:10px; padding:1px 6px; font-size:11.5px; }
}

/* ---------- دسته‌ها ---------- */
.v2-home-cats{ background:var(--v2-surface); padding:6vh 0; }
.v2-home-cats ul{ display:flex; flex-wrap:wrap; justify-content:center; gap:0 1.6%; margin:0 auto; padding:0; list-style:none; max-width:var(--v2-container); }
.v2-home-cat{ position:relative; display:flex; flex-direction:column; align-items:center; gap:4px; width:20vh; max-width:180px; padding:10px; text-align:center; }
.v2-home-cat-img{ position:relative; display:grid; place-items:center; width:130px; height:130px; }
.v2-home-cat-img::before{ content:""; position:absolute; inset:0; border-radius:50%; background:var(--v2-home-cat-circle); box-shadow:-2px 2px 9px rgba(0,0,0,.11); }
.v2-home-cat-img img{ position:relative; width:130px; height:130px; object-fit:contain; border-radius:10px; mix-blend-mode:multiply; }
.v2-home-cat-name{ display:block; font-size:15px; font-weight:800; color:var(--v2-text-subtle); }
@media (max-width:480px){
  .v2-home-cats{ padding:0; }
  .v2-home-cats ul{ gap:0; }
  .v2-home-cats li{ width:33.333%; }
  .v2-home-cat{ width:100%; }
  .v2-home-cat-img{ width:100px; height:100px; }
  .v2-home-cat-img img{ width:30vw; height:120px; }
}
@media (min-width:481px) and (max-width:768px){ .v2-home-cat-img{ width:100px; height:100px; } .v2-home-cat-img img{ width:110px; height:110px; } }

/* ---------- دو بنر ---------- */
.v2-home-banners{ display:flex; flex-wrap:wrap; justify-content:center; gap:15px; padding:20px; background:var(--v2-surface); }
.v2-home-banner{ flex:1; min-width:300px; max-width:720px; border-radius:12px; overflow:hidden; }
.v2-home-banner picture, .v2-home-banner img{ display:block; width:100%; height:auto; max-height:280px; object-fit:cover; }

/* ---------- بنرهای عریض: چرخ‌فلک سه‌بعدی (همان hjg-wide-carousel قبلی) ---------- */
.v2-home-wide{
  position:relative; max-width:1400px; margin:0 auto; padding:58px 0 94px; overflow:hidden;
  border-bottom:10px solid var(--v2-surface); direction:ltr; user-select:none;
}
.v2-home-wide-stage{
  position:relative; width:100%; height:clamp(185px, 21.5vw, 330px);
  perspective:1600px; transform-style:preserve-3d; cursor:grab; touch-action:pan-y;
}
.v2-home-wide-stage:active{ cursor:grabbing; }
.v2-home-wide-slide{
  position:absolute; top:50%; left:50%; width:clamp(540px, 56vw, 820px); max-width:calc(100vw - 96px);
  opacity:0; pointer-events:none; z-index:0; filter:saturate(.88) brightness(.94);
  transform:translate3d(-50%, -50%, -360px) scale(.58);
  transition:transform .62s cubic-bezier(.22,.8,.22,1), opacity .45s ease, filter .45s ease;
  backface-visibility:hidden;
}
.v2-home-wide-slide.is-active{ opacity:1; pointer-events:auto; z-index:5; filter:none; transform:translate3d(-50%, -50%, 30px) scale(.88); }
.v2-home-wide-slide.is-prev{ opacity:.78; pointer-events:auto; z-index:3; transform:translate3d(-50%, -50%, -95px) translateX(-48%) rotateY(15deg) scale(.72); }
.v2-home-wide-slide.is-next{ opacity:.78; pointer-events:auto; z-index:3; transform:translate3d(-50%, -50%, -95px) translateX(48%) rotateY(-15deg) scale(.72); }
.v2-home-wide-slide.is-prev2{ opacity:.22; z-index:1; transform:translate3d(-50%, -50%, -210px) translateX(-80%) rotateY(22deg) scale(.58); }
.v2-home-wide-slide.is-next2{ opacity:.22; z-index:1; transform:translate3d(-50%, -50%, -210px) translateX(80%) rotateY(-22deg) scale(.58); }
.v2-home-wide-card{
  display:block; position:relative; width:100%; aspect-ratio:16 / 5.8; border-radius:24px; overflow:hidden;
  background:var(--v2-surface-subtle); box-shadow:0 14px 32px rgba(0,0,0,.13);
}
.v2-home-wide-card picture, .v2-home-wide-card img{ display:block; width:100%; height:100%; }
.v2-home-wide-card img{ object-fit:cover; -webkit-user-drag:none; }
.v2-home-wide .v2-home-arrow{ top:calc(50% - 25px); display:none; opacity:1; color:var(--v2-home-title); box-shadow:0 4px 16px rgba(0,0,0,.2); }
.v2-home-wide .v2-home-arrow.is-prev{ left:24px; right:auto; }
.v2-home-wide .v2-home-arrow.is-next{ right:24px; left:auto; }
/* direction:ltr روی بخش: «قبلی» سمت چپ است؛ آیکون‌ها را مطابق جهت برمی‌گردانیم */
.v2-home-wide .v2-home-arrow.is-prev .v2-icon{ transform:none; }
.v2-home-wide .v2-home-arrow.is-next .v2-icon{ transform:scaleX(-1); }
.v2-home-wide .v2-home-arrow:hover{ background:var(--v2-home-title); color:var(--v2-white); }
@media (hover:hover) and (min-width:769px){ .v2-home-wide .v2-home-arrow{ display:grid; } }
@media (max-width:768px){
  .v2-home-wide{ padding:24px 0 48px; }
  .v2-home-wide-stage{ height:clamp(135px, 38vw, 220px); perspective:900px; }
  .v2-home-wide-slide{ width:calc(100vw - 76px); }
  .v2-home-wide-slide.is-prev{ opacity:.38; transform:translate3d(-50%, -50%, -90px) translateX(-88%) rotateY(9deg) scale(.68); }
  .v2-home-wide-slide.is-next{ opacity:.38; transform:translate3d(-50%, -50%, -90px) translateX(88%) rotateY(-9deg) scale(.68); }
  .v2-home-wide-slide:is(.is-prev2, .is-next2){ opacity:0; }
  .v2-home-wide-card{ aspect-ratio:16 / 7.6; border-radius:16px; }
}

/* ---------- برندهای محبوب: دو ردیف لوگوی متحرک ---------- */
.v2-home-brands{
  width:60%; margin:0 auto; padding-bottom:40px; overflow:hidden;
  -webkit-mask-image:linear-gradient(to right, transparent, #000 10%, #000 90%, transparent);
  mask-image:linear-gradient(to right, transparent, #000 10%, #000 90%, transparent);
}
.v2-home-brands-title{ margin:0; padding:40px 0; text-align:center; font-size:var(--v2-fs-22); font-weight:700; color:var(--v2-text); }
.v2-home-brands-row{ overflow:hidden; direction:ltr; }
.v2-home-brands-track{ display:flex; width:max-content; margin:0; padding:0; list-style:none; animation:v2-home-marquee 60s linear infinite; }
.v2-home-brands-row.is-reverse .v2-home-brands-track{ animation-direction:reverse; }
.v2-home-brands-track li{ flex:none; padding:0 35px; }
.v2-home-brands-track img{ display:block; width:120px; height:120px; object-fit:contain; border-radius:100px; }
@keyframes v2-home-marquee{ from{ transform:translateX(0); } to{ transform:translateX(-50%); } }
@media (max-width:768px){
  .v2-home-brands{ width:90%; }
  .v2-home-brands-track li{ padding:0 10px; }
  .v2-home-brands-track img{ width:60px; height:60px; }
}
@media (prefers-reduced-motion:reduce){
  .v2-home-brands-track{ animation:none; flex-wrap:wrap; justify-content:center; width:auto; }
  .v2-home-brands-track li[aria-hidden="true"]{ display:none; }
  .v2-home-wide-slide{ transition:none; }
}
