html.rtl-mode body {
    direction: rtl;
    text-align: right;
}

html.rtl-mode .nav-links a::after {
    left: auto;
    right: 0;
}

html.rtl-mode .hero-content {
    direction: rtl;
}

html.rtl-mode .floating-card-1 {
    left: auto;
    right: -40px;
    bottom: -30px;
}

html.rtl-mode .floating-card-2 {
    top: 40px;
    right: auto;
    left: -40px;
}

html.rtl-mode .feature-card::before {
    transform-origin: right;
}

html.rtl-mode .info-item:hover {
    transform: translateX(-10px);
}