/* * Persian (fa) layer — Kalameh webfont + RTL overrides. * Loaded only on /fa/ pages (when has dir="rtl" / class "lang-fa"). * The Farsi-Numerals build of Kalameh renders Latin digits as Persian numerals. */ @font-face { font-family: 'KalamehWeb'; font-style: normal; font-weight: 100; font-display: swap; src: url('/assets/fonts/kalameh/woff2/KalamehWebFaNum-Thin.woff2') format('woff2'), url('/assets/fonts/kalameh/woff/KalamehWebFaNum-Thin.woff') format('woff'); } @font-face { font-family: 'KalamehWeb'; font-style: normal; font-weight: 200; font-display: swap; src: url('/assets/fonts/kalameh/woff2/KalamehWebFaNum-ExtraLight.woff2') format('woff2'), url('/assets/fonts/kalameh/woff/KalamehWebFaNum-ExtraLight.woff') format('woff'); } @font-face { font-family: 'KalamehWeb'; font-style: normal; font-weight: 300; font-display: swap; src: url('/assets/fonts/kalameh/woff2/KalamehWebFaNum-Light.woff2') format('woff2'), url('/assets/fonts/kalameh/woff/KalamehWebFaNum-Light.woff') format('woff'); } @font-face { font-family: 'KalamehWeb'; font-style: normal; font-weight: 400; font-display: swap; src: url('/assets/fonts/kalameh/woff2/KalamehWebFaNum-Regular.woff2') format('woff2'), url('/assets/fonts/kalameh/woff/KalamehWebFaNum-Regular.woff') format('woff'); } @font-face { font-family: 'KalamehWeb'; font-style: normal; font-weight: 500; font-display: swap; src: url('/assets/fonts/kalameh/woff2/KalamehWebFaNum-Medium.woff2') format('woff2'), url('/assets/fonts/kalameh/woff/KalamehWebFaNum-Medium.woff') format('woff'); } @font-face { font-family: 'KalamehWeb'; font-style: normal; font-weight: 600; font-display: swap; src: url('/assets/fonts/kalameh/woff2/KalamehWebFaNum-SemiBold.woff2') format('woff2'), url('/assets/fonts/kalameh/woff/KalamehWebFaNum-SemiBold.woff') format('woff'); } @font-face { font-family: 'KalamehWeb'; font-style: normal; font-weight: 700; font-display: swap; src: url('/assets/fonts/kalameh/woff2/KalamehWebFaNum-Bold.woff2') format('woff2'), url('/assets/fonts/kalameh/woff/KalamehWebFaNum-Bold.woff') format('woff'); } @font-face { font-family: 'KalamehWeb'; font-style: normal; font-weight: 800; font-display: swap; src: url('/assets/fonts/kalameh/woff2/KalamehWebFaNum-ExtraBold.woff2') format('woff2'), url('/assets/fonts/kalameh/woff/KalamehWebFaNum-ExtraBold.woff') format('woff'); } @font-face { font-family: 'KalamehWeb'; font-style: normal; font-weight: 900; font-display: swap; src: url('/assets/fonts/kalameh/woff2/KalamehWebFaNum-Black.woff2') format('woff2'), url('/assets/fonts/kalameh/woff/KalamehWebFaNum-Black.woff') format('woff'); } /* ---- Persian typography ---- */ .lang-fa, .lang-fa body, .lang-fa input, .lang-fa textarea, .lang-fa select, .lang-fa button, .lang-fa .theme-btn, .lang-fa h1, .lang-fa h2, .lang-fa h3, .lang-fa h4, .lang-fa h5, .lang-fa h6, .lang-fa p, .lang-fa a, .lang-fa span, .lang-fa li { font-family: 'KalamehWeb', 'Inter', 'Segoe UI', Tahoma, sans-serif !important; } .lang-fa body { direction: rtl; text-align: right; } /* Latin brand names / inline-English keep a sensible LTR run inside RTL text */ .lang-fa .ltr, .lang-fa [lang="en"] { direction: ltr; unicode-bidi: isolate; } /* Persian script is taller and connected: kill the Latin negative tracking (which cramps joined letters) and give headings room to breathe. */ .lang-fa h1, .lang-fa h2, .lang-fa h3, .lang-fa h4, .lang-fa h5, .lang-fa h6, .lang-fa .section-heading, .lang-fa .cap-title, .lang-fa .rec-head h2 { letter-spacing: normal !important; } /* Hero headline: the tight 1.08 line-height made the gradient line collide with the line above in Persian — loosen it and add a little gap. */ .lang-fa .hero-area h1 { line-height: 1.55 !important; } .lang-fa .hero-area h1 .grad { line-height: 1.7; padding-bottom: .04em; } /* Footer: the theme hard-codes `text-align: left`, which left this RTL footer's headings/links hugging the wrong edge of their columns. */ .lang-fa .footer-area, .lang-fa .footer-big-text { text-align: right; } /* hover marker + indent live on the physical left — flip them to the right */ .lang-fa .footer-area .footer-grid .footer-menu li a::before { left: auto; right: 0; } .lang-fa .footer-area .footer-grid .footer-menu li a:hover { padding-left: 0; padding-right: 16px; } /* ---- RTL flips for utility/layout bits that are physically biased ---- */ .lang-fa .skip-link { left: auto; right: 6px; } /* Header / nav */ .lang-fa .navbar .sub-menu { text-align: right; } .lang-fa .menu-item-has-children > a .iconoir-nav-arrow-down { margin-right: 4px; margin-left: 0; } /* Generic: reflect common margin helpers used in this codebase. Most layout uses flexbox + bootstrap grid, which follow `direction` automatically, so we only correct text alignment + a few icon offsets. */ .lang-fa .section-heading, .lang-fa .footer-bottom, .lang-fa .copyright { text-align: center; } /* Badge marking case-study links that open in English */ .lang-fa .en-badge { display: inline-flex; align-items: center; font-family: 'Inter', sans-serif !important; font-size: 11px; font-weight: 600; line-height: 1; padding: 3px 7px; border-radius: 999px; border: 1px solid rgba(255, 255, 255, .28); color: #fff; opacity: .85; direction: ltr; margin-inline-start: 8px; vertical-align: middle; } /* Language toggle: keep both EN/فا labels visually LTR-stable in RTL context */ .lang-fa .lang-toggle { direction: ltr; }