/* Creative Lab: effects only. Colours, fonts, sizes and spacing live in Elementor (Site Settings and each widget). */

/* Theme reset: Twenty Twenty-Five underlines links and sets its own font on the canvas page */
body.elementor-template-canvas { margin: 0; }
.elementor a { text-decoration: none; }
.elementor .elementor-widget-text-editor p { margin-block: 0; }
.elementor .elementor-widget-text-editor p + p { margin-block-start: 1em; }
.elementor a:focus-visible { outline: 2px solid #F2B536; outline-offset: 3px; }

/* Sticky header */
body.ehf-header #masthead { position: sticky; top: 0; z-index: 999; }
body.admin-bar.ehf-header #masthead { top: 32px; }
@media (max-width: 782px) { body.admin-bar.ehf-header #masthead { top: 0; } }
#masthead .cl-header { transition: box-shadow .3s ease; }
body.cl-scrolled #masthead .cl-header { box-shadow: 0 10px 30px rgba(0, 13, 34, .35); }
.cl-section[id] { scroll-margin-top: 80px; }

/* Header row: the tools group takes its content width */
.e-con.cl-header-tools { --width: auto; width: auto; }

/* Language switcher (Polylang widget) */
.cl-lang ul { list-style: none; margin: 0; padding: 0; display: flex; gap: 10px; }
.cl-lang li { margin: 0; }
.cl-lang a { display: inline-flex; align-items: center; height: 40px; padding: 0 14px; border: 1px solid rgba(255, 255, 255, .35); border-radius: 6px;
	color: #fff; font-family: "Cairo", "Outfit", sans-serif; font-size: 15px; font-weight: 600; line-height: 1; transition: border-color .3s, color .3s; }
.cl-lang a[lang="en-US"], .cl-lang a[hreflang="en"] { font-family: "Outfit", sans-serif; }
.cl-lang a:hover { border-color: #F2B536; color: #F2B536; }
.cl-lang h5, .cl-lang .widget-title { display: none; }

/* HFE menu: keep the closed dropdown out of the layout below the menu breakpoint */
@media (max-width: 1024px) {
	.cl-header .elementor-widget-navigation-menu nav.hfe-dropdown:not(.menu-is-active) { display: none; }
	.cl-header .elementor-widget-navigation-menu nav.hfe-dropdown.menu-is-active { margin-top: 16px; }
	.e-con.cl-header { position: relative; }
	.cl-header .elementor-widget-navigation-menu { position: static !important; }
	.cl-header .elementor-widget-navigation-menu nav.hfe-dropdown { position: absolute !important; top: 100% !important; left: 0 !important; right: 0 !important; width: auto !important; margin-top: 0 !important; }
}

/* Service cards */
.cl-card { transition: transform .35s ease, box-shadow .35s ease; }
.cl-card:hover { transform: translateY(-6px); box-shadow: 0 24px 48px rgba(0, 20, 49, .13) !important; }
.cl-card .elementor-widget-image { overflow: hidden; }
.cl-card .elementor-widget-image img { transition: transform .7s ease; display: block; }
.cl-card:hover .elementor-widget-image img { transform: scale(1.05); }

/* Work tiles */
.cl-tile { transition: transform .35s ease; }
.cl-tile:hover { transform: translateY(-5px); }
.cl-tile::after { content: ""; position: absolute; inset: 0; border-radius: inherit; border: 1px solid rgba(242, 181, 54, 0); transition: border-color .35s; pointer-events: none; }
.cl-tile:hover::after { border-color: rgba(242, 181, 54, .7); }

/* Process steps: gold line on hover */
.cl-step { transition: border-color .3s ease, transform .3s ease; }
.cl-step:hover { border-color: #F2B536 !important; transform: translateY(-4px); }

/* About points: icons align with the first line of the title */
.cl-point .elementor-icon-box-wrapper { align-items: flex-start; }

/* Buttons: icon nudges on hover */
.cl-btn .elementor-button-icon { transition: transform .3s ease; }
.cl-btn a:hover .elementor-button-icon { transform: translateX(4px); }
[dir="rtl"] .cl-btn a:hover .elementor-button-icon { transform: translateX(-4px); }

/* Arabic: phone numbers and emails read left to right inside right to left text */
[dir="rtl"] .cl-contact-list a[href^="mailto:"] .elementor-icon-list-text,
[dir="rtl"] .cl-fcontact a[href^="mailto:"] .elementor-icon-list-text { direction: ltr; unicode-bidi: isolate; }

/* ?still in the URL (screenshots only): no entrance animations, fixed hero height */
.cl-still .elementor-invisible { visibility: visible !important; }
.cl-still .animated { animation: none !important; }
.cl-still .cl-hero { min-height: 780px !important; }

@media (prefers-reduced-motion: reduce) {
	.cl-card, .cl-card img, .cl-tile, .cl-step, .cl-btn .elementor-button-icon { transition: none !important; }
}