/* ==========================================================================
   پکیج پس‌زمینه‌ی بخش‌ها — Pardis Section Backgrounds
   هر بخش: <section class="pd-sbg pd-sbg--{preset}"> + <div class="pd-sbg-layer">
   متغیرها: --sbg-c1/c2/c3 (r,g,b)  --sbg-o (شدت)  --sbg-base-l / --sbg-base-d
   ========================================================================== */

@property --pd-r { syntax: '<length>'; inherits: false; initial-value: 0px; }
@property --pd-ang { syntax: '<angle>'; inherits: false; initial-value: 0deg; }

.pd-sbg {
	--sbg-c1: 91, 48, 246;
	--sbg-c2: 20, 184, 196;
	--sbg-c3: 255, 184, 0;
	--sbg-o: 1;
	--sbg-base: var(--sbg-base-l, #f8f7fe);
	--sbg-base2: color-mix(in srgb, var(--sbg-base) 92%, rgb(var(--sbg-c1)) 8%);
	--sbg-ink: 30, 28, 58;
	position: relative;
	isolation: isolate;
	overflow: hidden;
}
.dark .pd-sbg {
	--sbg-base: var(--sbg-base-d, #0f0e1a);
	--sbg-base2: color-mix(in srgb, var(--sbg-base) 88%, rgb(var(--sbg-c1)) 12%);
	--sbg-ink: 255, 255, 255;
}
section.pd-sbg.pd-sbg,
.pd-sbg-thumb .pd-sbg {
	background: linear-gradient(180deg, var(--sbg-base) 0%, var(--sbg-base2) 50%, var(--sbg-base) 100%) !important;
	background-color: var(--sbg-base) !important;
}
/* پترن‌های قدیمی بخش‌ها (نقطه‌های ::before و درخشش‌ها) در حالت جدید حذف می‌شوند */
section.pd-sbg::before { content: none !important; }
section.pd-sbg.pricing-section::after { content: none !important; }

.pd-sbg-layer {
	position: absolute;
	inset: 0;
	z-index: 0;
	overflow: hidden;
	pointer-events: none;
	contain: strict;
}
.pd-sbg-layer > * { position: absolute; display: block; pointer-events: none; }
section.pd-sbg > :not(.pd-sbg-layer) { position: relative; z-index: 1; }

/* بافت نویز ظریف */
.pd-sbg--grain .pd-sbg-layer::after {
	content: "";
	position: absolute;
	inset: 0;
	opacity: .045;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 .9 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}
.dark .pd-sbg--grain .pd-sbg-layer::after { opacity: .035; filter: invert(1); }

/* لبه‌های نرم بالا/پایین برای ادغام با بخش‌های مجاور */
.pd-sbg-layer::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 5;
	background: linear-gradient(180deg, var(--sbg-base) 0, transparent 70px, transparent calc(100% - 70px), var(--sbg-base) 100%);
}
.pd-sbg--waves .pd-sbg-layer::before,
.pd-sbg--image .pd-sbg-layer::before { background: linear-gradient(180deg, var(--sbg-base) 0, transparent 60px); }

/* ---------------------------------------------------------------- aurora
   فقط transform متحرک است (بدون filter:blur و بدون انیمیشن background-position)
   تا روی GPU اجرا شود و اسکرول را سنگین نکند. */
.pd-au-mask {
	inset: -25% -5% auto -5%;
	height: 130%;
	overflow: hidden;
	-webkit-mask-image: radial-gradient(ellipse 95% 80% at 50% 45%, #000 25%, transparent 80%);
	mask-image: radial-gradient(ellipse 95% 80% at 50% 45%, #000 25%, transparent 80%);
}
.pd-au {
	position: absolute;
	top: 0; bottom: 0; left: 0;
	width: 200%;
	opacity: calc(.9 * var(--sbg-o));
	background-image: linear-gradient(100deg,
		rgba(var(--sbg-c1), 0) 0%, rgba(var(--sbg-c1), .45) 8%, rgba(var(--sbg-c2), .38) 16%, rgba(var(--sbg-c1), 0) 25%,
		rgba(var(--sbg-c3), .3) 33%, rgba(var(--sbg-c1), .42) 41%, rgba(var(--sbg-c1), 0) 50%,
		rgba(var(--sbg-c1), .45) 58%, rgba(var(--sbg-c2), .38) 66%, rgba(var(--sbg-c1), 0) 75%,
		rgba(var(--sbg-c3), .3) 83%, rgba(var(--sbg-c1), .42) 91%, rgba(var(--sbg-c1), 0) 100%);
	animation: pd-aurora 40s linear infinite;
	will-change: transform;
}
.pd-au--2 {
	top: 22%;
	opacity: calc(.45 * var(--sbg-o));
	animation-duration: 56s;
	animation-direction: reverse;
}
.pd-au-glow {
	width: 70%; height: 60%; left: 15%; top: -10%;
	background: radial-gradient(ellipse at center, rgba(var(--sbg-c1), calc(.14 * var(--sbg-o))), transparent 70%);
}
.dark .pd-au { opacity: calc(.55 * var(--sbg-o)); }
@keyframes pd-aurora { from { transform: translate3d(0, 0, 0); } to { transform: translate3d(50%, 0, 0); } }

/* ------------------------------------------------------------------ mesh */
.pd-blob {
	width: min(620px, 60vw);
	aspect-ratio: 1;
	border-radius: 50%;
	opacity: var(--sbg-o);
	background: radial-gradient(circle at 50% 50%, rgba(var(--c), .26) 0%, rgba(var(--c), .1) 38%, transparent 68%);
	animation: pd-drift var(--t, 26s) ease-in-out infinite alternate;
	will-change: transform;
}
.pd-blob--1 { --c: var(--sbg-c1); top: -22%; right: -8%; --t: 24s; }
.pd-blob--2 { --c: var(--sbg-c2); bottom: -28%; left: -10%; --t: 30s; animation-delay: -8s; }
.pd-blob--3 { --c: var(--sbg-c3); top: 28%; left: 34%; width: min(420px, 45vw); --t: 34s; animation-delay: -14s; }
.pd-blob--4 { --c: var(--sbg-c1); bottom: -10%; right: 22%; width: min(380px, 40vw); --t: 28s; animation-delay: -4s; }
.dark .pd-blob { background: radial-gradient(circle, rgba(var(--c), .32) 0%, rgba(var(--c), .12) 38%, transparent 68%); }
@keyframes pd-drift {
	0%   { transform: translate3d(0, 0, 0) scale(1); }
	33%  { transform: translate3d(6%, 8%, 0) scale(1.12); }
	66%  { transform: translate3d(-8%, 3%, 0) scale(.92); }
	100% { transform: translate3d(4%, -6%, 0) scale(1.05); }
}

/* ------------------------------------------------------------------ grid */
.pd-grid {
	inset: 0;
	--cell: 56px;
	background-image:
		linear-gradient(rgba(var(--sbg-c1), calc(.11 * var(--sbg-o))) 1px, transparent 1px),
		linear-gradient(90deg, rgba(var(--sbg-c1), calc(.11 * var(--sbg-o))) 1px, transparent 1px);
	background-size: var(--cell) var(--cell);
	background-position: calc(50% + .5px) -1px;
	-webkit-mask-image: radial-gradient(ellipse 75% 70% at 50% 30%, #000 20%, transparent 78%);
	mask-image: radial-gradient(ellipse 75% 70% at 50% 30%, #000 20%, transparent 78%);
}
.dark .pd-grid {
	background-image:
		linear-gradient(rgba(255, 255, 255, calc(.07 * var(--sbg-o))) 1px, transparent 1px),
		linear-gradient(90deg, rgba(255, 255, 255, calc(.07 * var(--sbg-o))) 1px, transparent 1px);
}
.pd-grid-spot {
	width: 46%; height: 70%; top: -12%; left: 27%;
	background: radial-gradient(ellipse at center, rgba(var(--sbg-c1), calc(.18 * var(--sbg-o))), rgba(var(--sbg-c2), calc(.06 * var(--sbg-o))) 45%, transparent 70%);
	animation: pd-spot 16s ease-in-out infinite alternate;
}
@keyframes pd-spot { 0% { transform: translateX(-22%); } 100% { transform: translateX(22%); } }
.pd-gbeam { opacity: calc(.9 * var(--sbg-o)); }
.pd-gbeam--v {
	width: 1px; height: 130px; top: -140px;
	left: calc(50% + var(--i) * 56px);
	background: linear-gradient(180deg, transparent, rgba(var(--sbg-c1), .9) 70%, rgba(var(--sbg-c2), 1));
	animation: pd-beam-v 7s cubic-bezier(.45, 0, .55, 1) infinite;
	animation-delay: calc(var(--i) * -.9s);
}
.pd-gbeam--h {
	height: 1px; width: 140px; right: -150px;
	top: calc(var(--i) * 56px - 1px);
	background: linear-gradient(270deg, transparent, rgba(var(--sbg-c2), .9) 70%, rgba(var(--sbg-c1), 1));
	animation: pd-beam-h 9s cubic-bezier(.45, 0, .55, 1) infinite;
	animation-delay: calc(var(--i) * -1.7s);
}
@keyframes pd-beam-v { 0% { transform: translateY(0); } 70%, 100% { transform: translateY(calc(100vh + 400px)); } }
@keyframes pd-beam-h { 0% { transform: translateX(0); } 70%, 100% { transform: translateX(calc(-100vw - 400px)); } }

/* ------------------------------------------------------------------ dots */
.pd-dots {
	inset: 0;
	background-image: radial-gradient(rgba(var(--sbg-c1), calc(.28 * var(--sbg-o))) 1.3px, transparent 1.8px);
	background-size: 22px 22px;
	background-position: center;
	-webkit-mask-image: radial-gradient(ellipse 80% 75% at 50% 50%, #000 25%, transparent 80%);
	mask-image: radial-gradient(ellipse 80% 75% at 50% 50%, #000 25%, transparent 80%);
}
.dark .pd-dots { background-image: radial-gradient(rgba(255, 255, 255, calc(.16 * var(--sbg-o))) 1.3px, transparent 1.8px); }
.pd-dots--wave {
	background-image: radial-gradient(rgba(var(--sbg-c2), calc(.9 * var(--sbg-o))) 1.8px, transparent 2.4px);
	-webkit-mask-image: radial-gradient(circle at 50% 55%, transparent calc(var(--pd-r) - 90px), #000 var(--pd-r), transparent calc(var(--pd-r) + 20px));
	mask-image: radial-gradient(circle at 50% 55%, transparent calc(var(--pd-r) - 90px), #000 var(--pd-r), transparent calc(var(--pd-r) + 20px));
	animation: pd-ripple 6s cubic-bezier(.3, 0, .4, 1) infinite;
}
@keyframes pd-ripple { from { --pd-r: 0px; } to { --pd-r: 1100px; } }
.pd-dots-glow {
	width: 50%; height: 80%; left: 25%; top: 10%;
	background: radial-gradient(ellipse, rgba(var(--sbg-c1), calc(.1 * var(--sbg-o))), transparent 70%);
}

/* ----------------------------------------------------------------- waves */
.pd-wave-glow {
	inset: 0;
	background:
		radial-gradient(ellipse 50% 40% at 85% 10%, rgba(var(--sbg-c1), calc(.12 * var(--sbg-o))), transparent 70%),
		radial-gradient(ellipse 40% 35% at 10% 30%, rgba(var(--sbg-c2), calc(.1 * var(--sbg-o))), transparent 70%);
}
.pd-waves { left: 0; right: 0; bottom: 0; height: 230px; }
.pd-wave {
	position: absolute;
	bottom: 0; left: 0;
	width: 200%;
	height: 100%;
	animation: pd-wave-x 22s linear infinite;
	will-change: transform;
}
.pd-wave path { fill: rgba(var(--sbg-c1), calc(.07 * var(--sbg-o))); }
.pd-wave--2 { height: 80%; animation-duration: 16s; animation-direction: reverse; }
.pd-wave--2 path { fill: rgba(var(--sbg-c2), calc(.08 * var(--sbg-o))); }
.pd-wave--3 { height: 58%; animation-duration: 11s; }
.pd-wave--3 path { fill: rgba(var(--sbg-c3), calc(.1 * var(--sbg-o))); }
.dark .pd-wave path { fill: rgba(var(--sbg-c1), calc(.14 * var(--sbg-o))); }
@keyframes pd-wave-x { from { transform: translateX(0); } to { transform: translateX(-50%); } }
.pd-waves::after {
	content: ""; position: absolute; inset: auto 0 0 0; height: 1px;
	background: linear-gradient(90deg, transparent, rgba(var(--sbg-c1), .25), transparent);
}

/* ------------------------------------------------------------------ topo */
.pd-topo {
	inset: -10% -5%;
	background: rgba(var(--sbg-c1), calc(.2 * var(--sbg-o)));
	-webkit-mask: url("../images/sbg/topo.svg") center / cover no-repeat;
	mask: url("../images/sbg/topo.svg") center / cover no-repeat;
	animation: pd-topo 60s ease-in-out infinite alternate;
}
.dark .pd-topo { background: rgba(255, 255, 255, calc(.1 * var(--sbg-o))); }
.pd-topo--hi {
	background: linear-gradient(90deg, rgba(var(--sbg-c2), 0) 20%, rgba(var(--sbg-c2), calc(.85 * var(--sbg-o))) 50%, rgba(var(--sbg-c1), 0) 80%);
	background-size: 250% 100%;
	animation: pd-topo 60s ease-in-out infinite alternate, pd-topo-scan 9s linear infinite;
}
@keyframes pd-topo { from { transform: translate3d(0, 0, 0) scale(1); } to { transform: translate3d(-3%, 2%, 0) scale(1.06); } }
@keyframes pd-topo-scan { from { background-position: 150% 0; } to { background-position: -150% 0; } }
.pd-topo-glow {
	inset: 0;
	background: radial-gradient(ellipse 45% 50% at 80% 20%, rgba(var(--sbg-c1), calc(.1 * var(--sbg-o))), transparent 70%),
		radial-gradient(ellipse 40% 45% at 15% 85%, rgba(var(--sbg-c2), calc(.08 * var(--sbg-o))), transparent 70%);
}

/* ------------------------------------------------------------------- hex */
.pd-hex {
	inset: 0;
	background: rgba(var(--sbg-c1), calc(.16 * var(--sbg-o)));
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='56' height='98'%3E%3Cpath d='M28 66L0 50V16L28 0l28 16v34L28 66zm0 32V66' fill='none' stroke='%23000' stroke-width='1.2'/%3E%3C/svg%3E"), radial-gradient(ellipse 80% 75% at 50% 45%, #000 20%, transparent 80%);
	-webkit-mask-composite: source-in;
	mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='56' height='98'%3E%3Cpath d='M28 66L0 50V16L28 0l28 16v34L28 66zm0 32V66' fill='none' stroke='%23000' stroke-width='1.2'/%3E%3C/svg%3E"), radial-gradient(ellipse 80% 75% at 50% 45%, #000 20%, transparent 80%);
	mask-composite: intersect;
	-webkit-mask-size: 56px 98px, 100% 100%;
	mask-size: 56px 98px, 100% 100%;
	-webkit-mask-repeat: repeat, no-repeat;
	mask-repeat: repeat, no-repeat;
}
.dark .pd-hex { background: rgba(255, 255, 255, calc(.09 * var(--sbg-o))); }
.pd-hexcell {
	left: var(--x); top: var(--y);
	width: 120px; height: 138px;
	clip-path: polygon(50% 0, 100% 25%, 100% 75%, 50% 100%, 0 75%, 0 25%);
	background: radial-gradient(circle, rgba(var(--c), calc(.22 * var(--sbg-o))), rgba(var(--c), .02) 70%);
	opacity: 0;
	animation: pd-hexpulse 8s ease-in-out infinite;
	animation-delay: var(--d);
}
@keyframes pd-hexpulse { 0%, 100% { opacity: 0; transform: scale(.8); } 40%, 60% { opacity: 1; transform: scale(1); } }

/* --------------------------------------------------------------- circuit */
.pd-circuit { inset: 0; width: 100%; height: 100%; }
.pd-circuit__base path { fill: none; stroke: rgba(var(--sbg-c1), calc(.2 * var(--sbg-o))); stroke-width: 1.5; }
.dark .pd-circuit__base path { stroke: rgba(255, 255, 255, calc(.1 * var(--sbg-o))); }
.pd-circuit__pulse path {
	fill: none;
	stroke: rgb(var(--sbg-c2));
	stroke-width: 2.2;
	stroke-linecap: round;
	stroke-dasharray: 70 930;
	stroke-dashoffset: 1000;
	opacity: calc(.85 * var(--sbg-o));
	filter: drop-shadow(0 0 4px rgba(var(--sbg-c2), .8));
	animation: pd-pulse var(--t, 5s) linear infinite;
	animation-delay: calc(var(--d, 0s) * -1);
}
.pd-circuit__pulse path:nth-child(3n) { stroke: rgb(var(--sbg-c1)); filter: drop-shadow(0 0 4px rgba(var(--sbg-c1), .8)); }
@keyframes pd-pulse { to { stroke-dashoffset: 0; } }
.pd-circuit__nodes circle {
	fill: var(--sbg-base);
	stroke: rgba(var(--sbg-c1), calc(.55 * var(--sbg-o)));
	stroke-width: 2;
	transform-box: fill-box;
	transform-origin: center;
	animation: pd-node 3s ease-in-out infinite;
	animation-delay: var(--d);
}
@keyframes pd-node { 0%, 100% { transform: scale(1); } 50% { transform: scale(1.5); stroke: rgb(var(--sbg-c2)); } }
.pd-circuit-glow { inset: 0; background: radial-gradient(ellipse 45% 50% at 50% 40%, rgba(var(--sbg-c1), calc(.08 * var(--sbg-o))), transparent 70%); }

/* ----------------------------------------------------------------- beams */
.pd-beam-top {
	left: 10%; right: 10%; top: -30%; height: 60%;
	background: radial-gradient(ellipse 50% 50% at 50% 50%, rgba(var(--sbg-c1), calc(.32 * var(--sbg-o))), transparent 70%);
}
.pd-beams { left: 50%; top: -12%; width: 0; height: 120%; }
.pd-beam {
	position: absolute;
	top: 0; left: -110px;
	width: 220px; height: 100%;
	transform-origin: 50% 0;
	background: linear-gradient(90deg, transparent, rgba(var(--c, var(--sbg-c1)), calc(.3 * var(--sbg-o))) 50%, transparent);
	-webkit-mask-image: linear-gradient(180deg, #000 0%, transparent 85%);
	mask-image: linear-gradient(180deg, #000 0%, transparent 85%);
	animation: pd-sway var(--t, 12s) ease-in-out infinite alternate;
}
.pd-beam--1 { --r: -38deg; --t: 13s; }
.pd-beam--2 { --r: -18deg; --t: 11s; --c: var(--sbg-c2); animation-delay: -3s; }
.pd-beam--3 { --r: 0deg; --t: 15s; width: 240px; left: -120px; }
.pd-beam--4 { --r: 20deg; --t: 12s; --c: var(--sbg-c3); animation-delay: -6s; }
.pd-beam--5 { --r: 40deg; --t: 14s; animation-delay: -2s; }
@keyframes pd-sway { from { transform: rotate(calc(var(--r) - 6deg)); } to { transform: rotate(calc(var(--r) + 6deg)); } }
.pd-beam-floor {
	left: 15%; right: 15%; bottom: -30%; height: 45%;
	background: radial-gradient(ellipse 50% 50% at 50% 50%, rgba(var(--sbg-c2), calc(.1 * var(--sbg-o))), transparent 70%);
}
.dark .pd-beam { background: linear-gradient(90deg, transparent, rgba(var(--c, var(--sbg-c1)), calc(.22 * var(--sbg-o))) 50%, transparent); }

/* ------------------------------------------------------------- particles */
.pd-pt-glow { inset: 0; background: radial-gradient(ellipse 60% 50% at 50% 100%, rgba(var(--sbg-c1), calc(.12 * var(--sbg-o))), transparent 70%); }
.pd-pt {
	left: var(--x); bottom: -20px;
	width: var(--s); height: var(--s);
	border-radius: 50%;
	background: rgba(var(--c), calc(.55 * var(--sbg-o)));
	box-shadow: 0 0 calc(var(--s) * 2) rgba(var(--c), .45);
	animation: pd-rise var(--t) linear infinite;
	animation-delay: var(--d);
}
@keyframes pd-rise {
	0%   { transform: translate3d(0, 0, 0); opacity: 0; }
	10%  { opacity: 1; }
	50%  { transform: translate3d(var(--sw), -60vh, 0); }
	90%  { opacity: .8; }
	100% { transform: translate3d(0, -120vh, 0); opacity: 0; }
}

/* ----------------------------------------------------------------- rings */
.pd-rings-static {
	width: 1200px; height: 1200px; left: 50%; top: 50%;
	transform: translate(-50%, -50%);
	background: repeating-radial-gradient(circle, rgba(var(--sbg-c1), calc(.07 * var(--sbg-o))) 0 1px, transparent 1px 60px);
	-webkit-mask-image: radial-gradient(circle, #000 20%, transparent 65%);
	mask-image: radial-gradient(circle, #000 20%, transparent 65%);
}
.pd-rings { width: 0; height: 0; left: 50%; top: 50%; }
.pd-rings--alt { left: 8%; top: 12%; }
.pd-ring {
	position: absolute;
	width: 240px; height: 240px; left: -120px; top: -120px;
	border-radius: 50%;
	border: 1.5px solid rgba(var(--sbg-c1), calc(.4 * var(--sbg-o)));
	box-shadow: inset 0 0 30px rgba(var(--sbg-c2), calc(.08 * var(--sbg-o)));
	opacity: 0;
	animation: pd-radar 8s cubic-bezier(.2, .6, .4, 1) infinite;
	animation-delay: var(--d);
}
.pd-rings--alt .pd-ring { border-color: rgba(var(--sbg-c2), calc(.35 * var(--sbg-o))); animation-duration: 7s; }
@keyframes pd-radar { 0% { transform: scale(.2); opacity: 0; } 15% { opacity: 1; } 100% { transform: scale(4.5); opacity: 0; } }

/* ---------------------------------------------------------------- shapes */
.pd-shape {
	width: 64px; height: 64px;
	opacity: calc(.5 * var(--sbg-o));
	stroke: rgb(var(--c, var(--sbg-c1)));
	fill: rgb(var(--c, var(--sbg-c1)));
	animation: pd-float var(--t, 12s) ease-in-out infinite alternate;
}
.pd-shape--ring   { top: 10%; right: 6%; --c: var(--sbg-c1); --t: 11s; }
.pd-shape--square { top: 62%; right: 12%; width: 54px; --c: var(--sbg-c2); --t: 14s; }
.pd-shape--tri    { top: 18%; left: 8%; width: 58px; --c: var(--sbg-c3); --t: 13s; }
.pd-shape--plus   { bottom: 12%; left: 14%; width: 34px; --c: var(--sbg-c2); --t: 9s; }
.pd-shape--zig    { top: 42%; left: 3%; width: 90px; --c: var(--sbg-c1); --t: 15s; }
.pd-shape--dots   { bottom: 8%; right: 30%; width: 70px; --c: var(--sbg-c1); --t: 17s; opacity: calc(.28 * var(--sbg-o)); }
.pd-shape--donut  { top: 6%; left: 38%; width: 40px; --c: var(--sbg-c3); --t: 10s; }
.pd-shape--half   { top: 48%; right: 2%; width: 50px; --c: var(--sbg-c3); --t: 12s; opacity: calc(.3 * var(--sbg-o)); }
@keyframes pd-float {
	0%   { transform: translate3d(0, 0, 0) rotate(0deg); }
	50%  { transform: translate3d(8px, -18px, 0) rotate(12deg); }
	100% { transform: translate3d(-6px, 10px, 0) rotate(-10deg); }
}
.pd-shapes-glow { inset: 0; background: radial-gradient(ellipse 50% 45% at 50% 45%, rgba(var(--sbg-c1), calc(.09 * var(--sbg-o))), transparent 70%); }

/* --------------------------------------------------------------- stripes */
.pd-stripes {
	inset: 0;
	background: repeating-linear-gradient(135deg, rgba(var(--sbg-c1), calc(.075 * var(--sbg-o))) 0 2px, transparent 2px 22px);
	-webkit-mask-image: linear-gradient(90deg, transparent, #000 25%, #000 75%, transparent);
	mask-image: linear-gradient(90deg, transparent, #000 25%, #000 75%, transparent);
}
.pd-stripes-shine {
	inset: -50%;
	background: linear-gradient(115deg, transparent 40%, rgba(var(--sbg-c2), calc(.12 * var(--sbg-o))) 50%, transparent 60%);
	animation: pd-shine 9s ease-in-out infinite;
}
@keyframes pd-shine { 0% { transform: translateX(-40%); } 60%, 100% { transform: translateX(40%); } }
.pd-stripes-glow { inset: 0; background: radial-gradient(ellipse 50% 60% at 50% 50%, var(--sbg-base) 20%, transparent 75%); opacity: .75; }

/* ----------------------------------------------------------------- stars */
.pd-sbg--stars { --sbg-base2: color-mix(in srgb, var(--sbg-base) 82%, rgb(var(--sbg-c1)) 18%); }
.pd-stars-neb {
	inset: 0;
	background:
		radial-gradient(ellipse 40% 35% at 25% 30%, rgba(var(--sbg-c1), calc(.14 * var(--sbg-o))), transparent 70%),
		radial-gradient(ellipse 35% 30% at 75% 65%, rgba(var(--sbg-c2), calc(.1 * var(--sbg-o))), transparent 70%);
}
.pd-star {
	left: var(--x); top: var(--y);
	width: var(--s); height: var(--s);
	border-radius: 50%;
	background: rgba(var(--sbg-c1), .75);
	box-shadow: 0 0 6px rgba(var(--sbg-c1), .6);
	animation: pd-twinkle var(--t) ease-in-out infinite;
	animation-delay: var(--d);
}
.dark .pd-star { background: #fff; box-shadow: 0 0 6px rgba(255, 255, 255, .7); }
@keyframes pd-twinkle { 0%, 100% { opacity: .15; transform: scale(.7); } 50% { opacity: 1; transform: scale(1.15); } }
.pd-shoot {
	width: 140px; height: 1.5px;
	background: linear-gradient(90deg, rgba(var(--sbg-c2), 1), transparent);
	border-radius: 2px;
	opacity: 0;
	transform: rotate(-24deg);
	animation: pd-shoot 9s ease-in infinite;
}
.pd-shoot--1 { top: 12%; left: 70%; }
.pd-shoot--2 { top: 30%; left: 40%; animation-delay: 4.5s; }
@keyframes pd-shoot {
	0%, 80% { opacity: 0; transform: rotate(-24deg) translateX(0); }
	84% { opacity: 1; }
	100% { opacity: 0; transform: rotate(-24deg) translateX(-420px); }
}

/* ------------------------------------------------------------------ flow */
.pd-flow {
	inset: 0;
	opacity: var(--sbg-o);
	background: linear-gradient(120deg, rgba(var(--sbg-c1), .16), rgba(var(--sbg-c2), .12), rgba(var(--sbg-c3), .14), rgba(var(--sbg-c1), .12), rgba(var(--sbg-c2), .16));
	background-size: 400% 400%;
	animation: pd-flow 24s ease-in-out infinite alternate;
}
@keyframes pd-flow { 0% { background-position: 0% 30%; } 100% { background-position: 100% 70%; } }
.pd-flow-glass {
	inset: 0;
	background: radial-gradient(ellipse 60% 55% at 50% 50%, rgba(255, 255, 255, .35), transparent 70%);
}
.dark .pd-flow-glass { background: radial-gradient(ellipse 60% 55% at 50% 50%, rgba(0, 0, 0, .25), transparent 70%); }

/* ----------------------------------------------------------------- image */
.pd-img { inset: 0; background-size: cover; background-position: center; }
.pd-img-ov { inset: 0; background: var(--sbg-base); opacity: var(--sbg-ov, .7); }
@media (min-width: 1024px) and (hover: hover) {
	.pd-sbg--parallax .pd-img { background-attachment: fixed; }
	.pd-sbg--parallax .pd-sbg-layer { contain: none; }
}

/* ------------------------------------------------------- کنترل انیمیشن */
.pd-sbg--static .pd-sbg-layer *,
.pd-sbg.is-offscreen .pd-sbg-layer * { animation-play-state: paused !important; }
.pd-sbg--static .pd-sbg-layer * { animation: none !important; }
.pd-sbg--static .pd-dots--wave,
.pd-sbg--static .pd-pt,
.pd-sbg--static .pd-shoot,
.pd-sbg--static .pd-ring,
.pd-sbg--static .pd-hexcell { display: none; }
/* هنگام اسکرول و وقتی منو/پنجره‌ای باز است، انیمیشن‌ها موقتاً متوقف می‌شوند
   تا تمام توان پردازنده صرف روان بودن اسکرول و باز/بسته شدن منو شود. */
.pd-sbg.is-scrolling .pd-sbg-layer *,
body.drawer-open .pd-sbg-layer *,
html.pd-consult-open .pd-sbg-layer *,
body.pardis-preloader-active .pd-sbg-layer * { animation-play-state: paused !important; }
/* لمسی/موبایل: افکت‌هایی که هر فریم «بازنقاشی» لازم دارند حذف می‌شوند؛
   فقط انیمیشن‌های سبک (transform/opacity) باقی می‌مانند. */
@media (max-width: 1023px), (hover: none) {
	.pd-dots--wave, .pd-topo--hi, .pd-circuit__pulse, .pd-gbeam--h { display: none; }
	.pd-flow { animation: none; }
	.pd-sbg--grain .pd-sbg-layer::after { display: none; }
	.pd-blob { will-change: auto; }
}
@media (max-width: 767px) {
	.pd-sbg--mstatic .pd-sbg-layer * { animation: none !important; }
	.pd-sbg--mstatic .pd-dots--wave, .pd-sbg--mstatic .pd-pt, .pd-sbg--mstatic .pd-shoot, .pd-sbg--mstatic .pd-ring, .pd-sbg--mstatic .pd-hexcell { display: none; }
	.pd-shape { width: 40px; }
	.pd-shape--zig, .pd-shape--half, .pd-shape--donut { display: none; }
}
@media (prefers-reduced-motion: reduce) {
	.pd-sbg-layer * { animation: none !important; }
	.pd-dots--wave, .pd-pt, .pd-shoot, .pd-ring, .pd-hexcell, .pd-gbeam { display: none; }
}

/* ------------------------------------------ پیش‌نمایش کوچک در پنل تنظیمات */
.pd-sbg-thumb {
	position: relative;
	display: block;
	width: 100%;
	aspect-ratio: 16 / 9;
	overflow: hidden;
	border-radius: 10px;
	background: #f8f7fe;
}
.pd-sbg-thumb__stage {
	position: absolute !important;
	top: 0; right: 0;
	width: 250%;
	height: 250%;
	transform: scale(.4);
	transform-origin: top right;
	display: block;
}
.pd-sbg-thumb .pd-sbg-layer { contain: none; }
.pd-sbg-thumb .pd-sbg-layer::before { display: none; }
.pd-sbg-thumb__mock { position: absolute; inset: 44% 28% auto; z-index: 2; display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; opacity: .75; }
.pd-sbg-thumb__mock b, .pd-sbg-thumb--classic b { display: block; height: 90px; border-radius: 18px; background: rgba(255, 255, 255, .8); box-shadow: 0 20px 50px rgba(30, 28, 58, .08); }
.pd-sbg-thumb--classic { background: radial-gradient(ellipse 60% 50% at 15% 0, rgba(91, 48, 246, .12), transparent 60%), radial-gradient(circle, rgba(91, 48, 246, .18) 1px, transparent 0) 0 0 / 8px 8px, #f6f4fe; }
.pd-sbg-thumb--classic .pd-sbg-thumb__stage { display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; padding: 30% 18% 0; box-sizing: border-box; }
.pdx-visual__item:not(:hover) .pd-sbg-thumb * { animation-play-state: paused !important; }