/**
 * S Square shared experience and motion layer.
 * Static content is always visible; JavaScript only adds the pending state
 * immediately before an element is observed or animated.
 */
:root {
	--ssq-motion-fast: 180ms;
	--ssq-motion-base: 560ms;
	--ssq-motion-slow: 920ms;
	--ssq-motion-ease: cubic-bezier(.22, 1, .36, 1);
	--ssq-motion-ease-soft: cubic-bezier(.2, .75, .3, 1);
	--ssq-focus: #c64c27;
}

.ssq-motion-pending {
	opacity: .72;
	transform: translate3d(0, var(--ssq-motion-y, 34px), 0);
}

.ssq-motion-pending[data-ssq-mask],
.ssq-motion-pending.ssq-premium-hero__visual,
.ssq-motion-pending.ssq-service-chapters__media {
	clip-path: inset(7% 0 7% 0);
	transform: scale(1.035);
}

.ssq-motion-pending.is-ssq-motion-visible,
.is-ssq-motion-visible {
	opacity: 1;
	clip-path: inset(0 0 0 0);
	transform: none;
	transition:
		opacity var(--ssq-motion-base) var(--ssq-motion-ease),
		transform var(--ssq-motion-slow) var(--ssq-motion-ease),
		clip-path var(--ssq-motion-slow) var(--ssq-motion-ease);
}

html[dir="rtl"] .ssq-motion-pending[data-ssq-directional] {
	--ssq-motion-x: -28px;
}

.ssq-site-header a,
.ssq-site-header button,
.ssq-page a,
.ssq-page button,
.ssq-page summary,
.ssq-site-footer a {
	-webkit-tap-highlight-color: transparent;
}

.ssq-page :is(a, button, summary, [tabindex]):focus-visible,
.ssq-site-footer a:focus-visible {
	outline: 2px solid var(--ssq-focus);
	outline-offset: 5px;
}

.ssq-site-footer__preferences {
	display: inline-flex;
	min-height: 44px;
	align-items: center;
	justify-content: center;
}

.ssq-button,
.ssq-text-link,
.ssq-related a,
.ssq-service-row {
	transition:
		color var(--ssq-motion-fast) ease,
		background-color var(--ssq-motion-fast) ease,
		border-color var(--ssq-motion-fast) ease,
		box-shadow var(--ssq-motion-base) var(--ssq-motion-ease-soft),
		transform var(--ssq-motion-base) var(--ssq-motion-ease);
}

.ssq-button span,
.ssq-text-link span,
.ssq-related a i,
.ssq-service-row i {
	display: inline-block;
	transition: transform var(--ssq-motion-base) var(--ssq-motion-ease);
}

@media (hover: hover) and (pointer: fine) {
	.ssq-button:hover { transform: translateY(-3px); box-shadow: 0 15px 35px rgba(26, 24, 22, .14); }
	.ssq-button:hover span,
	.ssq-text-link:hover span,
	.ssq-related a:hover i,
	.ssq-service-row:hover i { transform: translate(4px, -4px); }
	html[dir="rtl"] :is(.ssq-button:hover span, .ssq-text-link:hover span, .ssq-related a:hover i, .ssq-service-row:hover i) { transform: scaleX(-1) translate(4px, -4px); }
}

/* Signature 1: deliberate hero sequence and restrained image depth. */
.ssq-premium-hero__visual > img {
	transform: translate3d(0, var(--ssq-depth-y, 0), 0) scale(var(--ssq-depth-scale, 1));
}

body.ssq-content-home .ssq-loop-gallery {
	--ssq-loop-gap: clamp(18px, 1.9vw, 30px);
	position: relative;
	padding: 10px 0 8px;
	overflow: hidden;
	background: #fff;
	direction: ltr;
}

body.ssq-content-home .ssq-loop-gallery__meta {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 18px;
	width: min(100% - 48px, 1240px);
	margin: 0 auto;
	color: #2d2b29;
	font-size: 12px;
	font-weight: 600;
	letter-spacing: .04em;
	text-transform: uppercase;
}

body.ssq-content-home .ssq-loop-gallery__hint {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 8px 12px;
	border: 1px solid rgba(31, 30, 29, .14);
	border-radius: 999px;
	background: rgba(255, 255, 255, .94);
	box-shadow: 0 8px 24px rgba(24, 22, 20, .07);
	font-size: 11px;
	font-weight: 500;
	letter-spacing: 0;
	text-transform: none;
	transition: opacity .3s ease, transform .3s ease;
}

body.ssq-content-home .ssq-loop-gallery__hint-icon {
	display: block;
	flex: 0 0 auto;
	width: 18px;
	height: 10px;
	color: #d35b34;
}

body.ssq-content-home .ssq-loop-gallery.has-been-used .ssq-loop-gallery__hint {
	opacity: 1;
	transform: none;
}

body.ssq-content-home .ssq-loop-gallery__viewport {
	width: 100%;
	overflow: hidden;
	padding: 6px 0 clamp(48px, 5vw, 76px);
	cursor: grab;
	touch-action: pan-y pinch-zoom;
	outline: none;
	perspective: 900px;
	perspective-origin: 50% 46%;
}

