/* ========== استایل اختصاصی ماه‌رخ ========== */
:root {
  --ink: #10201a; --pine: #1b332a; --moss: #2e4a3c;
  --cream: #f3ecdf; --paper: #faf6ec; --linen: #ece2cf;
  --gold: #c29a4b; --goldsoft: #e8d3a8; --blush: #d8a08f; --line: #ddd2bc;
}
html { scroll-behavior: smooth; }
body { font-family: 'Vazirmatn', Tahoma, sans-serif; background: var(--color-paper, #faf6ec); color: var(--ink); overflow-x: clip; }

/* بخش‌های انباشته: هر بخش فیکس می‌ماند و بخش بعدی با سایه روی آن می‌لغزد */
.stacked { position: sticky; box-shadow: 0 -30px 70px -25px rgba(10, 20, 15, .55); }
::selection { background: var(--gold); color: var(--ink); }
::-webkit-scrollbar { width: 10px; } ::-webkit-scrollbar-track { background: var(--cream); } ::-webkit-scrollbar-thumb { background: var(--gold); border-radius: 8px; }

.rr-a { border-radius: 2.5rem 2.5rem 2.5rem 0.75rem; }
.rr-b { border-radius: 0.75rem 2.5rem 2.5rem 2.5rem; }
.rr-c { border-radius: 2.5rem 0.75rem 2.5rem 2.5rem; }
.rr-d { border-radius: 2rem 2rem 0.6rem 2rem; }
.rr-tilt { border-radius: 3rem 3rem 3rem 1rem; }

.stroke-gold { -webkit-text-stroke: 1.5px rgba(194,154,75,.75); color: transparent; }

.noise::after { content: ""; position: absolute; inset: 0; pointer-events: none; opacity: .05;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='140' height='140' filter='url(%23n)'/%3E%3C/svg%3E"); }

.rv { opacity: 0; transform: translateY(34px); transition: all .9s cubic-bezier(.2,.65,.25,1); transition-delay: var(--d, 0ms); }
.rv.on { opacity: 1; transform: none; }
.rv-l { opacity: 0; transform: translateX(-40px); transition: all .9s cubic-bezier(.2,.65,.25,1); }
.rv-l.on { opacity: 1; transform: none; }
.rv-r { opacity: 0; transform: translateX(40px); transition: all .9s cubic-bezier(.2,.65,.25,1); }
.rv-r.on { opacity: 1; transform: none; }

@keyframes marqueeL { from { transform: translateX(0); } to { transform: translateX(-50%); } }
.marquee { animation: marqueeL 26s linear infinite; }
.marquee-slow { animation: marqueeL 44s linear infinite; }

/* ---------- FlipCard ---------- */
.flip-card { perspective: 1100px; cursor: pointer; position: relative; width: 100%; }
.flip-rotor { position: relative; width: 100%; height: 100%; transform-style: preserve-3d; transition: transform .8s cubic-bezier(.2,.65,.25,1); }
.flip-rotor.is-flipped { transform: rotateY(180deg); }
.flip-face { position: absolute; inset: 0; backface-visibility: hidden; -webkit-backface-visibility: hidden; border-radius: 24px; overflow: hidden; background: var(--pine); box-shadow: 0 30px 60px -20px rgba(10,20,15,.55); }
.flip-face img { width: 100%; height: 100%; object-fit: cover; }
.flip-back { transform: rotateY(180deg); background: linear-gradient(160deg, var(--pine), var(--ink)); display: flex; align-items: center; justify-content: center; padding: 1.2rem; text-align: center; color: var(--cream); }
.flip-glare { position: absolute; inset: 0; pointer-events: none; background: radial-gradient(420px circle at var(--gx,50%) var(--gy,50%), rgba(232,211,164,.25), transparent 65%); }

/* ---------- ChromaGrid ---------- */
.chroma-grid { position: relative; display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.2rem; --x: 50%; --y: 50%; }
@media (max-width: 900px) { .chroma-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 560px) { .chroma-grid { grid-template-columns: 1fr; } }
.chroma-card { position: relative; border-radius: 1.4rem; overflow: hidden; background: var(--ink); border: 1px solid var(--card-border, transparent); transition: transform .45s, box-shadow .45s; }
.chroma-card:hover { transform: translateY(-6px) scale(1.02); box-shadow: 0 26px 50px -18px rgba(10,20,15,.6); }
.chroma-img { height: 240px; overflow: hidden; }
.chroma-img img { width: 100%; height: 100%; object-fit: cover; transition: transform 1s; }
.chroma-card:hover .chroma-img img { transform: scale(1.07); }
.chroma-info { padding: 1rem 1.1rem 1.2rem; color: var(--cream); }
.chroma-info h3 { font-weight: 900; }
.chroma-info p { color: rgba(243,236,223,.65); font-size: 12px; margin-top: .3rem; line-height: 1.8; }
.chroma-grid > .chroma-overlay { position: absolute; inset: 0; pointer-events: none; background: radial-gradient(320px circle at var(--x) var(--y), rgba(232,211,164,.14), transparent 70%); }
@media (hover: none) { .chroma-card { border-color: var(--card-border); } .chroma-grid > .chroma-overlay { background: linear-gradient(140deg, rgba(232,211,164,.08), transparent 60%); } }

/* ---------- بلندشدن آیتم گالری ---------- */
.lift { transition: transform .5s cubic-bezier(.2,.65,.25,1), box-shadow .5s, filter .5s; }
.lift:hover { transform: scale(1.07) rotate(-1deg); box-shadow: 0 40px 80px -20px rgba(5,12,9,.75), 0 0 0 1px rgba(232,211,164,.35); z-index: 30; position: relative; filter: saturate(1.08); }

/* ---------- نوار افقی نظرات ---------- */
.hstrip { scrollbar-width: thin; scrollbar-color: var(--gold) transparent; }
.hstrip::-webkit-scrollbar { height: 8px; }
.hstrip::-webkit-scrollbar-thumb { background: var(--gold); border-radius: 8px; }
.hstrip::-webkit-scrollbar-track { background: rgba(16, 32, 26, .08); border-radius: 8px; }
.hstrip.dragging { cursor: grabbing; user-select: none; }

/* ---------- نوار افزونه‌های لومیر ---------- */
@keyframes kenburns { 0% { transform: scale(1); } 100% { transform: scale(1.12) translateY(-2%); } }
.kenburns { animation: kenburns 14s ease-in-out infinite alternate; }
@keyframes floaty { 0%,100% { transform: translateY(0); } 50% { transform: translateY(-14px); } }
.floaty { animation: floaty 6s ease-in-out infinite; }
.floaty2 { animation: floaty 7.5s ease-in-out 1.2s infinite; }
@keyframes spinSlow { to { transform: rotate(360deg); } }
.spin-slow { animation: spinSlow 16s linear infinite; }
@keyframes pulseSoft { 0%,100% { opacity:.5; transform:scale(1);} 50% { opacity:1; transform:scale(1.06);} }
.pulse-soft { animation: pulseSoft 3.5s ease-in-out infinite; }
@keyframes popIn { from { opacity:0; transform:scale(.92) translateY(14px);} to { opacity:1; transform:none;} }
.pop-in { animation: popIn .45s cubic-bezier(.2,.65,.25,1) both; }

.btn-gold { display: inline-flex; align-items: center; gap: .5rem; justify-content: center;
  background: linear-gradient(135deg, var(--gold), #a97f33); color: #fff8ea; font-weight: 700;
  border-radius: 999px; padding: .8rem 1.7rem; transition: all .35s; box-shadow: 0 10px 26px -10px rgba(194,154,75,.65); }
.btn-gold:hover { transform: translateY(-3px); box-shadow: 0 16px 34px -10px rgba(194,154,75,.8); }
.btn-ghost { display: inline-flex; align-items: center; gap: .5rem; justify-content: center;
  border: 1.5px solid currentColor; border-radius: 999px; padding: .8rem 1.7rem; font-weight: 600; transition: all .35s; }
.btn-ghost:hover { background: rgba(255,255,255,.08); transform: translateY(-3px); }

.inp { width: 100%; background: #fffdf6; border: 1.5px solid var(--line); border-radius: 1rem; padding: .7rem 1rem; font-size: .9rem; transition: all .25s; color: var(--ink); font-family: inherit; }
.inp:focus { outline: none; border-color: var(--gold); box-shadow: 0 0 0 4px rgba(194,154,75,.15); }

.card-hover { transition: transform .5s cubic-bezier(.2,.65,.25,1), box-shadow .5s; }
.card-hover:hover { transform: translateY(-8px) rotate(-.5deg); box-shadow: 0 24px 48px -20px rgba(16,32,26,.35); }
.img-zoom img { transition: transform 1.1s cubic-bezier(.2,.65,.25,1); }
.img-zoom:hover img { transform: scale(1.08) rotate(.5deg); }

.desk-cal { transform: perspective(1400px) rotateX(2deg); }
.slot-chip { transition: all .3s; }
.slot-chip:not(:disabled):hover { transform: translateY(-3px) scale(1.04); }

/* هدر شفاف →blur */
#nav { background: transparent; }
#nav.solid { background: rgba(16, 32, 26, .8); backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px); box-shadow: 0 10px 30px -12px rgba(16,32,26,.5); }

/* آیکون svg پایه */
.ic { width: 1.25rem; height: 1.25rem; stroke: currentColor; fill: none; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; vertical-align: middle; }