.elementor-kit-6{--e-global-color-primary:#FFFFFF;--e-global-color-secondary:#222222;--e-global-color-text:#FFFFFF;--e-global-color-accent:#000000;--e-global-typography-primary-font-weight:600;--e-global-typography-secondary-font-weight:400;--e-global-typography-text-font-weight:400;--e-global-typography-accent-font-weight:500;background-color:#211D1C;}.elementor-kit-6 button:hover,.elementor-kit-6 button:focus,.elementor-kit-6 input[type="button"]:hover,.elementor-kit-6 input[type="button"]:focus,.elementor-kit-6 input[type="submit"]:hover,.elementor-kit-6 input[type="submit"]:focus,.elementor-kit-6 .elementor-button:hover,.elementor-kit-6 .elementor-button:focus{background-color:#00B78100;}.elementor-kit-6 e-page-transition{background-color:#FFBC7D;}.elementor-kit-6 label{color:#FFFFFF;}.elementor-kit-6 input:not([type="button"]):not([type="submit"]),.elementor-kit-6 textarea,.elementor-kit-6 .elementor-field-textual{padding:13px 13px 13px 13px;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1320px;}.e-con{--container-max-width:1320px;}.elementor-widget:not(:last-child){margin-block-end:20px;}.elementor-element{--widgets-spacing:20px 20px;--widgets-spacing-row:20px;--widgets-spacing-column:20px;}{}h1.entry-title{display:var(--page-title-display);}.site-header .site-branding{flex-direction:column;align-items:stretch;}.site-header{padding-inline-end:0px;padding-inline-start:0px;}.site-footer .site-branding{flex-direction:column;align-items:stretch;}@media(max-width:1024px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:1024px;}.e-con{--container-max-width:1024px;}}@media(max-width:767px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:767px;}.e-con{--container-max-width:767px;}}:root { --Btn:#16F0B0; --btn-hover:#11C48F; --btn-text:#121212; --e-gv-d429553:8px; --btn-radius:8px; --green-secound:#00B781; --box-4:4px; --FFF:#ffffff; --Btn-border-low:rgb(58, 58, 58); --P-color:#C5C5C5; --tr-bg:#101010; --tr-card-top:#0C0C0C; --tr-card-mid:#141414; --tr-card-bottom:#1E1E1E; --tr-card-line:#2E2E2E; --tr-muted:#8A8A8A; --tr-hairline:#1C1C1C; --tr-card-radius:20px; --tr-card-radius-in:19px; --tr-card-pad:26px; --tr-btn-primary-text:#00120C; --tr-btn-sheen:rgba(255,255,255,0.55); --tr-btn-secondary-bg-hover:rgba(22,240,176,0.1); --tr-btn-radius:4px; --tr-btn-height:48px; --tr-btn-width:230px; --tr-primary-hover:#00D395; --tr-mint:#BFF5E1; --tr-border-soft:#1A1A1A; --tr-border-strong:#2A2A2A; --tr-surface-2:#1A1A1A; --tr-aurora-green:#00B781; --tr-aurora-blue:#2D84F0; --tr-aurora-violet:#8B5CF6; --tr-aurora-cyan:#22D3EE; --tr-radius-frame:16px; --tr-radius-pill:999px; --tr-section-y:96px; --tr-gutter:60px; --tr-container:1440px; --DUP_btn-text:#121212; --DUP_btn-radius:8px; --DUP_Btn:#16F0B0; --DUP_btn-hover:#11C48F; --DUP_box-4:4px; --tr-gold:#FFBD4B; } /* Start custom CSS *//* Trendo button sheen. Applies anywhere the 'tr-btn-primary' global class is used, on any page. The class itself already sets position:relative and overflow:hidden. */ .tr-btn-primary::before{content:'';position:absolute;top:0;left:-60%;width:55%;height:100%;background:linear-gradient(100deg,rgba(255,255,255,0) 0%,var(--tr-btn-sheen,rgba(255,255,255,.55)) 50%,rgba(255,255,255,0) 100%);transform:skewX(-18deg);pointer-events:none;animation:trSheen 3.6s ease-in-out infinite} @keyframes trSheen{0%,8%{left:-60%}55%,100%{left:125%}} @media(prefers-reduced-motion:reduce){.tr-btn-primary::before{animation:none;opacity:0}} /* Trendo heading shimmer. The gradient + background-clip:text live natively on the 'tr-heading-shimmer' global class; only these two declarations have no Style Schema equivalent. Reusable on any page. Approved by the site owner. */ .elementor .tr-heading-shimmer.tr-heading-shimmer{background-size:200% 100%;animation:trShimmer 9s linear infinite} @keyframes trShimmer{0%{background-position:0% 50%}100%{background-position:200% 50%}} @media(prefers-reduced-motion:reduce){.elementor .tr-heading-shimmer.tr-heading-shimmer{animation:none}} /* RTL mirroring -- tr-rtl-mirror-block. Elementor style variants are keyed by breakpoint+state only, so there is no native way to branch on direction. scaleX(-1) reverses the eyebrow gradient bar and the link-card arrow without restating any colour value. Approved by the site owner. */ [dir="rtl"] .elementor .e-da0c007-i, [dir="rtl"] .elementor .e-tpgd024-s, [dir="rtl"] .elementor .e-tpgd026-s{transform:scaleX(-1)} /* bonus-100 step connector rail. The rail is an SVG whose path staircases left-to-right; the cards mirror under dir=rtl but image artwork never does, so in ar/fa/ur the neon traced empty space beside the cards. Same scaleX(-1) treatment as above. Approved by the site owner. */ [dir="rtl"] .elementor .e-b1nrl-s, [dir="rtl"] .elementor .e-b1nrlt-s, [dir="rtl"] .elementor .e-b1nrlm-s{transform:scaleX(-1)} /* bonus-100 eyebrow hairlines + hero scrim. linear-gradient angles are physical and never mirror, so under dir=rtl every bar faded away from its label instead of into it, and the hero scrim darkened the wrong edge. The RTL design file flips exactly these with scaleX(-1) (90deg -> 270deg equivalent) rather than restating the colour stops. Approved by the site owner. */ [dir="rtl"] .elementor .e-b1seyer-s, [dir="rtl"] .elementor .e-b1teyer0-s, [dir="rtl"] .elementor .e-b1teyer-s, [dir="rtl"] .elementor .e-b1beyer0-s, [dir="rtl"] .elementor .e-b1beyer-s, [dir="rtl"] .elementor .e-b1veyer0-s, [dir="rtl"] .elementor .e-b1veyer-s, [dir="rtl"] .elementor .e-b1scrim-s{transform:scaleX(-1);transform-origin:center} /* --- IB Program (75975 + translations): direction-dependent paint. Elementor v4 has no [dir=rtl] style variant and both layers are full-bleed, so the gradient angle is restated here. Values are the element's own, mirrored, exactly as UI/IB/IB Program Desktop RTL.dc.html specifies (90->270, 27%->73%). The beam runs @keyframes trIbBeam, so transform:scaleX(-1) would lose to the animation - the gradient is flipped instead. --- */ [dir="rtl"] .elementor .e-ib-hero-scrim-s{background-image:linear-gradient(270deg,rgb(16,16,16) 0%,rgba(16,16,16,.92) 34%,rgba(16,16,16,.45) 58%,rgba(16,16,16,0) 78%)} [dir="rtl"] .elementor .e-ib-hero-beam-s{background-image:radial-gradient(76% 100% at 73% 0%,rgba(186,255,234,.4),rgba(22,240,176,.17) 38%,rgba(22,240,176,.05) 62%,rgba(22,240,176,0) 84%)} /* --- Islamic account (76111 + its WPML translations): direction-dependent paint. Elementor v4 style variants are keyed by breakpoint + state only, so no style prop can branch on direction. Selectors use the e-isl-* prefix rather than .elementor-76111 so they keep matching after WPML gives each translation its own post id. Values mirror the Desktop RTL design file. Approved by the site owner. --- */ [dir="rtl"] .elementor .e-isl-hero-fade-x-s, [dir="rtl"] .elementor .e-isl-hero-scrim-s, [dir="rtl"] .elementor .e-isl-steps-rail-s, [dir="rtl"] .elementor .e-isl-cmp-bar-s, [dir="rtl"] .elementor .e-isl-cmp-eye-l-s, [dir="rtl"] .elementor .e-isl-cmp-eye-r-s, [dir="rtl"] .elementor .e-isl-sym-eye-l-s, [dir="rtl"] .elementor .e-isl-sym-eye-r-s, [dir="rtl"] .elementor .e-isl-act-eye-l-s, [dir="rtl"] .elementor .e-isl-act-eye-r-s, [dir="rtl"] .elementor .e-isl-faq-eye-l-s, [dir="rtl"] .elementor .e-isl-faq-eye-r-s{transform:scaleX(-1);transform-origin:center} /* The hero photograph flips on desktop only - the Mobile RTL design leaves it unflipped. */ @media(min-width:768px){[dir="rtl"] .elementor .e-isl-hero-img-s{transform:scaleX(-1)}} /* Islamic account RTL typography. The design system's own [dir=rtl] block zeroes every --tr-ls-* token because letter-spacing breaks the cursive joining in Arabic, Persian and Urdu; the page raises its h1 from 1.1 to 1.32 so the descenders are not clipped. Approved by the site owner. */ [dir="rtl"] .elementor [class*="e-isl-"]{letter-spacing:normal} [dir="rtl"] .elementor .e-isl-hero-h1-s, [dir="rtl"] .elementor .e-isl-hero-h1b-s{line-height:1.32}/* End custom CSS */