body.ssq-content-home .ssq-loop-gallery__viewport:focus-visible {
	box-shadow: inset 0 0 0 3px rgba(211, 91, 52, .72);
}

body.ssq-content-home .ssq-loop-gallery.is-dragging .ssq-loop-gallery__viewport {
	cursor: grabbing;
	user-select: none;
}

body.ssq-content-home .ssq-loop-gallery__track {
	display: flex;
	align-items: flex-start;
	gap: var(--ssq-loop-gap);
	width: max-content;
	transform: translate3d(0, 0, 0);
	transform-style: preserve-3d;
	will-change: transform;
}

body.ssq-content-home .ssq-loop-gallery__item {
	--ssq-loop-scale: 1;
	--ssq-loop-tilt: 0deg;
	--ssq-loop-depth: 0px;
	--ssq-loop-drop: 0px;
	flex: 0 0 clamp(280px, 25vw, 390px);
	margin: 0;
	border: 1px solid rgba(29, 27, 25, .12);
	background: #f4f1ed;
	box-shadow: 0 14px 38px rgba(34, 28, 24, .08);
	contain: layout style;
	backface-visibility: hidden;
	transform: translate3d(0, var(--ssq-loop-drop), var(--ssq-loop-depth)) rotateY(var(--ssq-loop-tilt)) scale(var(--ssq-loop-scale));
	transform-origin: center center;
}

body.ssq-content-home .ssq-loop-gallery__media {
	display: grid;
	place-items: center;
	width: 100%;
	aspect-ratio: 3 / 2;
	overflow: hidden;
	background: #eee9e3;
}

body.ssq-content-home .ssq-loop-gallery__media img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	user-select: none;
	-webkit-user-drag: none;
}

body.ssq-content-home .ssq-loop-gallery__item figcaption {
	display: flex;
	align-items: center;
	gap: 11px;
	min-height: 62px;
	padding: 15px 18px;
	background: #fff;
	color: #242220;
	font-size: clamp(15px, 1vw, 17px);
	font-weight: 500;
	line-height: 1.25;
}

body.ssq-content-home .ssq-loop-gallery__item figcaption span {
	color: #d35b34;
	font-size: 11px;
	font-weight: 700;
	letter-spacing: .08em;
}

html[dir="rtl"] body.ssq-content-home .ssq-loop-gallery__meta,
html[dir="rtl"] body.ssq-content-home .ssq-loop-gallery__item figcaption {
	direction: rtl;
	text-align: right;
}

@media (hover: hover) and (pointer: fine) {
	body.ssq-content-home .ssq-loop-gallery__item { transition: box-shadow .3s ease; }
	body.ssq-content-home .ssq-loop-gallery__item:hover { box-shadow: 0 20px 46px rgba(34, 28, 24, .12); }
}

@media (max-width: 767px) {
	body.ssq-content-home .ssq-loop-gallery {
		--ssq-loop-gap: 14px;
		padding-top: 10px;
	}
	body.ssq-content-home .ssq-loop-gallery__meta {
		width: calc(100% - 28px);
		margin-bottom: 0;
		font-size: 10px;
	}
	body.ssq-content-home .ssq-loop-gallery__hint { padding: 7px 10px; font-size: 10px; }
	body.ssq-content-home .ssq-loop-gallery__viewport { padding: 10px 0 42px; }
	body.ssq-content-home .ssq-loop-gallery__item { flex-basis: min(80vw, 300px); }
	body.ssq-content-home .ssq-loop-gallery__item figcaption {
		min-height: 58px;
		padding: 13px 15px;
		font-size: 14px;
	}
}

/* Signature 2: portfolio filtering and credibility cards. */
.ssq-work__filters,
.ssq-faq__categories {
	scroll-padding-inline: 18px;
	scroll-snap-type: x proximity;
}

.ssq-work__filters button,
.ssq-faq__categories button {
	position: relative;
	scroll-snap-align: start;
	transition: color .25s ease, background-color .25s ease, border-color .25s ease, transform .25s ease;
}

.ssq-work__filters button:active,
.ssq-faq__categories button:active { transform: scale(.97); }

.ssq-filter-status {
	width: 1px;
	height: 1px;
	margin: -1px;
	overflow: hidden;
	clip: rect(0 0 0 0);
	clip-path: inset(50%);
	white-space: nowrap;
}

.ssq-work-card {
	position: relative;
	transform-origin: 50% 35%;
}

.ssq-work-card.is-filter-entering { animation: ssq-filter-enter .58s var(--ssq-motion-ease) both; }
.ssq-work-card.is-filter-leaving { pointer-events: none; animation: ssq-filter-leave .2s ease both; }

@keyframes ssq-filter-enter {
	from { opacity: 0; transform: translate3d(0, 30px, 0) scale(.985); }
	to { opacity: 1; transform: none; }
}

@keyframes ssq-filter-leave {
	to { opacity: 0; transform: translate3d(0, -12px, 0) scale(.985); }
}

@media (hover: hover) and (pointer: fine) {
	.ssq-work-card:hover,
	.ssq-work-card:focus-visible { transform: translateY(-7px); }
	.ssq-work-card:hover .ssq-work-card__copy,
	.ssq-work-card:focus-visible .ssq-work-card__copy { border-color: var(--ssq-accent); }
}

