
html[lang="ar"] a,
html[lang="ar"] span,
html[lang="ar"] p,
html[lang="ar"] h1,
html[lang="ar"] h2,
html[lang="ar"] h3,
html[lang="ar"] h4,
html[lang="ar"] h5,
html[lang="ar"] h6,
html[lang="ar"] li,
html[lang="ar"] button,
html[lang="ar"] input,
html[lang="ar"] textarea,
html[lang="ar"] select,
html[lang="ar"] option,
html[lang="ar"] label,
html[lang="ar"] .hero-title,
html[lang="ar"] .hero-description,
html[lang="ar"] .section-title,
html[lang="ar"] .section-description,
html[lang="ar"] .nav-link,
html[lang="ar"] .btn-primary-karmel,
html[lang="ar"] .btn-outline-karmel,
html[lang="ar"] .btn-nav-cta,
html[lang="ar"] .footer-title,
html[lang="ar"] .footer-links a {
  font-family: 'Tajawal', sans-serif !important;
}

html[lang="he"] a,
html[lang="he"] span,
html[lang="he"] p,
html[lang="he"] h1,
html[lang="he"] h2,
html[lang="he"] h3,
html[lang="he"] h4,
html[lang="he"] h5,
html[lang="he"] h6,
html[lang="he"] li,
html[lang="he"] button,
html[lang="he"] input,
html[lang="he"] textarea,
html[lang="he"] select,
html[lang="he"] option,
html[lang="he"] label,
html[lang="he"] .hero-title,
html[lang="he"] .hero-description,
html[lang="he"] .section-title,
html[lang="he"] .section-description,
html[lang="he"] .nav-link,
html[lang="he"] .btn,
html[lang="he"] .btn-primary-karmel,
html[lang="he"] .btn-outline-karmel,
html[lang="he"] .btn-nav-cta,
html[lang="he"] .footer-title,
html[lang="he"] .footer-links a {
  font-family: 'Heebo', sans-serif !important;
}


html[lang="ar"] .hero-code-block,
html[lang="he"] .hero-code-block {
    direction: ltr;
    text-align: left;
    font-family: 'Courier New', monospace !important;
}


html[lang="ar"] .btn-primary-karmel .btn-icon,
html[lang="he"] .btn-primary-karmel .btn-icon,
html[lang="ar"] .btn-outline-karmel .btn-icon,
html[lang="he"] .btn-outline-karmel .btn-icon {
    transform: scaleX(-1); 
}

html[lang="ar"] .btn-primary-karmel:hover .btn-icon,
html[lang="he"] .btn-primary-karmel:hover .btn-icon,
html[lang="ar"] .btn-outline-karmel:hover .btn-icon,
html[lang="he"] .btn-outline-karmel:hover .btn-icon {
    transform: translateX(-4px) scaleX(-1); 
}


html[lang="ar"] .breadcrumb-karmel svg,
html[lang="he"] .breadcrumb-karmel svg {
    transform: scaleX(-1);
}


html[lang="ar"] .carousel-btn:first-child svg,
html[lang="he"] .carousel-btn:first-child svg,
html[lang="ar"] .carousel-btn:last-child svg,
html[lang="he"] .carousel-btn:last-child svg {
    transform: rotate(180deg);
}


html[lang="ar"] .section-label,
html[lang="he"] .section-label {
    padding-left: 0;
    padding-right: 36px;
}

html[lang="ar"] .section-label::before,
html[lang="he"] .section-label::before {
    left: auto;
    right: 0;
}


html[lang="ar"] .timeline,
html[lang="he"] .timeline {
    padding-left: 0;
    padding-right: 40px;
}

html[lang="ar"] .timeline::before,
html[lang="he"] .timeline::before {
    left: auto;
    right: 7px;
}

html[lang="ar"] .timeline-item::before,
html[lang="he"] .timeline-item::before {
    left: auto;
    right: -40px;
}

html[lang="ar"] .process-step-number,
html[lang="he"] .process-step-number {
    text-align: right;
}


html[lang="ar"] .footer-links a:hover,
html[lang="he"] .footer-links a:hover {
    transform: translateX(-5px);
}

html[lang="ar"] .contact-info-card,
html[lang="he"] .contact-info-card {
    flex-direction: row-reverse;
}

html[lang="ar"] .integration-feature-item svg,
html[lang="he"] .integration-feature-item svg {
    margin-left: 10px;
    margin-right: 0;
}


html[lang="ar"] .navbar-toggler,
html[lang="he"] .navbar-toggler {
    margin-left: 0;
    margin-right: auto;
}


html[lang="ar"] .hero-badge,
html[lang="he"] .hero-badge {
    flex-direction: row-reverse;
}

html[lang="ar"] .project-card-overlay,
html[lang="he"] .project-card-overlay {
    text-align: right;
}


html[lang="ar"] body {
    font-family: 'Tajawal', sans-serif;
}

html[lang="he"] body {
    font-family: 'Heebo', sans-serif;
}