/*
Theme Name: Naghash (نقاش)
Theme URI: https://bymim.ir
Author: Claude
Description: قالب اختصاصی، رنگارنگ و شاد برای سایت هنرمند نقاش (دو زبانه فارسی/انگلیسی) با نمونه‌کارها و فرم سفارش.
Version: 2.2.0
Requires at least: 5.8
Requires PHP: 7.4
License: GNU General Public License v2 or later
Text Domain: naghash
*/

/* ---------- فونت وزیرمتن (اول از پوشه قالب، بعد از CDN؛ اگر نبود فونت سیستم) ---------- */
@font-face {
	font-family: "Vazirmatn";
	src: url("assets/fonts/Vazirmatn-Variable.woff2") format("woff2"),
		url("https://cdn.jsdelivr.net/npm/vazirmatn@33.0.3/fonts/webfonts/Vazirmatn%5Bwght%5D.woff2") format("woff2");
	font-weight: 100 900;
	font-display: swap;
}

:root {
	--coral: #ff5d73;
	--orange: #ff9f1c;
	--sun: #ffd23f;
	--lime: #7ed957;
	--mint: #1fd1a5;
	--sky: #33b5ff;
	--violet: #8a5cff;
	--pink: #ff4fa8;
	--navy: #26486e;
	--ink: #2d2a5a;
	--muted: #6b6790;
	--bg: #fffaf0;
	--rainbow: linear-gradient(90deg, var(--coral), var(--orange), var(--sun), var(--lime), var(--mint), var(--sky), var(--violet), var(--pink), var(--coral));
	--radius: 26px;
	--shadow: 0 14px 40px rgba(138, 92, 255, .16);
	--ease: cubic-bezier(.22, 1, .36, 1);
	--bounce: cubic-bezier(.34, 1.56, .64, 1);
	--dir: 1;
}
.is-rtl { --dir: -1; }

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
	margin: 0;
	overflow-x: hidden;
	background-color: var(--bg);
	background-image: radial-gradient(rgba(255, 79, 168, .16) 1.6px, transparent 1.7px), radial-gradient(rgba(51, 181, 255, .15) 1.6px, transparent 1.7px);
	background-size: 34px 34px;
	background-position: 0 0, 17px 17px;
	color: var(--ink);
	line-height: 1.9;
	font-size: 17px;
	-webkit-font-smoothing: antialiased;
}
body.nk-fa { font-family: "Vazirmatn", "Vazir", "Segoe UI", Tahoma, system-ui, sans-serif; }
body.nk-en { font-family: "Vazirmatn", "Segoe UI", system-ui, -apple-system, Helvetica, Arial, sans-serif; line-height: 1.7; }
img { max-width: 100%; height: auto; display: block; }
a { color: var(--violet); text-decoration: none; transition: color .2s; }
a:hover { color: var(--pink); }
h1, h2, h3, h4 { line-height: 1.35; margin: 0 0 .5em; color: var(--ink); font-weight: 900; }
p { margin: 0 0 1em; }
::selection { background: var(--pink); color: #fff; }
:focus-visible { outline: 3px solid var(--violet); outline-offset: 3px; border-radius: 8px; }
.container { width: min(1180px, 92%); margin-inline: auto; }
.screen-reader-text { position: absolute; left: -9999px; }

/* ---------- نوار پیشرفت اسکرول و پرده ورود ---------- */
.progress { position: fixed; top: 0; inset-inline-start: 0; height: 5px; width: 0; background: var(--rainbow); background-size: 200% 100%; animation: grad 4s linear infinite; z-index: 300; border-radius: 0 6px 6px 0; }
.intro { display: none; position: fixed; inset: 0; z-index: 1000; pointer-events: none; overflow: hidden; }
html.show-intro .intro { display: block; }
.intro i { position: absolute; top: 0; bottom: 0; width: 12.6%; inset-inline-start: calc(var(--i) * 12.5%); background: var(--c); transform-origin: top; animation: curtain .8s var(--ease) calc(1s + var(--i) * .07s) forwards; }
.intro img { position: absolute; top: 50%; left: 50%; width: 150px; height: 150px; margin: -75px; border-radius: 50%; box-shadow: 0 0 0 10px #fff; animation: introLogo 1.4s var(--bounce) forwards; }
@keyframes curtain { to { transform: translateY(-101%); } }
@keyframes introLogo { 0% { transform: scale(0) rotate(-200deg); } 45% { transform: scale(1.12) rotate(0); } 75% { transform: scale(1); } 100% { transform: scale(0); opacity: 0; } }

/* ---------- هدر ---------- */
.site-header { position: sticky; top: 0; z-index: 100; padding: 12px 0; pointer-events: none; }
.header-inner {
	pointer-events: auto; position: relative; display: flex; align-items: center; justify-content: space-between; gap: 16px;
	background: rgba(255, 255, 255, .84); backdrop-filter: blur(16px) saturate(1.5);
	border: 2px solid #fff; border-radius: 999px; padding: 8px 14px;
	box-shadow: 0 10px 34px rgba(138, 92, 255, .2), 0 0 0 1px rgba(138, 92, 255, .08);
	transition: padding .3s, box-shadow .3s;
}
.site-header.scrolled .header-inner { padding-block: 5px; box-shadow: 0 14px 40px rgba(255, 79, 168, .25), 0 0 0 1px rgba(255, 79, 168, .12); }
.brand { display: flex; align-items: center; gap: 12px; font-weight: 900; font-size: 1.2rem; }
.brand img { width: 48px; height: 48px; border-radius: 50%; box-shadow: 0 4px 14px rgba(38, 72, 110, .35); transition: transform .9s var(--bounce); }
.brand:hover img { transform: rotate(360deg) scale(1.1); }
.brand span { background: var(--rainbow); background-size: 200% 100%; -webkit-background-clip: text; background-clip: text; color: transparent; animation: grad 6s linear infinite; }
.main-nav ul { display: flex; gap: 4px; list-style: none; margin: 0; padding: 0; align-items: center; }
.main-nav li:nth-child(1) a { --c: var(--coral); }
.main-nav li:nth-child(2) a { --c: var(--orange); }
.main-nav li:nth-child(3) a { --c: var(--mint); }
.main-nav li:nth-child(4) a { --c: var(--pink); }
.main-nav li:nth-child(5) a { --c: var(--sky); }
.main-nav a:not(.lang-switch) { display: block; padding: 8px 17px; border-radius: 999px; font-weight: 800; color: var(--ink); transition: transform .3s var(--bounce), background .25s, color .25s, box-shadow .25s; }
.main-nav a:not(.lang-switch):hover, .main-nav a.is-current { background: var(--c); color: #fff; transform: translateY(-3px) rotate(-2deg); box-shadow: 0 8px 18px rgba(0, 0, 0, .14); }
.main-nav a.cta { background: linear-gradient(120deg, var(--pink), var(--violet)); color: #fff; animation: pulse 2.4s infinite; }
.lang-switch { display: inline-flex; align-items: center; gap: 6px; border: 2px solid var(--violet); border-radius: 999px; padding: 4px 14px; font-weight: 800; font-size: .92rem; color: var(--violet); transition: transform .3s var(--bounce), background .2s, color .2s; }
.lang-switch:hover { background: var(--violet); color: #fff; transform: scale(1.08) rotate(3deg); }
.nav-toggle { display: none; border: 0; width: 46px; height: 46px; border-radius: 16px; background: linear-gradient(135deg, var(--pink), var(--violet)); color: #fff; font-size: 1.4rem; cursor: pointer; box-shadow: 0 6px 16px rgba(138, 92, 255, .4); transition: transform .3s var(--bounce); }
.nav-toggle:active { transform: scale(.9); }

/* ---------- دکمه‌ها ---------- */
.btn {
	position: relative; overflow: hidden; display: inline-flex; align-items: center; justify-content: center; gap: 10px;
	padding: 14px 30px; border: 0; border-radius: 999px; font: inherit; font-weight: 800; color: #fff; cursor: pointer;
	background: linear-gradient(120deg, var(--coral), var(--pink), var(--violet)); background-size: 200% 100%;
	box-shadow: 0 10px 26px rgba(255, 79, 168, .38);
	transition: transform .3s var(--bounce), box-shadow .3s, background-position .6s;
}
.btn::after { content: ""; position: absolute; top: 0; inset-inline-start: -120%; width: 60%; height: 100%; background: linear-gradient(100deg, transparent, rgba(255, 255, 255, .6), transparent); transform: skewX(-20deg); transition: inset-inline-start .7s; }
.btn:hover { transform: translateY(-4px) scale(1.05); background-position: 100% 0; color: #fff; box-shadow: 0 16px 32px rgba(255, 79, 168, .45); }
.btn:hover::after { inset-inline-start: 140%; }
.btn:active { transform: scale(.95); }
.btn.alt { background: linear-gradient(120deg, var(--sky), var(--violet), var(--pink)); box-shadow: 0 10px 26px rgba(138, 92, 255, .38); background-size: 200% 100%; }
.btn.sun { background: linear-gradient(120deg, var(--orange), var(--sun)); color: #4a2a00; box-shadow: 0 10px 26px rgba(255, 159, 28, .4); }
.btn.white { background: #fff; color: var(--ink); box-shadow: 0 10px 26px rgba(0, 0, 0, .18); }
.btn.white:hover { color: var(--pink); }
.btn.ghost { background: #fff; color: var(--violet); box-shadow: 0 0 0 3px var(--violet) inset; }
.btn.ghost:hover { color: #fff; background: var(--violet); }
.btn.pulse { animation: pulse 2.4s infinite; }
.btn.loading { pointer-events: none; opacity: .75; }
.btn.loading::before { content: ""; width: 18px; height: 18px; border: 3px solid rgba(255, 255, 255, .5); border-top-color: #fff; border-radius: 50%; animation: spin .8s linear infinite; }

/* ---------- هیرو ---------- */
.hero { position: relative; overflow: hidden; padding: 70px 0 150px; background: linear-gradient(135deg, #ffe3f0 0%, #fff6cf 38%, #dff4ff 70%, #efe6ff 100%); background-size: 300% 300%; animation: bgshift 16s ease infinite; }
.hero-bg { position: absolute; inset: 0; pointer-events: none; }
.blob { position: absolute; opacity: .78; mix-blend-mode: multiply; border-radius: 42% 58% 60% 40% / 45% 45% 55% 55%; animation: morph 10s ease-in-out infinite, drift 14s ease-in-out infinite; }
.blob.b1 { width: 300px; height: 300px; background: var(--coral); top: -90px; inset-inline-end: 6%; }
.blob.b2 { width: 190px; height: 190px; background: var(--sun); bottom: 90px; inset-inline-end: 32%; animation-delay: -3s; }
.blob.b3 { width: 260px; height: 260px; background: var(--mint); bottom: -60px; inset-inline-start: 4%; animation-delay: -5s; }
.blob.b4 { width: 130px; height: 130px; background: var(--pink); top: 34%; inset-inline-start: 44%; animation-delay: -7s; }
.blob.b5 { width: 170px; height: 170px; background: var(--violet); top: 8%; inset-inline-start: 3%; animation-delay: -2s; }
.blob.b6 { width: 150px; height: 150px; background: var(--sky); top: 55%; inset-inline-end: 3%; animation-delay: -9s; }
.fl { position: absolute; font-size: 2.2rem; animation: floaty 7s ease-in-out infinite; filter: drop-shadow(0 6px 8px rgba(0, 0, 0, .15)); }
.fl.f1 { top: 14%; inset-inline-start: 38%; }
.fl.f2 { top: 70%; inset-inline-start: 10%; animation-delay: -2s; font-size: 2.6rem; }
.fl.f3 { top: 22%; inset-inline-end: 22%; animation-delay: -4s; }
.fl.f4 { top: 64%; inset-inline-end: 12%; animation-delay: -1s; font-size: 2.8rem; }
.fl.f5 { top: 8%; inset-inline-end: 44%; animation-delay: -3s; font-size: 1.8rem; }
.fl.f6 { top: 52%; inset-inline-start: 46%; animation-delay: -5s; font-size: 1.9rem; }
.hero-inner { position: relative; display: grid; grid-template-columns: 1.15fr .85fr; gap: 40px; align-items: center; }
.chip { display: inline-flex; align-items: center; gap: 8px; padding: 6px 18px; border-radius: 999px; background: #fff; color: var(--pink); font-weight: 800; font-size: .95rem; box-shadow: 0 6px 18px rgba(255, 79, 168, .25); animation: wobble 4s ease-in-out infinite; }
.hero h1 { font-size: clamp(2.4rem, 6vw, 4.5rem); font-weight: 900; margin: 18px 0 14px; }
.hero h1 .w { display: inline-block; opacity: 0; transform: translateY(40px) scale(.7) rotate(-6deg); animation: wordIn .8s var(--bounce) forwards; animation-delay: calc(var(--i) * .1s + .25s); }
html.show-intro .hero h1 .w { animation-delay: calc(var(--i) * .1s + 1.7s); }
.rot { position: relative; display: inline-block; background: linear-gradient(90deg, var(--coral), var(--orange), var(--pink), var(--violet), var(--coral)); background-size: 250% 100%; -webkit-background-clip: text; background-clip: text; color: transparent; animation: grad 4s linear infinite; padding-inline: .1em; }
.rot.swap { animation: rotIn .55s var(--bounce), grad 4s linear infinite; }
.rot::after { content: ""; position: absolute; inset-inline: 0; bottom: -.12em; height: .3em; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 12'%3E%3Cpath d='M0 6 Q5 0 10 6 T20 6 T30 6 T40 6' fill='none' stroke='%23ff4fa8' stroke-width='3' stroke-linecap='round'/%3E%3C/svg%3E") repeat-x; background-size: 40px 100%; animation: squig 1.4s linear infinite; }
.hero .lead { font-size: 1.2rem; color: var(--muted); max-width: 560px; font-weight: 500; }
.hero .actions { display: flex; gap: 14px; flex-wrap: wrap; margin-top: 26px; }
.trust { display: flex; gap: 10px; flex-wrap: wrap; margin-top: 26px; }
.trust span { background: rgba(255, 255, 255, .85); border-radius: 999px; padding: 5px 16px; font-weight: 700; font-size: .92rem; box-shadow: 0 4px 12px rgba(45, 42, 90, .08); transition: transform .3s var(--bounce); }
.trust span:hover { transform: translateY(-4px) rotate(-3deg); }
.orb { position: relative; width: min(390px, 78vw); aspect-ratio: 1; margin-inline: auto; }
.orb .ring { position: absolute; inset: 0; border-radius: 50%; background: conic-gradient(var(--coral), var(--orange), var(--sun), var(--lime), var(--mint), var(--sky), var(--violet), var(--pink), var(--coral)); animation: spin 10s linear infinite; }
.orb .ring::after { content: ""; position: absolute; inset: 14px; border-radius: 50%; background: #fff; }
.orb img { position: absolute; inset: 28px; width: calc(100% - 56px); height: calc(100% - 56px); border-radius: 50%; animation: bob 5s ease-in-out infinite; box-shadow: 0 24px 50px rgba(38, 72, 110, .4); }
.orbit { position: absolute; inset: -38px; animation: spin 14s linear infinite; }
.orbit.rev { inset: -70px; animation-duration: 24s; animation-direction: reverse; }
.orbit i { position: absolute; top: -13px; left: 50%; width: 26px; height: 26px; margin-left: -13px; border-radius: 50%; background: var(--c); box-shadow: 0 6px 14px rgba(0, 0, 0, .2); }
.orbit i:nth-child(2) { top: auto; bottom: -13px; }
.orbit i:nth-child(3) { top: 50%; left: auto; right: -13px; margin-top: -13px; }
.sticker { position: absolute; bottom: 6%; inset-inline-start: -8%; background: var(--sun); color: #4a2a00; font-weight: 900; padding: 8px 18px; border-radius: 16px; transform: rotate(-8deg); box-shadow: 0 10px 22px rgba(255, 159, 28, .45); animation: wobble 3.4s ease-in-out infinite; }
.scroll-hint { position: absolute; bottom: 130px; left: 50%; margin-left: -14px; width: 28px; height: 46px; border: 3px solid var(--violet); border-radius: 16px; opacity: .7; }
.scroll-hint::after { content: ""; position: absolute; top: 8px; left: 50%; margin-left: -3px; width: 6px; height: 10px; border-radius: 4px; background: var(--violet); animation: scrollDot 1.6s ease-in-out infinite; }

/* موج‌های متحرک */
.waves { position: absolute; inset-inline: 0; bottom: -1px; height: 120px; pointer-events: none; }
.waves i { position: absolute; inset: 0; background-repeat: repeat-x; background-size: 1440px 100%; }
.waves .w1 { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 120' preserveAspectRatio='none'%3E%3Cpath fill='%23ff4fa8' fill-opacity='.35' d='M0 60 C180 120 360 0 540 50 S900 110 1080 50 S1300 20 1440 60 V120 H0Z'/%3E%3C/svg%3E"); animation: wavex 16s linear infinite; bottom: 10px; }
.waves .w2 { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 120' preserveAspectRatio='none'%3E%3Cpath fill='%2333b5ff' fill-opacity='.35' d='M0 70 C200 10 400 110 620 60 S1000 10 1200 70 S1360 90 1440 70 V120 H0Z'/%3E%3C/svg%3E"); animation: wavex 22s linear infinite reverse; bottom: 4px; }
.waves .w3 { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 120' preserveAspectRatio='none'%3E%3Cpath fill='%23fffaf0' d='M0 80 C240 30 480 120 720 80 S1200 40 1440 80 V120 H0Z'/%3E%3C/svg%3E"); animation: wavex 30s linear infinite; }

/* ---------- نوار متحرک ---------- */
.marquee-wrap { overflow: hidden; padding: 6px 0 40px; margin-top: -26px; position: relative; z-index: 3; }
.marquee { transform: rotate(-1.6deg); margin-inline: -20px; background: linear-gradient(90deg, var(--violet), var(--pink), var(--orange)); color: #fff; padding: 14px 0; overflow: hidden; box-shadow: 0 12px 30px rgba(255, 79, 168, .32); }
.marquee-track { display: flex; width: max-content; direction: ltr; animation: marq 30s linear infinite; }
.marquee:hover .marquee-track { animation-play-state: paused; }
.marquee-track span { padding: 0 24px; font-weight: 900; font-size: 1.2rem; white-space: nowrap; }
.marquee-track span::after { content: "✦"; margin-inline-start: 48px; color: var(--sun); }

/* ---------- بخش‌ها ---------- */
.section { position: relative; padding: 80px 0; }
.section.white { background: linear-gradient(180deg, rgba(255, 255, 255, 0), rgba(255, 255, 255, .92) 14%, rgba(255, 255, 255, .92) 86%, rgba(255, 255, 255, 0)); }
.section-head { text-align: center; margin-bottom: 46px; }
.section-head .eyebrow { display: inline-block; background: var(--c, var(--pink)); color: #fff; font-weight: 800; font-size: .85rem; padding: 3px 16px; border-radius: 999px; margin-bottom: 10px; transform: rotate(-2deg); }
.section-head h2 { font-size: clamp(1.8rem, 4vw, 2.8rem); margin: 0; }
.section-head h2::after { content: ""; display: block; height: 8px; border-radius: 8px; margin: 12px auto 0; width: 0; background: var(--rainbow); background-size: 200% 100%; transition: width .9s var(--ease) .3s; animation: grad 5s linear infinite; }
.section-head.in h2::after { width: 70%; max-width: 280px; }
.section-head p { color: var(--muted); max-width: 640px; margin: 14px auto 0; }

/* کارت‌های خدمات */
.cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 24px; }
.tilt { transform: perspective(900px) rotateX(var(--rx, 0deg)) rotateY(var(--ry, 0deg)) translateY(var(--ty, 0px)); }
.card { position: relative; overflow: hidden; border-radius: var(--radius); padding: 32px 26px; background: var(--bgc, #fff); box-shadow: var(--shadow); transition: opacity .8s var(--ease) var(--d, 0s), translate .8s var(--ease) var(--d, 0s), transform .25s ease-out, box-shadow .3s; }
.card::before { content: ""; position: absolute; inset: 0; background: radial-gradient(260px circle at var(--mx, 50%) var(--my, 0%), rgba(255, 255, 255, .85), transparent 60%); opacity: 0; transition: opacity .3s; pointer-events: none; }
.card:hover::before { opacity: 1; }
.card:hover { --ty: -8px; box-shadow: 0 24px 50px rgba(0, 0, 0, .15); }
.card::after { content: ""; position: absolute; width: 130px; height: 130px; border-radius: 50%; background: var(--c); opacity: .14; inset-inline-end: -40px; bottom: -40px; transition: transform .5s var(--ease); }
.card:hover::after { transform: scale(2.2); }
.card .icon { position: relative; z-index: 1; width: 72px; height: 72px; border-radius: 24px; display: grid; place-items: center; font-size: 2.1rem; background: var(--c); box-shadow: 0 12px 24px rgba(0, 0, 0, .18); margin-bottom: 18px; transform: rotate(-6deg); }
.card:hover .icon { animation: wiggle .7s; }
.card h3 { font-size: 1.25rem; position: relative; z-index: 1; }
.card p { color: var(--muted); margin: 0; position: relative; z-index: 1; }
.cards .card:nth-child(1) { --c: var(--coral); --bgc: #ffe8ec; }
.cards .card:nth-child(2) { --c: var(--mint); --bgc: #dcfaf3; }
.cards .card:nth-child(3) { --c: var(--violet); --bgc: #efe8ff; }
.cards .card:nth-child(4) { --c: #ffb400; --bgc: #fff2c9; }

/* حباب‌های آمار */
.bubbles { display: flex; gap: 26px; justify-content: center; flex-wrap: wrap; }
.bubble { width: 180px; aspect-ratio: 1; border-radius: 50%; display: grid; place-content: center; text-align: center; color: #fff; background: var(--c); box-shadow: 0 20px 40px rgba(0, 0, 0, .15), inset 0 -10px 24px rgba(0, 0, 0, .12), inset 0 10px 24px rgba(255, 255, 255, .3); animation: bob 5s ease-in-out infinite; animation-delay: calc(var(--i) * -1.4s); }
.bubble b { font-size: 3rem; line-height: 1; font-weight: 900; }
.bubble > span { font-weight: 800; font-size: .95rem; padding-top: 6px; }
.bubble b { direction: ltr; unicode-bidi: isolate; }
.bubble:nth-child(1) { --c: var(--coral); }
.bubble:nth-child(2) { --c: var(--sky); }
.bubble:nth-child(3) { --c: var(--lime); }

/* گالری */
.filters { display: flex; flex-wrap: wrap; gap: 10px; justify-content: center; margin-bottom: 38px; }
.filters button { --c: var(--coral); border: 3px solid var(--c); background: #fff; color: var(--c); font: inherit; font-weight: 800; padding: 6px 22px; border-radius: 999px; cursor: pointer; transition: transform .3s var(--bounce), background .2s, color .2s; }
.filters button:nth-child(8n+2) { --c: var(--orange); }
.filters button:nth-child(8n+3) { --c: var(--mint); }
.filters button:nth-child(8n+4) { --c: var(--sky); }
.filters button:nth-child(8n+5) { --c: var(--violet); }
.filters button:nth-child(8n+6) { --c: var(--pink); }
.filters button:hover { transform: translateY(-4px) rotate(-3deg); }
.filters button.active { background: var(--c); color: #fff; box-shadow: 0 8px 18px rgba(0, 0, 0, .18); transform: scale(1.06); }
.gallery-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); gap: 28px; }
.art { --c: var(--coral); --rot: 0deg; position: relative; border-radius: 24px; background: #fff; padding: 10px 10px 0; border: 3px solid var(--c); box-shadow: 0 14px 30px rgba(45, 42, 90, .12); rotate: var(--rot); transition: opacity .8s var(--ease) var(--d, 0s), translate .8s var(--ease) var(--d, 0s), transform .25s ease-out, box-shadow .3s, rotate .4s var(--bounce); }
.gallery-grid .art:nth-child(6n+1) { --rot: -1.6deg; --c: var(--coral); }
.gallery-grid .art:nth-child(6n+2) { --rot: 1.3deg; --c: var(--mint); }
.gallery-grid .art:nth-child(6n+3) { --rot: -1deg; --c: var(--sky); }
.gallery-grid .art:nth-child(6n+4) { --rot: 1.6deg; --c: var(--sun); }
.gallery-grid .art:nth-child(6n+5) { --rot: -1.3deg; --c: var(--violet); }
.gallery-grid .art:nth-child(6n) { --rot: 1deg; --c: var(--pink); }
.art:hover { --ty: -10px; rotate: 0deg; box-shadow: 0 26px 46px rgba(0, 0, 0, .2); z-index: 2; }
.art.is-hidden { display: none; }
.art.pop { animation: popIn .5s var(--bounce); }
.art .thumb { position: relative; border-radius: 16px; overflow: hidden; aspect-ratio: 1 / 1; background: linear-gradient(135deg, var(--sky), var(--violet)); }
.art .thumb img { width: 100%; height: 100%; object-fit: cover; transition: transform .7s var(--ease); }
.art:hover .thumb img { transform: scale(1.12) rotate(1deg); }
.art .thumb::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, transparent 50%, var(--c)); opacity: 0; transition: opacity .35s; }
.art:hover .thumb::after { opacity: .7; }
.art .view { position: absolute; z-index: 1; inset-inline: 0; bottom: 14px; margin-inline: auto; width: max-content; background: #fff; color: var(--ink); font-weight: 800; font-size: .9rem; padding: 4px 16px; border-radius: 999px; translate: 0 60px; opacity: 0; transition: translate .4s var(--bounce), opacity .3s; }
.art:hover .view { translate: 0 0; opacity: 1; }
.art .info { padding: 14px 8px 16px; }
.art .info h3 { font-size: 1.05rem; margin: 0 0 2px; }
.art .info .meta { font-size: .85rem; color: var(--muted); }
.art a.cover { position: absolute; inset: 0; z-index: 3; border-radius: 22px; }
.badge { position: absolute; z-index: 2; top: 20px; inset-inline-start: 20px; padding: 2px 14px; border-radius: 999px; font-size: .8rem; font-weight: 800; color: #fff; background: var(--mint); box-shadow: 0 4px 10px rgba(0, 0, 0, .2); animation: wobble 3s ease-in-out infinite; }
.badge.sold { background: var(--coral); }
.empty-note { text-align: center; padding: 50px 20px; border: 3px dashed #ffc2d8; border-radius: var(--radius); color: var(--muted); background: #fff; }

/* صفحه یک اثر */
.single-art { display: grid; grid-template-columns: 1.15fr .85fr; gap: 44px; align-items: start; }
.single-art .image > a { display: block; border-radius: 22px; box-shadow: 14px 14px 0 var(--pink); transition: transform .4s var(--bounce), box-shadow .4s; }
.single-art .image > a:hover { transform: translate(-4px, -4px); box-shadow: 20px 20px 0 var(--violet); }
.single-art .image img { border-radius: 22px; width: 100%; border: 6px solid #fff; }
.single-art .details { background: #fff; border-radius: var(--radius); padding: 32px; box-shadow: var(--shadow); border-top: 8px solid var(--violet); }
.single-art dl { display: grid; grid-template-columns: auto 1fr; gap: 8px 18px; margin: 20px 0; }
.single-art dt { font-weight: 800; color: var(--pink); }
.single-art dd { margin: 0; color: var(--muted); }
.thumbs { display: flex; gap: 12px; flex-wrap: wrap; margin-top: 22px; }
.thumbs a { display: block; border-radius: 16px; overflow: hidden; border: 4px solid #fff; box-shadow: var(--shadow); transition: transform .35s var(--bounce); }
.thumbs a:hover { transform: translateY(-6px) rotate(-4deg) scale(1.08); }
.thumbs img { width: 96px; height: 96px; object-fit: cover; }

/* مراحل */
.steps { position: relative; display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: 22px; }
.step { position: relative; background: #fff; border-radius: var(--radius); padding: 30px 22px 24px; box-shadow: var(--shadow); text-align: center; transition: opacity .8s var(--ease) var(--d, 0s), translate .8s var(--ease) var(--d, 0s), transform .3s var(--bounce), box-shadow .3s; }
.step:hover { transform: translateY(-8px) rotate(-1.5deg); box-shadow: 0 24px 44px rgba(0, 0, 0, .14); }
.step .num { width: 62px; height: 62px; margin: -62px auto 12px; display: grid; place-items: center; border-radius: 50%; background: var(--c); color: #fff; font-weight: 900; font-size: 1.5rem; box-shadow: 0 10px 20px rgba(0, 0, 0, .2), 0 0 0 6px #fff; animation: bob 4s ease-in-out infinite; }
.step:nth-child(1) { --c: var(--coral); }
.step:nth-child(2) { --c: var(--orange); }
.step:nth-child(3) { --c: var(--mint); }
.step:nth-child(4) { --c: var(--violet); }
.step .em { font-size: 2.2rem; display: block; margin-bottom: 4px; }
.step h3 { font-size: 1.1rem; }
.step p { margin: 0; color: var(--muted); font-size: .95rem; }
.steps-wrap { padding-top: 36px; }

/* نوار دعوت به اقدام */
.cta-band { position: relative; overflow: hidden; color: #fff; text-align: center; padding: 90px 0; background: linear-gradient(120deg, var(--violet), var(--pink), var(--orange), var(--violet)); background-size: 300% 300%; animation: bgshift 10s ease infinite; }
.cta-band h2 { color: #fff; font-size: clamp(1.7rem, 4vw, 2.7rem); text-shadow: 0 4px 16px rgba(0, 0, 0, .18); }
.cta-band p { max-width: 600px; margin-inline: auto; font-size: 1.1rem; opacity: .95; }
.cta-band .shape { position: absolute; border-radius: 50%; background: rgba(255, 255, 255, .22); animation: floaty 8s ease-in-out infinite; }
.cta-band .s1 { width: 200px; height: 200px; top: -60px; inset-inline-start: 6%; }
.cta-band .s2 { width: 120px; height: 120px; bottom: -30px; inset-inline-end: 14%; animation-delay: -2s; }
.cta-band .s3 { width: 70px; height: 70px; top: 30%; inset-inline-end: 6%; animation-delay: -4s; background: var(--sun); opacity: .9; }
.cta-band .s4 { width: 90px; height: 90px; bottom: 14%; inset-inline-start: 10%; animation-delay: -6s; background: var(--mint); opacity: .85; }
.cta-band .container { position: relative; }

/* درباره */
.about-grid { display: grid; grid-template-columns: .8fr 1.2fr; gap: 54px; align-items: center; }
.about-visual { position: relative; display: flex; justify-content: center; }
.about-visual .frame { width: min(380px, 84%); aspect-ratio: 1; padding: 14px; background: linear-gradient(135deg, var(--sun), var(--coral), var(--pink), var(--violet)); background-size: 200% 200%; border-radius: 40% 60% 55% 45% / 50% 40% 60% 50%; animation: morph 10s ease-in-out infinite, bgshift 8s ease infinite; box-shadow: 0 24px 50px rgba(255, 79, 168, .35); }
.about-visual .frame img { width: 100%; height: 100%; object-fit: cover; border-radius: inherit; background: var(--navy); }
.about-visual::before, .about-visual::after { position: absolute; font-size: 2.6rem; animation: floaty 6s ease-in-out infinite; }
.about-visual::before { content: "🎨"; top: 4%; inset-inline-end: 6%; }
.about-visual::after { content: "✨"; bottom: 6%; inset-inline-start: 4%; animation-delay: -3s; }
.stats { display: flex; gap: 14px; flex-wrap: wrap; margin-top: 26px; }
.stat { flex: 1 1 130px; background: #fff; padding: 16px; border-radius: 20px; text-align: center; box-shadow: var(--shadow); font-weight: 700; transition: transform .35s var(--bounce); }
.stat:hover { transform: translateY(-6px) rotate(-2deg); }
.stat b { display: block; font-size: 1.9rem; }

/* فرم */
.form-wrap { background: #fff; border-radius: var(--radius); padding: 38px; box-shadow: var(--shadow); border-top: 8px solid transparent; border-image: var(--rainbow) 1; border-image-slice: 1; }
.form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
.form-grid .full { grid-column: 1 / -1; }
label { display: block; font-weight: 800; margin-bottom: 6px; color: var(--ink); font-size: .95rem; }
input[type=text], input[type=email], input[type=tel], select, textarea, input[type=file] {
	width: 100%; padding: 13px 18px; border: 3px solid #f0e6ff; border-radius: 18px; font: inherit; background: #fffdf8; color: var(--ink);
	transition: border-color .25s, box-shadow .25s, transform .25s var(--bounce), background .25s;
}
input:hover, select:hover, textarea:hover { border-color: #d9c8ff; }
input:focus, select:focus, textarea:focus { outline: 0; border-color: var(--pink); box-shadow: 0 0 0 5px rgba(255, 79, 168, .18); background: #fff; transform: translateY(-2px); }
input::file-selector-button { border: 0; padding: 6px 16px; margin-inline-end: 12px; border-radius: 999px; background: var(--violet); color: #fff; font: inherit; font-weight: 700; cursor: pointer; }
textarea { min-height: 150px; resize: vertical; }
.hp { position: absolute; left: -9999px; height: 0; overflow: hidden; }
.notice { padding: 18px 22px; border-radius: 20px; margin-bottom: 26px; font-weight: 800; animation: popIn .6s var(--bounce); }
.notice.ok { background: #dcfaf3; color: #00806a; border: 3px solid var(--mint); }
.notice.err { background: #ffe8ec; color: #b3262b; border: 3px solid var(--coral); animation: popIn .6s var(--bounce), shake .5s .3s; }
.hint { font-size: .85rem; color: var(--muted); margin-top: 4px; }

/* تماس */
.contact-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)); gap: 22px; }
.contact-card { background: #fff; padding: 30px 24px; border-radius: var(--radius); box-shadow: var(--shadow); text-align: center; border-bottom: 8px solid var(--c); transition: transform .35s var(--bounce), box-shadow .3s; }
.contact-card:hover { transform: translateY(-8px) rotate(-1.5deg); box-shadow: 0 24px 44px rgba(0, 0, 0, .15); }
.contact-card .icon { font-size: 2.4rem; margin-bottom: 8px; display: inline-block; }
.contact-card:hover .icon { animation: wiggle .7s; }
.contact-card:nth-child(1) { --c: var(--coral); }
.contact-card:nth-child(2) { --c: var(--mint); }
.contact-card:nth-child(3) { --c: var(--violet); }
.contact-card:nth-child(4) { --c: var(--sun); }
.contact-card h3 { font-size: 1.05rem; }
.contact-card a, .contact-card span { word-break: break-word; direction: ltr; unicode-bidi: plaintext; font-weight: 700; }

/* سربرگ صفحه‌های داخلی */
.page-hero { position: relative; overflow: hidden; text-align: center; padding: 60px 0 90px; background: linear-gradient(120deg, #ffe0ee, #fff3c4 45%, #d9f3ff 75%, #ece3ff); background-size: 250% 250%; animation: bgshift 14s ease infinite; }
.page-hero h1 { position: relative; margin: 0; font-size: clamp(2rem, 5vw, 3.2rem); animation: wordIn .8s var(--bounce) both; }
.page-hero p { position: relative; margin: 8px 0 0; color: var(--muted); font-weight: 600; animation: wordIn .8s var(--bounce) .15s both; }
.page-hero::before, .page-hero::after { content: ""; position: absolute; border-radius: 50%; mix-blend-mode: multiply; animation: morph 9s ease-in-out infinite, drift 12s ease-in-out infinite; }
.page-hero::before { width: 190px; height: 190px; background: var(--coral); opacity: .7; top: -70px; inset-inline-start: 7%; }
.page-hero::after { width: 130px; height: 130px; background: var(--sky); opacity: .7; bottom: -40px; inset-inline-end: 10%; animation-delay: -4s; }
.page-hero + .section::before { content: ""; position: absolute; top: -59px; inset-inline: 0; height: 60px; pointer-events: none; z-index: 2; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 120' preserveAspectRatio='none'%3E%3Cpath fill='%23fffaf0' d='M0 70 C240 10 480 120 720 70 S1200 20 1440 70 V120 H0Z'/%3E%3C/svg%3E") repeat-x; background-size: 1440px 100%; animation: wavex 22s linear infinite; }

/* فوتر */
.foot-wave { height: 90px; margin-top: -1px; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 120' preserveAspectRatio='none'%3E%3Cpath fill='%23ffe6f2' d='M0 60 C180 0 360 120 540 70 S900 10 1080 70 S1300 100 1440 60 V120 H0Z'/%3E%3C/svg%3E") repeat-x; background-size: 1440px 100%; animation: wavex 26s linear infinite; }
.site-footer { position: relative; background: linear-gradient(180deg, #ffe6f2, #fff0cc); padding: 20px 0 26px; color: var(--ink); }
.footer-grid { display: grid; grid-template-columns: 1.4fr 1fr 1fr; gap: 36px; }
.site-footer h4 { font-size: 1.1rem; color: var(--pink); }
.site-footer a { color: var(--ink); font-weight: 600; }
.site-footer a:hover { color: var(--pink); }
.site-footer ul { list-style: none; padding: 0; margin: 0; }
.site-footer li { margin-bottom: 6px; }
.site-footer .links a { display: inline-block; transition: transform .3s var(--bounce); }
.site-footer .links a:hover { transform: translateX(calc(var(--dir) * -6px)); }
.footer-brand { display: flex; align-items: center; gap: 12px; margin-bottom: 12px; font-weight: 900; font-size: 1.15rem; }
.footer-brand img { width: 54px; height: 54px; border-radius: 50%; box-shadow: 0 6px 16px rgba(38, 72, 110, .3); }
.socials { display: flex; flex-wrap: wrap; gap: 10px; }
.socials a { display: inline-flex; align-items: center; gap: 8px; padding: 7px 16px; border-radius: 999px; background: #fff; color: var(--c) !important; font-weight: 800; box-shadow: 0 6px 16px rgba(0, 0, 0, .08); transition: transform .3s var(--bounce), background .2s, color .2s; }
.socials a:hover { background: var(--c); color: #fff !important; transform: translateY(-5px) rotate(-3deg); }
.copy { border-top: 3px dotted rgba(255, 79, 168, .35); margin-top: 32px; padding-top: 18px; text-align: center; font-size: .92rem; font-weight: 600; }
.to-top { position: fixed; z-index: 90; bottom: 22px; inset-inline-end: 22px; width: 52px; height: 52px; border: 0; border-radius: 50%; background: linear-gradient(135deg, var(--pink), var(--violet)); color: #fff; font-size: 1.5rem; cursor: pointer; box-shadow: 0 10px 24px rgba(138, 92, 255, .45); opacity: 0; translate: 0 80px; transition: opacity .3s, translate .5s var(--bounce), transform .3s var(--bounce); }
.to-top.show { opacity: 1; translate: 0 0; animation: bob 3s ease-in-out infinite; }
.to-top:hover { transform: scale(1.15); }

/* نمایش بزرگ تصویر */
.lightbox { position: fixed; inset: 0; background: rgba(45, 42, 90, .93); display: none; place-items: center; z-index: 500; padding: 20px; }
.lightbox.open { display: grid; animation: fadeIn .25s; }
.lightbox img { max-height: 88vh; max-width: 90vw; border-radius: 16px; border: 6px solid #fff; animation: popIn .45s var(--bounce); }
.lightbox button { position: absolute; border: 0; cursor: pointer; color: #fff; background: var(--pink); width: 48px; height: 48px; border-radius: 50%; font-size: 1.5rem; transition: transform .25s var(--bounce); }
.lightbox button:hover { transform: scale(1.18); }
.lightbox .lb-close { top: 18px; inset-inline-end: 22px; }
.lightbox .lb-prev { top: 50%; inset-inline-start: 16px; background: var(--violet); }
.lightbox .lb-next { top: 50%; inset-inline-end: 16px; background: var(--violet); }
.lightbox .lb-count { position: absolute; bottom: 18px; color: #fff; font-weight: 800; }

/* موارد عمومی */
.reveal { opacity: 0; translate: 0 34px; transition: opacity .8s var(--ease) var(--d, 0s), translate .8s var(--ease) var(--d, 0s), scale .8s var(--ease) var(--d, 0s); }
.reveal[data-anim="left"] { translate: calc(var(--dir) * -60px) 0; }
.reveal[data-anim="right"] { translate: calc(var(--dir) * 60px) 0; }
.reveal[data-anim="zoom"] { translate: 0 0; scale: .8; }
.reveal.in { opacity: 1; translate: 0 0; scale: 1; }
.card.reveal, .art.reveal, .step.reveal { transition: opacity .8s var(--ease) var(--d, 0s), translate .8s var(--ease) var(--d, 0s), transform .25s ease-out, box-shadow .3s, rotate .4s var(--bounce); }
.step.reveal { transition: opacity .8s var(--ease) var(--d, 0s), translate .8s var(--ease) var(--d, 0s), transform .3s var(--bounce), box-shadow .3s; }
.entry { max-width: 820px; margin-inline: auto; background: #fff; padding: 34px; border-radius: var(--radius); box-shadow: var(--shadow); }
.entry img { border-radius: 16px; }
.pagination { display: flex; gap: 8px; justify-content: center; margin-top: 36px; }
.pagination a, .pagination span { padding: 6px 16px; border-radius: 12px; background: #fff; box-shadow: var(--shadow); font-weight: 800; }
.pagination .current { background: var(--pink); color: #fff; }
.bounce-emoji { font-size: 4.5rem; margin: 0; display: inline-block; animation: bob 2s ease-in-out infinite; }

/* ردپای رنگ و کانفتی */
.trail { position: fixed; z-index: 999; pointer-events: none; left: 0; top: 0; width: var(--s); height: var(--s); border-radius: 50%; background: var(--c); opacity: .85; mix-blend-mode: multiply; translate: var(--x) var(--y); animation: trail .85s ease-out forwards; }
.confetti { position: fixed; z-index: 999; pointer-events: none; width: 10px; height: 14px; border-radius: 3px; background: var(--c); left: var(--x); top: var(--y); animation: confetti 1.3s cubic-bezier(.2, .8, .3, 1) forwards; }

/* ---------- انیمیشن‌ها ---------- */
@keyframes grad { to { background-position: 250% 0; } }
@keyframes bgshift { 0%, 100% { background-position: 0% 50%; } 50% { background-position: 100% 50%; } }
@keyframes spin { to { transform: rotate(360deg); } }
@keyframes bob { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-14px); } }
@keyframes floaty { 0%, 100% { transform: translateY(0) rotate(-6deg); } 50% { transform: translateY(-26px) rotate(8deg); } }
@keyframes morph { 0%, 100% { border-radius: 42% 58% 60% 40% / 45% 45% 55% 55%; } 33% { border-radius: 60% 40% 45% 55% / 55% 60% 40% 45%; } 66% { border-radius: 48% 52% 38% 62% / 38% 50% 50% 62%; } }
@keyframes drift { 0%, 100% { transform: translate(0, 0) scale(1); } 50% { transform: translate(24px, -30px) scale(1.08); } }
@keyframes wobble { 0%, 100% { transform: rotate(-3deg); } 50% { transform: rotate(3deg) scale(1.04); } }
@keyframes wiggle { 0%, 100% { transform: rotate(-6deg); } 25% { transform: rotate(-18deg) scale(1.15); } 50% { transform: rotate(8deg) scale(1.15); } 75% { transform: rotate(-12deg); } }
@keyframes wordIn { to { opacity: 1; transform: none; } }
@keyframes rotIn { 0% { transform: translateY(.6em) scale(.6) rotate(-8deg); opacity: 0; } 100% { transform: none; opacity: 1; } }
@keyframes squig { to { background-position: 40px 0; } }
@keyframes wavex { to { background-position-x: -1440px; } }
@keyframes marq { to { transform: translateX(-50%); } }
@keyframes scrollDot { 0% { transform: translateY(0); opacity: 1; } 100% { transform: translateY(16px); opacity: 0; } }
@keyframes popIn { 0% { opacity: 0; transform: scale(.7); } 100% { opacity: 1; transform: scale(1); } }
@keyframes fadeIn { from { opacity: 0; } to { opacity: 1; } }
@keyframes shake { 0%, 100% { transform: translateX(0); } 20%, 60% { transform: translateX(-8px); } 40%, 80% { transform: translateX(8px); } }
@keyframes pulse { 0% { box-shadow: 0 0 0 0 rgba(255, 79, 168, .55), 0 10px 26px rgba(255, 79, 168, .38); } 70% { box-shadow: 0 0 0 18px rgba(255, 79, 168, 0), 0 10px 26px rgba(255, 79, 168, .38); } 100% { box-shadow: 0 0 0 0 rgba(255, 79, 168, 0), 0 10px 26px rgba(255, 79, 168, .38); } }
@keyframes trail { to { opacity: 0; scale: .2; translate: var(--x) calc(var(--y) + 26px); } }
@keyframes confetti { 0% { transform: translate(0, 0) rotate(0); opacity: 1; } 100% { transform: translate(var(--dx), var(--dy)) rotate(var(--rot)); opacity: 0; } }

/* ---------- واکنش‌گرا ---------- */
@media (max-width: 900px) {
	.hero-inner, .about-grid, .single-art, .footer-grid { grid-template-columns: 1fr; }
	.hero { padding: 40px 0 130px; text-align: center; }
	.hero .lead { margin-inline: auto; }
	.hero .actions, .trust { justify-content: center; }
	.hero-logo { order: -1; }
	.orb { width: min(280px, 70vw); }
	.scroll-hint, .fl.f5, .fl.f6 { display: none; }
	.form-grid { grid-template-columns: 1fr; }
	.nav-toggle { display: block; }
	.main-nav { position: absolute; top: calc(100% + 10px); inset-inline: 0; background: #fff; border-radius: 28px; box-shadow: 0 20px 50px rgba(138, 92, 255, .3); padding: 14px; display: none; pointer-events: auto; }
	.main-nav.open { display: block; animation: popIn .35s var(--bounce); }
	.main-nav ul { flex-direction: column; align-items: stretch; }
	.main-nav a:not(.lang-switch) { text-align: center; }
	.lang-switch { justify-content: center; }
	.form-wrap { padding: 22px; }
	.section { padding: 56px 0; }
	.brand span { font-size: 1.05rem; }
	.about-visual::before, .about-visual::after { display: none; }
}
@media (prefers-reduced-motion: reduce) {
	*, *::before, *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
	.reveal, .hero h1 .w { opacity: 1 !important; translate: none !important; scale: none !important; transform: none !important; }
	.marquee-track { animation: none !important; }
	.intro, .trail, .confetti { display: none !important; }
}

/* ---------- بهینه‌سازی کارایی ---------- */
html { overflow-x: clip; -webkit-text-size-adjust: 100%; }
img { max-width: 100%; height: auto; }
.blob, .fl, .orbit, .orb .ring, .orb img, .marquee-track, .bubble, .cta-band .shape { will-change: transform; backface-visibility: hidden; }
/* انیمیشنِ بخش‌های بیرون از صفحه و تب پنهان متوقف می‌شود */
.is-off, .is-off *, .is-off::before, .is-off::after,
html.tab-hidden *, html.tab-hidden *::before, html.tab-hidden *::after { animation-play-state: paused !important; }
.is-off .blob, .is-off .fl, .is-off .orbit, .is-off .ring, .is-off .marquee-track, .is-off .bubble, .is-off .shape { will-change: auto; }
/* نسخه سبک برای گوشی‌ها و دستگاه‌های ضعیف */
html.lite .hero, html.lite .cta-band, html.lite .page-hero, html.lite .about-visual .frame { animation: none; background-size: 100% 100%; }
html.lite .blob, html.lite .page-hero::before, html.lite .page-hero::after { mix-blend-mode: normal; animation: drift 18s ease-in-out infinite; opacity: .55; }
html.lite .waves .w1, html.lite .waves .w2, html.lite .waves .w3, html.lite .page-hero + .section::before, html.lite .foot-wave { animation: none; }
html.lite .progress, html.lite .brand span, html.lite .rot, html.lite .section-head h2::after { animation: none; }
html.lite .rot.swap { animation: rotIn .55s var(--bounce); }
html.lite .rot::after { animation: none; }
html.lite .site-header { backdrop-filter: none; background: rgba(255, 255, 255, .96); }
html.lite .fl { filter: none; }
html.lite .badge, html.lite .step .num, html.lite .chip, html.lite .sticker, html.lite .main-nav a.cta, html.lite .btn.pulse { animation: none; }
html.lite .art { will-change: auto; }
@media (max-width: 600px) {
	body { font-size: 16px; }
	.hero h1 { font-size: clamp(2rem, 9vw, 2.6rem); }
	.bubbles { gap: 16px; }
	.bubble { width: 150px; }
	.fl.f3, .fl.f4 { display: none; }
	.gallery-grid { grid-template-columns: 1fr 1fr; gap: 12px; }
	.filters { gap: 8px; }
	.filters button { padding: 6px 14px; font-size: .9rem; }
}
@media (max-width: 380px) {
	.gallery-grid { grid-template-columns: 1fr; }
	.brand span { display: none; }
}
@media (hover: none) { .art:hover, .card:hover { translate: none; } }

/* ======== نسخه ۲.۲ — رنگ‌های جیغ‌تر و شادتر ======== */
body { background-color: #fff4d6; }
.hero { background: linear-gradient(125deg, #ff4fa8 0%, #ff7a3d 28%, #ffb800 52%, #3ec9a7 76%, #33a8ff 100%); background-size: 260% 260%; color: #fff; }
.blob { opacity: .55; mix-blend-mode: soft-light; }
.blob.b1 { background: #fff; } .blob.b3 { background: #8a5cff; } .blob.b5 { background: #ffe14d; } .blob.b6 { background: #ff4fa8; }
.hero h1 { color: #fff; text-shadow: 0 4px 0 rgba(120, 30, 120, .25); }
.hero .rot { background: none; color: #fff35c; -webkit-text-fill-color: #fff35c; text-shadow: 0 4px 0 rgba(150, 60, 0, .3); }
.hero .rot::after { filter: brightness(0) invert(1); }
.hero .lead { color: rgba(255, 255, 255, .95); text-shadow: 0 2px 8px rgba(120, 30, 90, .35); }
.trust span { background: #fff; color: var(--ink); }
.chip { background: #fff; }
.hero .btn.ghost, .hero .btn-ghost { background: #fff; }
.scroll-hint { border-color: #fff; }
.waves .w1 { filter: brightness(1.4); }

.section { margin: 0 14px 20px; border-radius: 56px; padding: 90px 0; }
.section.white { background: none; }
.section::before { z-index: 0; }
.section > .container { position: relative; z-index: 1; }
.page-hero + .section::before { display: none; }
.hero + .marquee-wrap + .section { background: linear-gradient(160deg, #fff2a6, #ffd1e8 60%, #ffc2a6); }
.marquee-wrap + .section + .section { background: linear-gradient(160deg, #c8f1ff, #d9ccff 70%, #ffc9ee); }
.marquee-wrap + .section + .section + .section { background: linear-gradient(160deg, #ffe0b8, #ffc1c9 60%, #ffb3dc); }
.marquee-wrap + .section + .section + .section + .section { background: linear-gradient(160deg, #bff7de, #fff3a8 70%, #c8ecff); }
.page-hero ~ .section { background: linear-gradient(170deg, #fff2a6, #ffd6ec 55%, #d6f0ff); }

.page-hero { background: linear-gradient(120deg, #ff4fa8, #ff9f1c 40%, #35c9a8 72%, #33a8ff); background-size: 250% 250%; color: #fff; }
.page-hero h1 { color: #fff; text-shadow: 0 4px 0 rgba(120, 30, 120, .25); }
.page-hero p { color: rgba(255, 255, 255, .95); }
.page-hero::before { background: #fff35c; mix-blend-mode: normal; opacity: .7; }
.page-hero::after { background: #8a5cff; mix-blend-mode: normal; opacity: .6; }

/* کارت‌های خدمات: رنگی و پررنگ */
.cards .card:nth-child(1) { --bgc: linear-gradient(145deg, #ff5d73, #ff2f8f); }
.cards .card:nth-child(2) { --bgc: linear-gradient(145deg, #1fd1a5, #14a8d8); }
.cards .card:nth-child(3) { --bgc: linear-gradient(145deg, #8a5cff, #d04cff); }
.cards .card:nth-child(4) { --bgc: linear-gradient(145deg, #ffb400, #ff6a2b); }
.card { background: var(--bgc); color: #fff; }
.card h3, .card p { color: #fff; }
.card p { opacity: .95; }
.card .icon { background: #fff; box-shadow: 0 12px 24px rgba(0, 0, 0, .2); }
.card::after { background: #fff; opacity: .18; }

/* مراحل سفارش */
.step:nth-child(1) { --bgc: linear-gradient(160deg, #ff5d73, #ff8a5c); }
.step:nth-child(2) { --bgc: linear-gradient(160deg, #ff9f1c, #ffd23f); }
.step:nth-child(3) { --bgc: linear-gradient(160deg, #1fd1a5, #4fd96a); }
.step:nth-child(4) { --bgc: linear-gradient(160deg, #8a5cff, #ff4fa8); }
.step { background: var(--bgc); color: #fff; }
.step h3, .step p { color: #fff; }
.step:nth-child(2) h3, .step:nth-child(2) p { color: #4a2a00; }
.step .num { background: #fff; color: var(--c); box-shadow: 0 10px 20px rgba(0, 0, 0, .2), 0 0 0 6px var(--c); }

.section-head h2 { color: var(--ink); }
.art { background: #fff; }
.filters button { background: #fff; }
.filters button.active { background: var(--c); color: #fff; }
.form-wrap { background: #fff; }

.site-footer { background: linear-gradient(150deg, #8a5cff, #ff4fa8 55%, #ff9f1c); color: #fff; }
.foot-wave { filter: none; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 120' preserveAspectRatio='none'%3E%3Cpath fill='%238a5cff' d='M0 60 C180 0 360 120 540 70 S900 10 1080 70 S1300 100 1440 60 V120 H0Z'/%3E%3C/svg%3E"); }
.site-footer h4 { color: #fff35c; }
.site-footer a, .site-footer p, .site-footer .copy { color: #fff; }
.site-footer a:hover { color: #fff35c; }
.site-footer .copyright, .site-footer .bottom { border-color: rgba(255, 255, 255, .4); }

.site-header { border: 3px solid transparent; background: linear-gradient(#fff, #fff) padding-box, var(--rainbow) border-box; }
@media (max-width: 900px) { .section { margin: 0 8px 14px; border-radius: 34px; padding: 60px 0; } }