/* پوسته‌ی ویسا: جهت «ارگانیک و نرم» (wl-og). زمینه‌ی گرم، شکل‌های آزاد، برگ، کپسول. */
.wl-og { background: color-mix(in srgb, var(--wl-primary) 7%, var(--wl-paper)); color: var(--wl-ink); }
.wl-og :is(.wl-og-hero, .wl-og-copy, .wl-og-stage, .wl-ings, .wl-ing, .wl-sub, .wl-sub-copy, .wl-plans, .wl-plan) > * { margin: 0; }
.wl-og-eyebrow { display: inline-block; width: max-content; padding: 0.3rem 1rem; border-radius: 999px; background: color-mix(in srgb, var(--wl-primary) 14%, transparent); color: var(--wl-primary); font-weight: 700; font-size: 0.875rem; }
.wl-og .wp-block-button .wp-block-button__link { border-radius: 999px; }
.wl-og-text { font-size: 1.125rem; color: var(--wl-muted); max-width: 32rem; }

.wl-og-hero { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 0.9fr); gap: clamp(2rem, 5vw, 4.5rem); align-items: center; }
.wl-og-copy { display: grid; gap: 1.25rem; justify-items: start; }
.wl-sec .wl-og-title { font-size: clamp(2.8rem, 6.6vw, 5.2rem) !important; line-height: 1.2 !important; margin: 0 !important; font-weight: 800 !important; }
.wl-og-title mark { background: linear-gradient(transparent 62%, color-mix(in srgb, var(--wl-accent) 55%, transparent) 62%); color: inherit; padding: 0 0.1em; }
.wl-og-stage { position: relative; padding: 1.5rem; }
.wl-og-img img { width: 100%; aspect-ratio: 4/5; object-fit: cover; }
.wl-og-dot { position: absolute; width: 38%; aspect-ratio: 1; border-radius: 50%; background: var(--wl-accent); opacity: 0.35; top: -0.5rem; inset-inline-start: -1rem; z-index: 0; }
.wl-og-stage .wp-block-image { position: relative; z-index: 1; }
.wl-og-leaf { position: absolute; z-index: 2; color: var(--wl-primary); width: 4.5rem; animation: wl-bob 7s ease-in-out infinite; }
.wl-og-leaf--a { top: 0; inset-inline-end: 0; rotate: 30deg; } .wl-og-leaf--b { bottom: 14%; inset-inline-start: -0.5rem; rotate: -35deg; width: 3rem; opacity: 0.8; animation-delay: -3s; }
.wl-og-leaf svg { width: 100%; height: auto; display: block; }
.wl-og-leaf .wl-svg, .wl-og-leaf > div { width: 100%; }
.wl-og-badge { position: absolute; z-index: 3; display: grid; place-items: center; text-align: center; padding: 0.9rem 1.1rem; border-radius: 1.25rem; background: var(--wl-paper); box-shadow: 0 12px 34px rgb(0 0 0 / 0.14); line-height: 1.4; font-size: 0.8125rem; color: var(--wl-muted); }
.wl-og-badge strong { display: block; font-size: 1.35rem; color: var(--wl-primary); }
.wl-og-badge p { margin: 0; }
.wl-og-badge--a { bottom: 2.5rem; inset-inline-start: -1rem; } .wl-og-badge--b { top: 3.5rem; inset-inline-end: -0.75rem; }

/* مواد اولیه */
.wl-ings { position: relative; display: grid; grid-template-columns: 1fr minmax(0, 24rem) 1fr; grid-template-rows: auto auto; gap: 1.5rem clamp(1.5rem, 5vw, 5rem); align-items: center; }
.wl-ings__core { grid-column: 2; grid-row: 1 / 3; position: relative; }
.wl-ings__core::before { content: ""; position: absolute; inset: -1.25rem; border-radius: 50%; border: 2px dashed color-mix(in srgb, var(--wl-primary) 40%, transparent); animation: wl-spin 80s linear infinite; }
.wl-ings__img img { width: 100%; aspect-ratio: 1; object-fit: cover; border-radius: 50% !important; box-shadow: 0 30px 70px rgb(0 0 0 / 0.18); }
.wl-ing { display: grid; grid-template-columns: 5rem 1fr; gap: 0.15rem 1rem; align-items: center; padding: 1rem 1.25rem; border-radius: 1.5rem; background: var(--wl-paper); box-shadow: 0 10px 30px rgb(0 0 0 / 0.07); }
.wl-ing__img { grid-row: 1 / 3; } .wl-ing__img img { width: 100%; aspect-ratio: 1; object-fit: cover; border-radius: 50% !important; }
.wl-sec .wl-ing__t { font-size: 1.05rem !important; margin: 0 !important; } .wl-ing__d { font-size: 0.875rem; color: var(--wl-muted); }
.wl-ing--1 { grid-column: 1; grid-row: 1; } .wl-ing--2 { grid-column: 1; grid-row: 2; } .wl-ing--3 { grid-column: 3; grid-row: 1; } .wl-ing--4 { grid-column: 3; grid-row: 2; }

/* اشتراک */
.wl-sub { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(0, 0.7fr); gap: clamp(2rem, 4vw, 4rem); align-items: center; }
.wl-sub-copy { display: grid; gap: 1.1rem; }
.wl-sub-title { margin: 0 !important; font-weight: 800 !important; }
.wl-sub-img img { width: 100%; aspect-ratio: 3/4; object-fit: cover; }
.wl-plans { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; margin-block: 0.5rem !important; }
.wl-plan { position: relative; display: grid; gap: 0.35rem; justify-items: center; text-align: center; padding: 1.5rem 1rem 1.25rem; border-radius: 1.5rem; background: var(--wl-paper); border: 2px solid transparent; box-shadow: 0 8px 24px rgb(0 0 0 / 0.06); transition: translate 0.3s; }
.wl-plan:hover { translate: 0 -0.25rem; }
.wl-plan.is-best { border-color: var(--wl-primary); background: color-mix(in srgb, var(--wl-primary) 8%, var(--wl-paper)); }
.wl-plan__best { position: absolute; top: -0.8rem; background: var(--wl-primary); color: var(--wl-paper) !important; padding: 0.1rem 0.9rem; border-radius: 999px; font-size: 0.8rem; font-weight: 700; }
.wl-plan__name { margin: 0 !important; font-weight: 800 !important; } .wl-plan__off { color: var(--wl-primary); font-weight: 700; font-size: 0.9rem; }
.wl-plan__price strong { font-size: 1.6rem; } .wl-plan__note { color: var(--wl-muted); font-size: 0.85rem; margin-bottom: 0.5rem !important; }
.wl-plan .wp-block-buttons { justify-content: center; }
@media (max-width: 900px) {
	.wl-og-hero, .wl-sub { grid-template-columns: 1fr; }
	.wl-ings { grid-template-columns: 1fr 1fr; }
	.wl-ings__core { grid-column: 1 / -1; grid-row: 1; max-width: 18rem; margin-inline: auto; }
	.wl-ing--1, .wl-ing--2, .wl-ing--3, .wl-ing--4 { grid-column: auto; grid-row: auto; }
	.wl-plans { grid-template-columns: 1fr; }
	.wl-og-badge--a { inset-inline-start: 0; } .wl-og-badge--b { inset-inline-end: 0; }
}
@media (max-width: 520px) { .wl-ings { grid-template-columns: 1fr; } }
@media (prefers-reduced-motion: reduce) { .wl-og * { animation: none !important; transition: none !important; } }