.elementor-54809 .elementor-element.elementor-element-3db587af:not(.elementor-motion-effects-element-type-background), .elementor-54809 .elementor-element.elementor-element-3db587af > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#06182F;}.elementor-54809 .elementor-element.elementor-element-3db587af{transition:background 0.3s, border 0.3s, border-radius 0.3s, box-shadow 0.3s;margin-top:0px;margin-bottom:0px;padding:0px 0px 0px 0px;}.elementor-54809 .elementor-element.elementor-element-3db587af > .elementor-background-overlay{transition:background 0.3s, border-radius 0.3s, opacity 0.3s;}.elementor-54809 .elementor-element.elementor-element-15a4801e > .elementor-element-populated{margin:0px 0px 0px 0px;--e-column-margin-right:0px;--e-column-margin-left:0px;padding:0px 0px 0px 0px;}.elementor-54809 .elementor-element.elementor-element-6561899b:not(.elementor-motion-effects-element-type-background), .elementor-54809 .elementor-element.elementor-element-6561899b > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#06182F;}.elementor-54809 .elementor-element.elementor-element-6561899b > .elementor-container{max-width:1560px;}.elementor-54809 .elementor-element.elementor-element-6561899b{transition:background 0.3s, border 0.3s, border-radius 0.3s, box-shadow 0.3s;margin-top:0px;margin-bottom:0px;padding:0px 0px 0px 0px;}.elementor-54809 .elementor-element.elementor-element-6561899b > .elementor-background-overlay{transition:background 0.3s, border-radius 0.3s, opacity 0.3s;}.elementor-54809 .elementor-element.elementor-element-5ad1a22d > .elementor-element-populated{margin:0px 0px 0px 0px;--e-column-margin-right:0px;--e-column-margin-left:0px;padding:0px 0px 0px 0px;}.elementor-54809 .elementor-element.elementor-element-3edd9cab:not(.elementor-motion-effects-element-type-background), .elementor-54809 .elementor-element.elementor-element-3edd9cab > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#06182F;}.elementor-54809 .elementor-element.elementor-element-3edd9cab{transition:background 0.3s, border 0.3s, border-radius 0.3s, box-shadow 0.3s;margin-top:0px;margin-bottom:0px;padding:0px 0px 0px 0px;}.elementor-54809 .elementor-element.elementor-element-3edd9cab > .elementor-background-overlay{transition:background 0.3s, border-radius 0.3s, opacity 0.3s;}.elementor-54809 .elementor-element.elementor-element-336e96cf > .elementor-element-populated{margin:0px 0px 0px 0px;--e-column-margin-right:0px;--e-column-margin-left:0px;padding:0px 0px 0px 0px;}.elementor-54809 .elementor-element.elementor-element-24e168bf:not(.elementor-motion-effects-element-type-background), .elementor-54809 .elementor-element.elementor-element-24e168bf > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#06182F;}.elementor-54809 .elementor-element.elementor-element-24e168bf{transition:background 0.3s, border 0.3s, border-radius 0.3s, box-shadow 0.3s;margin-top:0px;margin-bottom:0px;padding:0px 0px 0px 0px;}.elementor-54809 .elementor-element.elementor-element-24e168bf > .elementor-background-overlay{transition:background 0.3s, border-radius 0.3s, opacity 0.3s;}.elementor-54809 .elementor-element.elementor-element-72c99c73 > .elementor-element-populated{margin:0px 0px 0px 0px;--e-column-margin-right:0px;--e-column-margin-left:0px;padding:0px 0px 0px 0px;}.elementor-54809 .elementor-element.elementor-element-4e334095:not(.elementor-motion-effects-element-type-background), .elementor-54809 .elementor-element.elementor-element-4e334095 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#06182F;}.elementor-54809 .elementor-element.elementor-element-4e334095{transition:background 0.3s, border 0.3s, border-radius 0.3s, box-shadow 0.3s;margin-top:0px;margin-bottom:0px;padding:0px 0px 0px 0px;}.elementor-54809 .elementor-element.elementor-element-4e334095 > .elementor-background-overlay{transition:background 0.3s, border-radius 0.3s, opacity 0.3s;}.elementor-54809 .elementor-element.elementor-element-70c71c42 > .elementor-element-populated{margin:0px 0px 0px 0px;--e-column-margin-right:0px;--e-column-margin-left:0px;padding:0px 0px 0px 0px;}.elementor-54809 .elementor-element.elementor-element-540f513c:not(.elementor-motion-effects-element-type-background), .elementor-54809 .elementor-element.elementor-element-540f513c > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#06182F;}.elementor-54809 .elementor-element.elementor-element-540f513c > .elementor-container{max-width:1560px;}.elementor-54809 .elementor-element.elementor-element-540f513c{transition:background 0.3s, border 0.3s, border-radius 0.3s, box-shadow 0.3s;margin-top:0px;margin-bottom:0px;padding:0px 0px 0px 0px;}.elementor-54809 .elementor-element.elementor-element-540f513c > .elementor-background-overlay{transition:background 0.3s, border-radius 0.3s, opacity 0.3s;}.elementor-54809 .elementor-element.elementor-element-6770f16a > .elementor-element-populated{margin:0px 0px 0px 0px;--e-column-margin-right:0px;--e-column-margin-left:0px;padding:0px 0px 0px 0px;}.elementor-54809 .elementor-element.elementor-element-4499aa70:not(.elementor-motion-effects-element-type-background), .elementor-54809 .elementor-element.elementor-element-4499aa70 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#06182F;}.elementor-54809 .elementor-element.elementor-element-4499aa70{transition:background 0.3s, border 0.3s, border-radius 0.3s, box-shadow 0.3s;margin-top:0px;margin-bottom:0px;padding:0px 0px 0px 0px;}.elementor-54809 .elementor-element.elementor-element-4499aa70 > .elementor-background-overlay{transition:background 0.3s, border-radius 0.3s, opacity 0.3s;}.elementor-54809 .elementor-element.elementor-element-1d1fce59 > .elementor-element-populated{margin:0px 0px 0px 0px;--e-column-margin-right:0px;--e-column-margin-left:0px;padding:0px 0px 0px 0px;}.elementor-54809 .elementor-element.elementor-element-27101c35:not(.elementor-motion-effects-element-type-background), .elementor-54809 .elementor-element.elementor-element-27101c35 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#06182F;}.elementor-54809 .elementor-element.elementor-element-27101c35{transition:background 0.3s, border 0.3s, border-radius 0.3s, box-shadow 0.3s;margin-top:0px;margin-bottom:0px;padding:0px 0px 0px 0px;}.elementor-54809 .elementor-element.elementor-element-27101c35 > .elementor-background-overlay{transition:background 0.3s, border-radius 0.3s, opacity 0.3s;}.elementor-54809 .elementor-element.elementor-element-310d2551 > .elementor-element-populated{margin:0px 0px 0px 0px;--e-column-margin-right:0px;--e-column-margin-left:0px;padding:0px 0px 0px 0px;}.elementor-54809 .elementor-element.elementor-element-5d9b7cf0:not(.elementor-motion-effects-element-type-background), .elementor-54809 .elementor-element.elementor-element-5d9b7cf0 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#06182F;}.elementor-54809 .elementor-element.elementor-element-5d9b7cf0{transition:background 0.3s, border 0.3s, border-radius 0.3s, box-shadow 0.3s;margin-top:0px;margin-bottom:0px;padding:0px 0px 0px 0px;}.elementor-54809 .elementor-element.elementor-element-5d9b7cf0 > .elementor-background-overlay{transition:background 0.3s, border-radius 0.3s, opacity 0.3s;}.elementor-54809 .elementor-element.elementor-element-467a3da4 > .elementor-element-populated{margin:0px 0px 0px 0px;--e-column-margin-right:0px;--e-column-margin-left:0px;padding:0px 0px 0px 0px;}.elementor-54809 .elementor-element.elementor-element-6b993e42{margin-top:0px;margin-bottom:0px;padding:0px 0px 0px 0px;}.elementor-54809 .elementor-element.elementor-element-47c4d4be > .elementor-element-populated{margin:0px 0px 0px 0px;--e-column-margin-right:0px;--e-column-margin-left:0px;padding:0px 0px 0px 0px;}.elementor-54809 .elementor-element.elementor-element-7c4e6e8e:not(.elementor-motion-effects-element-type-background), .elementor-54809 .elementor-element.elementor-element-7c4e6e8e > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#06182F;}.elementor-54809 .elementor-element.elementor-element-7c4e6e8e{transition:background 0.3s, border 0.3s, border-radius 0.3s, box-shadow 0.3s;margin-top:0px;margin-bottom:0px;padding:0px 0px 0px 0px;}.elementor-54809 .elementor-element.elementor-element-7c4e6e8e > .elementor-background-overlay{transition:background 0.3s, border-radius 0.3s, opacity 0.3s;}.elementor-54809 .elementor-element.elementor-element-7ecf7eb2 > .elementor-element-populated{margin:0px 0px 0px 0px;--e-column-margin-right:0px;--e-column-margin-left:0px;padding:0px 0px 0px 0px;}/* Start custom CSS *//* ═══════════════════════════════════════════════════════════════════
   Digisoul — 15-Minute Booking Call — Per-Page CSS Override
   Paste into: Elementor → Edit Page → Settings → Advanced → Custom CSS
   Also works at: Appearance → Customize → Additional CSS
   ═══════════════════════════════════════════════════════════════════ */

