/* ═══════════════════════════════════════════
   🖼️ Gallery Wall — نمایشگاه دیواری
   ═══════════════════════════════════════════ */

.gallery-wall-section{
  position:relative;
  width:100%;
  height:100vh;
  min-height:700px;
  overflow:hidden;
  background:#0c0a09;
  isolation:isolate;
  
  /* متغیرهای داخلی */
  --gold:#d4a574;
  --gold-2:#f0d3a4;
  --accent:#e63946;
  --text:#f1ece4;
  --muted:#9a9186;
  --W:300px;
  --H:375px;
  --B:4px;
}

/* ── عنوان بالای گالری ── */
.gw-heading{
  position:absolute;
  top:36px;
  left:0; right:0;
  z-index:50;
  text-align:center;
  padding:0 6vw;
  pointer-events:none;
}
.gw-heading .num{
  color:#e63946;
  font-weight:700;
  font-size:.8rem;
  letter-spacing:3px;
}
.gw-heading h2{
  font-size:clamp(1.3rem,2.8vw,2rem);
  margin-top:6px;
  font-weight:800;
  color:#f1ece4;
}
.gw-heading p{
  color:#9a9186;
  margin-top:6px;
  font-size:.85rem;
  max-width:600px;
  margin-left:auto;
  margin-right:auto;
}