/* Signature 3: product navigator, stacked chapters and functioning scenes. */
.ssq-product-nav { transition: box-shadow .3s ease, background-color .3s ease; }
.ssq-product-nav.is-tracking { box-shadow: 0 15px 35px rgba(26, 24, 22, .07); }
.ssq-product-nav__links { display: flex; gap: 28px; overflow-x: auto; scrollbar-width: none; scroll-snap-type: x proximity; }
.ssq-product-nav__links::-webkit-scrollbar { display: none; }
.ssq-product-nav a { scroll-snap-align: center; }
.ssq-product-nav a span { margin-inline-end: 8px; color: var(--ssq-accent); font-size: .72em; }
.ssq-product-nav__progress { position: absolute; right: 0; bottom: 0; left: 0; height: 2px; overflow: hidden; background: rgba(32, 32, 32, .09); }
.ssq-product-nav__progress > i { display: block; width: 20%; height: 100%; background: var(--ssq-accent); transform-origin: left center; transition: width .45s var(--ssq-motion-ease-soft); }
html[dir="rtl"] .ssq-product-nav__progress > i { margin-inline-start: auto; transform-origin: right center; }
.ssq-product.is-current { --ssq-product-focus: 1; }
.ssq-product__visual { transition: box-shadow .6s ease, transform .7s var(--ssq-motion-ease); }
.ssq-product.is-current .ssq-product__visual { box-shadow: 0 28px 76px rgba(31, 25, 20, .12); }
.ssq-product.is-revealed .ssq-product-ui__canvas span { animation: ssq-interface-rise .72s var(--ssq-motion-ease) both; }
.ssq-product.is-revealed .ssq-product-ui__canvas span:nth-child(2) { animation-delay: .08s; }
.ssq-product.is-revealed .ssq-product-ui__canvas span:nth-child(3) { animation-delay: .16s; }

@keyframes ssq-interface-rise {
	from { opacity: .18; transform: translateY(18px) scaleX(.94); transform-origin: left; }
	to { opacity: 1; transform: none; }
}