/* Collapse Elementor default spacing around our page */
body .elementor-section.elementor-top-section{padding-block:0!important;margin-block:0!important}
body .elementor-widget:not(:last-child){margin-block-end:0!important}
body .elementor-widget-wrap{padding:0!important}
body .elementor-widget-html{margin:0!important}
body .elementor-widget-shortcode{margin:0!important}
body .elementor-widget-shortcode .elementor-widget-container{margin:0!important;padding:0!important}

/* Footer: no hide rules, no blanket color rules.
   On "Elementor Full Width" template, the theme footer renders natively
   with its own .wcf--title color:#666666 inline CSS from the theme.
   On "Elementor Canvas" template, the footer is removed by the template.
   Do NOT add color:revert!important here — that keyword resets back to
   browser defaults (making links blue, headers white) instead of to the
   theme's own palette. Our alabaster is already scoped to .ds-pane-* so
   it cannot bleed into the footer. Leave the theme alone. */

/* Footer hyperlinks ONLY: force BLACK so they render as the original site
   footer (not nearly-invisible alabaster on the light footer background).
   Preserve theme's copper/gold hover on supported anchors. */
body.ds-lang-en .elementor-1302 a,
body.ds-lang-ar .elementor-1302 a,
body.ds-lang-en .elementor-1302 .wcf-btn-default,
body.ds-lang-ar .elementor-1302 .wcf-btn-default,
body.ds-lang-en .elementor-1302 .wcf__btn a,
body.ds-lang-ar .elementor-1302 .wcf__btn a,
body.ds-lang-en [data-elementor-id="1302"] a,
body.ds-lang-ar [data-elementor-id="1302"] a,
body.ds-lang-en [data-elementor-post-type="wcf-addons-template"] a,
body.ds-lang-ar [data-elementor-post-type="wcf-addons-template"] a{color:#1F1F1F!important}
body.ds-lang-en .elementor-1302 a:hover,
body.ds-lang-ar .elementor-1302 a:hover,
body.ds-lang-en .elementor-1302 .wcf__btn a:hover,
body.ds-lang-ar .elementor-1302 .wcf__btn a:hover,
body.ds-lang-en [data-elementor-id="1302"] a:hover,
body.ds-lang-ar [data-elementor-id="1302"] a:hover,
body.ds-lang-en [data-elementor-post-type="wcf-addons-template"] a:hover,
body.ds-lang-ar [data-elementor-post-type="wcf-addons-template"] a:hover{color:#E8BF96!important}

/* Navbar top-level text white (only top-level — sub-menus stay dark) */
body.ds-lang-en .elementor-nav-menu > ul > li > a,
body.ds-lang-ar .elementor-nav-menu > ul > li > a,
body.ds-lang-en .elementor-nav-menu--main > ul > li > a,
body.ds-lang-ar .elementor-nav-menu--main > ul > li > a,
body.ds-lang-en nav > ul > li > a,
body.ds-lang-ar nav > ul > li > a,
body.ds-lang-en .menu-item:not(.sub-menu .menu-item) > a,
body.ds-lang-ar .menu-item:not(.sub-menu .menu-item) > a{color:#FFFFFF!important}
body.ds-lang-en .elementor-nav-menu > ul > li > a:hover,
body.ds-lang-ar .elementor-nav-menu > ul > li > a:hover,
body.ds-lang-en nav > ul > li > a:hover,
body.ds-lang-ar nav > ul > li > a:hover{color:#E8C98A!important}

/* Sub-menu dropdowns: dark text on light dropdown panel */
body.ds-lang-en .sub-menu a,
body.ds-lang-ar .sub-menu a,
body.ds-lang-en ul.sub-menu a,
body.ds-lang-ar ul.sub-menu a,
body.ds-lang-en .elementor-nav-menu--dropdown a,
body.ds-lang-ar .elementor-nav-menu--dropdown a{color:#0A244A!important}
body.ds-lang-en .sub-menu a:hover,
body.ds-lang-ar .sub-menu a:hover{color:#00716C!important}

/* Elementor Canvas fallback */
body.elementor-template-canvas,
body.page-template-canvas{background:#06182F!important}
body.elementor-template-canvas main,
body.page-template-canvas main{margin:0!important;padding:0!important}

/* Full design system — defensive duplicate for cache-purge resilience */

:root{
  --sap:#0A244A;--sap-dk:#06182F;--sap-lt:#0F3262;--sap-2:#0B2A55;
  --gold:#C9A86E;--gold-bri:#E8C98A;--copper:#B87333;--alab:#F7F7F7;
  --teal:#00716C;--teal-bri:#2FB3AC;--mint:#00E879;
  --purp:#4A154B;--purp-bri:#7C3A7D;
  --ink:#2A2E36;--ink-2:#1F232B;--ink-bord:#3A3F48;--obs:#0F0F0F;
  --line:rgba(47,179,172,.18);--line-h:rgba(47,179,172,.5);
  --line-gold:rgba(201,168,110,.15);
  --glass:rgba(11,42,85,.55);--glass-d:rgba(6,24,47,.78);
  --pos:#5DD68C;--neg:#FF8A73;
  --br-l:16px;--br-m:10px;
  --wrap-max:min(92vw,1560px);
  --pad-y:clamp(72px,9vw,120px);
  --pad-x:clamp(20px,5vw,72px);
}
*{box-sizing:border-box}
html{scrollbar-gutter:stable;overflow-x:clip;max-width:100vw;scroll-behavior:smooth}
body{margin:0}

/* Dark theme — ONLY on our page (JS sets body.ds-lang-en|ds-lang-ar before paint).
   Scoping this way prevents bleed into theme header/footer on other pages.
   IMPORTANT: color is NOT set on body — that would cascade into theme footer
   and turn its text invisible on its light background. Instead, alabaster is
   applied to our panes and the bootstrap lang-toggle only. */
body.ds-lang-en,
body.ds-lang-ar{
  position:relative;isolation:isolate;overflow-x:clip;max-width:100vw;
  background:var(--sap-dk)!important;
  font-family:'Montserrat',system-ui,sans-serif;line-height:1.6;
  -webkit-font-smoothing:antialiased
}
body.ds-lang-ar{font-family:'Cairo','IBM Plex Sans Arabic',Tahoma,sans-serif;line-height:1.85}

/* Alabaster text — scoped to our panes only (not the theme header/footer). */
body.ds-lang-en .ds-pane-en,
body.ds-lang-ar .ds-pane-ar,
body.ds-lang-en .ds-pane-en *,
body.ds-lang-ar .ds-pane-ar *{color:var(--alab)}
/* Theme footer: NO color overrides on section titles.
   Our alabaster text is scoped to `.ds-pane-en *` / `.ds-pane-ar *` above,
   so the footer cannot inherit it. The theme's own high-specificity rules
   (`.elementor-1302 .elementor-element-XXX .wcf--title {color:#666666}`)
   render the footer correctly by default. Do NOT add color:revert here —
   !important + revert beats the theme's rules and turns links browser-blue
   while blanking out section headers. Trust the theme cascade. */

/* Footer hyperlinks: force BLACK with high specificity so nothing bleeds
   through the cascade and makes the links invisible on the light footer bg.
   Preserve theme's copper/gold hover state. Targets wcf-addons-template
   footer id=1302 plus fallback sibling body.elementor-page-54809 in case the ID changes. */
body.ds-lang-en .elementor-1302 a,
body.ds-lang-ar .elementor-1302 a,
body.ds-lang-en .elementor-1302 .wcf-btn-default,
body.ds-lang-ar .elementor-1302 .wcf-btn-default,
body.ds-lang-en .elementor-1302 .wcf__btn a,
body.ds-lang-ar .elementor-1302 .wcf__btn a,
body.ds-lang-en [data-elementor-id="1302"] a,
body.ds-lang-ar [data-elementor-id="1302"] a,
body.ds-lang-en [data-elementor-post-type="wcf-addons-template"] a,
body.ds-lang-ar [data-elementor-post-type="wcf-addons-template"] a{
  color:#1F1F1F!important
}
body.ds-lang-en .elementor-1302 a:hover,
body.ds-lang-ar .elementor-1302 a:hover,
body.ds-lang-en .elementor-1302 .wcf__btn a:hover,
body.ds-lang-ar .elementor-1302 .wcf__btn a:hover,
body.ds-lang-en [data-elementor-id="1302"] a:hover,
body.ds-lang-ar [data-elementor-id="1302"] a:hover,
body.ds-lang-en [data-elementor-post-type="wcf-addons-template"] a:hover,
body.ds-lang-ar [data-elementor-post-type="wcf-addons-template"] a:hover{
  color:#E8BF96!important
}

html[dir="rtl"] .disp,html[dir="rtl"] .sec{font-family:'IBM Plex Sans Arabic','Cairo',Tahoma,sans-serif}

/* Footer: NO hide rules — theme footer renders normally on Elementor
   "Full Width" template. If the page template is switched to Elementor
   Canvas, the canvas template removes header/footer natively; no extra
   CSS needed. We only keep `color:revert` above so that if the footer
   DOES render, its own theme colors apply (not our alabaster). */

/* NUCLEAR NAVBAR TEXT WHITE OVERRIDE — hardening §2 block (k).
   Theme navbar inherits grey text on our dark sapphire bg → force white.
   TOP-LEVEL LINKS ONLY. Sub-menu dropdowns get a dark override below
   (they render on light panels, so white text would vanish). */
body.ds-lang-en header > *:not([data-elementor-type="footer"]) a:not(.sub-menu a):not(.elementor-nav-menu--dropdown a),
body.ds-lang-ar header > *:not([data-elementor-type="footer"]) a:not(.sub-menu a):not(.elementor-nav-menu--dropdown a),
body.ds-lang-en .elementor-location-header a:not(.sub-menu a):not(.elementor-nav-menu--dropdown a),
body.ds-lang-ar .elementor-location-header a:not(.sub-menu a):not(.elementor-nav-menu--dropdown a),
body.ds-lang-en .elementor-nav-menu > ul > li > a,
body.ds-lang-ar .elementor-nav-menu > ul > li > a,
body.ds-lang-en .elementor-nav-menu--main > ul > li > a,
body.ds-lang-ar .elementor-nav-menu--main > ul > li > a,
body.ds-lang-en nav > ul > li > a,
body.ds-lang-ar nav > ul > li > a,
body.ds-lang-en .main-navigation > ul > li > a,
body.ds-lang-ar .main-navigation > ul > li > a,
body.ds-lang-en #masthead > *:not(.sub-menu) a:not(.sub-menu a),
body.ds-lang-ar #masthead > *:not(.sub-menu) a:not(.sub-menu a),
body.ds-lang-en .menu-item:not(.sub-menu .menu-item) > a,
body.ds-lang-ar .menu-item:not(.sub-menu .menu-item) > a,
body.ds-lang-en .ast-primary-header .menu-item > a:not(.sub-menu a),
body.ds-lang-ar .ast-primary-header .menu-item > a:not(.sub-menu a){
  color:#FFFFFF!important
}
/* Hover for top-level only */
body.ds-lang-en .elementor-nav-menu > ul > li > a:hover,
body.ds-lang-ar .elementor-nav-menu > ul > li > a:hover,
body.ds-lang-en nav > ul > li > a:hover,
body.ds-lang-ar nav > ul > li > a:hover{color:var(--gold-bri)!important}

/* SUB-MENU / DROPDOWN — restore dark text so items are readable on the
   light dropdown panel the theme/plugin renders. Higher specificity beats
   the top-level rule above. */
body.ds-lang-en .sub-menu a,
body.ds-lang-ar .sub-menu a,
body.ds-lang-en ul.sub-menu a,
body.ds-lang-ar ul.sub-menu a,
body.ds-lang-en .sub-menu a.elementor-item,
body.ds-lang-ar .sub-menu a.elementor-item,
body.ds-lang-en .sub-menu .elementor-item,
body.ds-lang-ar .sub-menu .elementor-item,
body.ds-lang-en .elementor-nav-menu--dropdown a,
body.ds-lang-ar .elementor-nav-menu--dropdown a,
body.ds-lang-en .elementor-nav-menu--dropdown .elementor-item,
body.ds-lang-ar .elementor-nav-menu--dropdown .elementor-item,
body.ds-lang-en nav .sub-menu a,
body.ds-lang-ar nav .sub-menu a,
body.ds-lang-en .menu-item-has-children .sub-menu a,
body.ds-lang-ar .menu-item-has-children .sub-menu a,
body.ds-lang-en li.menu-item .sub-menu li a,
body.ds-lang-ar li.menu-item .sub-menu li a{
  color:#0A244A!important;
  background-color:transparent
}
body.ds-lang-en .sub-menu a:hover,
body.ds-lang-ar .sub-menu a:hover,
body.ds-lang-en .elementor-nav-menu--dropdown a:hover,
body.ds-lang-ar .elementor-nav-menu--dropdown a:hover,
body.ds-lang-en .sub-menu .elementor-item:hover,
body.ds-lang-ar .sub-menu .elementor-item:hover{color:var(--teal)!important}

/* Top-level dropdown arrows only (not sub-menu items) */
body.ds-lang-en header > *:not(.sub-menu) > svg,
body.ds-lang-ar header > *:not(.sub-menu) > svg,
body.ds-lang-en .elementor-location-header > div svg:not(.sub-menu svg),
body.ds-lang-ar .elementor-location-header > div svg:not(.sub-menu svg),
body.ds-lang-en .elementor-nav-menu > ul > li > a .sub-arrow,
body.ds-lang-ar .elementor-nav-menu > ul > li > a .sub-arrow{
  color:#FFFFFF!important;fill:#FFFFFF!important
}

/* Pane visibility — JS toggles body class; default is EN visible, AR hidden.
   !important to beat Elementor section defaults (.elementor-section{display:flex} etc.) */
body.ds-lang-en .ds-pane-ar,
body.ds-lang-ar .ds-pane-en{display:none!important;visibility:hidden!important}
body.ds-lang-en .ds-pane-en,
body.ds-lang-ar .ds-pane-ar{display:block!important;visibility:visible!important}
/* Elementor-native elements default to flex — keep them flex when shown */
body.ds-lang-en section.elementor-section.ds-pane-en,
body.ds-lang-ar section.elementor-section.ds-pane-ar{display:flex!important}

/* BACKGROUND — static gradient + dotted pattern, SCOPED so it never overlays footer */
body.ds-lang-en::before,
body.ds-lang-ar::before{
  content:"";position:fixed;inset:0;z-index:-3;pointer-events:none;
  background:
    radial-gradient(ellipse 700px 500px at 85% 0%,rgba(0,113,108,.22),transparent 60%),
    radial-gradient(ellipse 650px 450px at 10% 100%,rgba(74,21,75,.24),transparent 60%),
    linear-gradient(180deg,var(--sap-dk) 0%,var(--sap) 50%,var(--sap-dk) 100%)
}
body.ds-lang-en::after,
body.ds-lang-ar::after{
  content:"";position:fixed;inset:0;z-index:-2;pointer-events:none;opacity:.42;
  background-image:radial-gradient(rgba(47,179,172,.12) 1px,transparent 1px);
  background-size:28px 28px
}

.scroll-progress{position:fixed;inset-block-end:0;inset-inline-start:0;inset-inline-end:auto;
  height:2px;width:var(--_sp,0%);
  background:linear-gradient(90deg,var(--teal),var(--teal-bri),var(--gold));
  z-index:2147483645;pointer-events:none;transform:translateZ(0)}

/* LANG TOGGLE — segmented pill, always-on-top, clears theme navbar */
.lang-toggle{position:fixed!important;inset-block-start:clamp(88px,11vh,116px)!important;inset-inline-end:14px!important;
  z-index:2147483647!important;isolation:isolate;
  display:inline-flex!important;align-items:center;gap:6px;
  background:rgba(10,36,74,.92)!important;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);
  border:1px solid rgba(201,168,110,.42)!important;border-radius:999px!important;padding:5px!important;
  box-shadow:0 10px 30px rgba(0,0,0,.45),0 0 0 1px rgba(0,0,0,.1)!important;
  pointer-events:auto!important;visibility:visible!important;opacity:1!important}
.lang-toggle *{pointer-events:auto!important}
.lang-toggle button{
  min-width:44px;min-height:34px;padding:6px 14px;border-radius:999px;border:0;
  background:transparent;color:var(--alab);font-family:'Montserrat',sans-serif;
  font-weight:500;font-size:.85rem;line-height:1;cursor:pointer;letter-spacing:.02em;
  transition:background .2s ease,color .2s ease,transform .2s ease}
.lang-toggle button:hover{color:var(--gold-bri)}
.lang-toggle button.active{
  background:linear-gradient(135deg,var(--gold) 0%,var(--copper) 100%);
  color:var(--obs);font-weight:700;
  box-shadow:0 3px 10px rgba(201,168,110,.35)}
.lang-toggle button:focus-visible{outline:2px solid var(--gold-bri);outline-offset:2px}
html[dir="rtl"] .lang-toggle button{font-family:'Cairo','IBM Plex Sans Arabic',Tahoma,sans-serif}

/* TYPOGRAPHY — cleaner, more sans-dominant than Brain */
.eye{font-family:'Montserrat',sans-serif;font-size:11px;font-weight:700;letter-spacing:.22em;text-transform:uppercase;color:var(--teal-bri);display:inline-flex;align-items:center;gap:10px;margin-block-end:18px}
.eye::before{content:"";inline-size:28px;block-size:1px;background:var(--teal-bri);animation:eyePulse 3s ease-in-out infinite}
@keyframes eyePulse{0%,100%{inline-size:28px;opacity:.55}50%{inline-size:44px;opacity:1}}
html[dir="rtl"] .eye{letter-spacing:.04em;font-family:'Cairo',sans-serif}

h1.disp{font-family:'Montserrat',sans-serif;font-weight:800;font-size:clamp(40px,5.4vw,76px);line-height:1.05;letter-spacing:-.025em;color:var(--alab)}
h1.disp .em{font-family:'Playfair Display',serif;font-style:italic;font-weight:600;color:var(--teal-bri);font-size:.98em}
html[dir="rtl"] h1.disp{font-family:'IBM Plex Sans Arabic',sans-serif;line-height:1.2;font-weight:700}
html[dir="rtl"] h1.disp .em{font-style:normal;font-family:'IBM Plex Sans Arabic',sans-serif}

h2.sec{font-family:'Montserrat',sans-serif;font-weight:800;font-size:clamp(28px,3.6vw,48px);line-height:1.1;letter-spacing:-.02em;color:var(--alab)}
h2.sec .em{font-family:'Playfair Display',serif;font-style:italic;font-weight:500;color:var(--teal-bri)}
html[dir="rtl"] h2.sec{font-family:'IBM Plex Sans Arabic',sans-serif;line-height:1.3}
html[dir="rtl"] h2.sec .em{font-style:normal;font-family:'IBM Plex Sans Arabic',sans-serif}

.lede{font-size:clamp(15px,1.35vw,17px);color:rgba(247,247,247,.78);max-inline-size:58ch;margin-block-start:18px;line-height:1.65;font-weight:400}
.slogan{font-family:'Montserrat',sans-serif;font-size:11px;font-weight:600;color:var(--gold);letter-spacing:.18em;text-transform:uppercase;margin-block-start:14px}
html[dir="rtl"] .slogan{letter-spacing:.02em;font-family:'Cairo',sans-serif}

/* SECTION CONTAINER */
section{position:relative;z-index:1;padding:var(--pad-y) var(--pad-x);scroll-margin-top:40px}
.wrap{max-inline-size:var(--wrap-max);margin-inline:auto}

/* REVEALS */
.reveal{opacity:0;transform:translateY(28px);transition:opacity .7s cubic-bezier(.16,1,.3,1),transform .7s cubic-bezier(.16,1,.3,1)}
.reveal.in{opacity:1;transform:translateY(0)}
.reveal-s{opacity:0;transform:scale(.94);transition:opacity .7s cubic-bezier(.16,1,.3,1),transform .7s cubic-bezier(.16,1,.3,1)}
.reveal-s.in{opacity:1;transform:scale(1)}
.reveal-b{opacity:0;filter:blur(10px);transform:translateY(18px);transition:opacity .8s ease,filter .8s ease,transform .8s cubic-bezier(.16,1,.3,1)}
.reveal-b.in{opacity:1;filter:blur(0);transform:translateY(0)}
.reveal-l{opacity:0;transform:translateX(-44px);transition:opacity .7s cubic-bezier(.16,1,.3,1),transform .7s cubic-bezier(.16,1,.3,1)}
html[dir="rtl"] .reveal-l{transform:translateX(44px)}
.reveal-l.in{opacity:1;transform:translateX(0)}

/* BUTTONS — TEAL primary (not gold like Brain) */
.btn{font-family:'Montserrat',sans-serif;font-weight:700;font-size:13px;letter-spacing:.06em;padding-block:15px;padding-inline:26px;border:1.5px solid var(--teal-bri);color:var(--alab);background:transparent;text-decoration:none;display:inline-flex;align-items:center;gap:10px;position:relative;overflow:hidden;transition:all .35s cubic-bezier(.2,.7,.2,1);text-transform:uppercase;cursor:pointer;min-height:46px}
.btn::before{content:"";position:absolute;inset:0;background:linear-gradient(135deg,var(--teal),var(--teal-bri));transform:translateX(-101%);transition:transform .4s ease}
html[dir="rtl"] .btn::before{transform:translateX(101%)}
.btn:hover::before{transform:translateX(0)}
.btn span{position:relative;z-index:1;transition:color .3s}
.btn:hover span{color:var(--sap-dk)}
.btn.primary{background:var(--teal-bri);color:var(--sap-dk);border-color:var(--teal-bri)}
.btn.primary span{color:var(--sap-dk)}
.btn.primary:hover{box-shadow:0 10px 32px rgba(47,179,172,.45);transform:translateY(-2px)}
.btn.primary:hover span{color:var(--sap-dk)}
html[dir="rtl"] .btn{letter-spacing:0;font-family:'Cairo',sans-serif}

/* HERO */
.hero{padding-block-start:clamp(84px,10vw,136px)}
.hero-grid{display:grid;grid-template-columns:1.1fr 1fr;gap:clamp(32px,5vw,64px);align-items:start}

/* ═════ ULTRAWIDE CONTENT CAP — Elementor hero section ═════
   Forces the two-column Elementor hero to behave like the preview .wrap (max 1560px centered).
   Without this, on 2560/3440 monitors content hugs both viewport edges with dead space in middle. */
.elementor-section.hero{
  padding-inline:clamp(20px,4vw,80px)!important;
  padding-block:clamp(40px,6vh,90px)!important
}
.elementor-section.hero > .elementor-container,
.elementor-section.hero > .elementor-container.elementor-column-gap-default,
.elementor-section.hero > .elementor-container.elementor-column-gap-extended{
  max-inline-size:min(92vw,1560px)!important;
  margin-inline:auto!important;
  gap:clamp(32px,4vw,64px)!important;
  align-items:start!important
}
/* Left column: hero text sizing */
.elementor-column.hero-left-col{
  padding-inline-end:clamp(16px,2vw,32px)!important
}
/* Right column: form-panel expands to column width */
.elementor-column.hero-right-col{
  min-inline-size:420px!important
}
@media (max-width:900px){
  .elementor-section.hero > .elementor-container{
    grid-template-columns:1fr!important;
    flex-direction:column!important
  }
  .elementor-column.hero-left-col,
  .elementor-column.hero-right-col{
    width:100%!important;inline-size:100%!important;min-inline-size:0!important
  }
}
.cta-row{display:flex;gap:14px;flex-wrap:wrap;margin-block-start:28px}

/* CLOCK VISUAL — signature motif for this page (NOT neural/brain) */
.clock-visual{position:absolute;inset-block-start:12px;inset-inline-end:12px;inline-size:140px;block-size:140px;opacity:.18;pointer-events:none;z-index:0}
.clock-visual svg{inline-size:100%;block-size:100%}
.clock-visual .tick-hand{transform-origin:center;animation:tickHand 60s linear infinite}
@keyframes tickHand{to{transform:rotate(360deg)}}

/* KPI STRIP — subtler than Brain's glass panels */

/* FORM PANEL — hero-form-card (matches /practical-genai-in-fpa/)
   Works in TWO rendering modes:
   (a) Preview:   <div class="form-panel">…</div>    — card styling applies directly
   (b) Elementor: <div class="elementor-column form-panel"><div class="elementor-widget-wrap">…</div></div>
       — Elementor's widget-wrap is the actual card (column outer is cleared). */
.form-panel:not(.elementor-column),
.elementor-column.form-panel > .elementor-widget-wrap,
.elementor-column.form-panel > .elementor-element-populated{
  background:linear-gradient(180deg,rgba(10,36,74,.85) 0%,rgba(4,16,31,.92) 100%)!important;
  backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);
  border:1px solid rgba(0,232,121,.28)!important;
  border-radius:var(--br-l)!important;
  padding:clamp(24px,calc(1.6vw + 16px),40px)!important;
  box-shadow:0 30px 80px rgba(0,0,0,.5),0 0 0 1px rgba(201,168,110,.18) inset,0 0 60px rgba(0,232,121,.08)!important;
  position:relative!important;overflow:hidden!important;isolation:isolate
}
/* Elementor: clear the column's own box so only the inner wrap is the card */
.elementor-column.form-panel{
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
  padding:0!important;
  border-radius:0!important
}
/* Grid overlay — dual body.elementor-page-54809 for both modes */
.form-panel:not(.elementor-column)::before,
.elementor-column.form-panel > .elementor-widget-wrap::before,
.elementor-column.form-panel > .elementor-element-populated::before{
  content:"";position:absolute;inset:0;pointer-events:none;opacity:.1;z-index:0;
  background-image:linear-gradient(rgba(201,168,110,.18) 1px,transparent 1px),linear-gradient(90deg,rgba(201,168,110,.18) 1px,transparent 1px);
  background-size:48px 48px
}
/* Clock-visual as a CSS BACKGROUND decoration on the form-panel card —
   guaranteed never to escape the card because it's a pseudo-element of the card itself. */
.form-panel:not(.elementor-column)::after,
.elementor-column.form-panel > .elementor-widget-wrap::after,
.elementor-column.form-panel > .elementor-element-populated::after{
  content:"";position:absolute;inset-block-start:12px;inset-inline-end:12px;
  inline-size:140px;block-size:140px;pointer-events:none;z-index:0;opacity:.22;
  background-repeat:no-repeat;background-position:center;background-size:contain;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 200'><circle cx='100' cy='100' r='90' fill='none' stroke='%232FB3AC' stroke-width='1' opacity='.7'/><circle cx='100' cy='100' r='76' fill='none' stroke='%23C9A86E' stroke-width='.6' opacity='.4'/><g stroke='%232FB3AC' stroke-width='1.2' stroke-linecap='round'><line x1='100' y1='14' x2='100' y2='24'/><line x1='100' y1='176' x2='100' y2='186'/><line x1='14' y1='100' x2='24' y2='100'/><line x1='176' y1='100' x2='186' y2='100'/></g><path d='M 100 14 A 86 86 0 0 1 186 100' fill='none' stroke='%23C9A86E' stroke-width='2.5' opacity='.7'/><text x='100' y='108' text-anchor='middle' fill='%23C9A86E' font-family='Montserrat,sans-serif' font-weight='800' font-size='42'>15</text><text x='100' y='128' text-anchor='middle' fill='%232FB3AC' font-family='Montserrat,sans-serif' font-weight='600' font-size='11' letter-spacing='2'>MIN</text><line x1='100' y1='100' x2='100' y2='34' stroke='%232FB3AC' stroke-width='2' stroke-linecap='round' opacity='.9'/><circle cx='100' cy='100' r='4' fill='%23C9A86E'/></svg>")
}
@media (max-width:768px){
  .form-panel:not(.elementor-column)::after,
  .elementor-column.form-panel > .elementor-widget-wrap::after,
  .elementor-column.form-panel > .elementor-element-populated::after{
    inline-size:90px;block-size:90px;inset-block-start:10px;inset-inline-end:10px;opacity:.14
  }
}
/* Hide the HTML clock-visual in BOTH modes — replaced by pseudo-element above */
.clock-visual{display:none!important}
.form-panel:not(.elementor-column) > *,
.elementor-column.form-panel > .elementor-widget-wrap > *,
.elementor-column.form-panel > .elementor-element-populated > *{position:relative;z-index:1}
.form-head{display:flex;align-items:center;gap:12px;margin-block-end:10px;padding-block-end:14px;border-bottom:1px dashed rgba(201,168,110,.18)}
.form-dot{inline-size:8px;block-size:8px;border-radius:50%;background:var(--mint);box-shadow:0 0 0 4px rgba(0,232,121,.2);animation:dotPulse 2s ease-in-out infinite;flex-shrink:0}
@keyframes dotPulse{0%,100%{box-shadow:0 0 0 4px rgba(0,232,121,.2)}50%{box-shadow:0 0 0 8px rgba(0,232,121,.08)}}
.form-id{font-family:'Montserrat',sans-serif;font-size:10px;font-weight:700;letter-spacing:.18em;color:var(--gold-bri);text-transform:uppercase}
html[dir="rtl"] .form-id{letter-spacing:0;font-family:'Cairo',sans-serif}
.form-title{font-family:'Montserrat',sans-serif;font-weight:800;font-size:clamp(22px,2.3vw,28px);line-height:1.2;color:var(--alab);margin-block-end:8px;letter-spacing:-.015em}
html[dir="rtl"] .form-title{font-family:'IBM Plex Sans Arabic',sans-serif}
.form-sub{font-size:14px;color:rgba(247,247,247,.72);margin-block-end:22px;line-height:1.6}
.form-meta{font-family:'Montserrat',sans-serif;font-size:10px;font-weight:500;letter-spacing:.1em;color:rgba(247,247,247,.45);text-transform:uppercase;margin-block-start:18px;padding-block-start:14px;border-top:1px dashed rgba(201,168,110,.18)}
html[dir="rtl"] .form-meta{letter-spacing:0;font-family:'Cairo',sans-serif}

/* ═════ FLUENTFORM STYLING — matches /practical-genai-in-fpa/ .ff-slot =====
   - Outer wrapper: TRANSPARENT (so the dark form-panel gradient shows through)
   - Labels: WHITE (on the dark card)
   - Input/select/textarea: WHITE background with GRAY text
   - Placeholder: light GRAY
   - Submit: GOLD button with dark text
   Uses both .ff-slot and .form-panel scoping for parity with reference. */

/* NUCLEAR: FluentForm outer wrappers TRANSPARENT — prevents the plugin's
   default white/cream skin from overriding our dark sapphire form-panel. */
.form-panel .fluentform,
.form-panel .ff-default,
.form-panel .ff-el-form-control-wrapper,
.form-panel form.fluentform,
.form-panel form.frm-fluent-form,
.form-panel .ff_form_instance,
.form-panel [class*="ff_form_instance_"],
.form-panel .ff-t-container,
.form-panel .ff-el-group,
.form-panel .ff-t-cell,
.form-panel .ff-t-row,
.elementor-column.form-panel .elementor-widget-shortcode,
.elementor-column.form-panel .elementor-widget-shortcode .elementor-widget-container,
.elementor-column.form-panel .fluentform,
.elementor-column.form-panel .ff-default,
.elementor-column.form-panel form.fluentform,
.elementor-column.form-panel form.frm-fluent-form,
.elementor-column.form-panel .ff_form_instance,
.elementor-column.form-panel [class*="ff_form_instance_"]{
  background:transparent!important;
  background-color:transparent!important;
  box-shadow:none!important;
  border:0!important;
  padding:0!important;
  margin:0!important
}

/* Also neutralize inner Elementor HTML widget wrappers so the clock-visual's
   position:absolute escapes up to the form-panel column wrap. */
.elementor-column.form-panel .elementor-widget,
.elementor-column.form-panel .elementor-widget-container,
.elementor-column.form-panel .elementor-widget-html,
.elementor-column.form-panel .elementor-widget-html .elementor-widget-container{
  background:transparent!important;
  padding:0!important;
  margin:0!important;
  box-shadow:none!important;
  position:static!important
}

/* Labels (WHITE on dark card) */
.form-panel label,
.form-panel .ff-el-input--label label,
.form-panel .ff-el-is-required label,
.form-panel .ff-el-group label,
.form-panel .ff-el-group .ff-el-input--label,
.form-panel .ff-el-input--label,
.form-panel legend,
.form-panel .ff_form_name_has_fname label{
  color:#F7F7F7!important;
  font-family:'Montserrat',sans-serif!important;
  font-size:12px!important;
  font-weight:600!important;
  letter-spacing:.06em!important;
  text-transform:uppercase!important;
  margin-block-end:8px!important;
  display:block!important;
  opacity:1!important
}
html[dir="rtl"] .form-panel label,
html[dir="rtl"] .form-panel .ff-el-input--label label{
  font-family:'Cairo',sans-serif!important;letter-spacing:0!important;text-transform:none!important;font-size:13px!important
}
.form-panel .ff-el-is-required label::after,
.form-panel label.ff-el-is-required::after{
  color:var(--gold-bri)!important
}

/* Fields — WHITE background, GRAY text (reference .ff-slot pattern) */
.form-panel input[type="text"],
.form-panel input[type="email"],
.form-panel input[type="tel"],
.form-panel input[type="url"],
.form-panel input[type="number"],
.form-panel input[type="date"],
.form-panel input[type="time"],
.form-panel input[type="datetime-local"],
.form-panel input[type="password"],
.form-panel input[type="search"],
.form-panel textarea,
.form-panel select,
.form-panel .ff-el-form-control,
.form-panel .ff_has_value input,
.form-panel .ff-el-group input,
.form-panel .ff-el-group textarea,
.form-panel .ff-el-group select{
  background:#FFFFFF!important;
  background-color:#FFFFFF!important;
  border:1px solid rgba(15,15,15,.18)!important;
  border-radius:var(--br-m)!important;
  color:#4B5563!important;
  font-family:'Montserrat',sans-serif!important;
  font-size:14px!important;
  font-weight:400!important;
  padding:11px 14px!important;
  min-height:44px!important;
  inline-size:100%!important;
  width:100%!important;
  transition:border-color .2s,box-shadow .2s!important;
  box-shadow:none!important;
  -webkit-appearance:none!important;
  appearance:none!important
}
html[dir="rtl"] .form-panel input,
html[dir="rtl"] .form-panel textarea,
html[dir="rtl"] .form-panel select{font-family:'Cairo',sans-serif!important}

/* Placeholder — light GRAY */
.form-panel input::placeholder,
.form-panel textarea::placeholder{color:#9CA3AF!important;opacity:1!important}

/* Icon padding — intl-tel-input flag, URL globe, Company prefix all sit at inline-start;
   reserve enough space so placeholder never overlaps. */
.form-panel .iti,
.form-panel .iti--allow-dropdown{display:block!important;width:100%!important;inline-size:100%!important;position:relative!important}
.form-panel .iti input,
.form-panel .iti__tel-input,
.form-panel .iti--separate-dial-code input,
.form-panel .iti--allow-dropdown input,
.form-panel .ff-el-tel input,
.form-panel input[type="tel"],
.form-panel input[type="url"]{
  padding-inline-start:56px!important;
  background-position:left 14px center!important
}
html[dir="rtl"] .form-panel .iti input,
html[dir="rtl"] .form-panel .iti__tel-input,
html[dir="rtl"] .form-panel input[type="tel"],
html[dir="rtl"] .form-panel input[type="url"]{
  padding-inline-start:56px!important;
  padding-inline-end:14px!important
}
/* intl-tel-input flag body.elementor-page-54809 on the dark card */
.form-panel .iti__selected-flag,
.form-panel .iti__country-container{
  background:rgba(15,15,15,.04)!important;
  border-radius:var(--br-m) 0 0 var(--br-m)!important;
  padding-inline:10px!important
}
html[dir="rtl"] .form-panel .iti__selected-flag,
html[dir="rtl"] .form-panel .iti__country-container{
  border-radius:0 var(--br-m) var(--br-m) 0!important
}
/* Fluent URL-field globe icon (inline prefix) */
.form-panel .ff_url_input,
.form-panel .ff-el-form-url .ff-el-form-control{padding-inline-start:44px!important}
/* Any field whose parent has .ff-el-group .ff-el-input--content > .ff-input-prefix */
.form-panel .ff-input-prefix,
.form-panel .ff-input-group-prepend{
  position:absolute!important;inset-block-start:0!important;
  inset-inline-start:0!important;block-size:100%!important;
  display:inline-flex!important;align-items:center;
  padding-inline:12px!important;color:#9CA3AF!important;
  pointer-events:none!important
}
.form-panel .ff-el-group:has(.ff-input-prefix) input,
.form-panel .ff-el-group:has(.ff-input-prefix) select{padding-inline-start:44px!important}

/* Focus — gold ring */
.form-panel input:focus,
.form-panel textarea:focus,
.form-panel select:focus,
.form-panel .ff-el-form-control:focus{
  border-color:var(--gold)!important;
  background:#FFFFFF!important;
  outline:none!important;
  box-shadow:0 0 0 3px rgba(201,168,110,.22)!important
}

/* Select dropdown arrow (dark grey chevron for contrast on white) */
.form-panel select{
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='none' stroke='%234B5563' stroke-width='1.5'><polyline points='5 8 10 13 15 8'/></svg>")!important;
  background-repeat:no-repeat!important;
  background-position:right 14px center!important;
  background-size:16px!important;
  padding-inline-end:40px!important
}
html[dir="rtl"] .form-panel select{background-position:left 14px center!important;padding-inline-end:14px!important;padding-inline-start:40px!important}

/* Dropdown options */
.form-panel select option{background:#FFFFFF!important;color:#4B5563!important}

/* Textarea */
.form-panel textarea{min-block-size:110px;resize:vertical}

/* Autofill override — keep white bg, gray text */
.form-panel input:-webkit-autofill,
.form-panel input:-webkit-autofill:hover,
.form-panel input:-webkit-autofill:focus,
.form-panel textarea:-webkit-autofill{
  -webkit-box-shadow:0 0 0 1000px #FFFFFF inset!important;
  -webkit-text-fill-color:#4B5563!important;
  caret-color:#4B5563!important
}

/* Checkboxes + radios — gold accent to match submit */
.form-panel input[type="checkbox"],
.form-panel input[type="radio"]{
  inline-size:18px!important;width:18px!important;
  block-size:18px!important;height:18px!important;
  min-height:auto!important;
  padding:0!important;margin-inline-end:8px!important;
  accent-color:var(--gold)!important
}
.form-panel .ff-el-form-check-label,
.form-panel .ff-el-form-check label{
  display:inline-flex!important;align-items:center;gap:6px;
  font-size:13px!important;font-weight:400!important;
  letter-spacing:0!important;text-transform:none!important;
  color:var(--alab)!important;margin:0!important
}

/* Submit button — GOLD with dark text (matches reference) */
.form-panel .ff-btn,
.form-panel .ff_btn_style,
.form-panel .ff-btn-submit,
.form-panel button[type="submit"]{
  background:var(--gold)!important;
  color:var(--obs)!important;
  border:0!important;
  border-radius:var(--br-m)!important;
  padding:13px 28px!important;
  font-family:'Montserrat',sans-serif!important;
  font-weight:700!important;
  font-size:13px!important;
  letter-spacing:.06em!important;
  text-transform:uppercase!important;
  cursor:pointer!important;
  transition:background .25s,transform .25s,box-shadow .25s!important;
  min-block-size:48px!important;
  box-shadow:0 8px 22px rgba(201,168,110,.32)!important
}
.form-panel .ff-btn:hover,
.form-panel button[type="submit"]:hover{
  background:var(--gold-bri)!important;
  box-shadow:0 12px 32px rgba(201,168,110,.45)!important;
  transform:translateY(-2px)!important
}
html[dir="rtl"] .form-panel .ff-btn,
html[dir="rtl"] .form-panel button[type="submit"]{font-family:'Cairo',sans-serif!important;letter-spacing:.02em!important}

/* Choices.js matching (country / select2 enhancements) */
.form-panel .choices__inner{
  background:#FFFFFF!important;border:1px solid rgba(15,15,15,.18)!important;
  border-radius:var(--br-m)!important;min-height:44px!important;
  padding:6px 12px!important;color:#4B5563!important
}
.form-panel .choices__item,
.form-panel .choices__item--selectable,
.form-panel .choices__list--dropdown .choices__item{color:#4B5563!important}
.form-panel .choices__list--dropdown,
.form-panel .choices__list[aria-expanded]{
  background:#FFFFFF!important;border:1px solid rgba(15,15,15,.18)!important;
  border-radius:var(--br-m)!important;color:#4B5563!important
}
.form-panel .choices__list--dropdown .choices__item--selectable.is-highlighted{
  background:rgba(201,168,110,.15)!important;color:var(--obs)!important
}
.form-panel .choices__input{background:#FFFFFF!important;color:#4B5563!important}
.form-panel .iti__country-name{color:#4B5563!important}
.form-panel .iti__selected-country-primary{color:#4B5563!important}

/* Help text / hints */
.form-panel .ff-el-help-message,
.form-panel .ff-el-input--help{
  color:rgba(247,247,247,.55)!important;
  font-size:11px!important;
  font-weight:400!important;
  letter-spacing:0!important;
  text-transform:none!important;
  margin-block-start:6px!important
}

/* Errors */
.form-panel .ff-el-is-error input,
.form-panel .ff-el-is-error textarea,
.form-panel .ff-el-is-error select{border-color:#EF4444!important;background:#FEF2F2!important}
.form-panel .error_msg,
.form-panel .ff-el-form-validation-error,
.form-panel .ff-el-message.error_msg{color:#FCA5A5!important;font-size:12px!important;margin-block-start:4px!important;font-weight:500!important;letter-spacing:0!important;text-transform:none!important}

/* Success */
.form-panel .ff-message-success,
.form-panel .ff_message_success{background:rgba(0,232,121,.08)!important;border:1px solid rgba(0,232,121,.32)!important;color:var(--alab)!important;padding:22px!important;border-radius:var(--br-m)!important}

/* Group spacing */
.form-panel .ff-el-group,
.form-panel .ff_form_loader,
.form-panel .ff-form-loader{margin-block-end:16px!important}
.form-panel .ff-t-container{gap:14px!important}

/* Preview-only placeholder — just the raw shortcode text */
.ff-preview-slot{
  background:#FFFFFF;border:1px dashed rgba(201,168,110,.5);padding:18px 22px;border-radius:var(--br-m);
  color:#4B5563;font-family:'IBM Plex Mono',monospace;font-size:13px;
  text-align:center;letter-spacing:.02em
}

/* ═════ FORM TELEPORT PATTERN ═════
   .ds-form-source-section: hidden section holding the FluentForm shortcode.
   JS teleports the rendered form out of here into .ds-form-slot on boot.
   Kept off-screen (NOT display:none) so the plugin can initialize inputs
   (intl-tel-input, choices.js, etc.) before we move the node. */
.ds-form-source-section,
body.ds-lang-en .ds-form-source-section,
body.ds-lang-ar .ds-form-source-section,
section.elementor-section.ds-form-source-section{
  position:absolute!important;
  inset-block-start:-9999px!important;
  inset-inline-start:-9999px!important;
  inline-size:1px!important;max-inline-size:1px!important;
  block-size:0!important;max-block-size:0!important;
  padding:0!important;margin:0!important;
  visibility:hidden!important;opacity:0!important;
  pointer-events:none!important;
  overflow:hidden!important;
  z-index:-100!important
}
/* .ds-form-slot — where the teleported form lands. Reset any
   inherited hidden state so the form is fully visible + interactive. */
.ds-form-slot{
  display:block!important;
  position:static!important;
  visibility:visible!important;
  opacity:1!important;
  pointer-events:auto!important;
  inline-size:100%!important;width:100%!important;
  min-block-size:280px;
  margin:0!important;padding:0!important;
  overflow:visible!important
}
/* Form + every descendant inside the slot MUST be visible, even if
   they inherited a hidden state from the source section. */
.ds-form-slot .fluentform,
.ds-form-slot form.fluentform,
.ds-form-slot form.frm-fluent-form,
.ds-form-slot .ff_form_instance,
.ds-form-slot [class*="ff_form_instance_"],
.ds-form-slot form{
  position:static!important;
  inset-block-start:auto!important;inset-inline-start:auto!important;
  inline-size:100%!important;
  block-size:auto!important;max-block-size:none!important;
  visibility:visible!important;opacity:1!important;
  pointer-events:auto!important;
  overflow:visible!important;
  z-index:auto!important
}
/* While the form hasn't arrived yet, show a skeleton so there's no
   empty void on first paint. JS clears it by appending the form node. */
.ds-form-slot:empty::before{
  content:"";display:block;inline-size:100%;block-size:240px;
  background:
    linear-gradient(90deg,rgba(255,255,255,.04) 0%,rgba(255,255,255,.1) 50%,rgba(255,255,255,.04) 100%);
  background-size:200% 100%;
  animation:dsSkel 1.4s ease-in-out infinite;
  border-radius:var(--br-m)
}
@keyframes dsSkel{0%{background-position:200% 0}100%{background-position:-200% 0}}

/* FIT GRID */
.fit-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(14px,2vw,24px);margin-block-start:48px}
.fit-col{background:var(--glass-d);border:1px solid var(--line);padding:clamp(22px,2.4vw,30px);border-radius:3px}
.fit-col.good{border-color:rgba(93,214,140,.28)}
.fit-col.bad{border-color:rgba(255,138,115,.22)}
.fit-h{font-family:'Montserrat',sans-serif;font-weight:800;font-size:clamp(17px,1.5vw,20px);margin-block-end:16px;padding-block-end:10px;border-bottom:1px dashed var(--line);letter-spacing:-.01em}
.fit-col.good .fit-h{color:var(--pos)}
.fit-col.bad .fit-h{color:var(--neg)}
html[dir="rtl"] .fit-h{font-family:'IBM Plex Sans Arabic',sans-serif}
.fit-list{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:10px}
.fit-list li{display:flex;gap:12px;align-items:flex-start;font-size:14px;color:rgba(247,247,247,.85);line-height:1.55}
.fit-list li::before{content:"";flex:0 0 auto;inline-size:18px;block-size:18px;border-radius:50%;margin-block-start:2px;background-size:12px;background-position:center;background-repeat:no-repeat}
.fit-col.good .fit-list li::before{background-color:rgba(93,214,140,.15);background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%235DD68C' stroke-width='3'><polyline points='20 6 9 17 4 12'/></svg>")}
.fit-col.bad .fit-list li::before{background-color:rgba(255,138,115,.14);background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23FF8A73' stroke-width='3'><line x1='18' y1='6' x2='6' y2='18'/><line x1='6' y1='6' x2='18' y2='18'/></svg>")}

/* FAQ */
.faq-list{max-inline-size:820px;margin:36px auto 0;display:flex;flex-direction:column;gap:6px}
.faq-item{background:var(--glass);border:1px solid var(--line);transition:border-color .3s;border-radius:2px}
.faq-item[open]{border-color:var(--teal-bri)}
.faq-item summary{font-family:'Montserrat',sans-serif;font-weight:600;font-size:15px;color:var(--alab);padding:18px 22px;cursor:pointer;list-style:none;display:flex;justify-content:space-between;align-items:center;gap:14px;min-height:44px}
html[dir="rtl"] .faq-item summary{font-family:'Cairo',sans-serif}
.faq-item summary::-webkit-details-marker{display:none}
.faq-item summary::after{content:"+";font-family:'Montserrat',sans-serif;font-size:22px;font-weight:300;color:var(--teal-bri);transition:transform .3s;flex-shrink:0}
.faq-item[open] summary::after{content:"\2212"}
.faq-answer{padding:0 22px 20px}
.faq-answer p{font-family:'Montserrat',sans-serif;font-weight:400;font-size:14px;color:rgba(247,247,247,.78);line-height:1.75}
html[dir="rtl"] .faq-answer p{font-family:'Cairo',sans-serif}

/* FINAL CTA */
.final{text-align:center;padding-block:clamp(80px,10vw,140px)}
.final h2{margin-inline:auto;max-inline-size:820px}

/* DIVIDER */
.sec-divider{height:1px;background:linear-gradient(90deg,transparent 5%,var(--teal) 30%,var(--teal) 70%,transparent 95%);opacity:.18;margin-inline:5vw}

/* RESPONSIVE */
@media (max-width:960px){
  .hero-grid{grid-template-columns:1fr;gap:36px}
  .fit-grid{grid-template-columns:1fr}
  .clock-visual{inline-size:100px;block-size:100px;inset-block-start:10px;inset-inline-end:10px}
}
@media (max-width:560px){
  .lang-toggle{inset-block-start:72px;inset-inline-end:10px;padding:4px}
  .lang-toggle button{min-width:40px;min-height:32px;padding:6px 12px;font-size:.8rem}
  .cta-row{flex-direction:column;align-items:stretch}
  .cta-row .btn{justify-content:center}
  .clock-visual{display:none}
}

/* REDUCED MOTION */
@media (prefers-reduced-motion:reduce){
  *{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
  .reveal,.reveal-s,.reveal-b,.reveal-l{opacity:1;transform:none;filter:none}
  .clock-visual .tick-hand{animation:none}
}

/* ADMIN-MODE DEFENSIVE + PRODUCTION HARDENING */
html.wp-toolbar,body.admin-bar,body.elementor-editor-active{overflow-x:clip!important;max-width:100vw!important;scrollbar-gutter:stable!important}
body.admin-bar .elementor-widget-html,body.elementor-editor-active .elementor-widget-html{width:100%!important;max-width:100%!important;padding:0!important;margin:0!important;overflow-x:clip!important}
body.admin-bar .elementor,body.admin-bar .elementor-section,body.admin-bar .elementor-container,body.admin-bar .elementor-column,body.admin-bar .elementor-widget,body.elementor-editor-active .elementor,body.elementor-editor-active .elementor-section,body.elementor-editor-active .elementor-container,body.elementor-editor-active .elementor-column,body.elementor-editor-active .elementor-widget{transform:none!important;filter:none!important;perspective:none!important}
.elementor-invisible{visibility:visible!important;opacity:1!important;animation:none!important}

:focus-visible{outline:2px solid var(--teal-bri);outline-offset:3px}/* End custom CSS */