/* ── دیوار ── */
.gw-wall{
  position:absolute;
  inset:0 0 22% 0;
  background:radial-gradient(70% 80% at 50% 38%,#2d2621 0%,#1c1815 60%,#120f0d 100%);
}
.gw-wall::after{
  content:"";
  position:absolute;
  inset:0;
  opacity:.12;
  mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='220' height='220'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>");
}

.gw-track{
  position:absolute;
  top:0; left:0; right:0;
  height:10px;
  z-index:30;
  background:linear-gradient(#3a3532,#161312);
  box-shadow:0 4px 14px rgba(0,0,0,.7);
}

.gw-lamp{
  position:absolute;
  top:6px; left:50%;
  width:46px; height:22px;
  transform:translateX(-50%);
  z-index:31;
  border-radius:0 0 22px 22px;
  background:linear-gradient(#4a4440,#1a1614);
  box-shadow:0 8px 40px 10px rgba(255,214,150,.55);
}

.gw-spot{
  position:absolute;
  top:0; left:50%;
  width:calc(var(--W) * 2.6);
  height:78%;
  transform:translateX(-50%);
  z-index:5;
  pointer-events:none;
  background:linear-gradient(rgba(255,226,170,.34),rgba(255,226,170,.07) 70%,transparent);
  clip-path:polygon(46% 0,54% 0,100% 100%,0 100%);
  filter:blur(16px);
  mix-blend-mode:screen;
}

.gw-rail{
  position:absolute;
  left:0; right:0;
  bottom:22%;
  height:12px;
  z-index:2;
  background:linear-gradient(#7a5b34,#3b2a15 60%,#1a1209);
  box-shadow:0 -2px 10px rgba(0,0,0,.6);
}

.gw-wainscot{
  position:absolute;
  left:0; right:0;
  bottom:6%;
  height:calc(16% - 12px);
  z-index:2;
  background:
    repeating-linear-gradient(90deg,transparent 0 calc(var(--W)*.9),rgba(0,0,0,.35) calc(var(--W)*.9) calc(var(--W)*.9 + 3px)),
    linear-gradient(#17120f,#0f0c0a);
}

.gw-floor{
  position:absolute;
  left:0; right:0;
  bottom:0;
  height:6%;
  z-index:2;
  background:
    repeating-linear-gradient(90deg,#2a1d12 0 90px,#22170e 90px 92px),
    linear-gradient(rgba(255,214,150,.18),transparent);
}

.gw-glow{
  position:absolute;
  left:50%; bottom:0;
  width:calc(var(--W) * 2.4);
  height:12%;
  transform:translateX(-50%);
  z-index:3;
  pointer-events:none;
  background:radial-gradient(ellipse,rgba(255,214,150,.35),transparent 70%);
}

/* ── استیج ── */
.gw-stage{
  position:absolute;
  left:0; right:0;
  top:9%;
  height:calc(var(--H) + 60px);
  z-index:10;
  perspective:1600px;
  cursor:grab;
  touch-action:pan-y;
}
.gw-stage.drag{cursor:grabbing}

.gw-frame{
  position:absolute;
  left:50%; top:50%;
  width:max-content;
  padding:var(--B);
  border-radius:2px;
  will-change:transform,opacity,filter;
  background:linear-gradient(135deg,#f0d3a4,#9a6b2f 38%,#d9b27c 58%,#5c3d18);
  box-shadow:0 46px 60px -24px rgba(0,0,0,.9),0 0 0 1px rgba(0,0,0,.55),inset 0 0 0 2px rgba(255,235,200,.28);
}
.gw-frame.on{
  box-shadow:0 56px 80px -20px rgba(0,0,0,.95),0 0 90px rgba(255,214,150,.22),0 0 0 1px rgba(0,0,0,.55),inset 0 0 0 2px rgba(255,235,200,.4);
}

.gw-mat{
  background:linear-gradient(#f0eadf,#e2dacb);
  box-shadow:inset 0 0 0 1px rgba(0,0,0,.22),inset 0 3px 16px rgba(0,0,0,.35);
}

.gw-in{
  overflow:hidden;
  position:relative;
  background:linear-gradient(135deg,hsl(var(--h) 60% 36%),hsl(calc(var(--h) + 50) 55% 16%));
  box-shadow:0 0 0 1px rgba(0,0,0,.55),0 0 0 3px rgba(255,255,255,.6),0 3px 12px rgba(0,0,0,.45);
}
.gw-in img{
  width:100%; height:100%;
  object-fit:cover;
  display:block;
  pointer-events:none;
  -webkit-user-drag:none;
}
.gw-in::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(115deg,transparent 38%,rgba(255,255,255,.2) 50%,transparent 62%);
  transform:translateX(-130%);
}
.gw-frame.on .gw-in::after{
  transform:translateX(130%);
  transition:transform 1.1s .25s;
}

/* ── پلاک ── */
.gw-plaque{
  position:absolute;
  left:0; right:0;
  bottom:2.2%;
  z-index:20;
  text-align:center;
  pointer-events:none;
}
.gw-lot{
  display:inline-block;
  font-size:.72rem;
  letter-spacing:3px;
  color:var(--gold);
  border:1px solid rgba(212,165,116,.5);
  padding:2px 12px;
  border-radius:2px;
}
.gw-plaque h2{
  font-size:clamp(1.15rem,2.6vw,1.7rem);
  font-weight:800;
  margin:6px 0 2px;
  color:var(--text);
  transition:opacity .3s,transform .3s;
}
.gw-plaque p{
  color:var(--muted);
  font-size:.82rem;
}
.gw-plaque .gw-sw{
  opacity:0;
  transform:translateY(6px);
}
.gw-bar{
  width:150px; height:2px;
  background:rgba(255,255,255,.12);
  margin:10px auto 0;
  border-radius:2px;
  overflow:hidden;
}
.gw-bar i{
  display:block;
  height:100%;
  width:0;
  background:linear-gradient(90deg,var(--accent),var(--gold));
}

/* ── کنترل‌ها ── */
.gw-nav{
  position:absolute;
  top:calc(9% + var(--H)/2 + 30px);
  transform:translateY(-50%);
  z-index:40;
  width:46px; height:46px;
  border-radius:50%;
  background:rgba(0,0,0,.45);
  border:1px solid rgba(212,165,116,.35);
  color:var(--gold-2);
  font-size:1.3rem;
  cursor:pointer;
  backdrop-filter:blur(6px);
  transition:.25s;
}
.gw-nav:hover{background:var(--gold); color:#1a1209}
#gwPrev{left:2.5vw}
#gwNext{right:2.5vw}

.gw-dots{
  position:absolute;
  top:14px; left:50%;
  transform:translateX(-50%);
  z-index:40;
  display:flex;
  gap:7px;
}
.gw-dots button{
  width:7px; height:7px;
  border-radius:50%;
  border:0;
  background:rgba(255,255,255,.22);
  cursor:pointer;
  padding:0;
  transition:.3s;
}
.gw-dots button.on{
  background:var(--gold);
  width:22px;
  border-radius:4px;
}

.gw-zoom{
  position:absolute;
  inset:0;
  z-index:100;
  background:rgba(5,4,3,.94);
  display:none;
  align-items:center;
  justify-content:center;
  cursor:zoom-out;
}
.gw-zoom.open{display:flex}
.gw-zoom img{
  max-width:92%;
  max-height:90%;
  box-shadow:0 0 80px rgba(0,0,0,.8);
}

/* ── دکمه‌ی «نمایش همه» — بالای خط طلایی ── */
.gw-viewall{
  position:absolute;
  bottom:calc(22% + 24px);
  left:50%;
  transform:translateX(-50%);
  z-index:45;
  padding:16px 48px;
  background:rgba(15,15,20,.85);
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
  border:1px solid rgba(212,165,116,.5);
  border-radius:100px;
  color:var(--gold);
  font-size:1.05rem;
  font-weight:700;
  letter-spacing:0.5px;
  text-decoration:none;
  transition:.25s;
  pointer-events:auto;
  box-shadow:0 10px 40px rgba(0,0,0,.5);
}
.gw-viewall:hover{
  background:var(--gold);
  color:#1a1209;
  border-color:var(--gold);
  transform:translateX(-50%) translateY(-3px);
  box-shadow:0 15px 50px rgba(212,165,116,.4);
}

/* ── موبایل ── */
@media(max-width:700px){
  .gw-heading{top:24px}
  .gw-heading h2{font-size:1.2rem}
  .gw-heading p{font-size:.78rem}
  .gw-nav{width:38px; height:38px}
  #gwPrev{left:1vw}
  #gwNext{right:1vw}
  .gw-dots{display:none}
  .gw-bar{width:110px}
  .gw-viewall{bottom:calc(22% + 16px); font-size:.9rem; padding:12px 32px}
}