/* Persian RTL Stylesheet - imports base + adds RTL overrides */
@import url('style.css');
@import url('https://fonts.googleapis.com/css2?family=Vazirmatn:wght@300;400;600;700;800&display=swap');

body {
    font-family: 'Vazirmatn', 'Poppins', sans-serif;
    direction: rtl;
    text-align: right;
}

.visual-side::after {
    background: linear-gradient(to left, rgba(0, 0, 0, 0) 70%, rgba(15, 15, 18, 0.8) 100%);
}

.content-side {
    order: -1;
}

.card-thumb {
    margin-right: 0;
    margin-left: 1.5rem;
}

.card-action {
    margin-left: 0;
    margin-right: 1rem;
}

.link-card:hover .card-action {
    transform: translateX(-5px) rotate(-90deg);
}

.link-card::after {
    left: auto;
    right: -100%;
    background: linear-gradient(-90deg, transparent, rgba(255, 255, 255, 0.1), transparent);
    transition: right 0.6s ease;
}

.link-card:hover::after {
    right: 100%;
    left: auto;
}

.card-description {
    text-align: right;
}

.content-side::before {
    right: auto;
    left: 10%;
}

.content-side::after {
    left: auto;
    right: 10%;
}

.footer-text {
    text-align: right;
}

.footer-keywords {
    justify-content: flex-start;
    direction: rtl;
}

.hero-name {
    letter-spacing: 0;
    font-family: 'Poppins', sans-serif;
}

.hero-description {
    letter-spacing: 1px;
    font-family: 'Vazirmatn', sans-serif;
}

.lang-option:hover {
    padding-left: 1.2rem;
    padding-right: 1.5rem;
}

@media (max-width: 900px) {
    .visual-side::after {
        background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 60%, rgba(15, 15, 18, 1) 100%);
    }

    .content-side {
        border-radius: 40px 40px 0 0;
    }

    .card-thumb {
        margin-left: 1rem;
    }
}

@media (max-width: 400px) {
    .card-thumb {
        margin-left: 0.8rem;
    }
}