/* Rasta Academy — ویجت ویدیوهای راهنما */

.rasta-w { direction: rtl; color: var(--t-ink); font-family: var(--rasta-font, inherit); }
.rasta-w *, .rasta-w *::before, .rasta-w *::after { box-sizing: border-box; }

/* ================= پنل ================= */
.rasta-guides { position: relative; margin-block: clamp(12px, 2vw, 24px); padding: clamp(28px, 4vw, 52px) clamp(20px, 3.6vw, 48px); overflow: hidden; border: 1px solid rgba(220, 230, 255, .9); border-radius: 36px; background: radial-gradient(55% 70% at 100% 100%, rgba(47, 107, 255, .1), transparent 65%), linear-gradient(180deg, #F2F6FF 0%, #FFFFFF 100%); box-shadow: 0 40px 80px -60px rgba(47, 107, 255, .5); isolation: isolate; }
.rasta-guides::before { content: ""; position: absolute; inset: 0; z-index: -1; background-image: repeating-linear-gradient(0deg, rgba(47, 107, 255, .07) 0 1px, transparent 1px 5px), repeating-linear-gradient(90deg, rgba(47, 107, 255, .07) 0 1px, transparent 1px 5px); -webkit-mask-image: radial-gradient(40% 55% at 50% 0%, #000 0%, transparent 100%); mask-image: radial-gradient(40% 55% at 50% 0%, #000 0%, transparent 100%); pointer-events: none; }

/* ================= عنوان ================= */
.rasta-guides .rasta-guides__head { max-width: 640px; margin: 0 auto 28px; text-align: center; }
.rasta-guides .rasta-guides__eyebrow { display: inline-flex; align-items: center; gap: 9px; color: var(--t-blue); font-size: 13px; font-weight: 600; line-height: 1.6; }
.rasta-guides .rasta-guides__eyebrow i { display: grid; flex: 0 0 30px; place-items: center; width: 30px; height: 30px; border-radius: 10px; background: var(--t-blue-50); color: var(--t-blue); font-style: normal; box-shadow: inset 0 0 0 1px rgba(47, 107, 255, .12); }
.rasta-guides .rasta-guides__eyebrow svg { width: 16px; height: 16px; }
.rasta-guides .rasta-guides__title { margin: 10px 0 6px; padding: 0; color: var(--t-ink); font-family: inherit; font-size: clamp(22px, 2.4vw, 32px); font-weight: 700; line-height: 1.55; letter-spacing: 0; text-transform: none; }
.rasta-guides .rasta-guides__desc { margin: 0; color: var(--t-muted); font-size: 14.5px; font-weight: 400; line-height: 2; }

/* ================= چیدمان ================= */
.rasta-guides .rasta-guides__grid { display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr); align-items: start; gap: 20px; }
.rasta-guides.is-single .rasta-guides__grid { grid-template-columns: minmax(0, 1fr); max-width: 820px; margin-inline: auto; }
.rasta-guides .rasta-guides__list { display: flex; flex-direction: column; gap: 12px; min-width: 0; }

/* ریست دکمه (جلوگیری از استایل قالب‌های دیگر) */
.rasta-guides .rasta-guides__feature, .rasta-guides .rasta-guides__feature:hover, .rasta-guides .rasta-guides__feature:focus,
.rasta-guides .rasta-guides__row, .rasta-guides .rasta-guides__row:hover, .rasta-guides .rasta-guides__row:focus { margin: 0; color: inherit; font: inherit; letter-spacing: 0; line-height: inherit; text-align: start; text-transform: none; white-space: normal; cursor: pointer; }
.rasta-guides .is-soon, .rasta-guides .is-soon:hover { cursor: default; }
.rasta-guides .rasta-guides__feature:focus-visible, .rasta-guides .rasta-guides__row:focus-visible { outline: 2px solid var(--t-blue); outline-offset: 3px; }

/* ================= ویدیوی اصلی ================= */
.rasta-guides .rasta-guides__feature, .rasta-guides .rasta-guides__feature:hover, .rasta-guides .rasta-guides__feature:focus { position: relative; display: block; width: 100%; aspect-ratio: 16 / 10; padding: 0; overflow: hidden; border: 0; border-radius: 26px; background: #0B1220; box-shadow: 0 40px 70px -40px rgba(16, 24, 40, .6); }
.rasta-guides .rasta-guides__feature .rasta-guides__thumb { position: absolute; inset: 0; display: block; }
.rasta-guides .rasta-guides__feature .rasta-guides__thumb::after { content: ""; position: absolute; inset: 0; background: linear-gradient(to top, rgba(11, 18, 32, .88) 0%, rgba(11, 18, 32, .2) 50%, rgba(11, 18, 32, 0) 75%); pointer-events: none; }
.rasta-guides .rasta-guides__feature .rasta-guides__body { position: absolute; right: 0; bottom: 0; left: 0; z-index: 2; display: block; padding: clamp(18px, 2.6vw, 28px); color: #fff; }
.rasta-guides .rasta-guides__feature .rasta-guides__step { color: #A9C2FF; }
.rasta-guides .rasta-guides__feature .rasta-guides__name { color: #fff; font-size: clamp(16px, 1.6vw, 20px); }
.rasta-guides .rasta-guides__feature .rasta-guides__text { max-width: 520px; color: rgba(255, 255, 255, .72); font-size: 13px; }
.rasta-guides .rasta-guides__feature .rasta-guides__play { top: 42%; width: 76px; height: 76px; }
.rasta-guides .rasta-guides__feature .rasta-guides__play::before { content: ""; position: absolute; inset: -8px; border: 1px solid rgba(255, 255, 255, .45); border-radius: 50%; animation: rastaGuideRing 2.6s ease-out infinite; }
.rasta-guides .rasta-guides__feature .rasta-guides__play svg { width: 26px; height: 26px; }
.rasta-guides .rasta-guides__feature .rasta-guides__dur { top: 16px; left: 16px; bottom: auto; }
.rasta-guides .rasta-guides__feature:hover .rasta-guides__thumb img { transform: scale(1.04); }
.rasta-guides .rasta-guides__feature:hover .rasta-guides__play { transform: translate(-50%, -50%) scale(1.08); }
@keyframes rastaGuideRing { from { opacity: .9; transform: scale(1); } to { opacity: 0; transform: scale(1.45); } }

/* ================= ردیف‌های لیست ================= */
.rasta-guides .rasta-guides__row, .rasta-guides .rasta-guides__row:hover, .rasta-guides .rasta-guides__row:focus { display: grid; grid-template-columns: 128px minmax(0, 1fr); align-items: center; gap: 14px; width: 100%; padding: 10px; border: 1px solid var(--t-line); border-radius: 20px; background: #fff; box-shadow: 0 1px 2px rgba(16, 24, 40, .04); transition: border-color .3s ease, box-shadow .3s ease, transform .4s var(--t-ease); }
.rasta-guides .rasta-guides__row:hover:not(.is-soon) { border-color: var(--t-blue-100); box-shadow: 0 22px 40px -28px rgba(47, 107, 255, .6); transform: translateY(-2px); }
.rasta-guides .rasta-guides__row .rasta-guides__thumb { position: relative; display: block; aspect-ratio: 16 / 10; overflow: hidden; border-radius: 14px; background: #0B1220; }
.rasta-guides .rasta-guides__row .rasta-guides__play { width: 36px; height: 36px; }
.rasta-guides .rasta-guides__row .rasta-guides__play svg { width: 14px; height: 14px; }
.rasta-guides .rasta-guides__row .rasta-guides__body { display: block; min-width: 0; }
.rasta-guides .rasta-guides__row .rasta-guides__name { display: -webkit-box; overflow: hidden; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.rasta-guides .rasta-guides__row .rasta-guides__text { display: -webkit-box; overflow: hidden; -webkit-box-orient: vertical; -webkit-line-clamp: 1; }
.rasta-guides .rasta-guides__row:hover .rasta-guides__play { background: var(--t-blue); color: #fff; }

/* ================= اجزای مشترک ================= */
.rasta-guides .rasta-guides__thumb img { position: absolute; inset: 0; display: block; width: 100%; height: 100%; max-width: none; margin: 0; border-radius: 0; object-fit: cover; transition: transform .9s var(--t-ease); }
.rasta-guides .rasta-guides__ph { position: absolute; inset: 0; display: grid; place-items: center; background: repeating-linear-gradient(45deg, rgba(255, 255, 255, .05) 0 1px, transparent 1px 16px), radial-gradient(70% 90% at 30% 20%, #4A82FF 0%, #1E4FD8 55%, #0B1A48 100%); color: rgba(255, 255, 255, .14); }
.rasta-guides .rasta-guides__ph svg { width: 42%; max-width: 160px; height: auto; }
.rasta-guides .rasta-guides__play { position: absolute; top: 50%; left: 50%; z-index: 1; display: grid; place-items: center; border-radius: 50%; background: rgba(255, 255, 255, .95); color: var(--t-blue); box-shadow: 0 16px 30px -12px rgba(11, 18, 32, .6); transform: translate(-50%, -50%); transition: transform .4s var(--t-ease), background .3s ease, color .3s ease; }
.rasta-guides .rasta-guides__play svg { transform: translateX(1.5px); }
.rasta-guides .rasta-guides__dur { position: absolute; bottom: 6px; left: 6px; z-index: 1; padding: 1px 8px; border-radius: 999px; background: rgba(11, 18, 32, .6); color: #fff; font-size: 11px; line-height: 1.9; -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); }
.rasta-guides .rasta-guides__step { display: flex; align-items: center; gap: 8px; color: var(--t-blue); font-size: 12px; font-weight: 600; line-height: 1.7; }
.rasta-guides .rasta-guides__step em { padding: 0 8px; border-radius: 999px; background: linear-gradient(135deg, #F6DFA6, #D9A84E); color: #4A3000; font-size: 10.5px; font-style: normal; font-weight: 600; line-height: 1.9; }
.rasta-guides .rasta-guides__name { display: block; margin-top: 2px; color: var(--t-ink); font-size: 14.5px; font-weight: 600; line-height: 1.75; }
.rasta-guides .rasta-guides__text { display: block; margin-top: 2px; color: var(--t-muted); font-size: 12.5px; font-weight: 400; line-height: 1.8; }
.rasta-guides .is-soon .rasta-guides__play { opacity: .5; }
.rasta-guides .rasta-guides__step small { display: inline-flex; align-items: center; gap: 4px; color: var(--t-muted); font-size: 11.5px; font-weight: 400; }
.rasta-guides .rasta-guides__step small svg { width: 13px; height: 13px; }
.rasta-guides .rasta-guides__row .rasta-guides__ph svg { display: none; }

/* ================= ردیف پشتیبانی ================= */
.rasta-guides .rasta-guides__help { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px 20px; margin-top: 20px; padding: 12px 12px 12px 18px; border: 1px solid var(--t-line); border-radius: 20px; background: rgba(255, 255, 255, .85); }
.rasta-guides .rasta-guides__help > span { display: inline-flex; align-items: center; gap: 10px; color: var(--t-ink-2); font-size: 14px; line-height: 1.8; }
.rasta-guides .rasta-guides__help i { display: grid; flex: 0 0 36px; place-items: center; width: 36px; height: 36px; border-radius: 12px; background: var(--t-blue-50); color: var(--t-blue); font-style: normal; }
.rasta-guides .rasta-guides__help i svg { width: 18px; height: 18px; }
.rasta-guides .rasta-guides__help-btn, .rasta-guides .rasta-guides__help-btn:visited { display: inline-flex; align-items: center; gap: 8px; height: 44px; padding: 0 18px; border: 1px solid var(--t-blue-100); border-radius: 14px; background: var(--t-blue-50); color: var(--t-blue); font-size: 13.5px; font-weight: 600; text-decoration: none; white-space: nowrap; transition: background .3s ease, color .3s ease; }
.rasta-guides .rasta-guides__help-btn:hover { background: var(--t-blue); color: #fff; }
.rasta-guides .rasta-guides__help-btn svg { width: 16px; height: 16px; }

/* ================= واکنش‌گرا ================= */
@media (max-width: 1320px) { .rasta-guides { margin-inline: 0; } }
@media (max-width: 960px) {
    .rasta-guides .rasta-guides__grid { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 720px) {
    .rasta-guides { padding: 30px 16px 32px; border-width: 1px 0; border-radius: 0; box-shadow: none; }
    .rasta-guides .rasta-guides__head { margin-bottom: 22px; }
    .rasta-guides .rasta-guides__feature, .rasta-guides .rasta-guides__feature:hover, .rasta-guides .rasta-guides__feature:focus { aspect-ratio: 4 / 3; border-radius: 20px; }
    .rasta-guides .rasta-guides__feature .rasta-guides__play { top: 38%; width: 62px; height: 62px; }
    .rasta-guides .rasta-guides__feature .rasta-guides__text { display: none; }
    .rasta-guides .rasta-guides__row, .rasta-guides .rasta-guides__row:hover, .rasta-guides .rasta-guides__row:focus { grid-template-columns: 104px minmax(0, 1fr); gap: 12px; padding: 8px; border-radius: 18px; }
    .rasta-guides .rasta-guides__row .rasta-guides__name { font-size: 13.5px; }
    .rasta-guides .rasta-guides__row .rasta-guides__text { display: none; }
    .rasta-guides .rasta-guides__help { flex-direction: column; padding: 16px; text-align: center; }
    .rasta-guides .rasta-guides__help > span { flex-direction: column; }
    .rasta-guides .rasta-guides__help-btn { justify-content: center; width: 100%; }
}
@media (prefers-reduced-motion: reduce) { .rasta-guides .rasta-guides__play::before { animation: none; } .rasta-guides .rasta-guides__row, .rasta-guides .rasta-guides__thumb img, .rasta-guides .rasta-guides__play { transition: none; } }