/* The product scenes are shared artwork: Arabic recomposes the surrounding copy, not the interface quality. */
.ssq-product-scene { --scene-accent: #d35b34; position: relative; width: 100%; min-width: 0; overflow: hidden; aspect-ratio: 1.3; border: 1px solid rgba(255, 255, 255, .1); background: #17191b; box-shadow: 0 28px 72px rgba(24, 20, 17, .19); transition: transform .6s var(--ssq-motion-ease-soft), box-shadow .6s ease; }
.ssq-product-scene--assessment { --scene-accent: #d87b45; }
.ssq-product-scene--booking { --scene-accent: #c65e3a; }
.ssq-product-scene--menu { --scene-accent: #e06b43; }
.ssq-product-scene--ecosystem { --scene-accent: #c44b23; }
.ssq-product-scene__top { position: absolute; z-index: 2; top: 0; right: 0; left: 0; display: flex; align-items: center; justify-content: space-between; height: 48px; padding: 0 18px; border-bottom: 1px solid rgba(255, 255, 255, .09); color: rgba(255, 255, 255, .48); font-size: 8px; font-weight: 700; letter-spacing: .14em; }
html[dir="rtl"] .ssq-product-scene__top { font-size: 10px; letter-spacing: 0; }
.ssq-product-scene__top::before { position: absolute; inset-inline-start: 18px; bottom: -3px; width: 6px; height: 6px; border-radius: 50%; background: var(--scene-accent); box-shadow: 10px 0 rgba(255, 255, 255, .2), 20px 0 rgba(255, 255, 255, .12); content: ""; }
html[dir="rtl"] .ssq-product-scene__top::before { box-shadow: -10px 0 rgba(255, 255, 255, .2), -20px 0 rgba(255, 255, 255, .12); }
.ssq-product-scene__top b { color: rgba(255, 255, 255, .75); font-size: 10px; }
.ssq-product-scene svg { display: block; width: 100%; height: 100%; }
.ssq-scene__surface { fill: #1c1e20; stroke: rgba(255, 255, 255, .08); }
:is(.ssq-scene__results, .ssq-scene__kpis, .ssq-scene__times, .ssq-scene__menu-panel, .ssq-scene__nodes) > rect,
.ssq-scene__confirmation > rect { fill: rgba(255, 255, 255, .035); stroke: rgba(255, 255, 255, .1); }
.ssq-scene__phone > rect:first-child { fill: #111315; stroke: rgba(255, 255, 255, .18); }
.ssq-scene__screen { fill: #202326; stroke: rgba(255, 255, 255, .08); }
.ssq-scene__menu-hero { fill: rgba(211, 91, 52, .18); stroke: rgba(224, 107, 67, .36); }
.ssq-scene__search { fill: rgba(255, 255, 255, .045); stroke: rgba(255, 255, 255, .13); }
:is(.ssq-scene__stroke, .ssq-scene__muted, .ssq-scene__accent, .ssq-scene__draw, .ssq-scene__radar, .ssq-scene__qr) { fill: none; stroke-linecap: round; stroke-linejoin: round; }
.ssq-scene__stroke { stroke: var(--scene-accent); stroke-width: 2; }
.ssq-scene__muted { stroke: rgba(255, 255, 255, .16); stroke-width: 1; }
.ssq-scene__accent { stroke: var(--scene-accent); stroke-width: 2; }
.ssq-scene__draw { stroke: var(--scene-accent); stroke-width: 1.5; }
.ssq-scene__pin { fill: #202326; stroke: var(--scene-accent); stroke-width: 3; }
.ssq-scene__pulse { fill: var(--scene-accent); }
.ssq-scene__ring { fill: none; stroke: rgba(255, 255, 255, .13); stroke-width: 15; }
.ssq-scene__ring-progress { fill: none; stroke: var(--scene-accent); stroke-width: 15; stroke-dasharray: 220 500; stroke-linecap: round; transform: rotate(-90deg); transform-origin: center; }
.ssq-scene__radar { fill: rgba(216, 123, 69, .13); stroke: var(--scene-accent); stroke-width: 2; }
.ssq-scene__slot { fill: rgba(198, 94, 58, .12); stroke: rgba(198, 94, 58, .42); }
.ssq-scene__selected { fill: rgba(198, 94, 58, .24) !important; stroke: var(--scene-accent) !important; }
.ssq-scene__availability { fill: #79a87d; }
.ssq-scene__qr { stroke: var(--scene-accent); stroke-width: 4; }
.ssq-scene__hub-core { fill: rgba(196, 75, 35, .17); stroke: var(--scene-accent); stroke-width: 2; }

.ssq-product.is-revealed :is(.ssq-scene__results, .ssq-scene__kpis, .ssq-scene__times, .ssq-scene__menu-panel, .ssq-scene__nodes) { animation: ssq-scene-rise .85s var(--ssq-motion-ease-soft) both; }
.ssq-product.is-revealed .ssq-scene__draw { animation: ssq-scene-draw 1.35s .12s var(--ssq-motion-ease-soft) both; }
.ssq-product.is-revealed .ssq-scene__ring-progress { animation: ssq-scene-ring 1.25s .12s var(--ssq-motion-ease-soft) both; }
.ssq-product.is-revealed :is(.ssq-scene__slot--1, .ssq-scene__pin--1) { animation: ssq-scene-pop .42s .3s both; }
.ssq-product.is-revealed :is(.ssq-scene__slot--2, .ssq-scene__pin--2) { animation: ssq-scene-pop .42s .48s both; }
.ssq-product.is-revealed :is(.ssq-scene__slot--3, .ssq-scene__pin--3) { animation: ssq-scene-pop .42s .66s both; }
.ssq-product.is-current .ssq-scene__pulse { animation: ssq-scene-pulse 2.2s ease-in-out infinite; }
@keyframes ssq-scene-rise { from { opacity: .25; transform: translateY(18px); } to { opacity: 1; transform: translateY(0); } }
@keyframes ssq-scene-draw { from { stroke-dasharray: 0 520; } to { stroke-dasharray: 520 0; } }
@keyframes ssq-scene-ring { from { stroke-dasharray: 0 500; } to { stroke-dasharray: 220 500; } }
@keyframes ssq-scene-pop { from { opacity: .15; transform: scale(.72); transform-origin: center; } to { opacity: 1; transform: scale(1); transform-origin: center; } }
@keyframes ssq-scene-pulse { 0%, 100% { opacity: .55; filter: drop-shadow(0 0 0 transparent); } 50% { opacity: 1; filter: drop-shadow(0 0 8px var(--scene-accent)); } }

.ssq-product { scroll-margin-top: 112px; }

@media (hover: hover) and (pointer: fine) {
	.ssq-product:hover .ssq-product-scene { transform: translateY(-4px); box-shadow: 0 34px 86px rgba(24, 20, 17, .24); }
}

/* Signature 4: connected-system story, shared by English and Arabic. */
.ssq-ecosystem--interactive .ssq-ecosystem__diagram { transition: box-shadow .45s ease; }
.ssq-ecosystem--interactive .ssq-ecosystem__core { display: grid; min-width: 106px; min-height: 106px; place-content: center; border: 1px solid var(--ssq-line); border-radius: 50%; background: rgba(255, 255, 255, .92); text-align: center; }
.ssq-ecosystem--interactive .ssq-ecosystem__core b { font-size: 20px; }
.ssq-ecosystem--interactive .ssq-ecosystem__core small { margin-top: 7px; color: var(--ssq-accent); font-size: 9px; letter-spacing: .12em; }
.ssq-ecosystem--interactive .ssq-ecosystem__node { --ssq-node-scale: 1; color: var(--ssq-muted); text-decoration: none; opacity: .7; transform: translate(-50%, -50%) rotate(calc(360deg / var(--total) * var(--i))) translateY(-210px) rotate(calc(-360deg / var(--total) * var(--i))) scale(var(--ssq-node-scale)); transition: color .35s, background .35s, border-color .35s, box-shadow .35s, opacity .35s, transform .35s; }
.ssq-ecosystem--interactive .ssq-ecosystem__node:is(:hover, :focus-visible) { color: var(--ssq-ink); opacity: 1; border-color: var(--ssq-accent); }
.ssq-ecosystem--interactive .ssq-ecosystem__node.is-active { --ssq-node-scale: 1.06; color: #fff; opacity: 1; border-color: var(--ssq-accent); background: var(--ssq-accent); box-shadow: 0 16px 38px rgba(171, 49, 12, .25); }
.ssq-ecosystem--interactive .ssq-ecosystem__list article { position: relative; padding-inline: 34px; scroll-margin-top: 128px; transition: border-color .35s, background .35s; }
.ssq-ecosystem--interactive .ssq-ecosystem__list article::before { position: absolute; inset-inline-start: 9px; top: 28px; bottom: 28px; width: 3px; border-radius: 99px; background: var(--ssq-accent); content: ""; opacity: 0; transform: scaleY(.2); transform-origin: top; transition: opacity .35s, transform .45s var(--ssq-motion-ease); }
.ssq-ecosystem--interactive .ssq-ecosystem__list article.is-active { border-color: rgba(171, 49, 12, .35); background: linear-gradient(90deg, rgba(171, 49, 12, .055), transparent 72%); }
html[dir="rtl"] .ssq-ecosystem--interactive .ssq-ecosystem__list article.is-active { background: linear-gradient(-90deg, rgba(171, 49, 12, .055), transparent 72%); }
.ssq-ecosystem--interactive .ssq-ecosystem__list article.is-active::before { opacity: 1; transform: scaleY(1); }

/* Signature 5: service-family motion identities, without changing content. */
.ssq-service-chapters__media::after {
	position: absolute;
	inset: 0;
	pointer-events: none;
	content: "";
	opacity: .62;
	transition: opacity .5s ease, transform 1s var(--ssq-motion-ease);
}

[data-ssq-page="service_digital"] .ssq-service-chapters__media::after {
	background: linear-gradient(90deg, transparent 0 42%, rgba(232, 102, 61, .55) 42% 42.35%, transparent 42.35% 100%);
}
[data-ssq-page="service_branding"] .ssq-service-chapters__media::after {
	inset: 12%; border: 1px solid rgba(255, 255, 255, .5); background: none;
}
[data-ssq-page="service_marketing"] .ssq-service-chapters__media::after {
	background: radial-gradient(circle at 78% 28%, rgba(232, 102, 61, .66) 0 3px, transparent 4px), radial-gradient(circle at 58% 57%, rgba(255, 255, 255, .65) 0 3px, transparent 4px);
}
[data-ssq-page="service_advisory"] .ssq-service-chapters__media::after {
	background: repeating-linear-gradient(90deg, transparent 0 19.8%, rgba(255, 255, 255, .24) 20% 20.2%);
}
[data-ssq-page="service_entertainment"] .ssq-service-chapters__media::after {
	background: radial-gradient(ellipse at 50% 110%, rgba(232, 102, 61, .68), transparent 52%);
}

@media (hover: hover) and (pointer: fine) {
	.ssq-service-chapters article:hover .ssq-service-chapters__media::after { opacity: .9; transform: scale(1.025); }
}

/* Signature 6: disclosures, form feedback and final CTA hand-off. */
.ssq-faq__items summary { transition: color .25s ease, padding-inline .35s var(--ssq-motion-ease); }
.ssq-faq__items details[open] summary { color: var(--ssq-accent); }
.ssq-faq__items summary:focus-visible { padding-inline: 12px; }
.ssq-faq__items details.is-filter-entering { animation: ssq-filter-enter .5s var(--ssq-motion-ease) both; }

.ssq-form :is(input, select, textarea) {
	transition: border-color .2s ease, box-shadow .2s ease, background-color .2s ease;
}
.ssq-form :is(input, select, textarea):focus {
	border-color: var(--ssq-accent);
	box-shadow: 0 2px 0 var(--ssq-accent);
}
.ssq-form :is(input, select, textarea)[aria-invalid="true"] {
	border-color: #b42318;
	box-shadow: 0 2px 0 #b42318;
}
.ssq-form .ssq-button[disabled] { cursor: wait; opacity: .65; transform: none; }
.ssq-form-notice { animation: ssq-notice-in .55s var(--ssq-motion-ease) both; }
@keyframes ssq-notice-in { from { opacity: 0; transform: translateY(-12px); } }

.ssq-premium-cta { position: relative; overflow: hidden; }
.ssq-premium-cta::after { position: absolute; right: -7vw; bottom: -15vw; width: 42vw; aspect-ratio: 1; border: 1px solid rgba(255, 255, 255, .08); border-radius: 50%; box-shadow: 0 0 0 7vw rgba(255, 255, 255, .025), 0 0 0 14vw rgba(255, 255, 255, .02); content: ""; pointer-events: none; }
html[dir="rtl"] .ssq-premium-cta::after { right: auto; left: -7vw; }
.ssq-premium-cta > .ssq-shell { position: relative; z-index: 1; }

@media (max-width: 1024px) {
	.ssq-motion-pending { --ssq-motion-y: 24px; }
	.ssq-ecosystem--interactive .ssq-ecosystem__node { transform: translate(-50%, -50%) rotate(calc(360deg / var(--total) * var(--i))) translateY(-174px) rotate(calc(-360deg / var(--total) * var(--i))) scale(var(--ssq-node-scale)); }
}

@media (max-width: 767px) {
	:root { --ssq-motion-base: 440ms; --ssq-motion-slow: 620ms; }
	.ssq-motion-pending { --ssq-motion-y: 18px; }
	.ssq-product-nav__links { gap: 22px; padding-inline: 18px; }
	.ssq-product-nav a { min-height: 48px; display: inline-flex; align-items: center; }
	.ssq-product { scroll-margin-top: 92px; }
	.ssq-product-scene { aspect-ratio: 1.55; }
	.ssq-product-scene__top { height: 40px; padding: 0 13px; font-size: 7px; }
	.ssq-product-scene__top::before { inset-inline-start: 13px; }
	.ssq-ecosystem--interactive .ssq-ecosystem__node { transform: translate(-50%, -50%) rotate(calc(360deg / var(--total) * var(--i))) translateY(-36vw) rotate(calc(-360deg / var(--total) * var(--i))) scale(var(--ssq-node-scale)); }
	.ssq-ecosystem--interactive .ssq-ecosystem__core { min-width: 82px; min-height: 82px; }
	.ssq-premium-cta::after { width: 78vw; bottom: -34vw; }
}

html.ssq-reduced-motion { scroll-behavior: auto !important; }
html.ssq-reduced-motion body:is(.ssq-liko-site, .ssq-content-home) :is(.ssq-page, .ssq-site-header, .ssq-site-footer, .elementor) *,
html.ssq-reduced-motion body:is(.ssq-liko-site, .ssq-content-home) :is(.ssq-page, .ssq-site-header, .ssq-site-footer, .elementor) *::before,
html.ssq-reduced-motion body:is(.ssq-liko-site, .ssq-content-home) :is(.ssq-page, .ssq-site-header, .ssq-site-footer, .elementor) *::after {
	animation: none !important;
	scroll-behavior: auto !important;
	transition: none !important;
	will-change: auto !important;
}
html.ssq-reduced-motion .ssq-motion-pending,
html.ssq-reduced-motion .is-ssq-motion-visible {
	opacity: 1 !important;
	clip-path: none !important;
	transform: none !important;
}
html.ssq-reduced-motion .ssq-premium-hero__visual > img,
html.ssq-reduced-motion .ssq-services-stage__panel { transform: none !important; }
html.ssq-reduced-motion body.ssq-content-home .ssq-loop-gallery__track { will-change: auto !important; }

@media (prefers-reduced-motion: reduce) {
	html { scroll-behavior: auto !important; }
	body:is(.ssq-liko-site, .ssq-content-home) :is(.ssq-page, .ssq-site-header, .ssq-site-footer, .elementor) *,
	body:is(.ssq-liko-site, .ssq-content-home) :is(.ssq-page, .ssq-site-header, .ssq-site-footer, .elementor) *::before,
	body:is(.ssq-liko-site, .ssq-content-home) :is(.ssq-page, .ssq-site-header, .ssq-site-footer, .elementor) *::after {
		animation-delay: 0s !important;
		animation-duration: .01ms !important;
		animation-iteration-count: 1 !important;
		scroll-behavior: auto !important;
		transition-delay: 0s !important;
		transition-duration: .01ms !important;
		will-change: auto !important;
	}
	.ssq-motion-pending,
	.ssq-motion-pending.is-ssq-motion-visible,
	.is-ssq-motion-visible {
		opacity: 1 !important;
		clip-path: none !important;
		transform: none !important;
		transition: none !important;
	}
	.ssq-work-card.is-filter-entering,
	.ssq-work-card.is-filter-leaving,
	.ssq-product.is-revealed .ssq-product-ui__canvas span,
	.ssq-product.is-revealed :is(.ssq-scene__results, .ssq-scene__kpis, .ssq-scene__times, .ssq-scene__menu-panel, .ssq-scene__nodes, .ssq-scene__draw, .ssq-scene__ring-progress, .ssq-scene__slot, .ssq-scene__pin),
	.ssq-product.is-current .ssq-scene__pulse,
	.ssq-form-notice { animation: none !important; }
	.ssq-premium-hero__visual > img,
	.ssq-services-stage__panel { transform: none !important; }
	body.ssq-content-home .ssq-loop-gallery__track { will-change: auto !important; }
}

/* Connected-systems story: shared English/Arabic visual and interaction model. */
body.ssq-liko-site .ssq-page .ssq-ecosystem--interactive .ssq-ecosystem__diagram {
	isolation: isolate;
	overflow: visible;
	border: 1px solid rgba(255, 255, 255, .1);
	border-radius: 36px;
	background:
		radial-gradient(circle at 50% 50%, rgba(211, 91, 52, .15), transparent 23%),
		radial-gradient(circle at 50% 50%, #202225 0, #17191b 58%, #111315 100%);
	box-shadow: inset 0 1px 0 rgba(255, 255, 255, .07), 0 34px 90px rgba(24, 20, 17, .15);
}
body.ssq-liko-site .ssq-page .ssq-ecosystem--interactive .ssq-ecosystem__diagram::before,
body.ssq-liko-site .ssq-page .ssq-ecosystem--interactive .ssq-ecosystem__diagram::after { display: none; }
.ssq-ecosystem__map { position: absolute; z-index: 0; inset: 0; width: 100%; height: 100%; overflow: visible; }
.ssq-ecosystem__grid-lines { opacity: .32; }
.ssq-ecosystem__grid-lines + * { vector-effect: non-scaling-stroke; }
#ssq-ecosystem-grid path { fill: none; stroke: rgba(255, 255, 255, .055); stroke-width: 1; }
.ssq-ecosystem__orbit { fill: none; stroke: rgba(255, 255, 255, .12); stroke-width: 1; vector-effect: non-scaling-stroke; }
.ssq-ecosystem__orbit--middle { stroke-dasharray: 4 8; }
.ssq-ecosystem__orbit--inner { stroke: rgba(211, 91, 52, .24); }
.ssq-ecosystem__connection { color: #d35b34; }
.ssq-ecosystem__connection-base,
.ssq-ecosystem__connection-active,
.ssq-ecosystem__connection-signal { fill: none; vector-effect: non-scaling-stroke; }
.ssq-ecosystem__connection-base { stroke: rgba(255, 255, 255, .12); stroke-width: 1; }
.ssq-ecosystem__connection-active { stroke: currentColor; stroke-width: 2; stroke-dasharray: 1; stroke-dashoffset: 1; opacity: .22; transition: stroke-dashoffset .72s var(--ssq-motion-ease), opacity .35s ease; }
.ssq-ecosystem__connection-signal { stroke: #f19a7d; stroke-width: 5; stroke-linecap: round; stroke-dasharray: .025 .975; stroke-dashoffset: 1; opacity: 0; }
.ssq-ecosystem__endpoint { fill: #202326; stroke: rgba(255, 255, 255, .26); stroke-width: 1.5; vector-effect: non-scaling-stroke; transition: fill .3s ease, stroke .3s ease, r .3s ease; }
.ssq-ecosystem__connection.is-active .ssq-ecosystem__connection-active { stroke-dashoffset: 0; opacity: 1; }
.ssq-ecosystem__connection.is-active .ssq-ecosystem__connection-signal { animation: ssq-ecosystem-signal .92s .14s var(--ssq-motion-ease) both; }
.ssq-ecosystem__connection.is-active .ssq-ecosystem__endpoint { fill: #d35b34; stroke: #f7b29b; }
@keyframes ssq-ecosystem-signal { 0% { stroke-dashoffset: 1; opacity: 0; } 12% { opacity: 1; } 88%, 100% { stroke-dashoffset: 0; opacity: 1; } }

body.ssq-liko-site .ssq-page .ssq-ecosystem--interactive .ssq-ecosystem__core {
	z-index: 2;
	display: grid;
	width: 132px;
	height: 132px;
	min-width: 0;
	min-height: 0;
	padding: 14px;
	place-content: center;
	border: 1px solid rgba(255, 255, 255, .18);
	border-radius: 50%;
	color: #fff;
	background: rgba(18, 20, 22, .88);
	box-shadow: 0 0 0 9px rgba(255, 255, 255, .025), 0 0 0 28px rgba(211, 91, 52, .04), 0 18px 45px rgba(0, 0, 0, .28);
	text-align: center;
}
body.ssq-liko-site .ssq-page .ssq-ecosystem--interactive .ssq-ecosystem__core > span { order: 1; margin-bottom: 7px; color: rgba(255, 255, 255, .48); font-size: 8px; font-weight: 600; letter-spacing: .12em; line-height: 1.25; text-transform: uppercase; }
body.ssq-liko-site #ssq-main .ssq-ecosystem--interactive .ssq-ecosystem__core b { order: 2; font-size: 17px; line-height: 1.15; }
body.ssq-liko-site .ssq-page .ssq-ecosystem--interactive .ssq-ecosystem__core small { order: 3; margin-top: 11px; color: #ef7952; direction: ltr; font-size: 9px; font-weight: 700; letter-spacing: .15em; unicode-bidi: isolate; }
html[dir="rtl"] body.ssq-liko-site .ssq-ecosystem__core > span { letter-spacing: 0; text-transform: none; }

.ssq-ecosystem__nodes { display: contents; }
body.ssq-liko-site .ssq-page .ssq-ecosystem--interactive .ssq-ecosystem__node {
	--ssq-node-scale: 1;
	display: grid;
	grid-template-columns: 34px minmax(0, 1fr);
	gap: 10px;
	width: clamp(146px, 13.5vw, 178px);
	min-height: 72px;
	padding: 11px 12px;
	align-items: center;
	border: 1px solid rgba(255, 255, 255, .14);
	border-radius: 12px;
	color: rgba(255, 255, 255, .72);
	background: rgba(27, 29, 31, .9);
	box-shadow: 0 12px 28px rgba(0, 0, 0, .15);
	text-align: start;
	text-decoration: none;
	opacity: 1;
	backdrop-filter: blur(12px);
	transform: translate(-50%, -50%) scale(var(--ssq-node-scale));
	transition: color .3s ease, background .3s ease, border-color .3s ease, box-shadow .35s ease, transform .35s var(--ssq-motion-ease);
}
.ssq-ecosystem__nodes .ssq-ecosystem__node:nth-child(1) { left: 50%; top: 12%; }
.ssq-ecosystem__nodes .ssq-ecosystem__node:nth-child(2) { left: 83%; top: 31%; }
.ssq-ecosystem__nodes .ssq-ecosystem__node:nth-child(3) { left: 83%; top: 69%; }
.ssq-ecosystem__nodes .ssq-ecosystem__node:nth-child(4) { left: 50%; top: 88%; }
.ssq-ecosystem__nodes .ssq-ecosystem__node:nth-child(5) { left: 17%; top: 69%; }
.ssq-ecosystem__nodes .ssq-ecosystem__node:nth-child(6) { left: 17%; top: 31%; }
.ssq-ecosystem__node-icon { display: grid; width: 34px; height: 34px; place-items: center; border: 1px solid rgba(255, 255, 255, .12); border-radius: 9px; color: #e77c59; background: rgba(255, 255, 255, .035); }
.ssq-ecosystem__node-icon svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
.ssq-ecosystem__node-copy { display: grid; min-width: 0; gap: 4px; }
.ssq-ecosystem__node-copy small { color: #e77c59; font-size: 8px; font-weight: 700; letter-spacing: .13em; }
.ssq-ecosystem__node-copy b { font-size: 10px; font-weight: 550; line-height: 1.28; }
body.ssq-liko-site .ssq-page .ssq-ecosystem--interactive .ssq-ecosystem__node:is(:hover, :focus-visible) { --ssq-node-scale: 1.035; color: #fff; border-color: rgba(239, 121, 82, .75); background: rgba(37, 38, 40, .96); box-shadow: 0 16px 34px rgba(0, 0, 0, .24); }
body.ssq-liko-site .ssq-page .ssq-ecosystem--interactive .ssq-ecosystem__node.is-active { --ssq-node-scale: 1.06; color: #fff; border-color: #e46b43; background: linear-gradient(135deg, #c64a23, #a93919); box-shadow: 0 18px 42px rgba(157, 49, 18, .35), 0 0 0 1px rgba(248, 158, 127, .2); }
.ssq-ecosystem__node.is-active .ssq-ecosystem__node-icon { color: #fff; border-color: rgba(255, 255, 255, .28); background: rgba(255, 255, 255, .1); }
.ssq-ecosystem__node.is-active .ssq-ecosystem__node-copy small { color: #ffd4c6; }

@media (max-width: 1100px) {
	body.ssq-liko-site .ssq-page .ssq-ecosystem--interactive .ssq-ecosystem__node { width: 144px; min-height: 66px; grid-template-columns: 29px minmax(0, 1fr); gap: 8px; padding: 9px; }
	.ssq-ecosystem__node-icon { width: 29px; height: 29px; }
	.ssq-ecosystem__node-icon svg { width: 17px; height: 17px; }
	.ssq-ecosystem__node-copy b { font-size: 9px; }
}

@media (max-width: 767px) {
	body.ssq-liko-site .ssq-page .ssq-ecosystem--interactive .ssq-ecosystem__diagram { min-height: 474px; aspect-ratio: auto; overflow: hidden; border-radius: 26px; }
	.ssq-ecosystem__map { top: 14px; right: auto; left: 50%; width: min(86vw, 326px); height: auto; aspect-ratio: 1; transform: translateX(-50%); }
	body.ssq-liko-site .ssq-page .ssq-ecosystem--interactive .ssq-ecosystem__core { left: 50%; top: 177px; width: 102px; height: 102px; min-width: 0; min-height: 0; }
	body.ssq-liko-site .ssq-page .ssq-ecosystem--interactive .ssq-ecosystem__core > span { font-size: 7px; }
	body.ssq-liko-site #ssq-main .ssq-ecosystem--interactive .ssq-ecosystem__core b { font-size: 14px; }
	.ssq-ecosystem__nodes { position: absolute; z-index: 4; right: 0; bottom: 15px; left: 0; display: flex; gap: 10px; overflow-x: auto; padding: 8px 16px 12px; scroll-padding-inline: 16px; scroll-snap-type: x proximity; scrollbar-width: none; }
	.ssq-ecosystem__nodes::-webkit-scrollbar { display: none; }
	body.ssq-liko-site .ssq-page .ssq-ecosystem--interactive .ssq-ecosystem__node { position: relative; left: auto !important; top: auto !important; flex: 0 0 min(75vw, 268px); width: auto; min-height: 78px; padding: 12px; scroll-snap-align: center; transform: none; }
	body.ssq-liko-site .ssq-page .ssq-ecosystem--interactive .ssq-ecosystem__node:is(:hover, :focus-visible),
	body.ssq-liko-site .ssq-page .ssq-ecosystem--interactive .ssq-ecosystem__node.is-active { transform: translateY(-2px); }
	.ssq-ecosystem__node-copy b { font-size: 11px; }
}

html.ssq-reduced-motion .ssq-ecosystem__connection-signal,
html.ssq-reduced-motion .ssq-ecosystem__connection-active,
html.ssq-reduced-motion .ssq-ecosystem__endpoint { animation: none !important; transition: none !important; }
@media (prefers-reduced-motion: reduce) {
	.ssq-ecosystem__connection-signal,
	.ssq-ecosystem__connection-active,
	.ssq-ecosystem__endpoint { animation: none !important; transition: none !important; }
	.ssq-ecosystem__connection.is-active .ssq-ecosystem__connection-signal { stroke-dashoffset: 0; opacity: 1; }
}